@eclass/ui-kit 1.54.7 → 1.54.9

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

@@ -1870,6 +1870,11 @@ const NavBarButton = ({
     className: "nav-bar-button",
     id: isAccessibility ? "UserWayButton" : "",
     onClick: isAccessibility ? triggerWidget : onClick,
+    _focusVisible: {
+      outline: `3px solid ${vars("colors-alert-deepSkyBlue")}`,
+      borderRadius: "2px"
+    },
+    tabIndex: 0,
     sx: {
       alignItems: "center",
       background: "none !important",
@@ -1918,9 +1923,11 @@ const NavBarButton = ({
     },
     children: [/* @__PURE__ */ jsx(Box, {
       className: "nav-bar-icon",
+      tabIndex: -1,
       children: buttonType[type].icon
     }), !isMobile && /* @__PURE__ */ jsx(Box, {
       className: "nav-bar-text",
+      tabIndex: -1,
       children: buttonType[type].text
     })]
   });
@@ -3338,7 +3345,9 @@ function BoxTraditional({
   data,
   modalPaymentText
 }) {
-  var _a, _b, _c, _d, _e, _f, _g, _h;
+  var _a, _b, _c, _d, _e, _f, _g, _h, _i;
+  const isClickable = isCourseActive((_b = (_a = data.action) == null ? void 0 : _a.enabled) != null ? _b : false, (_c = data.Profile) == null ? void 0 : _c.id);
+  const hasHref = !!((_d = data.action) == null ? void 0 : _d.href);
   const cssActive = {
     boxShadow: `0 2px 7px 0 ${vars("colors-neutral-silverSand")}`
   };
@@ -3348,23 +3357,27 @@ function BoxTraditional({
       as: "article",
       border: vars("borders-light"),
       borderRadius: vars("radii-big"),
-      cursor: "pointer",
+      cursor: isClickable ? "pointer" : "default",
       transition: "box-shadow .3s",
-      _active: cssActive,
-      _hover: cssActive,
-      _focus: cssActive,
       overflow: "hidden",
+      _hover: cssActive,
+      _active: cssActive,
+      _focusWithin: {
+        boxShadow: `0 0 0 3px ${vars("colors-alert-deepSkyBlue")} inset`
+      },
+      tabIndex: !hasHref && isClickable ? 0 : void 0,
+      role: "link",
       children: /* @__PURE__ */ jsx(WithRipples$1, {
-        enabled: isCourseActive((_b = (_a = data.action) == null ? void 0 : _a.enabled) != null ? _b : false, (_c = data.Profile) == null ? void 0 : _c.id),
+        enabled: isCourseActive((_f = (_e = data.action) == null ? void 0 : _e.enabled) != null ? _f : false, (_g = data.Profile) == null ? void 0 : _g.id),
         children: /* @__PURE__ */ jsxs(Flex, {
           direction: "column",
           justify: "space-between",
           h: "100%",
           children: [/* @__PURE__ */ jsxs(Box, {
             className: "CourseList-TraditionalBox",
-            children: [!data.hasFinanzeFreezed && isCourseActive((_e = (_d = data.action) == null ? void 0 : _d.enabled) != null ? _e : false, (_f = data.Profile) == null ? void 0 : _f.id) && /* @__PURE__ */ jsx(LinkOverlay, {
-              href: (_g = data.action) == null ? void 0 : _g.href,
-              isExternal: (_h = data.action) == null ? void 0 : _h.targetBlank
+            children: [isClickable && hasHref && /* @__PURE__ */ jsx(LinkOverlay, {
+              href: (_h = data.action) == null ? void 0 : _h.href,
+              isExternal: (_i = data.action) == null ? void 0 : _i.targetBlank
             }), /* @__PURE__ */ jsx(Header$1, {}), /* @__PURE__ */ jsx(Section, {})]
           }), /* @__PURE__ */ jsx(Footer, {
             modalPaymentText
@@ -3493,6 +3506,7 @@ function CourseList({
     return null;
   }
   return /* @__PURE__ */ jsx(Box, {
+    className: "courseListBox",
     display: "grid",
     gridColumnGap: `${columnGap}rem`,
     gridRowGap: "1.75rem",