@tui-cruises/mein-schiff-web-react-component-library 2.2.3 → 2.2.4

package/CHANGELOG.md

@@ -2,6 +2,24 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+### [2.2.4](https://bitbucket.org/yours_truly/tuic-mein-schiff-web-react-component-library/compare/v2.3.0...v2.2.4) (2025-07-23)
+
+
+### Features
+
+* **icons:** add mail and pause icons, update circle, plus-circle and phone ([3c2291b](https://bitbucket.org/yours_truly/tuic-mein-schiff-web-react-component-library/commit/3c2291b0f829c88be2f9a5e13f400419c134c32a))
+* **Tabs:** add `on` prop to control background context ([127dd83](https://bitbucket.org/yours_truly/tuic-mein-schiff-web-react-component-library/commit/127dd8319d205d6ec84c85c89e3b1959f3bfa9d7))
+
+
+### Bug Fixes
+
+* **EC-2101:** set IconButton as 'use client' to fix import problems ([9cd7b87](https://bitbucket.org/yours_truly/tuic-mein-schiff-web-react-component-library/commit/9cd7b8743309953e97a4768c9933a561ca3920e1))
+* **EC-2101:** set IconButton as 'use client' to fix import problems ([6a1c421](https://bitbucket.org/yours_truly/tuic-mein-schiff-web-react-component-library/commit/6a1c42100b9f38fd3b6ed7c9b8d931afe4774b7c))
+* **OM-2207:** form label with error style for data-invalid attribute ([285587c](https://bitbucket.org/yours_truly/tuic-mein-schiff-web-react-component-library/commit/285587cee026b4dc5c9d9ca5efa8fc87080244c8))
+* remove FieldSetVariant from InputFieldInput.tsx ([75ba4f0](https://bitbucket.org/yours_truly/tuic-mein-schiff-web-react-component-library/commit/75ba4f03c80a43115e98c0d6c5cb0f913c824f1b))
+* remove FieldSetVariant from InputFieldInput.tsx ([918af78](https://bitbucket.org/yours_truly/tuic-mein-schiff-web-react-component-library/commit/918af7869d319b3a00bd6aae4ee540907ef976d5))
+* **Stepper:** update tracking parameter (EC-2069) ([ed64438](https://bitbucket.org/yours_truly/tuic-mein-schiff-web-react-component-library/commit/ed644389bfb5bd76ade919515598c015bb702a7d))
+
 ### [2.2.3](https://bitbucket.org/yours_truly/tuic-mein-schiff-web-react-component-library/compare/v2.2.2...v2.2.3) (2025-07-21)
 
 

package/icons/icons/circle.tsx

@@ -10,10 +10,10 @@ const SvgCircle = (props: SVGProps<SVGSVGElement>) => (
     {...props}
   >
     <path
-      stroke="currentColor"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-      d="M12 22c5.523 0 10-4.477 10-10S17.523 2 12 2 2 6.477 2 12s4.477 10 10 10"
+      fill="currentColor"
+      fillRule="evenodd"
+      d="M1.25 12C1.25 6.063 6.063 1.25 12 1.25S22.75 6.063 22.75 12 17.937 22.75 12 22.75 1.25 17.937 1.25 12M12 2.75a9.25 9.25 0 1 0 0 18.5 9.25 9.25 0 0 0 0-18.5"
+      clipRule="evenodd"
     />
   </svg>
 );

package/icons/icons/index.ts

@@ -66,6 +66,7 @@ export const dynamicComponents = {
   'log-in': dynamic(() => import('./log-in'), { ssr: false }),
   'log-out': dynamic(() => import('./log-out'), { ssr: false }),
   'mail-open': dynamic(() => import('./mail-open'), { ssr: false }),
+  mail: dynamic(() => import('./mail'), { ssr: false }),
   map: dynamic(() => import('./map'), { ssr: false }),
   'maps-arrow-diagonal': dynamic(() => import('./maps-arrow-diagonal'), {
     ssr: false,
@@ -89,6 +90,7 @@ export const dynamicComponents = {
   'nav-arrow-up': dynamic(() => import('./nav-arrow-up'), { ssr: false }),
   'no-wifi': dynamic(() => import('./no-wifi'), { ssr: false }),
   'old-trips': dynamic(() => import('./old-trips'), { ssr: false }),
+  pause: dynamic(() => import('./pause'), { ssr: false }),
   percentage: dynamic(() => import('./percentage'), { ssr: false }),
   phone: dynamic(() => import('./phone'), { ssr: false }),
   pin: dynamic(() => import('./pin'), { ssr: false }),

package/icons/icons/mail.tsx

@@ -0,0 +1,20 @@
+import type { SVGProps } from 'react';
+const SvgMail = (props: SVGProps<SVGSVGElement>) => (
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    width="1em"
+    height="1em"
+    fill="none"
+    viewBox="0 0 24 24"
+    color="currentColor"
+    {...props}
+  >
+    <path
+      fill="currentColor"
+      fillRule="evenodd"
+      d="M2.75 7c0-.69.56-1.25 1.25-1.25h16c.69 0 1.25.56 1.25 1.25v10c0 .69-.56 1.25-1.25 1.25H4c-.69 0-1.25-.56-1.25-1.25zM4 4.25A2.75 2.75 0 0 0 1.25 7v10A2.75 2.75 0 0 0 4 19.75h16A2.75 2.75 0 0 0 22.75 17V7A2.75 2.75 0 0 0 20 4.25zm3.43 4.136a.75.75 0 1 0-.86 1.228l5 3.5a.75.75 0 0 0 .86 0l5-3.5a.75.75 0 1 0-.86-1.228L12 11.585z"
+      clipRule="evenodd"
+    />
+  </svg>
+);
+export default SvgMail;

package/icons/icons/pause.tsx

@@ -0,0 +1,20 @@
+import type { SVGProps } from 'react';
+const SvgPause = (props: SVGProps<SVGSVGElement>) => (
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    width="1em"
+    height="1em"
+    fill="none"
+    viewBox="0 0 24 24"
+    color="currentColor"
+    {...props}
+  >
+    <path
+      fill="currentColor"
+      fillRule="evenodd"
+      d="M9.25 4a.75.75 0 0 0-.75.75v14.5a.75.75 0 0 0 1.5 0V4.75A.75.75 0 0 0 9.25 4m5.5 0a.75.75 0 0 0-.75.75v14.5a.75.75 0 0 0 1.5 0V4.75a.75.75 0 0 0-.75-.75"
+      clipRule="evenodd"
+    />
+  </svg>
+);
+export default SvgPause;

package/icons/icons/phone.tsx

@@ -10,10 +10,10 @@ const SvgPhone = (props: SVGProps<SVGSVGElement>) => (
     {...props}
   >
     <path
-      stroke="currentColor"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-      d="M18.118 14.702 14 15.5c-2.782-1.396-4.5-3-5.5-5.5l.77-4.13L7.815 2H4.064c-1.128 0-2.016.932-1.847 2.047.42 2.783 1.66 7.83 5.283 11.453 3.805 3.805 9.286 5.456 12.302 6.113 1.165.253 2.198-.655 2.198-1.848v-3.584z"
+      fill="currentColor"
+      fillRule="evenodd"
+      d="M2.028 4.73C1.798 3.214 3.016 2 4.458 2h3.521c.293 0 .556.182.66.456l1.366 3.633c.045.12.056.25.033.377l-.685 3.672c.841 1.98 2.231 3.31 4.537 4.502l3.628-.703a.7.7 0 0 1 .385.033l3.644 1.389a.7.7 0 0 1 .453.658v3.365c0 1.525-1.344 2.764-2.917 2.422l.15-.688-.15.688c-2.867-.624-8.177-2.21-11.897-5.929l.498-.498-.498.498C3.623 12.312 2.43 7.391 2.028 4.731l.696-.106zm2.43-1.322c-.675 0-1.125.537-1.038 1.112.388 2.566 1.521 7.119 4.762 10.36 3.425 3.424 8.404 4.94 11.2 5.548.614.133 1.21-.334 1.21-1.046v-2.88l-3.003-1.144-3.67.71a.7.7 0 0 1-.449-.062c-2.717-1.363-4.48-2.98-5.501-5.53a.7.7 0 0 1-.038-.39L8.617 6.4 7.492 3.408z"
+      clipRule="evenodd"
     />
   </svg>
 );

package/icons/icons/plus-circle.tsx

@@ -10,10 +10,16 @@ const SvgPlusCircle = (props: SVGProps<SVGSVGElement>) => (
     {...props}
   >
     <path
-      stroke="currentColor"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-      d="M8 12h4m4 0h-4m0 0V8m0 4v4M12 22c5.523 0 10-4.477 10-10S17.523 2 12 2 2 6.477 2 12s4.477 10 10 10"
+      fill="currentColor"
+      fillRule="evenodd"
+      d="M12 7.25a.75.75 0 0 1 .75.75v3.25H16a.75.75 0 0 1 0 1.5h-3.25V16a.75.75 0 0 1-1.5 0v-3.25H8a.75.75 0 0 1 0-1.5h3.25V8a.75.75 0 0 1 .75-.75"
+      clipRule="evenodd"
+    />
+    <path
+      fill="currentColor"
+      fillRule="evenodd"
+      d="M12 2.75a9.25 9.25 0 1 0 0 18.5 9.25 9.25 0 0 0 0-18.5M1.25 12C1.25 6.063 6.063 1.25 12 1.25S22.75 6.063 22.75 12 17.937 22.75 12 22.75 1.25 17.937 1.25 12"
+      clipRule="evenodd"
     />
   </svg>
 );

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tui-cruises/mein-schiff-web-react-component-library",
-  "version": "2.2.3",
+  "version": "2.2.4",
   "main": "./index.tsx",
   "types": "./index.tsx",
   "type": "module",

package/src/components/core/AlertDialog/AlertDialog.tsx

@@ -47,6 +47,11 @@ type Props = PropsWithChildren<{
    */
   open?: boolean;
 
+  /**
+   * A React node that will be rendered as the trigger for the modal.
+   */
+  trigger?: ReactNode;
+
   /**
    * Callback fired when the modal's open state changes.
    */
@@ -254,9 +259,15 @@ export const AlertDialog: FC<Props> = ({
   container,
   centerItems = true,
   containerClassName,
+  trigger,
 }) => {
   return (
     <AlertDialogPrimitive.Root open={open} onOpenChange={onOpenChange}>
+      {trigger && (
+        <AlertDialogPrimitive.Trigger asChild>
+          {trigger}
+        </AlertDialogPrimitive.Trigger>
+      )}
       <AlertDialogPrimitive.Portal container={container || undefined}>
         <AlertDialogPrimitive.Overlay
           className={twJoin(

package/src/components/core/Stepper/Stepper.tsx

@@ -87,7 +87,7 @@ const Stepper = (props: StepperProps) => {
         variant="secondary"
         on={on}
         data-track-click-element={EventClickElement.Button}
-        data-track-click-label={`${trackingName}stepper-decrease`}
+        data-track-click-label={`${trackingName}-stepper-decrease`}
         aria-label={i18n?.stepperDecrease ?? 'Anzahl verringern'}
       />
       <div