@fluidattacks/design 1.4.0 → 1.6.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (37) hide show
  1. package/dist/design.js +969 -715
  2. package/dist/design.mjs +15447 -9934
  3. package/dist/src/components/accordion/accordion-content/index.d.ts +2 -2
  4. package/dist/src/components/accordion/types.d.ts +11 -6
  5. package/dist/src/components/little-flag/index.d.ts +4 -0
  6. package/dist/src/components/little-flag/styles.d.ts +6 -0
  7. package/dist/src/components/little-flag/types.d.ts +15 -0
  8. package/dist/src/components/lottie/index.d.ts +3 -0
  9. package/dist/src/components/lottie/styles.d.ts +41 -0
  10. package/dist/src/components/lottie/types.d.ts +11 -0
  11. package/dist/src/components/notification/index.d.ts +3 -0
  12. package/dist/src/components/notification/styles.d.ts +7 -0
  13. package/dist/src/components/notification/types.d.ts +16 -0
  14. package/dist/src/components/notification/utils.d.ts +4 -0
  15. package/dist/src/components/number-input/index.d.ts +5 -0
  16. package/dist/src/components/number-input/styles.d.ts +3 -0
  17. package/dist/src/components/number-input/types.d.ts +17 -0
  18. package/dist/src/components/radio-button/styles.d.ts +0 -2
  19. package/dist/src/components/radio-button/types.d.ts +1 -4
  20. package/dist/src/components/step-lapse/index.d.ts +3 -0
  21. package/dist/src/components/step-lapse/styles.d.ts +8 -0
  22. package/dist/src/components/step-lapse/types.d.ts +44 -0
  23. package/dist/src/components/table-button/index.d.ts +3 -0
  24. package/dist/src/components/table-button/styles.d.ts +2 -0
  25. package/dist/src/components/table-button/types.d.ts +16 -0
  26. package/dist/src/components/tag/index.d.ts +4 -0
  27. package/dist/src/components/tag/styles.d.ts +7 -0
  28. package/dist/src/components/tag/types.d.ts +20 -0
  29. package/dist/src/components/toggle/index.d.ts +4 -0
  30. package/dist/src/components/toggle/styles.d.ts +4 -0
  31. package/dist/src/components/toggle/types.d.ts +28 -0
  32. package/dist/src/components/tour/index.d.ts +6 -0
  33. package/dist/src/components/tour/types.d.ts +14 -0
  34. package/dist/src/index.d.ts +7 -0
  35. package/package.json +3 -1
  36. package/dist/src/components/accordion/accordion-content/types.d.ts +0 -16
  37. package/dist/src/components/accordion/utils.d.ts +0 -20
@@ -1,3 +1,3 @@
1
- import { IAccordionContentProps } from './types';
2
- declare const AccordionContent: ({ isSelectedAndOpen, item, variant, render, }: Readonly<IAccordionContentProps>) => JSX.Element | null;
1
+ import { IAccordionContentProps } from '../types';
2
+ declare const AccordionContent: ({ isSelectedAndOpen, item, }: Readonly<IAccordionContentProps>) => JSX.Element;
3
3
  export { AccordionContent };
@@ -1,4 +1,3 @@
1
- type TVariant = "progress" | "simple" | "platform";
2
1
  type TAligned = "end" | "start";
3
2
  /**
4
3
  * Accordion item properties.
@@ -12,6 +11,16 @@ interface IAccordionItemProps {
12
11
  description?: string;
13
12
  extraElement?: JSX.Element;
14
13
  }
14
+ /**
15
+ * Accordion Content props
16
+ * @interface IAccordionContentProps
17
+ * @property {boolean} isSelectedAndOpen If item in accordion is selected and open.
18
+ * @property {IAccordionItemProps} item Accordion item.
19
+ */
20
+ interface IAccordionContentProps {
21
+ isSelectedAndOpen: boolean;
22
+ item: IAccordionItemProps;
23
+ }
15
24
  /**
16
25
  * Pass more than 1 item to activate the progress variant.
17
26
  *
@@ -19,15 +28,11 @@ interface IAccordionItemProps {
19
28
  * @interface IAccordionProps
20
29
  * @property {TAligned} [aligned] - Alignment of the accordion title.
21
30
  * @property {IAccordionItemProps[]} items - A list of accordion items.
22
- * @property {number} [progressTime] - Time remaining until the next item (in seconds).
23
31
  * @property {string} [bgColor] - Background color of the accordion.
24
- * @property {TVariant} [variant] - Type of accordion variant.
25
32
  */
