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

package/CHANGELOG.md

@@ -2,6 +2,25 @@
 
 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.6](https://bitbucket.org/yours_truly/tuic-mein-schiff-web-react-component-library/compare/v2.2.5...v2.2.6) (2025-08-05)
+
+
+### Features
+
+* **Accordion:** add on background property ([a99009d](https://bitbucket.org/yours_truly/tuic-mein-schiff-web-react-component-library/commit/a99009d4adb955f06a6ebea139a7e89bc567713f))
+
+### [2.2.5](https://bitbucket.org/yours_truly/tuic-mein-schiff-web-react-component-library/compare/v2.2.4...v2.2.5) (2025-08-05)
+
+
+### Features
+
+* **TextButton:** add large text size property ([d873d25](https://bitbucket.org/yours_truly/tuic-mein-schiff-web-react-component-library/commit/d873d2566d95c27b07f28dc4517d8b443bed00ef))
+
+
+### Bug Fixes
+
+* **Accordion:** allow horizontal scrolling for overflowing content via overflow-x auto ([ecbdbf9](https://bitbucket.org/yours_truly/tuic-mein-schiff-web-react-component-library/commit/ecbdbf9d771cf85a5dbdd3217293ce4bf715daf6))
+
 ### [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)
 
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tui-cruises/mein-schiff-web-react-component-library",
-  "version": "2.2.4",
+  "version": "2.2.6",
   "main": "./index.tsx",
   "types": "./index.tsx",
   "type": "module",
@@ -10,7 +10,7 @@
     "prettier": "prettier --write ./src",
     "dev": "storybook dev -p 6006",
     "build-storybook": "storybook build",
-    "release": "standard-version && npm run pack:public",
+    "release": "standard-version",
     "pack:public": "node scripts/prepare-pack.mjs",
     "prepack": "npm run pack:public",
     "generate-icon-components": "node icons-import-svgs/generate-icons.cjs && prettier --write icons"

package/src/components/core/Accordion/Accordion.tsx

@@ -31,6 +31,7 @@ type CustomAccordionProps = {
   items?: AccordionMixedItem[];
   loadMoreButton?: TextButtonProps;
   headlineAs?: AccordionItemProps['headlineAs'];
+  on?: 'white' | 'gray';
 };
 
 export type AccordionSingleProps = HTMLAttributes<HTMLUListElement> &
@@ -48,7 +49,7 @@ type Root = FC<AccordionProps> & {
 };
 
 const Accordion: Root = propsArg => {
-  let { loadMoreButton, ...props } = propsArg;
+  let { loadMoreButton, on = 'white', ...props } = propsArg;
 
   let [pending, setPending] = useState(false);
 

package/src/components/core/Accordion/AccordionItem.tsx

@@ -57,7 +57,7 @@ export const AccordionItem: FC<AccordionItemProps> = ({
 
         {children && (
           <Radix.AccordionContent asChild>
-            <div className="overflow-hidden transition-all data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down">
+            <div className="overflow-x-auto overflow-y-hidden transition-all data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down">
               <div className="px-2 pt-4 text-marine-high-emphasis md:pt-3">
                 {children}
               </div>

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

@@ -47,11 +47,6 @@ 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.
    */
@@ -259,15 +254,9 @@ 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/IconButton/IconButton.tsx

@@ -1,4 +1,4 @@
-'use client'
+'use client';
 
 import { Icon, IconName } from '../Icon';
 import {

package/src/components/core/Pictogram/Pictogram.tsx

@@ -2,9 +2,9 @@ import type { FC } from 'react';
 import { dynamicComponents as dynamicComponentsPictograms } from '../../../../icons/pictograms';
 import { twMerge } from 'tailwind-merge';
 import {
-    getClassNamesFromMap,
-    ResponsiveValue,
-    ResponsiveValueClassMap,
+  getClassNamesFromMap,
+  ResponsiveValue,
+  ResponsiveValueClassMap,
 } from '../../../helpers/responsive-property';
 
 type CollectionPictograms = typeof dynamicComponentsPictograms;
@@ -23,77 +23,77 @@ type IconComponent = CollectionPictograms[PictogramName];
 type PictogramSize = 'sm' | 'md';
 
 export type PictogramProps = {
-    className?: string;
-    name: PictogramName;
-    size?: ResponsiveValue<PictogramSize>;
+  className?: string;
+  name: PictogramName;
+  size?: ResponsiveValue<PictogramSize>;
 };
 
 /**
  * Renders the icon.
  */
 const renderIcon = (
-    Element: IconComponent,
-    size: PictogramProps['size'],
-    wrapperAttrs: Record<string, string>,
+  Element: IconComponent,
+  size: PictogramProps['size'],
+  wrapperAttrs: Record<string, string>,
 ) => {
-    let classNameContainsSize = ['size-', 'h-', 'w-'].some(prefix =>
-        wrapperAttrs.className?.includes(prefix),
-    );
+  let classNameContainsSize = ['size-', 'h-', 'w-'].some(prefix =>
+    wrapperAttrs.className?.includes(prefix),
+  );
 
-    const className = twMerge(
-        'inline-block',
-        !classNameContainsSize && getClassNamesFromMap(sizeCssMap, size, 'sm'),
-        wrapperAttrs.className,
-    );
+  const className = twMerge(
+    'inline-block',
+    !classNameContainsSize && getClassNamesFromMap(sizeCssMap, size, 'sm'),
+    wrapperAttrs.className,
+  );
 
-    return (
-        <div {...wrapperAttrs} className={className}>
-            <Element className="block size-full" viewBox="0 0 40 40" />
-        </div>
-    );
+  return (
+    <div {...wrapperAttrs} className={className}>
+      <Element className="block size-full" viewBox="0 0 40 40" />
+    </div>
+  );
 };
 
 /**
  * Renders a pictogram with the specified size and icon.
  */
 const Pictogram: FC<PictogramProps> = ({ size, name, ...rest }) => {
-    const Element = dynamicComponentsPictograms[name];
-    if (!Element) {
-        return null;
-    }
+  const Element = dynamicComponentsPictograms[name];
+  if (!Element) {
+    return null;
+  }
 
-    return renderIcon(Element, size, rest);
+  return renderIcon(Element, size, rest);
 };
 
 const sizeCssMap: ResponsiveValueClassMap<PictogramSize> = {
-    initial: {
-        sm: 'size-[40px]',
-        md: 'size-[60px]',
-    },
-    xs: {
-        sm: 'xs:size-[40px]',
-        md: 'xs:size-[60px]',
-    },
-    sm: {
-        sm: 'sm:size-[40px]',
-        md: 'sm:size-[60px]',
-    },
-    md: {
-        sm: 'md:size-[40px]',
-        md: 'md:size-[60px]',
-    },
-    lg: {
-        sm: 'lg:size-[40px]',
-        md: 'lg:size-[60px]',
-    },
-    xl: {
-        sm: 'xl:size-[40px]',
-        md: 'xl:size-[60px]',
-    },
-    xxl: {
-        sm: '2xl:size-[40px]',
-        md: '2xl:size-[60px]',
-    },
+  initial: {
+    sm: 'size-[40px]',
+    md: 'size-[60px]',
+  },
+  xs: {
+    sm: 'xs:size-[40px]',
+    md: 'xs:size-[60px]',
+  },
+  sm: {
+    sm: 'sm:size-[40px]',
+    md: 'sm:size-[60px]',
+  },
+  md: {
+    sm: 'md:size-[40px]',
+    md: 'md:size-[60px]',
+  },
+  lg: {
+    sm: 'lg:size-[40px]',
+    md: 'lg:size-[60px]',
+  },
+  xl: {
+    sm: 'xl:size-[40px]',
+    md: 'xl:size-[60px]',
+  },
+  xxl: {
+    sm: '2xl:size-[40px]',
+    md: '2xl:size-[60px]',
+  },
 };
 
 Pictogram.displayName = 'Pictogram';

package/src/components/core/TextButton/TextButton.tsx

@@ -16,7 +16,7 @@ type CommonProps = ButtonHTMLAttributes<HTMLButtonElement> &
     iconLeft?: IconName;
     iconRight?: IconName;
     iconSize?: 'xs' | 'sm' | 'md' | 'lg';
-    size?: 'sm' | 'md';
+    size?: 'sm' | 'md' | 'lg';
     on?: 'white' | 'gray' | 'ocean' | 'image';
   }>;
 
@@ -53,6 +53,7 @@ const TextButtonRenderFunction: ForwardRefRenderFunction<
     'focus:outline-none focus-visible:shadow-focus-state',
     'disabled:pointer-events-none disabled:text-secondary-marine-48',
     size === 'sm' && 'text-sm',
+    size === 'lg' && 'text-lg',
 
     // On white (default)
     on === 'white' && 'text-marine-high-emphasis',