added feedback points

nl-design-system · Oct 11, 2024 · a8cbc82 · a8cbc82
1 parent 33ac15f
commit a8cbc82
Show file tree

Hide file tree

Showing 3 changed files with 7 additions and 6 deletions.
diff --git a/packages/components-css/link-list-card/index.scss b/packages/components-css/link-list-card/index.scss
@@ -1,4 +1,4 @@
-.rhc-link-list__card {
+.rhc-link-list-card {
   background-color: var(--rhc-link-list-card-background-color);
   display: flex;
   flex-direction: column;

diff --git a/packages/components-react/src/LinkListCard.tsx b/packages/components-react/src/LinkListCard.tsx
@@ -1,16 +1,17 @@
-import { forwardRef, HTMLAttributes } from 'react';
+import clsx from 'clsx';
+import { forwardRef, HTMLAttributes, ReactNode } from 'react';
 import { Heading } from './Heading';
 import { LinkList } from './LinkList';
 
 export interface LinkListCardProps extends HTMLAttributes<HTMLDivElement> {
   headingLevel: number;
-  heading: string;
+  heading: ReactNode;
 }
 
 export const LinkListCard = forwardRef<HTMLDivElement, LinkListCardProps>(
-  ({ children, headingLevel, heading }, ref) => {
+  ({ children, className, headingLevel, heading }, ref) => {
     return (
-      <div className="rhc-link-list__card" ref={ref}>
+      <div className={clsx('rhc-link-list-card', className)} ref={ref}>
         <Heading level={headingLevel}>{heading}</Heading>
         <LinkList>{children}</LinkList>
       </div>

diff --git a/packages/storybook/src/community/link-list-card.md b/packages/storybook/src/community/link-list-card.md
@@ -9,7 +9,7 @@ De **LinkListCard** component biedt een manier om een **card** weer te geven met
 - **`headingLevel`** (`number`)
   Dit bepaalt het niveau van de heading, vergelijkbaar met HTML heading-tags
 
-- **`headingText`** (`string`)
+- **`heading`** (`string`)
   De tekst die weergegeven wordt binnen de heading.
 
 LinkListCard-component bestaat uit de volgende subcomponenten: