@ndla/primitives 1.0.10-alpha.0 → 1.0.12-alpha.0

package/dist/panda.buildinfo.json

@@ -598,6 +598,7 @@
       "--arrow-background]___[value:colors.surface.action",
       "height]___[value:200px",
       "objectFit]___[value:cover",
+      "minHeight]___[value:3xlarge",
       "borderBlockWidth]___[value:1px",
       "borderInlineColor]___[value:transparent",
       "transitionProperty]___[value:background-color, border-color, color",
@@ -606,6 +607,8 @@
       "background]___[value:var(--background-hover)]___[cond:_hover",
       "background]___[value:var(--background-hover)]___[cond:_highlighted",
       "background]___[value:var(--background-current)]___[cond:&[aria-current=\"true\"], &[aria-current=\"page\"]",
+      "borderBlockStartColor]___[value:transparent]___[cond:&[aria-current=\"true\"], &[aria-current=\"page\"]",
+      "borderBlockEndColor]___[value:transparent]___[cond:&[aria-current=\"true\"], &[aria-current=\"page\"]",
       "color]___[value:var(--color-current-hover)]___[cond:&[aria-current=\"true\"], &[aria-current=\"page\"]",
       "background]___[value:var(--background-hover)]___[cond:&[aria-current=\"true\"], &[aria-current=\"page\"]<___>_hover",
       "color]___[value:text.default]___[cond:&[aria-current=\"true\"], &[aria-current=\"page\"]<___>_hover",

package/dist/styles.css

@@ -877,6 +877,10 @@
     object-fit: cover;
 }
 
+  .min-h_3xlarge {
+    min-height: var(--sizes-3xlarge);
+}
+
   .bd-y-w_1px {
     border-block-width: 1px;
 }
@@ -1829,6 +1833,14 @@
     outline-color: var(--colors-stroke-hover);
 }
 
+  .\[\&\[aria-current\=\"true\"\]\,_\&\[aria-current\=\"page\"\]\]\:bd-bs-c_transparent[aria-current="true"],.\[\&\[aria-current\=\"true\"\]\,_\&\[aria-current\=\"page\"\]\]\:bd-bs-c_transparent[aria-current="page"] {
+    border-block-start-color: transparent;
+}
+
+  .\[\&\[aria-current\=\"true\"\]\,_\&\[aria-current\=\"page\"\]\]\:bd-be-c_transparent[aria-current="true"],.\[\&\[aria-current\=\"true\"\]\,_\&\[aria-current\=\"page\"\]\]\:bd-be-c_transparent[aria-current="page"] {
+    border-block-end-color: transparent;
+}
+
   .first\:bd-bs-c_transparent:first-child {
     border-block-start-color: transparent;
 }

package/es/ListItem/ListItem.js

@@ -12,15 +12,13 @@ import { sva } from "@ndla/styled-system/css";
 import { createStyleContext } from "../createStyleContext";
 import { Image } from "../Image";
 import { Heading } from "../Text";
-
-// TODO: Focus ring on current items is not visible
 import { jsx as _jsx } from "react/jsx-runtime";
 export const listItemRecipe = sva({
   slots: ["root", "title", "content", "image"],
   base: {
     root: {
+      minHeight: "3xlarge",
       borderBlockWidth: "1px",
-      background: "surface.default",
       borderInlineColor: "transparent",
       color: "text.default",
       position: "relative",
@@ -40,6 +38,8 @@ export const listItemRecipe = sva({
       },
       '&[aria-current="true"], &[aria-current="page"]': {
         background: "var(--background-current)",
+        borderBlockStartColor: "transparent",
+        borderBlockEndColor: "transparent",
         color: "var(--color-current-hover)",
         _hover: {
           background: "var(--background-hover)",

package/lib/ListItem/ListItem.js

@@ -19,14 +19,12 @@ var _jsxRuntime = require("react/jsx-runtime");
  *
  */
 
-// TODO: Focus ring on current items is not visible
-
 const listItemRecipe = exports.listItemRecipe = (0, _css.sva)({
   slots: ["root", "title", "content", "image"],
   base: {
     root: {
+      minHeight: "3xlarge",
       borderBlockWidth: "1px",
-      background: "surface.default",
       borderInlineColor: "transparent",
       color: "text.default",
       position: "relative",
@@ -46,6 +44,8 @@ const listItemRecipe = exports.listItemRecipe = (0, _css.sva)({
       },
       '&[aria-current="true"], &[aria-current="page"]': {
         background: "var(--background-current)",
+        borderBlockStartColor: "transparent",
+        borderBlockEndColor: "transparent",
         color: "var(--color-current-hover)",
         _hover: {
           background: "var(--background-hover)",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ndla/primitives",
-  "version": "1.0.10-alpha.0",
+  "version": "1.0.12-alpha.0",
   "description": "Primitive components for NDLA.",
   "license": "GPL-3.0",
   "main": "lib/index.js",
@@ -43,5 +43,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "309461b1f7b791740d6cc5e430c4c96a891ac10e"
+  "gitHead": "fd50e914af42f70fda68083094768e248c4171a2"
 }