26
33
  interface IAccordionProps {
27
34
  aligned?: TAligned;
28
35
  items: IAccordionItemProps[];
29
- progressTime?: number;
30
36
  bgColor?: string;
31
- variant?: TVariant;
32
37
  }
33
- export type { IAccordionProps, IAccordionItemProps, TVariant, TAligned };
38
+ export type { IAccordionProps, IAccordionItemProps, IAccordionContentProps, TAligned, };
@@ -0,0 +1,4 @@
1
+ import { ILittleFlagProps } from './types';
2
+ declare const LittleFlag: ({ bgColor, children, txtDecoration, ml, }: Readonly<ILittleFlagProps>) => JSX.Element;
3
+ export type { ILittleFlagProps };
4
+ export { LittleFlag };
@@ -0,0 +1,6 @@
1
+ interface IStyledLittleFlagProps {
2
+ $bgColor?: string;
3
+ $txtDecoration?: string;
4
+ }
5
+ declare const LittleFlag: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, IStyledLittleFlagProps>> & string;
6
+ export { LittleFlag };
@@ -0,0 +1,15 @@
1
+ type TNums0To7 = 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7;
2
+ /**
3
+ * Little flag component props.
4
+ * @interface ILittleFlagProps
5
+ * @extends React.HTMLAttributes<HTMLSpanElement>
6
+ * @property { number } [ml] - The margin left value for the little flag.
7
+ * @property { string } [bgColor] - The background color for the little flag.
8
+ * @property { string } [txtDecoration] - The text decoration for the little flag.
9
+ */
10
+ interface ILittleFlagProps extends Partial<React.HTMLAttributes<HTMLSpanElement>> {
11
+ ml?: TNums0To7;
12
+ bgColor?: string;
13
+ txtDecoration?: string;
14
+ }
15
+ export type { ILittleFlagProps };
@@ -0,0 +1,3 @@
1
+ import { ILottieProps } from './types';
2
+ declare const Lottie: (props: Readonly<ILottieProps>) => JSX.Element;
3
+ export { Lottie };
@@ -0,0 +1,41 @@
1
+ import { ILottieProps } from './types';
2
+ interface IStyledLottieProps extends Partial<ILottieProps> {
3
+ $size?: ILottieProps["size"];
4
+ }
5
+ declare const StyledLottie: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('styled-components').FastOmit<import('styled-components/dist/types').Substitute<Omit<Omit<import('lottie-web').AnimationConfigWithData<"svg">, "container" | "animationData"> & {
6
+ animationData: unknown;
7
+ lottieRef?: import('lottie-light-react').LottieRef;
8
+ onComplete?: import('react').AnimationEventHandler | null;
9
+ onLoopComplete?: import('react').AnimationEventHandler | null;
10
+ onEnterFrame?: import('react').AnimationEventHandler | null;
11
+ onSegmentStart?: import('react').AnimationEventHandler | null;
12
+ onConfigReady?: import('react').AnimationEventHandler | null;
13
+ onDataReady?: import('react').AnimationEventHandler | null;
14
+ onDataFailed?: import('react').AnimationEventHandler | null;
15
+ onLoadedImages?: import('react').AnimationEventHandler | null;
16
+ onDOMLoaded?: import('react').AnimationEventHandler | null;
17
+ onDestroy?: import('react').AnimationEventHandler | null;
18
+ } & Omit<import('react').HTMLProps<HTMLDivElement>, "loop"> & {
19
+ interactivity?: Omit<import('lottie-light-react').InteractivityProps, "lottieObj">;
20
+ }, "ref"> & {
21
+ ref?: ((instance: HTMLDivElement | null) => void) | import('react').RefObject<HTMLDivElement> | null | undefined;
22
+ }, Omit<Omit<import('lottie-web').AnimationConfigWithData<"svg">, "container" | "animationData"> & {
23
+ animationData: unknown;
24
+ lottieRef?: import('lottie-light-react').LottieRef;
25
+ onComplete?: import('react').AnimationEventHandler | null;
26
+ onLoopComplete?: import('react').AnimationEventHandler | null;
27
+ onEnterFrame?: import('react').AnimationEventHandler | null;
28
+ onSegmentStart?: import('react').AnimationEventHandler | null;
29
+ onConfigReady?: import('react').AnimationEventHandler | null;
30
+ onDataReady?: import('react').AnimationEventHandler | null;
31
+ onDataFailed?: import('react').AnimationEventHandler | null;
32
+ onLoadedImages?: import('react').AnimationEventHandler | null;
33
+ onDOMLoaded?: import('react').AnimationEventHandler | null;
34
+ onDestroy?: import('react').AnimationEventHandler | null;
35
+ } & Omit<import('react').HTMLProps<HTMLDivElement>, "loop"> & {
36
+ interactivity?: Omit<import('lottie-light-react').InteractivityProps, "lottieObj">;
37
+ }, "ref"> & {
38
+ ref?: ((instance: HTMLDivElement | null) => void) | import('react').RefObject<HTMLDivElement> | null | undefined;
39
+ }>, never>, IStyledLottieProps>> & string & Omit<(props: import('lottie-light-react').LottieComponentProps) => import('react').ReactElement<any, string | import('react').JSXElementConstructor<any>>, keyof import('react').Component<any, {}, any>>;
40
+ export type { IStyledLottieProps };
41
+ export { StyledLottie };
@@ -0,0 +1,11 @@
1
+ import { LottieComponentProps } from 'lottie-light-react';
2
+ /**
3
+ * Lottie component props.
4
+ * @interface ILottieProps
5
+ * @extends LottieComponentProps
6
+ * @property { number } [size] - The size of the lottie animation. Default is 16px.
7
+ */
8
+ interface ILottieProps extends Partial<Pick<LottieComponentProps, "animationData" | "autoplay" | "className">> {
9
+ size?: number;
10
+ }
11
+ export type { ILottieProps };
@@ -0,0 +1,3 @@
1
+ import { INotificationProps } from './types';
2
+ declare const Notification: ({ description, onClose, title, variant, }: Readonly<INotificationProps>) => JSX.Element;
3
+ export { Notification };
@@ -0,0 +1,7 @@
1
+ import { TNotificationVariant } from './types';
2
+ interface IAlertAndNotifyBoxProps {
3
+ $variant: TNotificationVariant;
4
+ }
5
+ declare const NotificationContainer: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, IAlertAndNotifyBoxProps>> & string;
6
+ declare const IconsContainer: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, IAlertAndNotifyBoxProps>> & string;
7
+ export { IconsContainer, NotificationContainer };
@@ -0,0 +1,16 @@
1
+ type TNotificationVariant = "error" | "info" | "success" | "warning";
2
+ /**
3
+ * Notification component props.
4
+ * @interface INotificationProps
5
+ * @property {string} description - The main content of the notification.
6
+ * @property {string} title - The title of the notification.
7
+ * @property {TNotificationVariant} variant - The notification custom variant.
8
+ * @property { Function } [onClose] - Optional callback function when the notification is closed.
9
+ */
10
+ interface INotificationProps {
11
+ description: string;
12
+ title: string;
13
+ variant: TNotificationVariant;
14
+ onClose?: () => void;
15
+ }
16
+ export type { INotificationProps, TNotificationVariant };
@@ -0,0 +1,4 @@
1
+ import { IconName } from '@fortawesome/free-solid-svg-icons';
2
+ import { TNotificationVariant } from './types';
3
+ declare const getIcon: (variant: TNotificationVariant) => IconName;
4
+ export { getIcon };
@@ -0,0 +1,5 @@
1
+ import { default as React } from 'react';
2
+ import { INumberInputProps } from './types';
3
+ declare const NumberInput: React.ForwardRefExoticComponent<Readonly<INumberInputProps> & React.RefAttributes<HTMLInputElement>>;
4
+ export type { INumberInputProps };
5
+ export { NumberInput };
@@ -0,0 +1,3 @@
1
+ declare const StyledInputContainer: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
2
+ declare const StyledInput: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, never>> & string;
3
+ export { StyledInputContainer, StyledInput };
@@ -0,0 +1,17 @@
1
+ import { InputHTMLAttributes } from 'react';
2
+ /**
3
+ * Number input component props.
4
+ * @interface INumberInputProps
5
+ * @extends InputHTMLAttributes<HTMLInputElement>
6
+ * @property { boolean } [autoUpdate] - Whether the input value should be updated automatically.
7
+ * @property { number } [decimalPlaces] - Number of decimal places to display.
8
+ * @property { Function } [onEnter] - Function to be called when the enter key is pressed.
9
+ * @property { string } [tooltipMessage] - Tooltip message to display when hovering over the input.
10
+ */
11
+ interface INumberInputProps extends InputHTMLAttributes<HTMLInputElement> {
12
+ autoUpdate?: boolean;
13
+ decimalPlaces?: number;
14
+ onEnter: (value?: number) => void;
15
+ tooltipMessage?: string;
16
+ }
17
+ export type { INumberInputProps };
@@ -1,7 +1,5 @@
1
- import { TVariant } from './types';
2
1
  declare const LabelContainer: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, {
3
2
  $disabled: boolean;
4
- $variant: TVariant;
5
3
  }>> & string;
