@junyiacademy/ui-test 1.6.7 → 1.6.9

package/dist/index.js.mjs

@@ -1,1479 +0,0 @@
-import { createTheme as K, styled as $, alpha as B } from "@mui/material/styles";
-import { jsx as o, jsxs as y, Fragment as it } from "react/jsx-runtime";
-import { forwardRef as H, useState as D } from "react";
-import { MenuItem as lt, InputLabel as X, OutlinedInput as st, FormControl as Z, Select as tt, FormHelperText as et, Input as dt, useMediaQuery as pt, Box as x, Button as ot, ButtonGroup as ct, FormControlLabel as ut, Radio as mt, Typography as w, TextField as ht, Card as gt, CardHeader as xt, IconButton as ft, CardMedia as bt, Divider as Ft, CardContent as yt, CardActions as Ct, Slide as $t, Modal as kt, Chip as vt, Popper as St } from "@mui/material";
-import Tt from "@mui/icons-material/ArrowRightRounded";
-import { menuItemClasses as wt } from "@mui/material/MenuItem";
-import { formHelperTextClasses as rt } from "@mui/material/FormHelperText";
-import { inputBaseClasses as _ } from "@mui/material/InputBase";
-import { inputLabelClasses as g } from "@mui/material/InputLabel";
-import { outlinedInputClasses as C } from "@mui/material/OutlinedInput";
-import { inputClasses as F } from "@mui/material/Input";
-import { buttonClasses as P } from "@mui/material/Button";
-import { buttonGroupClasses as A } from "@mui/material/ButtonGroup";
-import { formControlLabelClasses as j } from "@mui/material/FormControlLabel";
-import { radioClasses as Pt } from "@mui/material/Radio";
-import { textFieldClasses as Bt } from "@mui/material/TextField";
-import zt from "@mui/material/useMediaQuery";
-import Lt from "@mui/icons-material/Close";
-import { chipClasses as N } from "@mui/material/Chip";
-const M = {
-  yellow: { 200: "#FFFF99" },
-  blue: { 600: "#4990E2" },
-  lightGreen: { 400: "#99CC66" }
-}, Mt = (t) => ({
-  components: {
-    MuiLocalizationProvider: {
-      defaultProps: {
-        localeText: { ...t }
-      }
-    }
-  }
-}), Q = {
-  hours: "小時",
-  minutes: "分鐘",
-  seconds: "秒",
-  meridiem: "子午線"
-}, Et = {
-  // Calendar navigation
-  previousMonth: "上個月",
-  nextMonth: "下個月",
-  // View navigation
-  openPreviousView: "上一個視圖",
-  openNextView: "下一個視圖",
-  calendarViewSwitchingButtonAriaLabel: (t) => t === "year" ? "年視圖已打開，切換為日曆視圖" : "日曆視圖已打開，切換為年視圖",
-  // DateRange placeholders
-  start: "開始",
-  end: "結束",
-  // Action bar
-  cancelButtonLabel: "取消",
-  clearButtonLabel: "清除",
-  okButtonLabel: "確認",
-  todayButtonLabel: "今天",
-  nextStepButtonLabel: "下一步",
-  // Toolbar titles
-  datePickerToolbarTitle: "選擇日期",
-  dateTimePickerToolbarTitle: "選擇日期和時間",
-  timePickerToolbarTitle: "選擇時間",
-  dateRangePickerToolbarTitle: "選擇時間範圍",
-  // Clock labels
-  clockLabelText: (t, e) => `選擇 ${Q[t]}. ${e === null ? "未選擇時間" : `已選擇${e}`}`,
-  hoursClockNumberText: (t) => `${t}小時`,
-  minutesClockNumberText: (t) => `${t}分鐘`,
-  secondsClockNumberText: (t) => `${t}秒`,
-  // Digital clock labels
-  selectViewText: (t) => `選擇 ${Q[t]}`,
-  // Calendar labels
-  calendarWeekNumberHeaderLabel: "週數",
-  calendarWeekNumberHeaderText: "#",
-  calendarWeekNumberAriaLabelText: (t) => `第${t}週`,
-  calendarWeekNumberText: (t) => `${t}`,
-  // Open picker labels
-  openDatePickerDialogue: (t) => t ? `選擇日期，已選擇${t}` : "選擇日期",
-  openTimePickerDialogue: (t) => t ? `選擇時間，已選擇${t}` : "選擇時間",
-  // Table labels
-  timeTableLabel: "選擇時間",
-  dateTableLabel: "選擇日期",
-  // Field section placeholders
-  fieldYearPlaceholder: (t) => "Y".repeat(t.digitAmount),
-  fieldMonthPlaceholder: (t) => t.contentType === "letter" ? "MMMM" : "MM",
-  fieldDayPlaceholder: () => "DD",
-  fieldWeekDayPlaceholder: (t) => t.contentType === "letter" ? "EEEE" : "EE",
-  fieldHoursPlaceholder: () => "hh",
-  fieldMinutesPlaceholder: () => "mm",
-  fieldSecondsPlaceholder: () => "ss",
-  fieldMeridiemPlaceholder: () => "aa"
-}, At = Mt(Et), Y = K(), b = [
-  '"Noto Sans TC"',
-  "PingFang",
-  '"Microsoft JhengHei"',
-  "Arial",
-  "sans-serif"
-].join(","), he = K(
-  {
-    typography: {
-      fontFamily: b,
-      h1: { fontFamily: b, fontSize: 96, lineHeight: "112px" },
-      h2: { fontFamily: b, fontSize: 60, lineHeight: 1.2 },
-      h3: { fontFamily: b, fontSize: 48, lineHeight: 1.167 },
-      h4: { fontFamily: b, fontSize: 34, lineHeight: 1.235 },
-      h5: { fontFamily: b, fontSize: 24, lineHeight: 1.334 },
-      h6: { fontFamily: b, fontSize: 20, lineHeight: 1.6 },
-      subtitle1: {
-        fontFamily: b,
-        fontSize: 16,
-        lineHeight: 1.75
-      },
-      subtitle2: {
-        fontFamily: b,
-        fontSize: 14,
-        lineHeight: 1.57
-      },
-      body1: { fontFamily: b, fontSize: 16, lineHeight: 1.5 },
-      body2: { fontFamily: b, fontSize: 14, lineHeight: 1.43 },
-      button: { fontFamily: b },
-      caption: { fontFamily: b, fontSize: 12, lineHeight: 1.66 },
-      overline: { fontFamily: b, fontSize: 12, lineHeight: 2.66 }
-    },
-    palette: {
-      primary: {
-        light: "#82C0FF",
-        main: M.blue[600],
-        dark: "#0063B0"
-      },
-      secondary: {
-        light: "#FFD759",
-        main: "#F5A623",
-        dark: "#BD7700",
-        contrastText: "#FFFFFF"
-      },
-      cancel: {
-        main: "#C4C4C4",
-        contrastText: "#FFFFFF"
-      },
-      primaryGreen: {
-        light: "#9DD49E",
-        main: "#5CB85D",
-        dark: "#218838",
-        contrastText: "#FFFFFF"
-      },
-      blueGreen: {
-        main: "#19A696",
-        contrastText: "#FFFFFF"
-      },
-      grassGreen: Y.palette.augmentColor({
-        color: { main: "#80BB5A", contrastText: "#FFFFFF" }
-      }),
-      darkOrange: Y.palette.augmentColor({
-        color: { main: "#D55704", contrastText: "#FFFFFF" }
-      }),
-      progressPrimary: {
-        main: M.blue[600],
-        dark: M.blue[600],
-        light: "#FFFFFF",
-        contrastText: "#FFFFFF"
-      },
-      progressUpgraded: {
-        main: "#EEEEEE",
-        light: "#FFF",
-        dark: "#D4D4D4",
-        contrastText: "#000000DE"
-      },
-      progressUnstarted: {
-        main: "#EEEEEE",
-        light: "#FFF",
-        dark: "#D4D4D4",
-        contrastText: "#000000DE"
-      },
-      progressStart: {
-        main: "#BEDEFF",
-        light: "#FFFFFF",
-        dark: "#ABC8E5",
-        contrastText: "#000000DE"
-      },
-      progressLevel1: {
-        main: "#82C0FF",
-        light: "#FFFFFF",
-        dark: "#75ADE5",
-        contrastText: "#000000DE"
-      },
-      progressLevel2: {
-        main: M.blue[600],
-        light: "#FFFFFF",
-        dark: "#4180C9",
-        contrastText: "#FFFFFF"
-      },
-      progressLevel3: {
-        main: "#0063B0",
-        light: "#FFFFFF",
-        dark: "#005596",
-        contrastText: "#FFFFFF"
-      },
-      progressFinished: {
-        main: "#05396B",
-        light: "#FFFFFF",
-        dark: "#042B52",
-        contrastText: "#FFFFFF"
-      },
-      progressStruggle: {
-        main: "#C62828",
-        light: "#FFFFFF",
-        dark: "#AD2323",
-        contrastText: "#FFFFFF"
-      },
-      text: {
-        secondary: "rgba(0, 0, 0, 0.54)",
-        disabled: "rgba(0, 0, 0, 0.38)"
-      }
-    },
-    components: {
-      MuiCssBaseline: {
-        styleOverrides: {
-          body: {
-            color: "rgba(0, 0, 0, 0.6)",
-            lineHeight: "1.2",
-            WebkitFontSmoothing: "auto",
-            "& .swal2-container": { zIndex: 1350 },
-            button: {
-              fontFamily: b
-            }
-          },
-          "ol, ul": {
-            listStyle: "none"
-          },
-          "h1, h2, h3, h4, h5, h6, p": {
-            color: "rgba(0, 0, 0, 0.87)",
-            margin: 0,
-            padding: 0,
-            border: 0
-          },
-          a: {
-            color: M.blue[600],
-            textDecoration: "none",
-            cursor: "pointer"
-          },
-          "a:hover, a:focus": {
-            color: "#0063b0"
-          }
-        }
-      },
-      MuiButton: {
-        styleOverrides: {
-          sizeSmall: {
-            fontSize: 12,
-            fontWeight: 500,
-            lineHeight: "22px"
-          },
-          sizeMedium: {
-            fontSize: 14,
-            fontWeight: 500,
-            lineHeight: "24px"
-          },
-          sizeLarge: {
-            fontSize: 15,
-            fontWeight: 500,
-            lineHeight: "26px"
-          }
-        }
-      }
-    }
-  },
-  At
-), I = H(
-  (t, e) => {
-    const { children: r, value: a = "", ...m } = t, { sx: n, ...s } = m;
-    return /* @__PURE__ */ o(
-      lt,
-      {
-        ref: e,
-        sx: [
-          (p) => ({
-            whiteSpace: "unset",
-            color: p.palette.text.primary,
-            [`&.${wt.selected}`]: {
-              backgroundColor: p.palette.grey[300],
-              "&:hover": {
-                backgroundColor: p.palette.grey[200]
-              }
-            }
-          }),
-          ...Array.isArray(n) ? n : [n]
-        ],
-        value: a,
-        ...s,
-        children: r
-      }
-    );
-  }
-);
-I.displayName = "SelectMenuItem";
-const It = $(X, {
-  shouldForwardProp: (t) => t !== "color"
-})(({ color: t = "primary", theme: e }) => ({
-  color: e.palette.text.secondary,
-  [`&.${g.outlined}`]: {
-    [`&:not(.${g.disabled}) .${g.focused}`]: {
-      color: e.palette.action.active
-    },
-    [`&.${g.sizeSmall}:not(.${g.shrink})`]: {
-      transform: "translate(12px, 12px) scale(1)"
-    }
-  },
-  // eslint-disable-next-line
-  [`&.${g.shrink}:not(.${g.error}):not(.${g.disabled}).${g.focused}`]: {
-    color: e.palette[t].main
-  },
-  [`&.${g.shrink}`]: {
-    backgroundColor: "#ffffff",
-    padding: "0 2px"
-  }
-})), Dt = $(st)(
-  ({ theme: t }) => ({
-    [`&.${C.root}`]: {
-      [`&.${C.error}.${C.focused} .${C.notchedOutline}`]: {
-        borderColor: `${t.palette.error.main}`
-      },
-      [`&.${_.sizeSmall} > .${_.input}`]: {
-        padding: "12.5px 15px 12.5px 12px"
-      }
-    },
-    [`& .${C.input}`]: {
-      color: t.palette.text.primary,
-      "&:focus": {
-        background: "rgba(0,0,0,0)"
-      }
-    }
-  })
-), Ht = ({
-  label: t,
-  helperText: e,
-  FormControlProps: r = {},
-  InputLabelProps: a = {},
-  InputProps: m = {},
-  SelectProps: n = {},
-  MenuProps: s = {},
-  FormHelperTextProps: p = {},
-  className: c,
-  children: i,
-  color: u = "primary",
-  size: d = "small",
-  paperMaxHeight: h = "auto",
-  error: l = !1,
-  hasLabel: f = !0,
-  hasShrink: v = !1,
-  value: z = "",
-  disabled: T = !1
-}) => {
-  const W = !!e, { sx: L = [], ...V } = r, { sx: k = [], ...O } = p;
-  return /* @__PURE__ */ y(
-    Z,
-    {
-      sx: [
-        (R) => ({
-          backgroundColor: "white",
-          "&:hover": {
-            // eslint-disable-next-line
-            [`& :not(.${C.disabled}):not(.${C.error}) .${C.notchedOutline}`]: {
-              borderColor: R.palette[u].main
-            }
-          }
-        }),
-        ...Array.isArray(L) ? L : [L]
-      ],
-      size: d,
-      disabled: T,
-      error: l,
-      color: u,
-      className: c,
-      ...V,
-      children: [
-        f && /* @__PURE__ */ o(
-          It,
-          {
-            color: u,
-            shrink: v ? !0 : void 0,
-            ...a,
-            children: t
-          }
-        ),
-        /* @__PURE__ */ o(
-          tt,
-          {
-            value: z,
-            label: f ? t : void 0,
-            MenuProps: {
-              PaperProps: {
-                sx: {
-                  maxHeight: h
-                }
-              },
-              disableAutoFocusItem: !0,
-              anchorOrigin: {
-                vertical: 2,
-                horizontal: "left"
-              },
-              transformOrigin: {
-                vertical: "top",
-                horizontal: "left"
-              },
-              ...s
-            },
-            input: /* @__PURE__ */ o(
-              Dt,
-              {
-                color: u,
-                label: f ? t : void 0,
-                disabled: T,
-                ...m
-              }
-            ),
-            ...n,
-            children: i
-          }
-        ),
-        W && /* @__PURE__ */ o(
-          et,
-          {
-            sx: [
-              {
-                [`&.${rt.root}`]: {
-                  marginLeft: 0
-                }
-              },
-              ...Array.isArray(k) ? k : [k]
-            ],
-            ...O,
-            children: e
-          }
-        )
-      ]
-    }
-  );
-}, Wt = $(X, {
-  shouldForwardProp: (t) => t !== "color"
-})(({ color: t = "primary", theme: e }) => ({
-  [`&.${g.root}`]: {
-    color: e.palette.text.disabled
-  },
-  [`&.${g.focused}`]: {
-    color: e.palette[t].main
-  },
-  [`&.${g.error}`]: {
-    color: e.palette.error.main
-  }
-})), Ot = $(dt, {
-  shouldForwardProp: (t) => t !== "color"
-})(({ color: t = "primary", theme: e }) => ({
-  color: e.palette.text.primary,
-  [`& .${F.input}`]: {
-    "&:focus": {
-      background: "rgba(0,0,0,0)"
-    }
-  },
-  [`&.${F.underline}:not(.${F.disabled}):not(.${F.error})`]: {
-    "&:after,&:hover:before": {
-      borderBottomColor: e.palette[t].main
-    }
-  },
-  [`&.${F.underline}.${F.error}:not(.${F.disabled})`]: {
-    "&:after,&:hover:before": {
-      borderBottomColor: e.palette.error.main
-    }
-  }
-})), Rt = ({
-  label: t,
-  helperText: e,
-  FormControlProps: r = {},
-  InputLabelProps: a = {},
-  InputProps: m = {},
-  SelectProps: n = {},
-  FormHelperTextProps: s = {},
-  className: p,
-  children: c,
-  color: i = "primary",
-  size: u = "small",
-  paperMaxHeight: d = "auto",
-  error: h = !1,
-  hasLabel: l = !0,
-  hasShrink: f = !1,
-  value: v = "",
-  disabled: z = !1
-}) => {
-  const T = !!e;
-  return /* @__PURE__ */ y(
-    Z,
-    {
-      variant: "standard",
-      color: i,
-      size: u,
-      disabled: z,
-      error: h,
-      className: p,
-      ...r,
-      children: [
-        /* @__PURE__ */ o(
-          Wt,
-          {
-            color: i,
-            shrink: f ? !0 : void 0,
-            ...a,
-            children: l ? t : void 0
-          }
-        ),
-        /* @__PURE__ */ o(
-          tt,
-          {
-            value: v,
-            MenuProps: {
-              PaperProps: {
-                sx: {
-                  maxHeight: d
-                }
-              },
-              anchorOrigin: {
-                vertical: 2,
-                horizontal: "left"
-              },
-              transformOrigin: {
-                vertical: "top",
-                horizontal: "left"
-              }
-            },
-            input: /* @__PURE__ */ o(Ot, { color: i, ...m }),
-            ...n,
-            children: c
-          }
-        ),
-        T && /* @__PURE__ */ o(et, { ...s, children: e })
-      ]
-    }
-  );
-}, J = ({ variant: t, ...e }) => t === "outlined" ? /* @__PURE__ */ o(Ht, { ...e }) : /* @__PURE__ */ o(Rt, { ...e }), q = "請選擇", U = "option-for-reset", jt = "", Gt = (t, e, r) => {
-  const a = r && t === 0 ? U : jt;
-  return e?.[t + 1] || a;
-}, ge = ({
-  topicList: t,
-  onTopicSelected: e,
-  hasArrow: r,
-  selectedTopicIds: a,
-  onResetClick: m = () => {
-  },
-  hasResetOption: n = !1
-}) => {
-  const s = pt((u) => u.breakpoints.up("md")), [p, c] = D([]), i = (u, d) => {
-    if (u.target.value === U) {
-      m();
-      return;
-    }
-    e(u.target.value, {
-      layerNumber: d
-    }), c((h) => [
-      ...h.slice(0, d + 1),
-      !1
-    ]);
-  };
-  return /* @__PURE__ */ o(
-    x,
-    {
-      sx: {
-        display: "flex",
-        alignItems: "center",
-        flexWrap: "wrap"
-      },
-      children: t.map((u, d) => {
-        const h = p[d] || !a[d + 1];
-        return u.isError ? null : /* @__PURE__ */ y(
-          x,
-          {
-            sx: {
-              display: "flex",
-              alignItems: "center",
-              width: s ? void 0 : "100%"
-            },
-            children: [
-              r && d !== 0 && /* @__PURE__ */ o(
-                Tt,
-                {
-                  sx: (l) => ({
-                    margin: l.spacing(-1, -1.5),
-                    fontSize: l.spacing(7),
-                    color: "#444"
-                  }),
-                  fontSize: "large",
-                  "data-testid": "topic-filter-arrow"
-                }
-              ),
-              u.isLoading ? /* @__PURE__ */ o(
-                J,
-                {
-                  variant: "outlined",
-                  size: "small",
-                  label: "載入資料中...",
-                  disabled: !0,
-                  FormControlProps: {
-                    sx: (l) => ({
-                      width: s ? 220 : "100%",
-                      margin: l.spacing(1)
-                    })
-                  }
-                }
-              ) : /* @__PURE__ */ y(
-                J,
-                {
-                  variant: "outlined",
-                  size: "small",
-                  label: q,
-                  paperMaxHeight: 412,
-                  hasLabel: h,
-                  value: Gt(
-                    d,
-                    a,
-                    n
-                  ),
-                  SelectProps: {
-                    "data-testid": `layered-topic-${d}`
-                  },
-                  InputProps: {
-                    inputProps: {
-                      "aria-label": `layered-topic-${d}`
-                    },
-                    onChange: (l) => {
-                      i(l, d);
-                    },
-                    onFocus: () => {
-                      c((l) => {
-                        const f = [...l];
-                        return f[d] = !0, f;
-                      });
-                    },
-                    onBlur: () => {
-                      c((l) => {
-                        const f = [...l];
-                        return f[d] = !1, f;
-                      });
-                    }
-                  },
-                  FormControlProps: {
-                    sx: (l) => ({
-                      width: s ? 220 : "100%",
-                      margin: l.spacing(1)
-                    })
-                  },
-                  children: [
-                    /* @__PURE__ */ o(I, { disabled: !0, value: "", children: q }),
-                    n && d === 0 && /* @__PURE__ */ o(I, { value: U, children: "所有科目" }),
-                    u.data.children.map((l) => /* @__PURE__ */ o(
-                      I,
-                      {
-                        value: l.id,
-                        "data-testid": `layered-menuitem-${d}`,
-                        "data-is-content-topic": l.hasContentChild,
-                        children: l.title
-                      },
-                      l.id
-                    ))
-                  ]
-                }
-              )
-            ]
-          },
-          d
-        );
-      })
-    }
-  );
-};
-function S(t) {
-  return `${t.charAt(0).toUpperCase()}${t.slice(1)}`;
-}
-const E = H(
-  (t, e) => {
-    const { children: r, ...a } = t;
-    return /* @__PURE__ */ o(ot, { ref: e, ...a, children: r });
-  }
-);
-E.displayName = "Button";
-const xe = $(E, {
-  shouldForwardProp: (t) => t !== "active"
-})(({ theme: t, active: e, color: r = "primary" }) => ({
-  // For variant: outlined
-  [`&.${P.outlined}${S(r)}`]: {
-    backgroundColor: e ? t.palette[r].main : t.palette.common.white,
-    color: e ? t.palette.common.white : t.palette[r].main,
-    borderColor: t.palette[r].main,
-    "&:hover": {
-      backgroundColor: e ? t.palette[r].main : B(t.palette[r].main, 0.1)
-    },
-    [`&.${P.disabled}`]: {
-      backgroundColor: t.palette.common.white,
-      borderColor: t.palette.action.disabledBackground,
-      color: t.palette.action.disabled
-    }
-  },
-  // For variant: text
-  [`&.${P.text}${S(r)}`]: {
-    "&:hover": {
-      backgroundColor: B(t.palette[r].main, 0.1)
-    }
-  }
-})), Ut = $(ot)(
-  ({ theme: t, color: e = "primary", loading: r }) => ({
-    // For variant: outlined
-    [`&.${P.outlined}${S(e)}`]: {
-      borderColor: !r && t.palette[e].main,
-      "&:hover": {
-        backgroundColor: B(t.palette[e].main, 0.1)
-      },
-      [`&.${P.disabled}`]: {
-        backgroundColor: !r && t.palette.common.white,
-        borderColor: !r && t.palette.action.disabledBackground,
-        color: !r && t.palette.action.disabled
-      }
-    },
-    // For variant: text
-    [`&.${P.text}${S(e)}`]: {
-      "&:hover": {
-        backgroundColor: B(t.palette[e].main, 0.1)
-      }
-    }
-  })
-), fe = ({
-  children: t,
-  ...e
-}) => /* @__PURE__ */ o(Ut, { ...e, children: /* @__PURE__ */ o("span", { children: t }) }), nt = H(
-  (t, e) => {
-    const { children: r, ...a } = t;
-    return /* @__PURE__ */ o(ct, { ref: e, ...a, children: r });
-  }
-);
-nt.displayName = "ButtonGroup";
-const be = $(
-  nt
-)(({ color: t = "primary", theme: e }) => ({
-  [`&.${A.outlined} > .${A.grouped}${S(t)}.${A.grouped}.${A.disabled}`]: {
-    borderColor: B(e.palette[t].main, 0.5),
-    color: B(e.palette[t].main, 0.5)
-  }
-})), Vt = $(ut)(({ theme: t }) => ({
-  [`& .${j.label}`]: {
-    color: t.palette.text.secondary,
-    [`&.${j.disabled}`]: {
-      color: t.palette.text.disabled
-    }
-  },
-  [`& .${Pt.checked} + .${j.label}`]: {
-    color: t.palette.text.primary
-  }
-})), Fe = ({
-  checked: t,
-  disabled: e,
-  label: r,
-  labelPlacement: a,
-  value: m,
-  FormControlLabelProps: n = {},
-  RadioProps: s = {},
-  TypographyProps: p = {},
-  color: c = "secondary",
-  size: i = "medium",
-  caption: u = ""
-}) => {
-  const { sx: d = [], ...h } = s, { sx: l = [], ...f } = p;
-  return /* @__PURE__ */ y(it, { children: [
-    /* @__PURE__ */ o(
-      Vt,
-      {
-        control: /* @__PURE__ */ o(
-          mt,
-          {
-            sx: [
-              (v) => ({
-                color: v.palette.text.primary
-              }),
-              ...Array.isArray(d) ? d : [d]
-            ],
-            color: c,
-            size: i,
-            ...h
-          }
-        ),
-        checked: t,
-        disabled: e,
-        label: r,
-        labelPlacement: a,
-        value: m,
-        ...n
-      }
-    ),
-    u && /* @__PURE__ */ o(
-      w,
-      {
-        sx: [
-          (v) => ({
-            color: v.palette.text.disabled,
-            margin: "0 0 0 30px"
-          }),
-          ...Array.isArray(l) ? l : [l]
-        ],
-        variant: "body2",
-        ...f,
-        children: u
-      }
-    )
-  ] });
-}, _t = $(ht)(
-  ({ label: t, color: e = "primary", theme: r }) => ({
-    [`& .${g.error}`]: {
-      [`&:not(.${g.shrink})`]: {
-        color: r.palette.text.secondary
-      },
-      [`&.${g.disabled}`]: {
-        color: r.palette.text.disabled
-      }
-    },
-    [`& .${g.error}.${g.focused}`]: {
-      color: r.palette.error.main
-    },
-    // For variant: standard | filled
-    [`& .${F.underline}:not(.${F.disabled})`]: {
-      [`&.MuiInputBase-color${S(e)}:hover:before`]: {
-        borderColor: r.palette[e].main
-      }
-    },
-    // For variant: outlined
-    [`& .${F.disabled} .${C.notchedOutline}`]: {
-      borderStyle: "dotted"
-    },
-    [`& .${F.error}.${F.focused} .${C.notchedOutline}`]: {
-      borderColor: r.palette.error.main
-    },
-    [`&.${Bt.root} :not(.${F.disabled}):not(.${F.error})`]: {
-      [`&.MuiInputBase-color${S(e)}:hover .${C.notchedOutline}`]: {
-        borderColor: r.palette[e].main
-      }
-    },
-    [`& .${C.notchedOutline}`]: {
-      "& > legend": {
-        maxWidth: t === "" && 0
-      }
-    }
-  })
-), ye = (t) => {
-  const { slotProps: e = {}, ...r } = t, {
-    inputLabel: a = {},
-    input: m = {},
-    formHelperText: n = {},
-    ...s
-  } = e, p = !!("endAdornment" in m && m?.endAdornment);
-  return /* @__PURE__ */ o(
-    _t,
-    {
-      slotProps: {
-        inputLabel: {
-          shrink: p ? !0 : void 0,
-          ...a
-        },
-        input: m,
-        formHelperText: {
-          ...n,
-          sx: [
-            (c) => ({
-              [`&.${rt.root}`]: {
-                marginLeft: 0,
-                [`&.${F.error}`]: {
-                  color: c.palette.error.main
-                }
-              }
-            })
-          ]
-        },
-        ...s
-      },
-      ...r
-    }
-  );
-}, at = H((t, e) => {
-  const {
-    title: r,
-    content: a,
-    imageUrl: m,
-    confirmButtonProps: n,
-    cancelButtonProps: s,
-    closeButtonProps: p,
-    context: c
-  } = t;
-  return /* @__PURE__ */ y(
-    gt,
-    {
-      ref: e,
-      sx: (i) => ({
-        zIndex: "10000",
-        backgroundColor: "white",
-        borderRadius: "10px",
-        boxShadow: "4px 6px 20px 0px #00000040",
-        padding: 0,
-        width: "400px",
-        [i.breakpoints.up(1024)]: {
-          position: "fixed",
-          left: "64px",
-          bottom: "50px"
-        },
-        [i.breakpoints.down(451)]: {
-          width: "80%"
-        }
-      }),
-      children: [
-        /* @__PURE__ */ o(
-          xt,
-          {
-            sx: (i) => ({
-              padding: i.spacing(p ? 1 : 2, 2, 0)
-            }),
-            action: p && /* @__PURE__ */ o(
-              ft,
-              {
-                onClick: () => {
-                  p instanceof Object && p?.onClick ? p.onClick(c) : c.close();
-                },
-                children: /* @__PURE__ */ o(Lt, {})
-              }
-            )
-          }
-        ),
-        m && /* @__PURE__ */ o(
-          bt,
-          {
-            sx: (i) => ({
-              padding: i.spacing(1, 2)
-            }),
-            children: /* @__PURE__ */ y(
-              x,
-              {
-                sx: (i) => ({
-                  display: "flex",
-                  flexDirection: "column",
-                  gap: i.spacing(1)
-                }),
-                children: [
-                  /* @__PURE__ */ o(
-                    x,
-                    {
-                      component: "img",
-                      sx: {
-                        textAlign: "center",
-                        width: "100%",
-                        height: "100%",
-                        border: "0.5px solid #D2D2D2",
-                        borderRadius: "8px"
-                      },
-                      src: m
-                    }
-                  ),
-                  /* @__PURE__ */ o(Ft, {})
-                ]
-              }
-            )
-          }
-        ),
-        /* @__PURE__ */ y(
-          yt,
-          {
-            sx: (i) => ({
-              padding: i.spacing(0, 2),
-              gap: i.spacing(1),
-              display: "flex",
-              flexDirection: "column"
-            }),
-            children: [
-              /* @__PURE__ */ y(
-                x,
-                {
-                  sx: (i) => ({
-                    gap: i.spacing(1),
-                    display: "flex"
-                  }),
-                  children: [
-                    /* @__PURE__ */ o(
-                      x,
-                      {
-                        component: "img",
-                        alt: "title icon",
-                        src: "https://www.junyiacademy.org/images/exam/title_icon.svg"
-                      }
-                    ),
-                    /* @__PURE__ */ o(x, { children: /* @__PURE__ */ o(w, { sx: { fontSize: "21px" }, children: r }) })
-                  ]
-                }
-              ),
-              /* @__PURE__ */ o(w, { sx: { color: "#b5b5b5", fontSize: "18px" }, children: a })
-            ]
-          }
-        ),
-        /* @__PURE__ */ y(
-          Ct,
-          {
-            sx: (i) => ({
-              padding: i.spacing(1, 1, 3, 1),
-              display: "flex",
-              justifyContent: "center",
-              gap: i.spacing(2)
-            }),
-            children: [
-              s && /* @__PURE__ */ o(
-                E,
-                {
-                  color: "cancel",
-                  variant: s?.variant ?? "contained",
-                  size: s?.size ?? "large",
-                  onClick: () => {
-                    s?.onClick && s.onClick(c);
-                  },
-                  children: s.title || "取消"
-                }
-              ),
-              n && /* @__PURE__ */ o(
-                E,
-                {
-                  variant: n?.variant ?? "contained",
-                  size: n?.size ?? "large",
-                  onClick: () => {
-                    n?.onClick && n.onClick(c);
-                  },
-                  children: n.title || "確定"
-                }
-              )
-            ]
-          }
-        )
-      ]
-    }
-  );
-});
-at.displayName = "TutorialStep";
-const Ce = ({
-  steps: t = [],
-  initialStep: e = 0,
-  onClose: r
-}) => {
-  const [a, m] = D(e), n = zt((h) => h.breakpoints.up(1024)), [s, p] = D(!0), c = t[a], u = {
-    ...c,
-    context: {
-      close: () => {
-        p(!1), r && r();
-      },
-      goToStep: (h) => {
-        m(h);
-      },
-      currentStep: a,
-      currentStepProps: c
-    }
-  };
-  return ((h) => n ? /* @__PURE__ */ o($t, { in: s, direction: "up", mountOnEnter: !0, unmountOnExit: !0, children: h }) : /* @__PURE__ */ o(
-    kt,
-    {
-      open: s,
-      sx: {
-        display: "flex",
-        alignItems: "center",
-        justifyContent: "center",
-        outline: 0
-      },
-      children: /* @__PURE__ */ o(
-        x,
-        {
-          sx: {
-            display: "flex",
-            alignItems: "center",
-            justifyContent: "center",
-            outline: 0
-          },
-          children: h
-        }
-      )
-    }
-  ))(/* @__PURE__ */ o(at, { ...u }));
-}, Nt = ({
-  color: t = "progressUpgraded",
-  checked: e = !1,
-  ...r
-}) => {
-  const { sx: a = [], ...m } = r;
-  return /* @__PURE__ */ o(
-    vt,
-    {
-      variant: "outlined",
-      sx: [
-        (n) => ({
-          ...e ? {
-            backgroundColor: n.palette[t].main,
-            color: n.palette[t].contrastText,
-            ".MuiChip-icon": {
-              color: n.palette[t].contrastText
-            }
-          } : {
-            backgroundColor: n.palette[t].light,
-            color: n.palette.text.primary
-          },
-          [`&.${N.clickable}:hover`]: {
-            backgroundColor: n.palette[t].dark,
-            color: n.palette[t].contrastText
-          },
-          [`&.${N.clickable}:hover > .MuiChip-icon`]: {
-            color: n.palette[t].contrastText
-          }
-        }),
-        ...Array.isArray(a) ? a : [a]
-      ],
-      ...m
-    }
-  );
-}, Qt = $(St)(({ theme: t }) => ({
-  zIndex: 1e3,
-  "& > div": {
-    position: "relative"
-  },
-  '&[data-popper-placement*="bottom"]': {
-    "& > div": {
-      marginTop: 6
-    },
-    "& .MuiPopper-arrow": {
-      top: 0,
-      left: 0,
-      marginTop: "-0.9em",
-      width: "3em",
-      height: "1em",
-      "&::after": {
-        borderWidth: "0 1em 1em 1em",
-        borderColor: `transparent transparent ${t.palette.common.white} transparent`,
-        top: 1
-      },
-      "&::before": {
-        borderWidth: "0 1em 1em 1em",
-        borderColor: "transparent transparent rgba(0, 0, 0, 0.4) transparent",
-        top: 6
-      }
-    }
-  },
-  '&[data-popper-placement*="top"]': {
-    "& > div": {
-      marginBottom: 6
-    },
-    "& .MuiPopper-arrow": {
-      bottom: 0,
-      left: 0,
-      marginBottom: "-0.9em",
-      width: "3em",
-      height: "1em",
-      "&::after": {
-        borderWidth: "6px 6px 0 6px",
-        borderColor: `${t.palette.common.white} transparent transparent transparent`,
-        bottom: 14
-      },
-      "&::before": {
-        borderWidth: "7px 7px 0 7px",
-        borderColor: "rgba(0, 0, 0, 0.4) transparent transparent transparent",
-        bottom: 6
-      }
-    }
-  },
-  '&[data-popper-placement*="right"]': {
-    "& > div": {
-      marginLeft: 6
-    },
-    "& .MuiPopper-arrow": {
-      left: 6,
-      marginLeft: "-0.9em",
-      height: "3em",
-      width: "1em",
-      "&::after": {
-        borderWidth: "6px 6px 6px 0",
-        borderColor: `transparent ${t.palette.common.white} transparent transparent`,
-        top: -13,
-        left: 1
-      },
-      "&::before": {
-        borderWidth: "7px 7px 7px 0",
-        borderColor: "transparent rgba(0, 0, 0, 0.4) transparent transparent"
-      }
-    }
-  },
-  '&[data-popper-placement*="left"]': {
-    "& > div": {
-      marginRight: 6
-    },
-    "& .MuiPopper-arrow": {
-      right: 6,
-      marginRight: "-0.9em",
-      height: "3em",
-      width: "1em",
-      "&::after": {
-        borderWidth: "6px 0 6px 6px",
-        borderColor: `transparent transparent transparent ${t.palette.common.white}`,
-        top: -13,
-        right: 1
-      },
-      "&::before": {
-        borderWidth: "7px 0 7px 7px",
-        borderColor: "transparent transparent transparent rgba(0, 0, 0, 0.4)"
-      }
-    }
-  }
-})), Yt = $("div")(({ hasBorder: t }) => ({
-  position: "absolute",
-  fontSize: 7,
-  width: "3em",
-  height: "3em",
-  zIndex: 1,
-  "&::after": {
-    position: "relative",
-    content: '""',
-    margin: "auto",
-    display: "block",
-    width: 0,
-    height: 0,
-    borderStyle: "solid",
-    zIndex: 2
-  },
-  "&::before": {
-    position: "relative",
-    content: '""',
-    margin: "auto",
-    display: "block",
-    visibility: t ? "visible" : "hidden",
-    width: 0,
-    height: 0,
-    borderStyle: "solid"
-  }
-})), G = $(E)({
-  minWidth: "49px"
-}), $e = ({
-  anchorEl: t,
-  arrow: e,
-  placement: r = "right",
-  hasBorder: a = !0,
-  content: m = "",
-  helperText: n,
-  chipLabel: s,
-  TopLeftButtonProps: p,
-  TopRightButtonProps: c,
-  BottomRightButtonProps: i,
-  ChipProps: u,
-  PopperProps: d = {}
-}) => {
-  const [h, l] = D(null), { title: f, ...v } = p || {}, { title: z, ...T } = c || {}, { title: W, ...L } = i || {};
-  return /* @__PURE__ */ y(
-    Qt,
-    {
-      "data-testid": "info-popover",
-      open: !!t,
-      anchorEl: t,
-      placement: r,
-      disablePortal: !0,
-      modifiers: [
-        {
-          name: "flip",
-          enabled: !0,
-          options: {
-            altBoundary: !0,
-            rootBoundary: "document",
-            padding: 8
-          }
-        },
-        {
-          name: "preventOverflow",
-          enabled: !0,
-          options: {
-            altAxis: !1,
-            altBoundary: !0,
-            tether: !0,
-            rootBoundary: "document",
-            padding: 8
-          }
-        },
-        {
-          name: "arrow",
-          enabled: e,
-          options: {
-            element: h,
-            padding: 10
-          }
-        }
-      ],
-      sx: {
-        maxWidth: 194,
-        width: "100%"
-      },
-      ...d,
-      children: [
-        e ? /* @__PURE__ */ o(
-          Yt,
-          {
-            "data-testid": "info-popover-arrow",
-            ref: l,
-            className: "MuiPopper-arrow",
-            hasBorder: a
-          }
-        ) : null,
-        /* @__PURE__ */ o(
-          x,
-          {
-            "data-testid": "info-popover-paper",
-            sx: (k) => ({
-              padding: 2,
-              backgroundColor: k.palette.background.paper,
-              borderRadius: "4px",
-              border: a ? "1px solid rgba(0, 0, 0, 0.4)" : null,
-              overflow: "auto",
-              boxShadow: k.shadows[2]
-            }),
-            children: /* @__PURE__ */ y(
-              x,
-              {
-                sx: {
-                  maxWidth: 194
-                },
-                children: [
-                  /* @__PURE__ */ o(
-                    w,
-                    {
-                      variant: "body1",
-                      sx: {
-                        width: "100%",
-                        "&:not(:last-child)": {
-                          marginBottom: 1
-                        }
-                      },
-                      children: m
-                    }
-                  ),
-                  s && u && /* @__PURE__ */ y(
-                    x,
-                    {
-                      sx: {
-                        display: "flex",
-                        justifyContent: "flex-end",
-                        alignItems: "center",
-                        "&:not(:last-child)": {
-                          marginBottom: 1
-                        }
-                      },
-                      children: [
-                        /* @__PURE__ */ o(w, { variant: "body2", children: s }),
-                        /* @__PURE__ */ o(
-                          Nt,
-                          {
-                            ...u,
-                            sx: {
-                              border: 0
-                            }
-                          }
-                        )
-                      ]
-                    }
-                  ),
-                  n && /* @__PURE__ */ o(
-                    x,
-                    {
-                      sx: (k) => ({
-                        width: "100%",
-                        padding: k.spacing(1, 0),
-                        "&:not(:last-child)": {
-                          marginBottom: 1
-                        }
-                      }),
-                      children: n.split(`
-`).map((k, O) => /* @__PURE__ */ o(
-                        w,
-                        {
-                          variant: "body2",
-                          sx: (R) => ({
-                            color: R.palette.text.secondary,
-                            textAlign: "right"
-                          }),
-                          children: k
-                        },
-                        `helper-text-${O}`
-                      ))
-                    }
-                  ),
-                  (c || p) && /* @__PURE__ */ y(
-                    x,
-                    {
-                      sx: {
-                        display: "flex",
-                        justifyContent: "flex-end",
-                        alignItems: "center",
-                        "&:not(:last-child)": {
-                          marginBottom: 1
-                        }
-                      },
-                      children: [
-                        p && /* @__PURE__ */ o(
-                          x,
-                          {
-                            sx: {
-                              display: "flex"
-                            },
-                            children: /* @__PURE__ */ o(
-                              G,
-                              {
-                                "data-testid": "info-popover-top-left-button",
-                                variant: "contained",
-                                size: "medium",
-                                color: "primary",
-                                ...v,
-                                children: f
-                              }
-                            )
-                          }
-                        ),
-                        c && /* @__PURE__ */ o(
-                          x,
-                          {
-                            sx: {
-                              display: "flex",
-                              marginLeft: 1
-                            },
-                            children: /* @__PURE__ */ o(
-                              G,
-                              {
-                                "data-testid": "info-popover-top-right-button",
-                                variant: "contained",
-                                size: "medium",
-                                color: "primary",
-                                ...T,
-                                children: z
-                              }
-                            )
-                          }
-                        )
-                      ]
-                    }
-                  ),
-                  i && /* @__PURE__ */ o(
-                    x,
-                    {
-                      sx: {
-                        display: "flex",
-                        justifyContent: "flex-end",
-                        alignItems: "center",
-                        "&:not(:last-child)": {
-                          marginBottom: 1
-                        }
-                      },
-                      children: /* @__PURE__ */ o(
-                        G,
-                        {
-                          "data-testid": "info-popover-bottom-left-button",
-                          variant: "contained",
-                          size: "medium",
-                          color: "primary",
-                          ...L,
-                          children: W
-                        }
-                      )
-                    }
-                  )
-                ]
-              }
-            )
-          }
-        )
-      ]
-    }
-  );
-};
-export {
-  xe as Button,
-  be as ButtonGroup,
-  Nt as Chip,
-  $e as InfoPopover,
-  fe as LoadingButton,
-  Fe as Radio,
-  J as Select,
-  I as SelectMenuItem,
-  ye as TextField,
-  ge as TopicFilter,
-  Ce as Tutorial,
-  M as colors,
-  he as theme
-};