@fluidattacks/design 1.2.21 → 1.2.22

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

@@ -1,3 +1,3 @@
 import { IMessageBannerProps } from './types';
-declare const MessageBanner: import('react').ForwardRefExoticComponent<Readonly<IMessageBannerProps> & import('react').RefAttributes<unknown>>;
+declare const MessageBanner: ({ message, onClickButton, buttonText, buttonFontWeight, icon, onClose, variant, }: Readonly<IMessageBannerProps>) => JSX.Element;
 export { MessageBanner };

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

@@ -0,0 +1,3 @@
+import { INotificationSignProps } from './types';
+declare const NotificationSign: import('react').ForwardRefExoticComponent<Readonly<INotificationSignProps> & import('react').RefAttributes<HTMLDivElement>>;
+export { NotificationSign };

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

@@ -0,0 +1,9 @@
+import { INotificationSignProps } from './types';
+interface IStyledNotificationSignProps {
+    $variant?: INotificationSignProps["variant"];
+}
+declare const NotificationSignButton: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<Omit<import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('../@core').IPaddingModifiable | keyof import('../@core').IMarginModifiable | keyof import('../@core').IPositionModifiable | keyof import('../@core').IBorderModifiable | keyof import('../@core').IDisplayModifiable | keyof import('../@core').ITextModifiable | keyof import('../@core').IInteractionModifiable> & import('../@core').IBorderModifiable & import('../@core').IDisplayModifiable & import('../@core').IInteractionModifiable & import('../@core').IMarginModifiable & import('../@core').IPaddingModifiable & import('../@core').IPositionModifiable & import('../@core').ITextModifiable, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import('react').RefObject<HTMLDivElement> | null | undefined;
+}, IStyledNotificationSignProps>> & string;
+declare const NumberIndicator: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export { NotificationSignButton, NumberIndicator };

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

@@ -0,0 +1,15 @@
+import { IPositionModifiable } from '../@core';
+type TVariant = "error" | "warning";
+/**
+ * Notification sign component props.
+ * @extends IPositionModifiable
+ * @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;
+    show?: boolean;
+    variant?: TVariant;
+}
+export type { INotificationSignProps };

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

@@ -0,0 +1,4 @@
+import { IProgressBarProps } from './types';
+declare const ProgressBar: ({ progressTime, onComplete, }: Readonly<IProgressBarProps>) => JSX.Element;
+export { ProgressBar };
+export type { IProgressBarProps };

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

@@ -0,0 +1,11 @@
+import { IDisplayModifiable } from '../@core';
+/**
+ * Progress bar component props
+ * @property {number} [progressTime] Time to complete.
+ * @property {Function} [onComplete] Action when progress complete.
+ */
+interface IProgressBarProps extends IDisplayModifiable {
+    progressTime?: number;
+    onComplete?: () => void;
+}
+export type { IProgressBarProps };

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

@@ -0,0 +1,2 @@
+declare const getDelay: (progressTime: number) => number;
+export { getDelay };

package/dist/src/components/tabs/fixed-tabs/index.d.ts

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

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

@@ -0,0 +1,5 @@
+import { FixedTabs } from './fixed-tabs';
+import { Tab } from './tab';
+import { ITabsProps } from './types';
+declare const Tabs: ({ items, borders, box, }: Readonly<ITabsProps>) => JSX.Element;
+export { FixedTabs, Tabs, Tab };

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

@@ -1,3 +1,4 @@
-declare const StyledTab: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, never>> & string;
-declare const StyledTabs: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export { StyledTab, StyledTabs };
+declare const StyledFixedTab: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, never>> & string;
+declare const StyledFixedTabs: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+declare const TabLink: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react-router-dom').NavLinkProps & import('react').RefAttributes<HTMLAnchorElement>, never>> & string & Omit<import('react').ForwardRefExoticComponent<import('react-router-dom').NavLinkProps & import('react').RefAttributes<HTMLAnchorElement>>, keyof import('react').Component<any, {}, any>>;
+export { StyledFixedTab, StyledFixedTabs, TabLink };

package/dist/src/components/tabs/tab/index.d.ts

