@eclass/ui-kit 1.9.1 → 1.10.1

package/dist/eclass-ui-kit.es.js

@@ -10690,7 +10690,7 @@ var ring2 = {
   ringOffsetColor: t.colors("--chakra-ring-offset-color"),
   ringInset: t.prop("--chakra-ring-inset")
 };
-var space = {
+var space$1 = {
   margin: t.spaceT("margin"),
   marginTop: t.spaceT("marginTop"),
   marginBlockStart: t.spaceT("marginBlockStart"),
@@ -10718,29 +10718,29 @@ var space = {
   paddingY: t.space(["paddingTop", "paddingBottom"]),
   paddingBlock: t.space("paddingBlock")
 };
-Object.assign(space, {
-  m: space.margin,
-  mt: space.marginTop,
-  mr: space.marginRight,
-  me: space.marginInlineEnd,
-  marginEnd: space.marginInlineEnd,
-  mb: space.marginBottom,
-  ml: space.marginLeft,
-  ms: space.marginInlineStart,
-  marginStart: space.marginInlineStart,
-  mx: space.marginX,
-  my: space.marginY,
-  p: space.padding,
-  pt: space.paddingTop,
-  py: space.paddingY,
-  px: space.paddingX,
-  pb: space.paddingBottom,
-  pl: space.paddingLeft,
-  ps: space.paddingInlineStart,
-  paddingStart: space.paddingInlineStart,
-  pr: space.paddingRight,
-  pe: space.paddingInlineEnd,
-  paddingEnd: space.paddingInlineEnd
+Object.assign(space$1, {
+  m: space$1.margin,
+  mt: space$1.marginTop,
+  mr: space$1.marginRight,
+  me: space$1.marginInlineEnd,
+  marginEnd: space$1.marginInlineEnd,
+  mb: space$1.marginBottom,
+  ml: space$1.marginLeft,
+  ms: space$1.marginInlineStart,
+  marginStart: space$1.marginInlineStart,
+  mx: space$1.marginX,
+  my: space$1.marginY,
+  p: space$1.padding,
+  pt: space$1.paddingTop,
+  py: space$1.paddingY,
+  px: space$1.paddingX,
+  pb: space$1.paddingBottom,
+  pl: space$1.paddingLeft,
+  ps: space$1.paddingInlineStart,
+  paddingStart: space$1.paddingInlineStart,
+  pr: space$1.paddingRight,
+  pe: space$1.paddingInlineEnd,
+  paddingEnd: space$1.paddingInlineEnd
 });
 var textDecoration = {
   textDecorationColor: t.colors("textDecorationColor"),
@@ -10987,8 +10987,8 @@ var pseudoSelectors = {
   _light: ".chakra-ui-light &:not([data-theme]),[data-theme=light] &:not([data-theme]),&[data-theme=light]"
 };
 var pseudoPropNames = objectKeys(pseudoSelectors);
-var systemProps = mergeWith({}, background, border, color$1, flexbox, layout, filter$1, ring2, interactivity, grid, others, position, effect, space, scroll, typography$2, textDecoration, transform8, list$1, transition$1);
-Object.assign({}, space, layout, flexbox, grid, position);
+var systemProps = mergeWith({}, background, border, color$1, flexbox, layout, filter$1, ring2, interactivity, grid, others, position, effect, space$1, scroll, typography$2, textDecoration, transform8, list$1, transition$1);
+Object.assign({}, space$1, layout, flexbox, grid, position);
 var propNames = [].concat(objectKeys(systemProps), pseudoPropNames);
 var styleProps = _extends$c({}, systemProps, pseudoSelectors);
 var isStyleProp = function isStyleProp2(prop2) {
@@ -16334,7 +16334,7 @@ var radii$1 = {
   "3xl": "1.5rem",
   full: "9999px"
 };
-var shadows = {
+var shadows$1 = {
   xs: "0 0 0 1px rgba(0, 0, 0, 0.05)",
   sm: "0 1px 2px 0 rgba(0, 0, 0, 0.05)",
   base: "0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06)",
@@ -16406,7 +16406,7 @@ var foundations = _extends$a({
   colors: colors$1
 }, typography$1, {
   sizes: sizes$l,
-  shadows,
+  shadows: shadows$1,
   space: spacing,
   borders: borders$2,
   transition
@@ -26121,22 +26121,39 @@ const styles = {
     }
   })
 };
-const base = "solid 1px";
+const base = "solid .063rem";
 const borders = {
-  normal: `${base} ${colors.neutral.silverSand}`,
+  normal: `${base} ${colors.neutral.darkCharcoal}`,
   light: `${base} ${colors.neutral.platinum}`,
   active: `${base} ${colors.main.deepSkyBlue}`,
   success: `${base} ${colors.alert.jadeGreen}`,
-  error: `${base} ${colors.alert.red}`
+  error: `${base} ${colors.alert.red}`,
+  white: `solid .125rem ${colors.neutral.white}`
 };
 const radii = {
   small: ".25rem",
   big: ".5rem",
   rounded: "50%"
 };
+const shadows = {
+  sm: "0 .125rem .5rem 0 rgba(0,0,0,.20)",
+  md: "0 .25rem 1rem 0 rgba(0,0,0,.20)",
+  lg: "0 .5rem 2rem 0 rgba(0,0,0,.20)"
+};
+const space = {
+  xxs: ".25rem",
+  xs: ".5rem",
+  s: "1rem",
+  m: "1.5rem",
+  l: "2rem",
+  xl: "3rem",
+  xxl: "5rem"
+};
 const utils = {
   borders,
-  radii
+  radii,
+  shadows,
+  space
 };
 var _700 = "";
 var _500 = "";
@@ -26346,12 +26363,12 @@ var withAttrs = function(Component) {
     return React__default.createElement(Component, __assign({}, props));
   };
 };
-var ReactRipples = withAttrs(createRipples());
+var Ripples$1 = withAttrs(createRipples());
 function Ripples({
   children,
   color: color2 = "rgba(204,204,204,0.2)"
 }) {
-  return /* @__PURE__ */ jsx(ReactRipples, {
+  return /* @__PURE__ */ jsx(Ripples$1, {
     during: 1e3,
     color: color2,
     children: /* @__PURE__ */ jsx(Box, {
@@ -26366,15 +26383,18 @@ function Base({
   color: color2 = vars("colors-main-ziggurat"),
   m: m2 = "0",
   viewBox = "0 0 16 16",
-  children
+  children,
+  title
 }) {
-  return /* @__PURE__ */ jsx(Icon, {
+  return /* @__PURE__ */ jsxs(Icon, {
     w: w2,
     h,
     viewBox,
     color: color2,
     m: m2,
-    children
+    children: [/* @__PURE__ */ jsxs("title", {
+      children: ["icon", title && `-${title}`]
+    }), children]
   });
 }
 function AlertInfo(props) {
@@ -26486,11 +26506,56 @@ function CircularInformation(props) {
   }));
 }
 CircularInformation.displayName = "CircularInformation";
+function Loader({
+  fill = "#fff"
+}) {
+  return /* @__PURE__ */ jsx("div", {
+    className: "loaderAsync",
+    "data-testid": "loaderAsync",
+    children: /* @__PURE__ */ jsxs("svg", {
+      id: "prefix__eXySq0EBKm11",
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 38 20",
+      shapeRendering: "geometricPrecision",
+      textRendering: "geometricPrecision",
+      width: 38,
+      height: 20,
+      children: [/* @__PURE__ */ jsx("style", {
+        dangerouslySetInnerHTML: {
+          __html: "@keyframes eXySq0EBKm12_f_o{0%,33.333333%,to{fill-opacity:.4}66.666667%{fill-opacity:1;animation-timing-function:cubic-bezier(.42,0,.58,1)}}@keyframes eXySq0EBKm13_f_o{0%,66.666667%,to{fill-opacity:.4}33.333333%{fill-opacity:1;animation-timing-function:cubic-bezier(.42,0,.58,1)}}@keyframes eXySq0EBKm14_f_o{0%{fill-opacity:1;animation-timing-function:cubic-bezier(.42,0,.58,1)}33.333333%,66.666667%{fill-opacity:.4}to{fill-opacity:1}}"
+        }
+      }), /* @__PURE__ */ jsx("circle", {
+        r: 2.502,
+        transform: "translate(29.526 10)",
+        fill,
+        fillOpacity: 0.4,
+        style: {
+          animation: "eXySq0EBKm12_f_o 600ms linear infinite normal forwards"
+        }
+      }), /* @__PURE__ */ jsx("circle", {
+        r: 2.502,
+        transform: "translate(19 10)",
+        fill,
+        fillOpacity: 0.4,
+        style: {
+          animation: "eXySq0EBKm13_f_o 600ms linear infinite normal forwards"
+        }
+      }), /* @__PURE__ */ jsx("circle", {
+        r: 2.053,
+        transform: "matrix(1.21764 0 0 1.21764 8.562 10.002)",
+        fill,
+        style: {
+          animation: "eXySq0EBKm14_f_o 600ms linear infinite normal forwards"
+        }
+      })]
+    })
+  });
+}
 function Profile(props) {
   return /* @__PURE__ */ jsx(Base, __spreadProps(__spreadValues({}, props), {
     viewBox: "0 0 12 12",
-    w: ".625rem",
-    h: ".75rem",
+    w: "12px",
+    title: "profile",
     children: /* @__PURE__ */ jsx("path", {
       fill: "currentColor",
       d: "M5 6a3 3 0 100-6 3 3 0 000 6zM5 7c-3.375 0-5 2.106-5 3.333V11a1 1 0 001 1h8a1 1 0 001-1v-.667C10 9.106 8.375 7 5 7z"
@@ -26629,6 +26694,115 @@ function TinyAlertSuccess(props) {
   }));
 }
 TinyAlertSuccess.displayName = "TinyAlertSuccess";
+function Multimedia(props) {
+  return /* @__PURE__ */ jsxs(Base, __spreadProps(__spreadValues({}, props), {
+    w: "12px",
+    viewBox: "0 0 14 14",
+    title: "multimedia",
+    children: [/* @__PURE__ */ jsx("path", {
+      d: "M3 6C4.65685 6 6 4.65685 6 3C6 1.34315 4.65685 0 3 0C1.34315 0 0 1.34315 0 3C0 4.65685 1.34315 6 3 6Z",
+      fill: "currentColor"
+    }), /* @__PURE__ */ jsx("path", {
+      d: "M11 6C12.6569 6 14 4.65685 14 3C14 1.34315 12.6569 0 11 0C9.34315 0 8 1.34315 8 3C8 4.65685 9.34315 6 11 6Z",
+      fill: "currentColor"
+    }), /* @__PURE__ */ jsx("path", {
+      d: "M3 14C4.65685 14 6 12.6569 6 11C6 9.34315 4.65685 8 3 8C1.34315 8 0 9.34315 0 11C0 12.6569 1.34315 14 3 14Z",
+      fill: "currentColor"
+    }), /* @__PURE__ */ jsx("path", {
+      d: "M11 14C12.6569 14 14 12.6569 14 11C14 9.34315 12.6569 8 11 8C9.34315 8 8 9.34315 8 11C8 12.6569 9.34315 14 11 14Z",
+      fill: "currentColor"
+    })]
+  }));
+}
+Multimedia.displayName = "Multimedia";
+function GoBack(props) {
+  return /* @__PURE__ */ jsx(Base, __spreadProps(__spreadValues({}, props), {
+    w: "16px",
+    h: "16px",
+    viewBox: "0 0 16 16",
+    title: "goBack",
+    children: /* @__PURE__ */ jsx("path", {
+      d: "M9.92593 2L4 8L9.92593 14L12 11.9L8.14815 8L12 4.1L9.92593 2Z",
+      fill: "currentColor"
+    })
+  }));
+}
+GoBack.displayName = "GoBack";
+function Password(props) {
+  return /* @__PURE__ */ jsx(Base, __spreadProps(__spreadValues({}, props), {
+    w: "16px",
+    h: "16px",
+    viewBox: "0 0 16 16",
+    title: "password",
+    children: /* @__PURE__ */ jsx("path", {
+      fillRule: "evenodd",
+      clipRule: "evenodd",
+      d: "M8 1C5.95714 1 4.28571 2.67143 4.28571 4.71429V5.64286H2.42857C1.87143 5.64286 1.5 6.01429 1.5 6.57143V14.9286C1.5 15.4857 1.87143 15.8571 2.42857 15.8571H13.5714C14.1286 15.8571 14.5 15.4857 14.5 14.9286V6.57143C14.5 6.01429 14.1286 5.64286 13.5714 5.64286H11.7143V4.71429C11.7143 2.67143 10.0429 1 8 1ZM8.92857 11.8643V13.0714H7.07143V11.8643C6.51429 11.5857 6.14286 10.9357 6.14286 10.2857C6.14286 9.26429 6.97857 8.42857 8 8.42857C9.02143 8.42857 9.85714 9.26429 9.85714 10.2857C9.85714 10.9357 9.48571 11.5857 8.92857 11.8643ZM6.14286 4.71429V5.64286H9.85714V4.71429C9.85714 3.69286 9.02143 2.85714 8 2.85714C6.97857 2.85714 6.14286 3.69286 6.14286 4.71429Z",
+      fill: "currentColor"
+    })
+  }));
+}
+Password.displayName = "Password";
+function Pen(props) {
+  return /* @__PURE__ */ jsxs(Base, __spreadProps(__spreadValues({}, props), {
+    w: "16px",
+    h: "16px",
+    viewBox: "0 0 16 16",
+    title: "pen",
+    children: [/* @__PURE__ */ jsx("path", {
+      d: "M8.1 3.5L0.3 11.3C0.1 11.5 0 11.7 0 12V15C0 15.6 0.4 16 1 16H4C4.3 16 4.5 15.9 4.7 15.7L12.5 7.9L8.1 3.5Z",
+      fill: "currentColor"
+    }), /* @__PURE__ */ jsx("path", {
+      d: "M15.7 3.3L12.7 0.3C12.3 -0.1 11.7 -0.1 11.3 0.3L9.5 2.1L13.9 6.5L15.7 4.7C16.1 4.3 16.1 3.7 15.7 3.3Z",
+      fill: "currentColor"
+    })]
+  }));
+}
+Pen.displayName = "Pen";
+function PlusSign(props) {
+  return /* @__PURE__ */ jsx(Base, __spreadProps(__spreadValues({}, props), {
+    w: "16px",
+    h: "16px",
+    viewBox: "0 0 16 16",
+    title: "plusSign",
+    children: /* @__PURE__ */ jsx("path", {
+      fillRule: "evenodd",
+      clipRule: "evenodd",
+      d: "M0 8C0 3.6 3.6 0 8 0C12.4 0 16 3.6 16 8C16 12.4 12.4 16 8 16C3.6 16 0 12.4 0 8ZM9 9H12V7H9V4H7V7H4V9H7V12H9V9Z",
+      fill: "currentColor"
+    })
+  }));
+}
+PlusSign.displayName = "PlusSign";
+function TrashCan(props) {
+  return /* @__PURE__ */ jsxs(Base, __spreadProps(__spreadValues({}, props), {
+    w: "16px",
+    h: "16px",
+    viewBox: "0 0 16 16",
+    title: "trashCan",
+    children: [/* @__PURE__ */ jsx("path", {
+      d: "M2 6V14C2 15.1 2.9 16 4 16H12C13.1 16 14 15.1 14 14V6H2Z",
+      fill: "currentColor"
+    }), /* @__PURE__ */ jsx("path", {
+      d: "M12 3V1C12 0.4 11.6 0 11 0H5C4.4 0 4 0.4 4 1V3H0V5H16V3H12ZM10 3H6V2H10V3Z",
+      fill: "currentColor"
+    })]
+  }));
+}
+TrashCan.displayName = "TrashCan";
+function TextBubble(props) {
+  return /* @__PURE__ */ jsx(Base, __spreadProps(__spreadValues({}, props), {
+    w: "16px",
+    h: "16px",
+    viewBox: "0 0 16 16",
+    title: "textBubble",
+    children: /* @__PURE__ */ jsx("path", {
+      d: "M1 0H15C15.552 0 16 0.448 16 1V11C16 11.552 15.552 12 15 12H10L4 16V12H1C0.448 12 0 11.552 0 11V1C0 0.448 0.448 0 1 0Z",
+      fill: "currentColor"
+    })
+  }));
+}
+TextBubble.displayName = "TextBubble";
 function TinyAlert({
   status,
   text,
@@ -26698,6 +26872,7 @@ function TinyAlert({
     gap: ".25rem",
     width: "fit-content",
     borderRadius: ".25rem",
+    className: "TinyAlert-Box",
     children: [alerts[status].icon && /* @__PURE__ */ jsx(Box, {
       lineHeight: 0,
       sx: {
@@ -26720,6 +26895,239 @@ function TinyAlert({
   });
 }
 TinyAlert.displayName = "TinyAlert";
+function Btn({
+  bg: bg2,
+  borderColorActive = [vars("colors-main-deepSkyBlue"), vars("colors-neutral-white")],
+  children,
+  color: color2 = vars("colors-neutral-white"),
+  disabled: disabled2 = false,
+  fillLoader = vars("colors-neutral-white"),
+  isFullWidth = false,
+  leftIcon,
+  m: m2 = "0",
+  isLoading = false,
+  onClick,
+  rightIcon,
+  rounded = false,
+  size: size2 = "regular",
+  touchDark = false,
+  type = "button",
+  tabIndex
+}) {
+  var _a, _b, _c;
+  let showChildren = children != null ? children : null;
+  if (!children && !rightIcon && !leftIcon) {
+    showChildren = "Button";
+  }
+  const borderRadius = rounded ? "12px" : vars("radii-small");
+  const colorMain = (_a = bg2 == null ? void 0 : bg2.main) != null ? _a : vars("colors-main-deepSkyBlue");
+  const touchColor = touchDark ? "rgba(160, 160, 160, 0.2)" : "rgba(255, 255, 255, 0.2)";
+  const onlyIcon = !children && (rightIcon != null ? rightIcon : leftIcon) ? "onlyIcon" : "";
+  return /* @__PURE__ */ jsx(Box, {
+    margin: m2,
+    sx: {
+      ".react-ripples": {
+        borderRadius,
+        display: `${isFullWidth ? "grid" : "inline-flex!important"}`
+      }
+    },
+    children: /* @__PURE__ */ jsx(Ripples$1, {
+      color: touchColor,
+      children: /* @__PURE__ */ jsx(Button, {
+        fontWeight: "500",
+        fontSize: size2 === "regular" ? "medium" : "small",
+        bg: colorMain,
+        size: size2 === "regular" ? "md" : "sm",
+        borderRadius,
+        color: color2,
+        className: onlyIcon,
+        disabled: disabled2,
+        height: "auto",
+        iconSpacing: vars("space-xs"),
+        isActive: false,
+        isLoading,
+        leftIcon,
+        onClick: (e2) => {
+          !isLoading && !disabled2 && (onClick == null ? void 0 : onClick(e2));
+        },
+        type,
+        tabIndex,
+        paddingTop: size2 === "regular" ? vars("space-xs") : vars("space-xxs"),
+        paddingBottom: size2 === "regular" ? vars("space-xs") : vars("space-xxs"),
+        paddingLeft: size2 === "regular" ? vars("space-s") : vars("space-xs"),
+        paddingRight: size2 === "regular" ? vars("space-s") : vars("space-xs"),
+        position: "relative",
+        isFullWidth,
+        rightIcon,
+        spinner: /* @__PURE__ */ jsx(Loader, {
+          fill: fillLoader
+        }),
+        _active: {
+          bg: (_b = bg2 == null ? void 0 : bg2.main) != null ? _b : vars("colors-main-azureRadiance")
+        },
+        _disabled: {
+          opacity: "50%",
+          cursor: "not-allowed"
+        },
+        _focus: {
+          boxShadow: `inset 0 0 0 2px ${borderColorActive[0]}, inset 0 0 0 4px ${borderColorActive[1]}`
+        },
+        _hover: {
+          bg: (_c = bg2 == null ? void 0 : bg2.hover) != null ? _c : vars("colors-main-azureRadiance")
+        },
+        sx: {
+          "&[data-loading]": {
+            boxShadow: "none",
+            cursor: "wait"
+          },
+          "&.onlyIcon span": {
+            m: 0
+          },
+          span: {
+            h: "1rem"
+          }
+        },
+        children: showChildren
+      })
+    })
+  });
+}
+Btn.displayName = "Btn";
+function BtnPrimary({
+  children,
+  disabled: disabled2 = false,
+  isFullWidth = false,
+  leftIcon,
+  m: m2 = "0",
+  isLoading = false,
+  onClick,
+  rightIcon,
+  size: size2 = "regular",
+  type = "button",
+  tabIndex
+}) {
+  return /* @__PURE__ */ jsx(Btn, {
+    disabled: disabled2,
+    isFullWidth,
+    isLoading,
+    leftIcon,
+    m: m2,
+    onClick,
+    rightIcon,
+    size: size2,
+    type,
+    tabIndex,
+    children
+  });
+}
+BtnPrimary.displayName = "BtnPrimary";
+function BtnSecondary({
+  children,
+  disabled: disabled2 = false,
+  isFullWidth = false,
+  leftIcon,
+  m: m2 = "0",
+  isLoading = false,
+  onClick,
+  rightIcon,
+  size: size2 = "regular",
+  type = "button",
+  tabIndex
+}) {
+  return /* @__PURE__ */ jsx(Btn, {
+    bg: {
+      main: vars("colors-main-veryLightBlue"),
+      hover: vars("colors-main-linkWater")
+    },
+    fillLoader: vars("colors-main-deepSkyBlue"),
+    borderColorActive: [vars("colors-main-deepSkyBlue"), vars("colors-neutral-white")],
+    color: vars("colors-main-deepSkyBlue"),
+    disabled: disabled2,
+    isFullWidth,
+    isLoading,
+    leftIcon,
+    m: m2,
+    onClick,
+    rightIcon,
+    size: size2,
+    touchDark: true,
+    type,
+    tabIndex,
+    children
+  });
+}
+BtnSecondary.displayName = "BtnSecondary";
+function BtnTertiary({
+  children,
+  iconStatus = "multimedia",
+  rightIcon,
+  withoutColor = false,
+  m: m2 = "0",
+  onClick
+}) {
+  var _a;
+  const gray = vars("colors-neutral-gray");
+  const blue = vars("colors-main-deepSkyBlue");
+  const white = vars("colors-neutral-white");
+  const colorIcon = withoutColor ? gray : blue;
+  const btnIcons = {
+    answer: /* @__PURE__ */ jsx(TextBubble, {
+      color: colorIcon
+    }),
+    back: /* @__PURE__ */ jsx(GoBack, {
+      color: colorIcon
+    }),
+    edit: /* @__PURE__ */ jsx(Pen, {
+      color: colorIcon
+    }),
+    eliminate: /* @__PURE__ */ jsx(TrashCan, {
+      color: colorIcon
+    }),
+    more: /* @__PURE__ */ jsx(PlusSign, {
+      color: colorIcon
+    }),
+    password: /* @__PURE__ */ jsx(Password, {
+      color: colorIcon
+    }),
+    multimedia: /* @__PURE__ */ jsx(Multimedia, {
+      color: colorIcon
+    })
+  };
+  const icon = (_a = btnIcons[iconStatus]) != null ? _a : btnIcons.multimedia;
+  const rIcon = rightIcon ? icon : void 0;
+  const lIcon = !rightIcon ? icon : void 0;
+  return /* @__PURE__ */ jsx(Button, {
+    height: "24px",
+    background: white,
+    fontFamily: "Roboto",
+    fontStyle: "normal",
+    fontWeight: "500",
+    fontSize: "14px",
+    lineHeight: "16px",
+    textDecorationLine: "underline",
+    borderRadius: "12px",
+    color: gray,
+    rightIcon: rIcon,
+    leftIcon: lIcon,
+    m: m2,
+    onClick,
+    _hover: {
+      color: blue
+    },
+    _focus: {
+      boxShadow: `inset 0 0 0 2px ${blue}, inset 0 0 0 4px ${white}`
+    },
+    sx: {
+      "&:hover": {
+        "svg path": {
+          fill: blue
+        }
+      }
+    },
+    children
+  });
+}
+BtnTertiary.displayName = "BtnTertiary";
 const STUDENT = 4;
 function Header() {
   const {
@@ -27787,6 +28195,7 @@ function Footer({
         _focus: cssButton,
         _active: cssButton,
         onClick: () => handleClick(),
+        fontSize: "1rem !important",
         children: action.text
       }) : /* @__PURE__ */ jsx(Text, {
         color: vars("colors-main-deepSkyBlue"),
@@ -27890,5 +28299,5 @@ function CourseList({
   });
 }
 CourseList.displayName = "CourseList";
-export { CourseList, Label, Progress, Ripples, TinyAlert, dataFake, maxWidthCoursesList, theme, vars };
+export { Btn, BtnPrimary, BtnSecondary, BtnTertiary, CourseList, Label, Progress, Ripples, TinyAlert, dataFake, maxWidthCoursesList, theme, vars };
 //# sourceMappingURL=eclass-ui-kit.es.js.map