@mitodl/smoot-design 6.6.2 → 6.7.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/bundles/remoteTutorDrawer.es.js +4111 -3999
- package/dist/bundles/remoteTutorDrawer.es.js.map +1 -1
- package/dist/bundles/remoteTutorDrawer.umd.js +52 -52
- package/dist/bundles/remoteTutorDrawer.umd.js.map +1 -1
- package/dist/cjs/VERSION.d.ts +1 -1
- package/dist/cjs/VERSION.js +1 -1
- package/dist/cjs/components/AiChat/AiChat.js +9 -1
- package/dist/cjs/components/AiChat/EllipsisIcon.d.ts +6 -0
- package/dist/cjs/components/AiChat/EllipsisIcon.js +17 -0
- package/dist/esm/VERSION.d.ts +1 -1
- package/dist/esm/VERSION.js +1 -1
- package/dist/esm/components/AiChat/AiChat.js +10 -2
- package/dist/esm/components/AiChat/EllipsisIcon.d.ts +6 -0
- package/dist/esm/components/AiChat/EllipsisIcon.js +15 -0
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/package.json +1 -1
package/dist/cjs/VERSION.d.ts
CHANGED
package/dist/cjs/VERSION.js
CHANGED
|
@@ -28,6 +28,7 @@ const ChatTitle_1 = require("./ChatTitle");
|
|
|
28
28
|
const AiChatContext_1 = require("./AiChatContext");
|
|
29
29
|
const useScrollSnap_1 = require("../ScrollSnap/useScrollSnap");
|
|
30
30
|
const Markdown_1 = require("./Markdown");
|
|
31
|
+
const EllipsisIcon_1 = require("./EllipsisIcon");
|
|
31
32
|
const classes = {
|
|
32
33
|
root: "MitAiChat--root",
|
|
33
34
|
title: "MitAiChat--title",
|
|
@@ -154,6 +155,13 @@ const Disclaimer = (0, styled_1.default)(Typography_1.default)(({ theme }) => ({
|
|
|
154
155
|
marginTop: "16px",
|
|
155
156
|
textAlign: "center",
|
|
156
157
|
}));
|
|
158
|
+
const StyledEllipsisIcon = (0, styled_1.default)(EllipsisIcon_1.default)(({ theme }) => ({
|
|
159
|
+
ellipse: {
|
|
160
|
+
fill: theme.custom.colors.darkGray2,
|
|
161
|
+
},
|
|
162
|
+
width: "24px",
|
|
163
|
+
height: "24px",
|
|
164
|
+
}));
|
|
157
165
|
const AiChatDisplay = (_a) => {
|
|
158
166
|
var _b, _c;
|
|
159
167
|
var { conversationStarters, askTimTitle, entryScreenEnabled = true, entryScreenTitle, srLoadingMessages, placeholder = "", className, scrollElement, ref, useMathJax = false } = _a, others = __rest(_a, ["conversationStarters", "askTimTitle", "entryScreenEnabled", "entryScreenTitle", "srLoadingMessages", "placeholder", "className", "scrollElement", "ref", "useMathJax"]) // Could contain data attributes
|
|
@@ -222,7 +230,7 @@ const AiChatDisplay = (_a) => {
|
|
|
222
230
|
} }, m.content))))) : null,
|
|
223
231
|
waiting ? (React.createElement(MessageRow, { className: (0, classnames_1.default)(classes.messageRow, classes.messageRowAssistant), key: "loading" },
|
|
224
232
|
React.createElement(Message, null,
|
|
225
|
-
React.createElement(
|
|
233
|
+
React.createElement(StyledEllipsisIcon, null)))) : null,
|
|
226
234
|
error ? (React.createElement(Alert_1.Alert, { severity: "error", closable: true }, "An unexpected error has occurred.")) : null),
|
|
227
235
|
React.createElement(BottomSection, { externalScroll: externalScroll, className: classes.bottomSection },
|
|
228
236
|
React.createElement("form", { onSubmit: (e) => {
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
const React = require("react");
|
|
4
|
+
const EllipsisIcon = ({ className }) => (React.createElement("svg", { viewBox: "0 -10 100 40", xmlns: "http://www.w3.org/2000/svg", className: className },
|
|
5
|
+
React.createElement("ellipse", { cx: "20", cy: "15", rx: "8", ry: "8", fill: "#000" },
|
|
6
|
+
React.createElement("animate", { attributeName: "cy", values: "15;4;15;15", dur: "1.2s", keyTimes: "0;0.3;0.6;1", keySplines: "0.42 0 0.58 1; 0.42 0 0.58 1; 0.42 0 0.58 1", calcMode: "spline", repeatCount: "indefinite", begin: "0s" }),
|
|
7
|
+
React.createElement("animate", { attributeName: "ry", values: "8;8;7;8;8", dur: "1.2s", keyTimes: "0;0.52;0.6;0.7;1", repeatCount: "indefinite", begin: "0s" }),
|
|
8
|
+
React.createElement("animate", { attributeName: "rx", values: "8;8;9;8;8", dur: "1.2s", keyTimes: "0;0.52;0.6;0.7;1", repeatCount: "indefinite", begin: "0s" })),
|
|
9
|
+
React.createElement("ellipse", { cx: "50", cy: "15", rx: "8", ry: "8", fill: "#000" },
|
|
10
|
+
React.createElement("animate", { attributeName: "cy", values: "15;4;15;15", dur: "1.2s", keyTimes: "0;0.3;0.6;1", keySplines: "0.42 0 0.58 1; 0.42 0 0.58 1; 0.42 0 0.58 1", calcMode: "spline", repeatCount: "indefinite", begin: "0.2s" }),
|
|
11
|
+
React.createElement("animate", { attributeName: "ry", values: "8;8;7;8;8", dur: "1.2s", keyTimes: "0;0.52;0.6;0.7;1", repeatCount: "indefinite", begin: "0.2s" }),
|
|
12
|
+
React.createElement("animate", { attributeName: "rx", values: "8;8;9;8;8", dur: "1.2s", keyTimes: "0;0.52;0.6;0.7;1", repeatCount: "indefinite", begin: "0.2s" })),
|
|
13
|
+
React.createElement("ellipse", { cx: "80", cy: "15", rx: "8", ry: "8", fill: "#000" },
|
|
14
|
+
React.createElement("animate", { attributeName: "cy", values: "15;4;15;15", dur: "1.2s", keyTimes: "0;0.3;0.6;1", keySplines: "0.42 0 0.58 1; 0.42 0 0.58 1; 0.42 0 0.58 1", calcMode: "spline", repeatCount: "indefinite", begin: "0.4s" }),
|
|
15
|
+
React.createElement("animate", { attributeName: "ry", values: "8;8;7;8;8", dur: "1.2s", keyTimes: "0;0.52;0.6;0.7;1", repeatCount: "indefinite", begin: "0.4s" }),
|
|
16
|
+
React.createElement("animate", { attributeName: "rx", values: "8;8;9;8;8", dur: "1.2s", keyTimes: "0;0.52;0.6;0.7;1", repeatCount: "indefinite", begin: "0.4s" }))));
|
|
17
|
+
exports.default = EllipsisIcon;
|
package/dist/esm/VERSION.d.ts
CHANGED
package/dist/esm/VERSION.js
CHANGED
|
@@ -14,7 +14,7 @@ import { useEffect, useRef, useState } from "react";
|
|
|
14
14
|
import styled from "@emotion/styled";
|
|
15
15
|
import Typography from "@mui/material/Typography";
|
|
16
16
|
import classNames from "classnames";
|
|
17
|
-
import { RiSendPlaneFill, RiStopFill
|
|
17
|
+
import { RiSendPlaneFill, RiStopFill } from "@remixicon/react";
|
|
18
18
|
import { Input, AdornmentButton } from "../Input/Input";
|
|
19
19
|
import { EntryScreen } from "./EntryScreen";
|
|
20
20
|
import { ScrollSnap } from "../ScrollSnap/ScrollSnap";
|
|
@@ -25,6 +25,7 @@ import { ChatTitle } from "./ChatTitle";
|
|
|
25
25
|
import { AiChatProvider, useAiChat } from "./AiChatContext";
|
|
26
26
|
import { useScrollSnap } from "../ScrollSnap/useScrollSnap";
|
|
27
27
|
import Markdown from "./Markdown";
|
|
28
|
+
import EllipsisIcon from "./EllipsisIcon";
|
|
28
29
|
const classes = {
|
|
29
30
|
root: "MitAiChat--root",
|
|
30
31
|
title: "MitAiChat--title",
|
|
@@ -151,6 +152,13 @@ const Disclaimer = styled(Typography)(({ theme }) => ({
|
|
|
151
152
|
marginTop: "16px",
|
|
152
153
|
textAlign: "center",
|
|
153
154
|
}));
|
|
155
|
+
const StyledEllipsisIcon = styled(EllipsisIcon)(({ theme }) => ({
|
|
156
|
+
ellipse: {
|
|
157
|
+
fill: theme.custom.colors.darkGray2,
|
|
158
|
+
},
|
|
159
|
+
width: "24px",
|
|
160
|
+
height: "24px",
|
|
161
|
+
}));
|
|
154
162
|
const AiChatDisplay = (_a) => {
|
|
155
163
|
var _b, _c;
|
|
156
164
|
var { conversationStarters, askTimTitle, entryScreenEnabled = true, entryScreenTitle, srLoadingMessages, placeholder = "", className, scrollElement, ref, useMathJax = false } = _a, others = __rest(_a, ["conversationStarters", "askTimTitle", "entryScreenEnabled", "entryScreenTitle", "srLoadingMessages", "placeholder", "className", "scrollElement", "ref", "useMathJax"]) // Could contain data attributes
|
|
@@ -219,7 +227,7 @@ const AiChatDisplay = (_a) => {
|
|
|
219
227
|
} }, m.content))))) : null,
|
|
220
228
|
waiting ? (React.createElement(MessageRow, { className: classNames(classes.messageRow, classes.messageRowAssistant), key: "loading" },
|
|
221
229
|
React.createElement(Message, null,
|
|
222
|
-
React.createElement(
|
|
230
|
+
React.createElement(StyledEllipsisIcon, null)))) : null,
|
|
223
231
|
error ? (React.createElement(Alert, { severity: "error", closable: true }, "An unexpected error has occurred.")) : null),
|
|
224
232
|
React.createElement(BottomSection, { externalScroll: externalScroll, className: classes.bottomSection },
|
|
225
233
|
React.createElement("form", { onSubmit: (e) => {
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
const EllipsisIcon = ({ className }) => (React.createElement("svg", { viewBox: "0 -10 100 40", xmlns: "http://www.w3.org/2000/svg", className: className },
|
|
3
|
+
React.createElement("ellipse", { cx: "20", cy: "15", rx: "8", ry: "8", fill: "#000" },
|
|
4
|
+
React.createElement("animate", { attributeName: "cy", values: "15;4;15;15", dur: "1.2s", keyTimes: "0;0.3;0.6;1", keySplines: "0.42 0 0.58 1; 0.42 0 0.58 1; 0.42 0 0.58 1", calcMode: "spline", repeatCount: "indefinite", begin: "0s" }),
|
|
5
|
+
React.createElement("animate", { attributeName: "ry", values: "8;8;7;8;8", dur: "1.2s", keyTimes: "0;0.52;0.6;0.7;1", repeatCount: "indefinite", begin: "0s" }),
|
|
6
|
+
React.createElement("animate", { attributeName: "rx", values: "8;8;9;8;8", dur: "1.2s", keyTimes: "0;0.52;0.6;0.7;1", repeatCount: "indefinite", begin: "0s" })),
|
|
7
|
+
React.createElement("ellipse", { cx: "50", cy: "15", rx: "8", ry: "8", fill: "#000" },
|
|
8
|
+
React.createElement("animate", { attributeName: "cy", values: "15;4;15;15", dur: "1.2s", keyTimes: "0;0.3;0.6;1", keySplines: "0.42 0 0.58 1; 0.42 0 0.58 1; 0.42 0 0.58 1", calcMode: "spline", repeatCount: "indefinite", begin: "0.2s" }),
|
|
9
|
+
React.createElement("animate", { attributeName: "ry", values: "8;8;7;8;8", dur: "1.2s", keyTimes: "0;0.52;0.6;0.7;1", repeatCount: "indefinite", begin: "0.2s" }),
|
|
10
|
+
React.createElement("animate", { attributeName: "rx", values: "8;8;9;8;8", dur: "1.2s", keyTimes: "0;0.52;0.6;0.7;1", repeatCount: "indefinite", begin: "0.2s" })),
|
|
11
|
+
React.createElement("ellipse", { cx: "80", cy: "15", rx: "8", ry: "8", fill: "#000" },
|
|
12
|
+
React.createElement("animate", { attributeName: "cy", values: "15;4;15;15", dur: "1.2s", keyTimes: "0;0.3;0.6;1", keySplines: "0.42 0 0.58 1; 0.42 0 0.58 1; 0.42 0 0.58 1", calcMode: "spline", repeatCount: "indefinite", begin: "0.4s" }),
|
|
13
|
+
React.createElement("animate", { attributeName: "ry", values: "8;8;7;8;8", dur: "1.2s", keyTimes: "0;0.52;0.6;0.7;1", repeatCount: "indefinite", begin: "0.4s" }),
|
|
14
|
+
React.createElement("animate", { attributeName: "rx", values: "8;8;9;8;8", dur: "1.2s", keyTimes: "0;0.52;0.6;0.7;1", repeatCount: "indefinite", begin: "0.4s" }))));
|
|
15
|
+
export default EllipsisIcon;
|