@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.
@@ -9,4 +9,4 @@
9
9
  * result in all of the package.json being included in the bundled code, which
10
10
  * is not desired.
11
11
  */
12
- export declare const VERSION = "6.6.2";
12
+ export declare const VERSION = "6.7.0";
@@ -12,4 +12,4 @@ exports.VERSION = void 0;
12
12
  * result in all of the package.json being included in the bundled code, which
13
13
  * is not desired.
14
14
  */
15
- exports.VERSION = "6.6.2";
15
+ exports.VERSION = "6.7.0";
@@ -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(react_2.RiMoreFill, null)))) : null,
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,6 @@
1
+ import type { FC } from "react";
2
+ type EllipsisIconProps = {
3
+ className?: string;
4
+ };
5
+ declare const EllipsisIcon: FC<EllipsisIconProps>;
6
+ export default EllipsisIcon;
@@ -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;
@@ -9,4 +9,4 @@
9
9
  * result in all of the package.json being included in the bundled code, which
10
10
  * is not desired.
11
11
  */
12
- export declare const VERSION = "6.6.2";
12
+ export declare const VERSION = "6.7.0";
@@ -9,4 +9,4 @@
9
9
  * result in all of the package.json being included in the bundled code, which
10
10
  * is not desired.
11
11
  */
12
- export const VERSION = "6.6.2";
12
+ export const VERSION = "6.7.0";
@@ -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, RiMoreFill } from "@remixicon/react";
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(RiMoreFill, null)))) : null,
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,6 @@
1
+ import type { FC } from "react";
2
+ type EllipsisIconProps = {
3
+ className?: string;
4
+ };
5
+ declare const EllipsisIcon: FC<EllipsisIconProps>;
6
+ export default EllipsisIcon;
@@ -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;