Merge pull request #7 from schubergphilis/bugfix/date-check

fix: IsValidDateString check

Author: ramonklanke

sbp-frontend-style/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@schubergphilis/sbp-frontend-style",
-	"version": "1.7.0",
+	"version": "1.7.1-4",
 	"license": "MIT",
 	"type": "module",
 	"types": "./dist/index.d.ts",
@@ -41,61 +41,61 @@
 		"styled-components": "^6.1.19"
 	},
 	"devDependencies": {
-		"@eslint/compat": "^1.3.1",
+		"@eslint/compat": "^1.3.2",
 		"@eslint/eslintrc": "^3.3.1",
-		"@eslint/js": "^9.32.0",
+		"@eslint/js": "^9.35.0",
 		"@inrupt/jest-jsdom-polyfills": "^4.0.5",
-		"@reduxjs/toolkit": "^2.8.2",
+		"@reduxjs/toolkit": "^2.9.0",
 		"@rollup/plugin-commonjs": "^28.0.6",
 		"@rollup/plugin-node-resolve": "^16.0.1",
 		"@rollup/plugin-sucrase": "^5.0.2",
 		"@rollup/plugin-typescript": "^11.1.2",
 		"@testing-library/dom": "^10.4.1",
-		"@testing-library/jest-dom": "^6.6.4",
+		"@testing-library/jest-dom": "^6.8.0",
 		"@testing-library/react": "^16.3.0",
 		"@testing-library/user-event": "^14.6.1",
 		"@types/jest": "^30.0.0",
-		"@types/node": "^24.2.0",
-		"@types/react": "^19.1.9",
-		"@types/react-dom": "^19.1.7",
+		"@types/node": "^24.3.1",
+		"@types/react": "^19.1.12",
+		"@types/react-dom": "^19.1.9",
 		"@types/react-redux": "^7.1.34",
 		"@types/react-syntax-highlighter": "^15.5.13",
 		"@types/styled-components": "^5.1.34",
-		"@typescript-eslint/eslint-plugin": "^8.39.0",
-		"@typescript-eslint/parser": "^8.39.0",
-		"@vitejs/plugin-react": "^4.7.0",
-		"@vitejs/plugin-react-swc": "^3.11.0",
+		"@typescript-eslint/eslint-plugin": "^8.43.0",
+		"@typescript-eslint/parser": "^8.43.0",
+		"@vitejs/plugin-react": "^5.0.2",
+		"@vitejs/plugin-react-swc": "^4.0.1",
 		"directory-tree": "^3.5.2",
-		"eslint": "9.32.0",
-		"eslint-config-prettier": "^10.1.8",
-		"eslint-plugin-prettier": "^5.5.3",
+		"eslint": "9.35.0",
+		"eslint-config-prettier": "10.1.5",
+		"eslint-plugin-prettier": "5.5.4",
 		"eslint-plugin-react": "^7.37.5",
 		"eslint-plugin-react-hooks": "^5.2.0",
 		"eslint-plugin-react-refresh": "^0.4.20",
 		"globals": "^16.3.0",
 		"html-react-parser": "^5.2.6",
-		"jest": "^30.0.5",
-		"jest-environment-jsdom": "^30.0.5",
-		"jest-environment-node": "^30.0.5",
+		"jest": "^30.1.3",
+		"jest-environment-jsdom": "^30.1.2",
+		"jest-environment-node": "^30.1.2",
 		"prettier": "^3.6.2",
 		"prettier-plugin-organize-imports": "^4.2.0",
 		"react": "^19.1.1",
 		"react-dom": "^19.1.1",
 		"react-element-to-jsx-string": "^17.0.1",
 		"react-redux": "^9.2.0",
-		"react-router-dom": "^7.7.1",
-		"react-syntax-highlighter": "^15.6.1",
+		"react-router-dom": "^7.8.2",
+		"react-syntax-highlighter": "^15.6.6",
 		"rimraf": "^6.0.1",
-		"rollup": "^4.46.2",
+		"rollup": "^4.50.1",
 		"rollup-plugin-delete": "^3.0.1",
-		"rollup-plugin-dts": "^6.2.1",
+		"rollup-plugin-dts": "^6.2.3",
 		"rollup-plugin-peer-deps-external": "^2.2.4",
 		"rollup-plugin-terser": "^7.0.2",
 		"rollup-plugin-tsconfig-paths": "^1.5.2",
 		"standard-version": "^9.5.0",
 		"ts-jest": "^29.4.1",
 		"typescript": "5.9.2",
-		"vite": "^7.0.6",
+		"vite": "^7.1.5",
 		"vite-tsconfig-paths": "^5.1.4",
 		"web-vitals": "^5.1.0"
 	},

sbp-frontend-style/src/components/atoms/debugger/PageSize.tsx

