Merge pull request #154 from linked-planet/dev

Dev

Author: marcus-wishes

biome.json renamed to biome.jsonc

@@ -1,5 +1,5 @@
 {
-	"$schema": "https://biomejs.dev/schemas/2.0.4/schema.json",
+	"$schema": "https://biomejs.dev/schemas/2.0.6/schema.json",
 	"formatter": {
 		"enabled": true,
 		"formatWithErrors": true,
@@ -25,6 +25,9 @@
 			"correctness": {
 				"noUnusedImports": "warn"
 			},
+			"nursery": {
+				"useUniqueElementIds": "off"
+			},
 			"style": {
 				"noParameterAssign": "error",
 				"useAsConstAssertion": "error",

library/src/components/Accordion.tsx

@@ -1,6 +1,6 @@
 import * as RAccordion from "@radix-ui/react-accordion"
 import { ChevronDownIcon } from "lucide-react"
-import React, { type Ref } from "react"
+import { forwardRef, type Ref } from "react"
 import { twMerge } from "tailwind-merge"
 
 type AccordionSingleProps = Pick<
@@ -48,7 +48,7 @@ type AccordionItemProps = Pick<
 	"value" | "id" | "className" | "style" | "children"
 >
 
-const AccordionItem = React.forwardRef(
+const AccordionItem = forwardRef(
 	(
 		{ children, className, ...props }: AccordionItemProps,
 		forwardedRef: Ref<HTMLDivElement>,
@@ -72,7 +72,7 @@ type AccordionTriggerProps = Pick<
 	"id" | "onClick" | "onKeyDown" | "className" | "style" | "children"
 > & { testId?: string }
 
-const AccordionTrigger = React.forwardRef(
+const AccordionTrigger = forwardRef(
 	(
 		{ children, className, ...props }: AccordionTriggerProps,
 		forwardedRef: Ref<HTMLButtonElement>,
@@ -104,7 +104,7 @@ type AccordionContentProps = Pick<
 	"id" | "className" | "style" | "children"
 > & { testId?: string }
 
-const AccordionContent = React.forwardRef(
+const AccordionContent = forwardRef(
 	(
 		{ children, className, ...props }: AccordionContentProps,
 		forwardedRef: Ref<HTMLDivElement>,

library/src/components/Blanket.tsx

@@ -1,7 +1,8 @@
-import ReactDOM from "react-dom"
 import type { ComponentPropsWithoutRef } from "react"
+import ReactDOM from "react-dom"
 import { twMerge } from "tailwind-merge"
 import { usePortalContainer } from "../utils"
+
 type BlanketProps = ComponentPropsWithoutRef<"div"> & {
 	usePortal?: boolean | ShadowRoot
 }
@@ -25,8 +26,8 @@ export function Blanket({
 			role={role ?? "presentation"}
 			{...props}
 		>
-			{/** biome-ignore lint/a11y/noStaticElementInteractions: <explanation> */}
-			{/** biome-ignore lint/a11y/useKeyWithClickEvents: <explanation> */}
+			{/** biome-ignore lint/a11y/noStaticElementInteractions: background blanke diff interaction handling */}
+			{/** biome-ignore lint/a11y/useKeyWithClickEvents: No key handling needed */}
 			<div
 				onClick={(e) => {
 					// this is necessary for the click to propagate to the blanket anywhere inside the children

library/src/components/BookCard.tsx

@@ -1,8 +1,7 @@
+import { css } from "@emotion/css"
 import type React from "react"
-import { forwardRef } from "react"
 import type { CSSProperties } from "react"
-
-import { css } from "@emotion/css"
+import { forwardRef } from "react"
 
 import { twMerge } from "tailwind-merge"
 import { Collapsible } from "./Collapsible"
@@ -281,24 +280,27 @@ const CardHeaderUpperTitle = ({
 	)
 }
 
+/**
+ * Styling element containing the actions of the card header
+ */
 const CardHeaderActions = ({
 	children,
 	id,
 	testId,
 	className,
 	style,
-	onClick,
-	onKeyDown,
-	onKeyUp,
+	//onClick,
+	//onKeyDown,
+	//onKeyUp,
 }: {
 	children: React.ReactNode
 	id?: string
 	testId?: string
 	className?: string
 	style?: CSSProperties
-	onClick?: (event: React.MouseEvent<HTMLDivElement>) => void
-	onKeyDown?: (event: React.KeyboardEvent<HTMLDivElement>) => void
-	onKeyUp?: (event: React.KeyboardEvent<HTMLDivElement>) => void
+	//onClick?: (event: React.MouseEvent<HTMLDivElement>) => void
+	//onKeyDown?: (event: React.KeyboardEvent<HTMLDivElement>) => void
+	//onKeyUp?: (event: React.KeyboardEvent<HTMLDivElement>) => void
 }) => (
 	<div
 		className={twMerge(
@@ -308,32 +310,9 @@ const CardHeaderActions = ({
 		id={id}
 		data-testid={testId}
 		style={style}
-		onClick={onClick}
-		onKeyDown={onKeyDown}
-		onKeyUp={onKeyUp}
-	>
-		{children}
-	</div>
-)
-
-const CardHeaderActionsInfo = ({
-	children,
-	id,
-	testId,
-	className,
-	style,
-}: {
-	children: React.ReactNode
-	id?: string
-	testId?: string
-	className?: string
-	style?: CSSProperties
-}) => (
-	<div
-		className={twMerge("mr-2 box-border items-center text-sm", className)}
-		id={id}
-		data-testid={testId}
-		style={style}
+		//onClick={onClick}
+		//onKeyDown={onKeyDown}
+		//onKeyUp={onKeyUp}
 	>
 		{children}
 	</div>
@@ -464,7 +443,6 @@ const BookCardComponents = {
 	CardHeaderSubtitle,
 	CardHeaderUpperTitle,
 	CardHeaderActions,
-	CardHeaderActionsInfo,
 	CardGridBody,
 	CardRowBody,
 	CardColumnBody,
@@ -485,7 +463,6 @@ type BookCardProps = {
 	bodyStyle?: CSSProperties
 	bodyClassName?: string
 	actions?: React.ReactNode
-	actionsInfo?: React.ReactNode
 	children?: React.ReactNode
 	onOpenChanged?: (opened: boolean) => void
 	id?: string
@@ -502,7 +479,6 @@ export const BookCard = forwardRef(
 			closed,
 			defaultOpen,
 			actions,
-			actionsInfo,
 			bodyStyle,
 			bodyClassName,
 			bodyLayout,
@@ -549,14 +525,7 @@ export const BookCard = forwardRef(
 								</CardHeaderSubtitle>
 							)}
 						</CardHeaderMeta>
-						<CardHeaderActions>
-							{actionsInfo && (
-								<CardHeaderActionsInfo>
-									{actionsInfo}
-								</CardHeaderActionsInfo>
-							)}
-							{actions}
-						</CardHeaderActions>
+						<CardHeaderActions>{actions}</CardHeaderActions>
 					</CardHeader>
 				}
 			>

library/src/components/Breadcrumbs.tsx

@@ -1,5 +1,5 @@
-import React, { useEffect, useState } from "react"
 import type { ComponentPropsWithoutRef } from "react"
+import React, { useEffect, useState } from "react"
 import { twMerge } from "tailwind-merge"
 
 type BreadcrumbsProps = ComponentPropsWithoutRef<"div"> & {