6
4
  declare const CheckMark: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('styled-components').FastOmit<import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
7
5
  ref?: ((instance: HTMLSpanElement | null) => void) | import('react').RefObject<HTMLSpanElement> | null | undefined;
@@ -1,5 +1,4 @@
1
1
  import { HTMLAttributes, HTMLProps } from 'react';
2
- type TVariant = "web" | "platform";
3
2
  /**
4
3
  * Radio button props.
5
4
  * @interface IRadioButtonProps
@@ -7,11 +6,9 @@ type TVariant = "web" | "platform";
7
6
  * @extends HTMLProps<HTMLInputElement>
8
7
  * @property {string} name - Input name.
9
8
  * @property {string} value - Radio button value.
10
- * @property {Function} [variant] - Radio button variant type.
11
9
  */
12
10
  interface IRadioButtonProps extends HTMLAttributes<HTMLInputElement>, HTMLProps<HTMLInputElement> {
13
11
  name: string;
14
12
  value: string;
15
- variant?: TVariant;
16
13
  }
17
- export type { IRadioButtonProps, TVariant };
14
+ export type { IRadioButtonProps };
@@ -0,0 +1,3 @@
1
+ import { IStepLapseProps } from './types';
2
+ declare const StepLapse: ({ button: { disabled, text, type, onClick }, steps, }: Readonly<IStepLapseProps>) => JSX.Element;
3
+ export { StepLapse };
@@ -0,0 +1,8 @@
1
+ import { TStepVariant } from './types';
2
+ declare const StepperContainer: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
3
+ declare const StepContainer: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
4
+ declare const StyledButtonsContainer: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
5
+ declare const StyledStepLabel: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {
6
+ $variant: TStepVariant;
7
+ }>> & string;
8
+ export { StyledStepLabel, StyledButtonsContainer, StepContainer, StepperContainer, };
@@ -0,0 +1,44 @@
1
+ import { ButtonHTMLAttributes, ReactNode } from 'react';
2
+ type TStepVariant = "completed" | "current" | "disabled";
3
+ /**
4
+ * Step component props.
5
+ * @interface IStep
6
+ * @property { ReactNode } content - The content to be displayed in the step.
7
+ * @property { boolean } [isDisabledNext] - A flag indicating whether the next button should be disabled.
8
+ * @property { boolean } [isDisabledPrevious] - A flag indicating whether the previous button should be disabled.
9
+ * @property { Function } [nextAction] - The callback function to be executed when the next button is clicked.
10
+ * @property { Function } [previousAction] - The callback function to be executed when the previous button is clicked.
11
+ * @property { string } title - The title of the step.
12
+ */
13
+ interface IStep {
14
+ content: ReactNode;
15
+ isDisabledNext?: boolean;
16
+ isDisabledPrevious?: boolean;
17
+ nextAction?: () => void;
18
+ previousAction?: () => void;
19
+ title: string;
20
+ }
21
+ /**
22
+ * Step lapse button props.
23
+ * @interface IStepLapseButton
24
+ * @extends ButtonHTMLAttributes<HTMLButtonElement>
25
+ * @property { boolean } disabled - Whether the button should be disabled.
26
+ * @property { string } text - Button text.
27
+ * @property { Function } onClick - Callback function to be executed when the button is clicked.
28
+ */
29
+ interface IStepLapseButton extends Pick<ButtonHTMLAttributes<HTMLButtonElement>, "type"> {
30
+ disabled?: boolean;
31
+ text: string;
32
+ onClick?: () => void;
33
+ }
34
+ /**
35
+ * Step lapse component props.
36
+ * @interface IStepLapseProps
37
+ * @property { IStepLapseButton } button - The button to be displayed at the end of the step lapse.
38
+ * @property { IStep[] } steps - The steps to be included in the step lapse.
39
+ */
40
+ interface IStepLapseProps {
41
+ button: IStepLapseButton;
42
+ steps: IStep[];
43
+ }
44
+ export type { IStepLapseProps, TStepVariant };
@@ -0,0 +1,3 @@
1
+ import { ITableButtonProps } from './types';
2
+ declare const TableButton: ({ disabled, icon, id, label, name, onClick, type, variant, }: Readonly<ITableButtonProps>) => JSX.Element;
3
+ export { TableButton };
@@ -0,0 +1,2 @@
1
+ declare const StyledTableButton: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, never>> & string;
2
+ export { StyledTableButton };
@@ -0,0 +1,16 @@
1
+ import { ButtonHTMLAttributes } from 'react';
2
+ import { IIconModifiable } from '../@core';
3
+ type TVariant = "add" | "approve" | "disabled" | "reject" | "submit" | "success";
4
+ /**
5
+ * Table button component props.
6
+ * @interface ITableButtonProps
7
+ * @extends IIconModifiable
8
+ * @extends ButtonHTMLAttributes<HTMLButtonElement>
9
+ * @property { string } [label] - Button label.
10
+ * @property { TVariant } variant - Button variant.
11
+ */
12
+ interface ITableButtonProps extends Partial<Pick<IIconModifiable, "icon">>, ButtonHTMLAttributes<HTMLButtonElement> {
13
+ label?: string;
14
+ variant: TVariant;
15
+ }
16
+ export type { ITableButtonProps, TVariant };
@@ -0,0 +1,4 @@
1
+ import { ITagProps, TTagVariant } from './types';
2
+ declare const Tag: ({ children, disabled, icon, iconColor, id, fontSize, onClose, variant, }: Readonly<ITagProps>) => JSX.Element;
3
+ export type { ITagProps, TTagVariant };
4
+ export { Tag };
@@ -0,0 +1,7 @@
1
+ import { TTagVariant } from './types';
2
+ interface IStyledTag {
3
+ $fontSize?: string;
4
+ $variant: TTagVariant;
5
+ }
6
+ declare const StyledTag: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, IStyledTag>> & string;
7
+ export { StyledTag };
@@ -0,0 +1,20 @@
1
+ import { IIconModifiable } from '../@core';
2
+ type TTagVariant = "default" | "error" | "inactive" | "new" | "reachable" | "remediation" | "review" | "role" | "success" | "technique" | "warning";
3
+ /**
4
+ * Tag component props.
5
+ * @interface ITagProps
6
+ * @extends IIconModifiable
7
+ * @extends HTMLAttributes<HTMLSpanElement>
8
+ * @property { boolean } [disabled] - Whether the tag is disabled.
9
+ * @property { string } [fontSize] - The font size for the tag.
10
+ * @property { Function } [onClose] - Function handler for close button click.
11
+ * @property { TTagType } [type] - The type of the tag.
12
+ * @property { TTagVariant } [variant] - The variant of the tag.
13
+ */
14
+ interface ITagProps extends Partial<Pick<IIconModifiable, "icon" | "iconColor">>, React.HTMLAttributes<HTMLSpanElement> {
15
+ disabled?: boolean;
16
+ fontSize?: string;
17
+ onClose?: () => void;
18
+ variant?: TTagVariant;
19
+ }
20
+ export type { ITagProps, TTagVariant };
@@ -0,0 +1,4 @@
1
+ import { default as React } from 'react';
2
+ import { IToggleProps } from './types';
3
+ declare const Toggle: React.ForwardRefExoticComponent<Readonly<IToggleProps> & React.RefAttributes<HTMLInputElement>>;
4
+ export { Toggle };
@@ -0,0 +1,4 @@
1
+ declare const Slider: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
2
+ declare const Ball: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
3
+ declare const ToggleContainer: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, never>> & string;
4
+ export { Slider, ToggleContainer, Ball };
@@ -0,0 +1,28 @@
1
+ import { Property } from 'csstype';
2
+ import { InputHTMLAttributes } from 'react';
3
+ /**
4
+ * Toggle component props.
5
+ * @interface ILabel
6
+ * @property { string } on - The label for the on state.
7
+ * @property { string } off - The label for the off state.
8
+ */
9
+ interface ILabel {
10
+ on: string;
11
+ off: string;
12
+ }
13
+ /**
14
+ * Toggle component props.
15
+ * @interface IToggleProps
16
+ * @extends InputHTMLAttributes<HTMLInputElement>
17
+ * @property { Property.JustifyContent } [justify] - The justification of the toggle and its labels.
18
+ * @property { ILabel | string } [leftDescription] - The label or description for the left side of the toggle.
19
+ * @property { string } name - The name of the input field.
20
+ * @property { string } [rightDescription] - The label or description for the right side of the toggle.
21
+ */
22
+ interface IToggleProps extends InputHTMLAttributes<HTMLInputElement> {
23
+ justify?: Property.JustifyContent;
24
+ leftDescription?: ILabel | string;
25
+ name: string;
26
+ rightDescription?: string;
27
+ }
28
+ export type { IToggleProps };
@@ -0,0 +1,6 @@
1
+ import { Step } from 'react-joyride';
2
+ import { ITourProps } from './types';
3
+ declare const baseStep: Step;
4
+ declare const Tour: ({ run, steps, onFinish }: Readonly<ITourProps>) => JSX.Element;
5
+ export { baseStep, Tour };
6
+ export type { Step };
@@ -0,0 +1,14 @@
1
+ import { Step } from 'react-joyride';
2
+ /**
3
+ * Tour component props.
4
+ * @interface ITourProps
5
+ * @property { Function } [onFinish] - The callback function to be executed when the tour finishes.
6
+ * @property { boolean } run - A flag indicating whether the tour should be run.
7
+ * @property { Step[] } steps - The steps to be included in the tour.
8
+ */
9
+ interface ITourProps {
10
+ onFinish?: () => void;
11
+ run: boolean;
12
+ steps: Step[];
13
+ }
14
+ export type { ITourProps };
@@ -20,14 +20,21 @@ export * from './components/interactive-card';
20
20
  export * from './components/language-selector';