@@ -26,7 +26,7 @@ const Size = styled.div`
 	position: sticky;
 	bottom: 0;
 	left: 0;
-	z-index: 2;
+	z-index: 1000;
 	opacity: 0.8;
 	cursor: pointer;
 	width: 5em;

sbp-frontend-style/src/components/atoms/forms/SelectInput.tsx

@@ -20,7 +20,7 @@ const SelectInput = ({ children, ...props }: Props) => {
 }
 
 const SelectInputElement = styled.select<{ readOnly?: boolean }>`
-	border: 1px solid ${({ theme }) => theme.style.borderColor};
+	border: 1px solid ${({ theme }) => theme.style.inputBorderColor};
 	border-radius: ${({ theme }) => theme.style.radius}px;
 	background-color: ${({ theme }) => theme.style.inputColorBg};
 	padding: 0.5em;

sbp-frontend-style/src/components/atoms/forms/TextInput.tsx

@@ -1,7 +1,7 @@
 import { styled } from 'styled-components'
 
 const TextInput = styled.input`
-	border: 1px solid ${({ theme }) => theme.style.borderColor};
+	border: 1px solid ${({ theme }) => theme.style.inputBorderColor};
 	border-radius: ${({ theme }) => theme.style.radius}px;
 	background-color: ${({ theme }) => theme.style.inputColorBg};
 	padding: 0.5em;

sbp-frontend-style/src/components/molecules/cards/CardHeader.tsx

@@ -5,7 +5,7 @@ import { styled } from 'styled-components'
 
 interface Props extends HTMLAttributes<HTMLDivElement> {
 	isOpen?: boolean
-	onClick?: VoidFunction
+	onClick?: VoidFunction | ((ev: React.MouseEvent<HTMLElement>) => void)
 	icon?: JSX.Element
 	disabled?: boolean
 	isRemove?: boolean
@@ -25,7 +25,10 @@ const CardHeader = ({
 }: Props) => {
 	const handleOnClick = useCallback(
 		(e: MouseEvent<HTMLButtonElement>): void => {
-			if (onClick) onClick()
+			if (onClick) {
+				onClick(e)
+				return
+			}
 			e.stopPropagation()
 		},
 		[onClick]

sbp-frontend-style/src/components/molecules/notifications/Notification.tsx

@@ -9,6 +9,8 @@ import {
 	CardFooter,
 	CardHeader
 } from 'components/molecules/cards'
+
+import { parser } from 'helpers/HtmlHelper'
 import { useCallback, useEffect, useRef, useState } from 'react'
 import { styled } from 'styled-components'
 import { NotificationType } from '../../../datatypes/NotificationType'
@@ -101,7 +103,7 @@ const Notification = ({
 			</NotificationHeader>
 			{description && description !== '' ? (
 				<Collapse $isOpen={showMore ? isOpen : true}>
-					<NotificationContent>{description}</NotificationContent>
+					<NotificationContent>{parser(description)}</NotificationContent>
 					{date && (
 						<NotificationFooter hasPadding>
 							<DateInfo>{new Date(date).toLocaleString()}</DateInfo>

sbp-frontend-style/src/helpers/FunctionHelpers.ts

@@ -48,6 +48,6 @@ export const IsValidDateString = (cell: any) => {
 		!isNaN(date.getTime()) &&
 		typeof cell === 'string' &&
 		cell.trim().length > 0 &&
-		/^[\d/\-.\s:TZ]+$/.test(cell) // Only numbers, / - . : and spaces
+		/^[\d\\/\-.\s:TZ\\+]+$/.test(cell) // Only numbers, / - . : + and spaces
 	)
 }

sbp-frontend-style/src/styling/ThemeConfig.ts

@@ -135,6 +135,7 @@ const lightStyle: DefaultStyle = {
 	cardColorBg: 'rgba(232, 242, 253, .90)',
 	inputColorActive: 'rgb(30, 128, 237)',
 	inputColorBg: 'rgb(255, 255, 255)',
+	inputBorderColor: 'rgb(0, 0, 0)',
 	inputPlaceholder: 'rgba(22, 12, 23, .5)',
 	navigationColorBg: 'rgba(232, 242, 253, .90)',
 	tooltipColor: 'rgb(255, 255, 255)',
@@ -153,6 +154,7 @@ const darkStyle: DefaultStyle = {
 		buttonDisabledColorBg: 'rgba(232, 242, 253, .75)',
 		buttonDragColor: 'rgb(2, 12, 23)',
 		cardColorBg: 'rgba(232, 242, 253, .10)',
+		inputBorderColor: 'rgba(232, 242, 253, .75)',
 		inputColorBg: 'rgba(232, 242, 253, .10)',
 		inputPlaceholder: 'rgba(255, 255, 255, .5)',
 		navigationColorBg: 'rgba(232, 242, 253, .10)',

sbp-frontend-style/src/types/styled-components.ts

@@ -46,6 +46,7 @@ declare module 'styled-components' {
 		notificationErrorColor?: CssColorType
 		notificationErrorColorBg?: CssColorType
 		cardColorBg?: CssColorType
+		inputBorderColor?: CssColorType
 		inputColorActive?: CssColorType
 		inputColorBg?: CssColorType
 		inputPlaceholder?: CssColorType