@oslokommune/punkt-react 16.1.0 → 16.2.0

package/CHANGELOG.md

@@ -5,6 +5,24 @@ og skriver commits ca etter [Conventional Commits](https://conventionalcommits.o
 
 ---
 
+## [16.2.0](https://github.com/oslokommune/punkt/compare/16.1.0...16.2.0) (2026-03-24)
+
+### ⚠ BREAKING CHANGES
+Ingen
+
+### Features
+* PktCard i React (#3389). 
+
+
+### Bug Fixes
+Ingen
+
+### Chores
+Ingen
+
+---
+
+
 ## [16.1.0](https://github.com/oslokommune/punkt/compare/16.0.5...16.1.0) (2026-03-18)
 
 ### ⚠ BREAKING CHANGES

package/dist/index.d.ts

@@ -14,7 +14,7 @@ import { InputHTMLAttributes } from 'react';
 import { IPktBackLink as IPktBackLink_2 } from '@oslokommune/punkt-elements';
 import { IPktComboboxOption } from '../../../../../shared-types/combobox';
 import { IPktConsent as IPktConsent_2 } from '@oslokommune/punkt-elements';
-import { IPktHeading } from '@oslokommune/punkt-elements';
+import { IPktHeading as IPktHeading_2 } from '@oslokommune/punkt-elements';
 import { IPktLoader as IPktLoader_2 } from '@oslokommune/punkt-elements';
 import { IPktProgressbar as IPktProgressbar_2 } from '@oslokommune/punkt-elements';
 import { JSX as JSX_2 } from 'react/jsx-runtime';
@@ -24,6 +24,7 @@ import { MouseEvent as MouseEvent_2 } from 'react';
 import { MouseEventHandler } from 'react';
 import { ReactElement } from 'react';
 import { ReactNode } from 'react';
+import { Ref } from 'react';
 import { RefAttributes } from 'react';
 import { RefObject } from 'react';
 import { SelectHTMLAttributes } from 'react';
@@ -156,6 +157,13 @@ declare interface IBreadcrumbs {
     href: string;
 }
 
+declare interface ICardTag {
+    skin?: TTagSkin;
+    iconName?: string;
+    ariaLabel?: string;
+    text: string;
+}
+
 /** Props for `uploadStrategy="form"` (native file input submission). */
 declare interface IFileInputFileUploadProps extends IBaseFileUploadProps, Omit<HTMLAttributes<HTMLInputElement>, 'value' | 'onChange' | 'defaultValue'> {
     uploadStrategy?: 'form';
@@ -291,14 +299,14 @@ declare interface IPktCalendarStrings {
     nextMonth?: string;
 }
 
-export declare interface IPktCard extends PktElType {
+export declare interface IPktCard extends Omit<HTMLAttributes<HTMLElement>, 'title'> {
     ariaLabel?: string;
     metaLead?: string | null;
-    borderOnHover?: boolean | null;
+    borderOnHover?: boolean;
     metaTrail?: string | null;
     layout?: TLayout;
     heading?: string;
-    headingLevel?: IPktHeading['level'];
+    headingLevel?: THeadingLevel;
     image?: {
         src: string;
         alt: string;
@@ -306,13 +314,13 @@ export declare interface IPktCard extends PktElType {
     imageShape?: TCardImageShape;
     clickCardLink?: string | null;
     padding?: TCardPadding;
-    openLinkInNewTab?: boolean | null;
+    openLinkInNewTab?: boolean;
     skin?: TCardSkin;
     subheading?: string;
     tagPosition?: TCardTagPosition;
-    tags?: (Omit<IPktTag, 'closeTag'> & {
-        text: string;
-    })[];
+    tags?: ICardTag[];
+    children?: ReactNode;
+    ref?: Ref<HTMLDivElement>;
 }
 
 export declare interface IPktCheckbox extends InputHTMLAttributes<HTMLInputElement> {
@@ -521,7 +529,7 @@ export declare interface IPktHeader {
 
 export declare type IPktHeaderService = IPktHeader;
 
-declare interface IPktHeading_2 extends IPktHeading {
+declare interface IPktHeading extends IPktHeading_2 {
     children?: ReactNode | ReactNode[];
     ref?: LegacyRef<HTMLElement>;
 }
@@ -912,7 +920,7 @@ declare interface PktCalendarHandle {
     close: () => void;
 }
 
-export declare const PktCard: FC<IPktCard>;
+export declare const PktCard: ForwardRefExoticComponent<Omit<IPktCard, "ref"> & RefAttributes<HTMLDivElement>>;
 
 export declare const PktCheckbox: ForwardRefExoticComponent<IPktCheckbox & RefAttributes<HTMLInputElement>>;
 
@@ -952,7 +960,7 @@ export declare const PktHeader: ForwardRefExoticComponent<IPktHeader & RefAttrib
 
 export declare const PktHeaderService: ForwardRefExoticComponent<IPktHeader & RefAttributes<HTMLDivElement>>;
 
-export declare const PktHeading: FC<IPktHeading_2>;
+export declare const PktHeading: FC<IPktHeading>;
 
 export declare const PktHelptext: FC<IPktHelptextProps>;
 
@@ -1085,6 +1093,8 @@ export declare type TFileTransfer = {
     lastProgress?: number;
 };
 
+declare type THeadingLevel = 1 | 2 | 3 | 4 | 5 | 6;
+
 /**
  * Custom renderer for how a queue item is displayed (e.g. filename vs thumbnail grid).
  *
@@ -1129,6 +1139,8 @@ declare type TSkin_2 = IPktTag['skin'];
 
 declare type TStepStatus = 'completed' | 'incomplete' | 'current';
 
+declare type TTagSkin = 'blue' | 'blue-light' | 'blue-dark' | 'green' | 'red' | 'beige' | 'yellow' | 'grey' | 'gray';
+
 export declare type TTransferItemInProgress = TFileAndTransfer & {
     progress: number;
 };