21
21
  export * from './components/link';
22
22
  export * from './components/list-item';
23
+ export * from './components/little-flag';
23
24
  export * from './components/logo';
24
25
  export * from './components/logo-carousel';
26
+ export * from './components/lottie';
25
27
  export * from './components/message-banner';
28
+ export * from './components/notification';
26
29
  export * from './components/notification-sign';
30
+ export * from './components/number-input';
27
31
  export * from './components/progress-bar';
28
32
  export * from './components/radio-button';
29
33
  export * from './components/search-bar';
34
+ export * from './components/table-button';
30
35
  export * from './components/tabs';
36
+ export * from './components/tag';
37
+ export * from './components/toggle';
31
38
  export * from './components/toggle-buttons';
32
39
  export * from './components/tooltip';
33
40
  export * from './components/typography';
package/package.json CHANGED
@@ -8,10 +8,12 @@
8
8
  "@cloudinary/url-gen": "1.21.0",
9
9
  "@fortawesome/free-solid-svg-icons": "6.7.1",
10
10
  "@fortawesome/react-fontawesome": "0.2.2",
11
+ "lottie-light-react": "2.4.0",
11
12
  "prismjs": "1.29.0",
12
13
  "react": "18.2.0",
13
14
  "react-dom": "18.2.0",
