@fluidattacks/design 1.2.23 → 1.2.25

package/dist/src/components/accordion/types.d.ts

@@ -1,11 +1,11 @@
 type TVariant = "progress" | "simple" | "platform";
 type TAligned = "end" | "start";
 /**
- * Accordion item props
+ * Accordion item properties.
  * @interface IAccordionItemProps
- * @property {string} title Accordion title.
- * @property {string} [description] Accordion description.
- * @property {JSX.Element} [extraElement] Accordion extra components.
+ * @property {string} title - Accordion title.
+ * @property {string} [description] - Accordion description.
+ * @property {JSX.Element} [extraElement] - Additional elements for the accordion.
  */
 interface IAccordionItemProps {
     title: string;
@@ -13,15 +13,15 @@ interface IAccordionItemProps {
     extraElement?: JSX.Element;
 }
 /**
- * Pass more than 1 item to activate progress variant
+ * Pass more than 1 item to activate the progress variant.
  *
- * Accordion component props
+ * Accordion component properties.
  * @interface IAccordionProps
- * @property {TAligned} [aligned] Align title.
- * @property {IAccordionItemProps} items A list of accordion items.
- * @property {number} [progressTime] Time remaining until the next item (in seconds).
- * @property {string} [bgColor] Accordion background color.
- * @property {TVariant} [variant] Type of accordion.
+ * @property {TAligned} [aligned] - Alignment of the accordion title.
+ * @property {IAccordionItemProps[]} items - A list of accordion items.
+ * @property {number} [progressTime] - Time remaining until the next item (in seconds).
+ * @property {string} [bgColor] - Background color of the accordion.
+ * @property {TVariant} [variant] - Type of accordion variant.
  */
 interface IAccordionProps {
     aligned?: TAligned;

package/dist/src/components/button/types.d.ts

@@ -11,12 +11,12 @@ type TVariant = "primary" | "primaryWeb" | "secondary" | "secondaryWeb" | "terti
  * @extends IPaddingModifiable
  * @extends IIconModifiable
  * @extends ButtonHTMLAttributes<HTMLButtonElement>
- * @property {boolean} [bold] Text bold for link variant.
- * @property {TMode} [mode] The background theme: dark or light.
- * @property {string} [tooltip] Tooltip message.
- * @property {TPlace} [tooltipPlace] Tooltip message relative place.
- * @property {boolean} [underline] Text underlined for link variant.
- * @property {TVariant} [variant] The button variant type.
+ * @property {boolean} [bold] - Text bold for link variant.
+ * @property {TMode} [mode] - The background theme: dark or light.
+ * @property {string} [tooltip] - Tooltip message.
+ * @property {TPlace} [tooltipPlace] - Tooltip message relative place.
+ * @property {boolean} [underline] - Text underlined for link variant.
+ * @property {TVariant} [variant] - The button variant type.
  */
 interface IButtonProps extends IBorderModifiable, IDisplayModifiable, IMarginModifiable, IPaddingModifiable, Partial<IIconModifiable>, ButtonHTMLAttributes<HTMLButtonElement> {
     bold?: boolean;

package/dist/src/components/checkbox/types.d.ts

@@ -4,11 +4,11 @@ type TVariant = "web" | "platform";
  * Checkbox props.
  * @interface ICheckboxProps
  * @extends HTMLAttributes<HTMLInputElement>
- * @property {boolean} [disabled] Disable checkbox.
- * @property {string} name Input name.
- * @property {string} [label] Checkbox label.
- * @property {string} [value] Checkbox value.
- * @property {Function} [variant] Checkbox variant type.
+ * @property {boolean} [disabled] - Disable checkbox.
+ * @property {string} name - Input name.
+ * @property {string} [label] - Checkbox label.
+ * @property {string} [value] - Checkbox value.
+ * @property {Function} [variant] - Checkbox variant type.
  */
 interface ICheckboxProps extends HTMLAttributes<HTMLInputElement> {
     disabled?: boolean;

package/dist/src/components/cloud-image/types.d.ts

@@ -2,11 +2,11 @@ import { Plugins } from '@cloudinary/html';
 /**
  * Cloud image component props.
  * @interface ICloudImageProps
- * @property {string} [alt] The alternate text for an image.
- * @property {number | string} [height] The height of the image.
- * @property {number | string} [width] The width of the image.
- * @property {Plugins} [plugins] A list of cloudinary plugins.
- * @property {string} publicId The publicId location in cloudinary.
+ * @property {string} [alt] - The alternate text for an image.
+ * @property {number | string} [height] - The height of the image.
+ * @property {number | string} [width] - The width of the image.
+ * @property {Plugins} [plugins] - A list of cloudinary plugins.
+ * @property {string} publicId - The publicId location in cloudinary.
  */
 interface ICloudImageProps {
     alt?: string;

package/dist/src/components/container/types.d.ts

@@ -6,10 +6,10 @@ type THtmlTag = keyof ReactHTML;
  * @interface IContainerProps
  * @extends TModifiable
  * @extends HTMLAttributes<HTMLDivElement>
- * @property {THtmlTag} [as] The react html tag to represent.
- * @property {boolean} [center] Whether to center the content.
- * @property {Function} [onHover] Function handler for hover event.
- * @property {Function} [onLeave] Function handler for leave event.
+ * @property {THtmlTag} [as] - The react html tag to represent.
+ * @property {boolean} [center] - Whether to center the content.
+ * @property {Function} [onHover] - Function handler for hover event.
+ * @property {Function} [onLeave] - Function handler for leave event.
  */
 interface IContainerProps extends TModifiable, HTMLAttributes<HTMLDivElement> {
     as?: THtmlTag;

package/dist/src/components/content-card/event-date/index.d.ts

@@ -0,0 +1,5 @@
+import { IEventDate } from '../types';
+declare const EventDate: ({ eventDate, }: Readonly<{
+    eventDate?: IEventDate;
+}>) => JSX.Element | null;
+export { EventDate };

package/dist/src/components/content-card/index.d.ts

@@ -0,0 +1,3 @@
+import { IContentCardProps } from './types';
+declare const ContentCard: ({ imageId, tag, eventDate, }: Readonly<IContentCardProps>) => JSX.Element;
+export { ContentCard };

package/dist/src/components/content-card/styles.d.ts

@@ -0,0 +1,2 @@
+declare const CardContainer: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<Readonly<import('react').PropsWithChildren<import('../container/types').IContainerProps>> & import('react').RefAttributes<HTMLDivElement>, never>> & string & Omit<import('react').ForwardRefExoticComponent<Readonly<import('react').PropsWithChildren<import('../container/types').IContainerProps>> & import('react').RefAttributes<HTMLDivElement>>, keyof import('react').Component<any, {}, any>>;
+export { CardContainer };

package/dist/src/components/content-card/types.d.ts

@@ -0,0 +1,37 @@
+/**
+ * Represents a date for an event.
+ * @interface IEventDate
+ * @property {string} day - The day of the event.
+ * @property {string} month - The month of the event.
+ */
+interface IEventDate {
+    day: string;
+    month: string;
+}
+/**
+ * Properties for the Content Card component.
+ * @interface IContentCardProps
+ * @property {string} imageId - ID of the image.
+ * @property {string} [tag] - Optional tag or category label.
+ * @property {IEventDate} [eventDate] - Optional date related to the event.
+ * @property {string} [author] - Optional author.
+ * @property {string} [publishDate] - Optional publish date.
+ * @property {string} readingTime - Estimated reading time.
+ * @property {string} title - Title of the card.
+ * @property {string} description - Brief description.
+ * @property {string} [buttonText] - Optional text for the action button.
+ * @property {string} [href] - Optional URL for the action button link.
+ */
+interface IContentCardProps {
+    imageId: string;
+    tag?: string;
+    eventDate?: IEventDate;
+    author?: string;
+    publishDate?: string;
+    readingTime: string;
+    title: string;
+    description: string;
+    buttonText?: string;
+    href?: string;
+}
+export type { IContentCardProps, IEventDate };

package/dist/src/components/icon/types.d.ts

@@ -6,11 +6,11 @@ type TIconType = "fa-brands" | "fa-light" | "fa-regular" | "fa-solid";
  * @interface IIconWrapProps
  * @extends IMarginModifiable
  * @extends IIconModifiable
- * @property {boolean} [clickable] Defines the cursor to show on icon hover.
- * @property {string} [hoverColor] The icon color onn hover.
- * @property {Function} [onClick] Function handler for click event.
- * @property {boolean} [disabled] Show disabled icon state.
- * @property {number} [rotation] Rotation degrees to modify icon style.
+ * @property {boolean} [clickable] - Defines the cursor to show on icon hover.
+ * @property {string} [hoverColor] - The icon color onn hover.
+ * @property {Function} [onClick] - Function handler for click event.
+ * @property {boolean} [disabled] - Show disabled icon state.
+ * @property {number} [rotation] - Rotation degrees to modify icon style.
  */
 interface IIconWrapProps extends IIconModifiable, IMarginModifiable {
     clickable?: boolean;
@@ -23,10 +23,10 @@ interface IIconWrapProps extends IIconModifiable, IMarginModifiable {
  * Icon component props.
  * @interface IIconProps
  * @extends IIconWrapProps
- * @property {string} [iconClass] The icon class from fontawesome.
- * @property {string} [iconMask] The data-fa-mask prop of icon.
- * @property {string} [iconTransform] The data-fa-transform prop of icon.
- * @property {TIconType} [iconType] The icon type.
+ * @property {string} [iconClass] - The icon class from fontawesome.
+ * @property {string} [iconMask] - The data-fa-mask prop of icon.
+ * @property {string} [iconTransform] - The data-fa-transform prop of icon.
+ * @property {TIconType} [iconType] - The icon type.
  */
 interface IIconProps extends IIconWrapProps {
     iconClass?: string;

package/dist/src/components/language-selector/types.d.ts

@@ -1,8 +1,8 @@
 import { TMode } from '../@core';
 /**
  * Item list props
- * @property {boolean} [disabled] Show the item as disabled.
- * @property {string} text Item list text
+ * @property {boolean} [disabled] - Show the item as disabled.
+ * @property {string} text - Item list text
  */
 interface IItem {
     disabled?: boolean;
@@ -11,10 +11,10 @@ interface IItem {
 /**
  * Item list for language selector props
  * @interface IItemList
- * @property {boolean} [disabled] Show the item as disabled.
- * @property {TMode} [mode] The background theme: dark or light.
- * @property {Function} onClick Function handler for click event.
- * @property {string} text Item list text
+ * @property {boolean} [disabled] - Show the item as disabled.
+ * @property {TMode} [mode] - The background theme: dark or light.
+ * @property {Function} onClick - Function handler for click event.
+ * @property {string} text - Item list text
  */
 interface IItemList {
     disabled?: boolean;
@@ -25,9 +25,9 @@ interface IItemList {
 /**
  * Language selector component props
  * @interface ILangSelectorProps
- * @property {IItem} [items] The custom items to make selection.
- * @property {Function} handleClick Function handler for click event.
- * @property {TMode} [mode] The background theme: dark or light.
+ * @property {IItem} [items] - The custom items to make selection.
+ * @property {Function} handleClick - Function handler for click event.
+ * @property {TMode} [mode] - The background theme: dark or light.
  */
 interface ILangSelectorProps {
     items?: IItem[];

package/dist/src/components/logo/types.d.ts

@@ -2,8 +2,8 @@ type TLogoVariant = "company" | "footer" | "header" | "icon";
 /**
  * Logo component props.
  * @interface ILogoProps
- * @property {string} publicId The publicId location in cloudinary.
- * @property {TLogoVariant} variant The different types of logo used.
+ * @property {string} publicId - The publicId location in cloudinary.
+ * @property {TLogoVariant} variant - The different types of logo used.
  */
 interface ILogoProps {
     publicId: string;

package/dist/src/components/logo-carousel/index.d.ts

@@ -0,0 +1,3 @@
+import { ILogoCarouselProps } from './types';
+declare const LogoCarousel: ({ fusion, logos, }: Readonly<ILogoCarouselProps>) => JSX.Element;
+export { LogoCarousel };

package/dist/src/components/logo-carousel/styles.d.ts

@@ -0,0 +1,4 @@
+declare const ClientsContainer: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+declare const Rectangle: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').SVGProps<SVGRectElement>, never>> & string;
+declare const SlideShow: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export { ClientsContainer, Rectangle, SlideShow };

package/dist/src/components/logo-carousel/types.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Logo carousel component props.
+ * @interface ILogoCarouselProps
+ * @property {boolean} [fusion] - Define the fusion style in carousel.
+ * @property {string[]} [logos] - The list of image logos to show.
+ */
+interface ILogoCarouselProps {
+    fusion?: boolean;
+    logos?: string[];
+}
+export type { ILogoCarouselProps };

package/dist/src/components/logo-carousel/utils.d.ts

@@ -0,0 +1,2 @@
+declare const clientLogosDefault: string[];
+export { clientLogosDefault };

package/dist/src/components/message-banner/types.d.ts

@@ -6,13 +6,13 @@ type TVariant = "web" | "platform";
  * Message banner props.
  * @interface IMessageBannerProps
  * @extends IMessageBannerProps
- * @property {JSX.Element | string} message Banner text.
- * @property {string} [buttonText] Text for action button.
- * @property {FontWeight} [buttonFontWeight] Weight for button text.
- * @property {IconName} [icon] Icon for action button.
- * @property {Function} [onClickButton] Action for action button.
- * @property {Function} [onClose] Extra action when banner close.
- * @property {TVariant} [variant] Variant to use: platform or web.
+ * @property {JSX.Element | string} message - Banner text.
+ * @property {string} [buttonText] - Text for action button.
+ * @property {FontWeight} [buttonFontWeight] - Weight for button text.
+ * @property {IconName} [icon] - Icon for action button.
+ * @property {Function} [onClickButton] - Action for action button.
+ * @property {Function} [onClose] - Extra action when banner close.
+ * @property {TVariant} [variant] - Variant to use: platform or web.
  */
 interface IMessageBannerProps {
     message: JSX.Element | string;

package/dist/src/components/notification-sign/types.d.ts

@@ -4,9 +4,9 @@ type TVariant = "error" | "warning";
  * Notification sign component props.
  * @interface INotificationSignProps
  * @extends IPositionModifiable
- * @property {number} [numberIndicator] The number of notifications.
- * @property {boolean} [show] The visibility of notification sign.
- * @property {TVariant} [variant] The notification custom variant.
+ * @property {number} [numberIndicator] - The number of notifications.
+ * @property {boolean} [show] - The visibility of notification sign.
+ * @property {TVariant} [variant] - The notification custom variant.
  */
 interface INotificationSignProps extends Pick<IPositionModifiable, "left" | "top"> {
     numberIndicator?: number;

package/dist/src/components/progress-bar/types.d.ts

@@ -2,8 +2,8 @@ import { IDisplayModifiable } from '../@core';
 /**
  * Progress bar component props
  * @interface IProgressBarProps
- * @property {number} [progressTime] Time to complete.
- * @property {Function} [onComplete] Action when progress complete.
+ * @property {number} [progressTime] - Time to complete.
+ * @property {Function} [onComplete] - Action when progress complete.
  */
 interface IProgressBarProps extends IDisplayModifiable {
     progressTime?: number;

package/dist/src/components/radio-button/types.d.ts

@@ -5,9 +5,9 @@ type TVariant = "web" | "platform";
  * @interface IRadioButtonProps
  * @extends HTMLAttributes<HTMLInputElement>
  * @extends HTMLProps<HTMLInputElement>
- * @property {string} name Input name.
- * @property {string} value Radio button value.
- * @property {Function} [variant] Radio button variant type.
+ * @property {string} name - Input name.
+ * @property {string} value - Radio button value.
+ * @property {Function} [variant] - Radio button variant type.
  */
 interface IRadioButtonProps extends HTMLAttributes<HTMLInputElement>, HTMLProps<HTMLInputElement> {
     name: string;

package/dist/src/components/search-bar/types.d.ts

@@ -3,9 +3,9 @@ type THit = Record<string, unknown>;
 /**
  * Item searching component props.
  * @interface IItemSearchingProps
- * @property {THit} hit The matched item of the search query.
- * @property {IconName} [icon] Icon to show with item.
- * @property {boolean} [showIcon] True if the item includes an icon.
+ * @property {THit} hit - The matched item of the search query.
+ * @property {IconName} [icon] - Icon to show with item.
+ * @property {boolean} [showIcon] - True if the item includes an icon.
  */
 interface IItemSearchingProps {
     hit: THit;
@@ -15,10 +15,10 @@ interface IItemSearchingProps {
 /**
  * Search bar component props.
  * @interface ISearchBarProps
- * @property {THit[]} items The matched items returned from Algolia.
- * @property {string} [placeholder] The search bar placeholder.
- * @property {Function} refine A function to set a new query and searches.
- * @property {string} query The query from the last search.
+ * @property {THit[]} items - The matched items returned from Algolia.
+ * @property {string} [placeholder] - The search bar placeholder.
+ * @property {Function} refine - A function to set a new query and searches.
+ * @property {string} query - The query from the last search.
  */
 interface ISearchBarProps {
     items: THit[];

package/dist/src/components/tabs/types.d.ts

@@ -1,9 +1,9 @@
 import { INotificationSignProps } from '../notification-sign/types';
 /**
  * Individual tab props.
- * @property {boolean} [isActive] Set the current tab active.
- * @property {Function} [onClick] The handler event on tab click.
- * @property {string | JSX.Element} label The tab title.
+ * @property {boolean} [isActive] - Set the current tab active.
+ * @property {Function} [onClick] - The handler event on tab click.
+ * @property {string | JSX.Element} label - The tab title.
  */
 interface IFixedTabProps {
     isActive?: boolean;
@@ -13,7 +13,7 @@ interface IFixedTabProps {
 /**
  * Fixed tabs component props.
  * ** Note: A maximum of 5 tabs is allowed. **
- * @property {ITabProps[]} items The list of tabs to display.
+ * @property {ITabProps[]} items - The list of tabs to display.
  */
 interface IFixedTabsProps {
     items: IFixedTabProps[];
@@ -22,10 +22,10 @@ interface IFixedTabsProps {
  * Tab component props.
  * @interface ITabProps
  * @extends IFixedTabProps
- * @property {string} id The id related to the tab.
- * @property {string} link The link to redirect on tab click.
- * @property {INotificationSignProps} [notificationSign] Notification tab details.
- * @property {string} [tooltip] The tooltip text to add.
+ * @property {string} id - The id related to the tab.
+ * @property {string} link - The link to redirect on tab click.
+ * @property {INotificationSignProps} [notificationSign] - Notification tab details.
+ * @property {string} [tooltip] - The tooltip text to add.
  */
 interface ITabProps extends IFixedTabProps {
     id: string;
@@ -36,9 +36,9 @@ interface ITabProps extends IFixedTabProps {
 /**
  * Tabs component props.
  * @interface ITabsProps
- * @property {ITabProps[]} items The lists of tabs to display.
- * @property {boolean} [borders] Whether to add borders to set of tabs.
- * @property {boolean} [box] Whether to add box container to set of tabs.
+ * @property {ITabProps[]} items - The lists of tabs to display.
+ * @property {boolean} [borders] - Whether to add borders to set of tabs.
+ * @property {boolean} [box] - Whether to add box container to set of tabs.
  */
 interface ITabsProps {
     items: ITabProps[];

package/dist/src/components/toggle-buttons/types.d.ts

@@ -1,9 +1,9 @@
 /**
  * Toggle button component props.
  * @interface IToggleButtonProps
- * @property {string} [defaultSelection] The option selected by default.
- * @property {string[]} options The list options label.
- * @property {Function} handleClick The function to handle the click event.
+ * @property {string} [defaultSelection] - The option selected by default.
+ * @property {string[]} options - The list options label.
+ * @property {Function} handleClick - The function to handle the click event.
  */
 interface IToggleButtonProps {
     defaultSelection?: string;

package/dist/src/components/tooltip/types.d.ts

@@ -7,14 +7,14 @@ type TEffect = "float" | "solid";
  * @interface ITooltipProps
  * @extends IIconModifiable
  * @extends IDisplayModifiable
- * @property {boolean} [disabled] If the tooltip icon is disabled.
- * @property {TEffect} [effect] Tooltip visual effect.
- * @property {boolean} [hide] If the tooltip has a hideout event.
- * @property {string} [id] The tooltip id, required for it to work.
- * @property {ReactNode} [nodeTip] The tooltip content when is not plain text.
- * @property {TPlace} [place] Where to locate the tooltip from parent node.
- * @property {string} [tip] The tooltip content, only as string.
- * @property {title} [title] The tooltip title.
+ * @property {boolean} [disabled] - If the tooltip icon is disabled.
+ * @property {TEffect} [effect] - Tooltip visual effect.
+ * @property {boolean} [hide] - If the tooltip has a hideout event.
+ * @property {string} [id] - The tooltip id, required for it to work.
+ * @property {ReactNode} [nodeTip] - The tooltip content when is not plain text.
+ * @property {TPlace} [place] - Where to locate the tooltip from parent node.
+ * @property {string} [tip] - The tooltip content, only as string.
+ * @property {title} [title] - The tooltip title.
  */
 interface ITooltipProps extends Partial<IIconModifiable>, Pick<IDisplayModifiable, "display" | "height" | "maxWidth" | "width"> {
     disabled?: boolean;

package/dist/src/components/typography/types.d.ts

@@ -7,7 +7,7 @@ import { IMarginModifiable, IPaddingModifiable, ISizeModifiable, ITextModifiable
  * @extends IPaddingModifiable
  * @extends ISizeModifiable
  * @extends ITextModifiable
- * @property {Display} [display] Text display layout.
+ * @property {Display} [display] - Text display layout.
  */
 interface ITypographyProps extends IMarginModifiable, ISizeModifiable, IPaddingModifiable, Omit<ITextModifiable, "fontSize"> {
     display?: Property.Display;

package/dist/src/index.d.ts

@@ -8,6 +8,7 @@ export * from './components/container';
 export * from './components/icon';
 export * from './components/language-selector';
 export * from './components/logo';
+export * from './components/logo-carousel';
 export * from './components/message-banner';
 export * from './components/notification-sign';
 export * from './components/progress-bar';

package/package.json

@@ -3,7 +3,6 @@
   "bugs": {
     "url": "https://gitlab.com/fluidattacks/universe/issues"
   },
-  "description": "Fluidattacks core components library",
   "dependencies": {
     "@cloudinary/react": "1.13.0",
     "@cloudinary/url-gen": "1.21.0",
@@ -14,25 +13,22 @@
     "react-tooltip": "5.28.0",
     "styled-components": "6.1.13"
   },
-  "optionalDependencies": {
-    "@floating-ui/react-dom": "2.1.2",
-    "react-router-dom": "6.27.0"
-  },
+  "description": "Fluidattacks core components library",
   "devDependencies": {
-    "@storybook/addon-a11y": "8.3.6",
-    "@storybook/addon-essentials": "8.3.6",
-    "@storybook/addon-interactions": "8.3.6",
-    "@storybook/addon-links": "8.3.6",
-    "@storybook/addon-viewport": "8.3.6",
-    "@storybook/blocks": "8.3.6",
-    "@storybook/react": "8.3.6",
-    "@storybook/react-vite": "8.3.6",
-    "@storybook/test": "8.3.6",
+    "@storybook/addon-a11y": "8.4.3",
+    "@storybook/addon-essentials": "8.4.3",
+    "@storybook/addon-interactions": "8.4.3",
+    "@storybook/addon-links": "8.4.3",
+    "@storybook/addon-viewport": "8.4.3",
+    "@storybook/blocks": "8.4.3",
+    "@storybook/react": "8.4.3",
+    "@storybook/react-vite": "8.4.3",
+    "@storybook/test": "8.4.3",
     "@types/react": "18.2.0",
     "@types/react-dom": "18.2.0",
     "@vitejs/plugin-react-swc": "3.7.1",
     "autoprefixer": "10.4.20",
-    "eslint": "9.12.0",
+    "eslint": "9.13.0",
     "eslint-config-prettier": "9.1.0",
     "eslint-import-resolver-typescript": "3.6.3",
     "eslint-plugin-functional": "7.0.2",
@@ -44,18 +40,23 @@
     "eslint-plugin-react": "7.37.0",
     "eslint-plugin-react-hooks": "5.0.0",
     "postcss": "8.4.47",
-    "postcss-styled-syntax": "0.6.4",
+    "postcss-styled-syntax": "0.7.0",
     "remark-gfm": "4.0.0",
-    "storybook": "8.3.6",
+    "storybook": "8.4.3",
     "stylelint": "16.10.0",
     "stylelint-config-standard": "36.0.1",
-    "tailwindcss": "3.4.13",
+    "tailwindcss": "3.4.14",
     "typescript": "5.6.3",
-    "typescript-eslint": "8.11.0",
+    "typescript-eslint": "8.12.2",
     "vite": "5.4.10",
     "vite-plugin-css-injected-by-js": "3.5.2",
     "vite-plugin-dts": "4.3.0"
   },
+  "eslintConfig": {
+    "extends": [
+      "plugin:storybook/recommended"
+    ]
+  },
   "files": [
     "README.md",
     "dist"
@@ -69,8 +70,11 @@
   "license": "MPL-2.0",
   "main": "dist/design.js",
   "module": "dist/design.mjs",
-  "types": "dist/src/index.d.ts",
   "name": "@fluidattacks/design",
+  "optionalDependencies": {
+    "@floating-ui/react-dom": "2.1.2",
+    "react-router-dom": "6.28.0"
+  },
   "publishConfig": {
     "access": "public"
   },
@@ -85,10 +89,6 @@
     "preview": "vite preview",
     "storybook": "storybook dev"
   },
-  "version": "1.2.23",
-  "eslintConfig": {
-    "extends": [
-      "plugin:storybook/recommended"
-    ]
-  }
+  "types": "dist/src/index.d.ts",
+  "version": "1.2.25"
 }