@@ -0,0 +1,4 @@
+import { ITabProps } from '../types';
+declare const Tab: ({ label, id, isActive, link, notificationSign, onClick, tooltip, }: Readonly<ITabProps>) => JSX.Element;
+export type { ITabProps };
+export { Tab };

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

@@ -0,0 +1,46 @@
+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.
+ */
+interface IFixedTabProps {
+    isActive?: boolean;
+    onClick?: (event: Readonly<React.MouseEvent>) => void;
+    label: string | JSX.Element;
+}
+/**
+ * Fixed tabs component props.
+ * ** Note: A maximum of 5 tabs is allowed. **
+ * @property {ITabProps[]} items The list of tabs to display.
+ */
+interface IFixedTabsProps {
+    items: IFixedTabProps[];
+}
+/**
+ * Tab component props.
+ * @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.
+ */
+interface ITabProps extends IFixedTabProps {
+    id: string;
+    link: string;
+    notificationSign?: INotificationSignProps;
+    tooltip?: string;
+}
+/**
+ * Tabs component props.
+ * @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[];
+    borders?: boolean;
+    box?: boolean;
+}
+export type { IFixedTabsProps, IFixedTabProps, ITabProps, ITabsProps };

package/dist/src/index.d.ts

@@ -7,7 +7,9 @@ export * from './components/container';
 export * from './components/icon';
 export * from './components/language-selector';
 export * from './components/logo';
+export * from './components/notification-sign';
 export * from './components/search-bar';
+export * from './components/tabs';
 export * from './components/toggle-buttons';
 export * from './components/tooltip';
 export * from './components/typography';

package/package.json

@@ -7,7 +7,6 @@
   "dependencies": {
     "@cloudinary/react": "1.13.0",
     "@cloudinary/url-gen": "1.21.0",
-    "@floating-ui/react-dom": "2.1.2",
     "@fortawesome/free-solid-svg-icons": "6.6.0",
     "@fortawesome/react-fontawesome": "0.2.2",
     "react": "18.2.0",
@@ -15,6 +14,10 @@
     "react-tooltip": "5.28.0",
     "styled-components": "6.1.13"
   },
+  "optionalDependencies": {
+    "@floating-ui/react-dom": "2.1.2",
+    "react-router-dom": "6.27.0"
+  },
   "devDependencies": {
     "@storybook/addon-a11y": "8.3.6",
     "@storybook/addon-essentials": "8.3.6",
@@ -82,7 +85,7 @@
     "preview": "vite preview",
     "storybook": "storybook dev"
   },
-  "version": "1.2.21",
+  "version": "1.2.22",
   "eslintConfig": {
     "extends": [
       "plugin:storybook/recommended"

package/dist/src/components/accordion/index.stories.d.ts

@@ -1,7 +0,0 @@
-import { Meta } from '@storybook/react';
-import { IAccordionProps } from './types';
-declare const config: Meta;
-declare const Default: import('@storybook/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, IAccordionProps>;
-declare const Progress: import('@storybook/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, IAccordionProps>;
-export { Default, Progress };
-export default config;

package/dist/src/components/accordion/platform/index.stories.d.ts

@@ -1,6 +0,0 @@
-import { Meta } from '@storybook/react';
-import { IAccordionProps } from '../types';
-declare const config: Meta;
-declare const Default: import('@storybook/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, IAccordionProps>;
-export { Default };
-export default config;

package/dist/src/components/button/index.stories.d.ts

@@ -1,10 +0,0 @@
-import { Meta } from '@storybook/react';
-import { PropsWithChildren } from 'react';
-import { IButtonProps } from '.';
-declare const config: Meta;
-declare const Default: import('@storybook/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, PropsWithChildren<IButtonProps>>;
-declare const Secondary: import('@storybook/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, PropsWithChildren<IButtonProps>>;
-declare const Ghost: import('@storybook/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, PropsWithChildren<IButtonProps>>;
-declare const Link: import('@storybook/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, PropsWithChildren<IButtonProps>>;
-export { Default, Secondary, Ghost, Link };
-export default config;

package/dist/src/components/button/platform/index.stories.d.ts

@@ -1,10 +0,0 @@
-import { Meta } from '@storybook/react';
-import { PropsWithChildren } from 'react';
-import { IButtonProps } from '..';
-declare const config: Meta;
-declare const Default: import('@storybook/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, PropsWithChildren<IButtonProps>>;
-declare const Secondary: import('@storybook/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, PropsWithChildren<IButtonProps>>;
-declare const Tertiary: import('@storybook/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, PropsWithChildren<IButtonProps>>;
-declare const Ghost: import('@storybook/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, PropsWithChildren<IButtonProps>>;
-export { Default, Secondary, Tertiary, Ghost };
-export default config;

package/dist/src/components/container/index.stories.d.ts

@@ -1,7 +0,0 @@
-import { Meta, StoryFn } from '@storybook/react';
-import { IContainerProps } from './types';
-declare const config: Meta;
-declare const Default: import('@storybook/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, import('react').PropsWithChildren<IContainerProps>>;
-declare const FlexBox: StoryFn;
-export { Default, FlexBox };
-export default config;

package/dist/src/components/grid-layout/index.stories.d.ts

@@ -1,17 +0,0 @@
-import { Meta } from '@storybook/react';
-declare const config: Meta;
-declare const PlatformLayout: () => JSX.Element;
-declare const Large: import('@storybook/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, {
-    columns: number;
-}>;
-declare const Medium: import('@storybook/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, {
-    columns: number;
-}>;
-declare const Tablet: import('@storybook/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, {
-    columns: number;
-}>;
-declare const Mobile: import('@storybook/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, {
-    columns: number;
-}>;
-export { PlatformLayout, Large, Medium, Tablet, Mobile };
-export default config;

package/dist/src/components/language-selector/index.stories.d.ts

@@ -1,8 +0,0 @@
-import { Meta } from '@storybook/react';
-import { ILangSelectorProps } from './types';
-declare const config: Meta;
-declare const Default: import('@storybook/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, ILangSelectorProps>;
-declare const FullLanguage: import('@storybook/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, ILangSelectorProps>;
-declare const DarkMode: import('@storybook/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, ILangSelectorProps>;
-export { Default, FullLanguage, DarkMode };
-export default config;

package/dist/src/components/message-banner/index.stories.d.ts

@@ -1,6 +0,0 @@
-import { Meta } from '@storybook/react';
-import { IMessageBannerProps } from './types';
-declare const config: Meta;
-declare const Default: import('@storybook/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, IMessageBannerProps>;
-export default config;
-export { Default };

package/dist/src/components/search-bar/index.stories.d.ts

@@ -1,7 +0,0 @@
-import { Meta } from '@storybook/react';
-import { ISearchBarProps } from './types';
-declare const config: Meta;
-declare const Default: import('@storybook/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, ISearchBarProps>;
-declare const EmptyState: import('@storybook/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, ISearchBarProps>;
-export { Default, EmptyState };
-export default config;

package/dist/src/components/search-bar/item-searching/index.stories.d.ts

@@ -1,6 +0,0 @@
-import { Meta } from '@storybook/react';
-import { IItemSearchingProps } from '../types';
-declare const config: Meta;
-declare const Default: import('@storybook/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, IItemSearchingProps>;
-export { Default };
-export default config;

package/dist/src/components/toggle-buttons/index.stories.d.ts

@@ -1,6 +0,0 @@
-import { Meta } from '@storybook/react';
-import { IToggleButtonProps } from './types';
-declare const config: Meta;
-declare const Default: import('@storybook/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, IToggleButtonProps>;
-export { Default };
-export default config;

package/dist/src/components/tooltip/index.stories.d.ts

@@ -1,8 +0,0 @@
-import { Meta } from '@storybook/react';
-import { ITooltipProps } from './types';
-declare const config: Meta;
-declare const Default: import('@storybook/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, ITooltipProps>;
-declare const TitleTooltip: import('@storybook/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, ITooltipProps>;
-declare const IconTooltip: import('@storybook/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, ITooltipProps>;
-export { Default, TitleTooltip, IconTooltip };
-export default config;