14
15
  "react-international-phone": "4.3.0",
16
+ "react-joyride": "2.9.3",
15
17
  "react-tooltip": "5.28.0",
16
18
  "styled-components": "6.1.13"
17
19
  },
@@ -96,5 +98,5 @@
96
98
  "test-storybook": "test-storybook"
97
99
  },
98
100
  "types": "dist/src/index.d.ts",
99
- "version": "1.4.0"
101
+ "version": "1.6.0"
100
102
  }
@@ -1,16 +0,0 @@
1
- import { IAccordionItemProps, TVariant } from '../types';
2
- /**
3
- * Accordion Content props
4
- * @interface IAccordionContentProps
5
- * @property {boolean} isSelectedAndOpen If item in accordion is selected and open.
6
- * @property {IAccordionItemProps} item Accordion item.
7
- * @property {TVariant} variant Type of accordion.
8
- * @property {boolean} render Render condition.
9
- */
10
- interface IAccordionContentProps {
11
- isSelectedAndOpen: boolean;
12
- item: IAccordionItemProps;
13
- variant: TVariant;
14
- render: boolean;
15
- }
16
- export type { IAccordionContentProps };
@@ -1,20 +0,0 @@
1
- import { IconName } from '@fortawesome/free-solid-svg-icons';
2
- import { Property } from 'csstype';
3
- import { SetStateAction } from 'react';
4
- import { TAligned, TVariant } from './types';
5
- import { TSize, TSpacing } from '../@core';
6
- declare const getItemBorderBottom: (index: number, isSelectedAndOpen: boolean, totalItems: number, variant: TVariant) => string | undefined;
7
- declare const getItemBorderTop: (isSelectedAndOpen: boolean, variant: TVariant) => string | undefined;
8
- declare const getIcon: (isSelectedAndOpen: boolean, variant: TVariant) => IconName;
9
- declare const getContentDisplay: (isSelectedAndOpen: boolean) => Property.Display;
10
- declare const handleContentVisibility: (index: number, currentItem: number, setIsOpen: (value: SetStateAction<boolean>) => void) => void;
11
- declare const getTitlePadding: (variant: TVariant) => [TSpacing, TSpacing, TSpacing, TSpacing];
12
- declare const getContentPadding: (variant: TVariant) => [TSpacing, TSpacing, TSpacing, TSpacing] | undefined;
13
- declare const getHoverBgColor: (variant: TVariant) => string | undefined;
14
- declare const getBorderColor: (variant: TVariant) => string;
15
- declare const getIconColor: (variant: TVariant) => string;
16
- declare const getFlexDirection: (aligned: TAligned) => Property.FlexDirection;
17
- declare const getFontSize: (variant: TVariant) => TSize;
18
- declare const getDelay: (progressTime: number) => number;
19
- declare const sleep: (seconds: number) => Promise<PromiseConstructor>;
20
- export { getItemBorderBottom, getItemBorderTop, getBorderColor, getContentDisplay, getDelay, getFlexDirection, getFontSize, getHoverBgColor, getIconColor, getTitlePadding, getContentPadding, getIcon, handleContentVisibility, sleep, };