@fluidattacks/design 3.0.1 → 3.1.1

package/dist/types/components/accordion/accordion-content/index.d.ts

@@ -1,3 +1,3 @@
 import { IAccordionContentProps } from "../types";
-declare const AccordionContent: ({ isSelectedAndOpen, item, }: Readonly<IAccordionContentProps>) => JSX.Element;
+declare const AccordionContent: ({ item, }: Readonly<IAccordionContentProps>) => JSX.Element;
 export { AccordionContent };

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

@@ -14,11 +14,9 @@ interface IAccordionItemProps {
 /**
  * Accordion Content props
  * @interface IAccordionContentProps
- * @property {boolean} isSelectedAndOpen If item in accordion is selected and open.
  * @property {IAccordionItemProps} item Accordion item.
  */
 interface IAccordionContentProps {
-    isSelectedAndOpen: boolean;
     item: IAccordionItemProps;
 }
 /**

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

@@ -1,7 +1,2 @@
-import { TVariant } from "./types";
-declare const InputContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, {
-    $alert?: boolean;
-    $disabled: boolean;
-    $variant: TVariant;
-}>> & string;
+declare const InputContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, never>> & string;
 export { InputContainer };

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

@@ -1,5 +1,4 @@
 import type { HTMLAttributes } from "react";
-type TVariant = "web" | "platform";
 /**
  * Checkbox props.
  * @interface ICheckboxProps
@@ -8,13 +7,11 @@ type TVariant = "web" | "platform";
  * @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;
     label?: string;
     name: string;
     value?: string;
-    variant?: TVariant;
 }
-export type { ICheckboxProps, TVariant };
+export type { ICheckboxProps };

package/dist/types/components/inputs/fields/combobox/index.d.ts

@@ -0,0 +1,4 @@
+import { IComboBoxProps } from "./types";
+declare const ComboBox: import("react").ForwardRefExoticComponent<Readonly<IComboBoxProps> & import("react").RefAttributes<HTMLInputElement>>;
+export { ComboBox };
+export type { IComboBoxProps };

package/dist/types/components/inputs/fields/combobox/option/index.d.ts

@@ -0,0 +1,3 @@
+import { IOptionProps } from "../types";
+declare const Option: <T extends object>({ item, state, }: Readonly<IOptionProps<T>>) => JSX.Element;
+export { Option };

package/dist/types/components/inputs/fields/combobox/styles.d.ts

@@ -0,0 +1,3 @@
+declare const StyledDropdown: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLUListElement>, HTMLUListElement>, never>> & string;
+declare const StyledOption: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, never>> & string;
+export { StyledDropdown, StyledOption };

package/dist/types/components/inputs/fields/combobox/types.d.ts

@@ -0,0 +1,40 @@
+import type { Key } from "react-aria";
+import type { ComboBoxState } from "react-stately";
+import type { IOutlineContainerProps } from "../../types";
+/**
+ * Props for the item component.
+ * @interface IItem
+ * @property { string } name - The name of the item.
+ * @property { string } value - The value of the item.
+ */
+interface IItem {
+    name: string;
+    value: string;
+}
+/**
+ * Props for the option component.
+ * @interface IOptionProps
+ * @property { IItem } item - The item to be rendered as an option.
+ * @property { ComboBoxState<T> } state - The state of the ComboBox.
+ */
+interface IOptionProps<T> {
+    item: IItem;
+    state: ComboBoxState<T>;
+}
+/**
+ * Props for the Select component.
+ * @interface IComboBoxProps
+ * @property { boolean } [disabled] - Whether the Select is disabled.
+ * @property { string } name - The name of the Select.
+ * @property { IItem[] } items - The items to be rendered as options.
+ * @property { Function } onChange - The callback function to be called when the value of the Select changes.
+ * @property { string } value - The value of the Select.
+ */
+interface IComboBoxProps extends Partial<Omit<IOutlineContainerProps, "maxLength" | "value">> {
+    disabled?: boolean;
+    name: string;
+    items: IItem[];
+    onChange: (key: Key | null) => void;
+    value: string;
+}
+export type { IItem, IOptionProps, IComboBoxProps };

package/dist/types/components/inputs/index.d.ts

@@ -1,3 +1,4 @@
+import { ComboBox } from "./fields/combobox";
 import { InputDate } from "./fields/date";
 import { InputDateRange } from "./fields/date-range";
 import { InputDateTime } from "./fields/date-time";
@@ -10,4 +11,4 @@ import { InputNumberRange } from "./fields/number-range";
 import { PhoneInput } from "./fields/phone";
 import { TextArea } from "./fields/text-area";
 import { OutlineContainer } from "./outline-container";
-export { OutlineContainer, PhoneInput, Input, InputDate, InputDateRange, InputDateTime, InputFile, InputNumber, InputTags, InputNumberRange, TextArea, Editable, };
+export { OutlineContainer, PhoneInput, ComboBox, Input, InputDate, InputDateRange, InputDateTime, InputFile, InputNumber, InputTags, InputNumberRange, TextArea, Editable, };

package/dist/types/components/inputs/utils/popover/index.d.ts

@@ -1,4 +1,4 @@
 import { PropsWithChildren } from "react";
 import type { IPopoverProps } from "../types";
-declare const Popover: ({ children, isFilter, state, ...props }: Readonly<PropsWithChildren<IPopoverProps>>) => JSX.Element;
+declare const Popover: ({ className, children, isFilter, popoverRef, state, triggerRef, ...props }: Readonly<PropsWithChildren<IPopoverProps>>) => JSX.Element;
 export { Popover };

package/dist/types/components/inputs/utils/types.d.ts

@@ -21,11 +21,15 @@ interface IActionButtonProps extends Pick<IIconModifiable, "icon">, IBorderModif
  * Popover component props.
  * @interface IPopoverProps
  * @extends AriaPopoverProps
+ * @property {string} [className] - The class name of the popover.
  * @property {boolean} [isFilter] - Indicates if the popover is a filter.
  * @property {OverlayTriggerState} state - The state of the overlay trigger.
+ * @property {RefObject} [popoverRef] - The ref of the popover.
  */
 interface IPopoverProps extends Omit<AriaPopoverProps, "popoverRef"> {
+    className?: string;
     isFilter?: boolean;
+    popoverRef?: React.MutableRefObject<HTMLDivElement | null>;
     state: OverlayTriggerState;
 }
 /**
@@ -36,21 +40,15 @@ interface IPopoverProps extends Omit<AriaPopoverProps, "popoverRef"> {
  * @property {string} [error] - The error message.
  * @property {React.MutableRefObject<null>} datePickerRef - The ref of the date picker.
  * @property {boolean} [disabled] - Indicates if the date selector is disabled.
- * @property {Function} [handleOnChange] - The function to be called when the date is changed.
  * @property {React.Ref<HTMLInputElement>} inputRef - The ref of the input.
- * @property {boolean} isOpen - Indicates if the date selector is open.
  * @property {string} name - The name of the date selector.
- * @property {string} [variant] - The variant of the date selector.
  */
 interface IDateSelectorProps extends Pick<DatePickerAria, "buttonProps" | "fieldProps" | "groupProps">, Pick<AriaDatePickerProps<DateValue>, "granularity"> {
     error?: string;
     datePickerRef: React.MutableRefObject<null>;
     disabled?: boolean;
-    handleOnChange?: (value: DateValue) => void;
     inputRef: React.Ref<HTMLInputElement>;
-    isOpen: boolean;
     name: string;
-    variant?: "range";
 }
 /**
  * Date segment component props.

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

@@ -1,6 +1,4 @@
-declare const LabelContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, {
-    $disabled: boolean;
-}>> & string;
+declare const LabelContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, never>> & string;
 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"> & {
     ref?: ((instance: HTMLSpanElement | null) => void) | import("react").RefObject<HTMLSpanElement> | null | undefined;
 }>, never>, never>> & string;

package/package.json

@@ -12,6 +12,7 @@
     "react-hook-form": "7.53.2",
     "react-router-dom": "6.28.0",
     "react-stately": "3.34.0",
+    "react-tooltip": "5.28.0",
     "styled-components": "6.1.13"
   },
   "description": "Fluidattacks core components library",
@@ -53,8 +54,7 @@
     "tailwindcss": "3.4.16",
     "typescript": "5.7.2",
     "typescript-eslint": "8.18.0",
-    "vite": "6.0.3",
-    "vite-plugin-css-injected-by-js": "3.5.2"
+    "vite": "6.0.3"
   },
   "eslintConfig": {
     "extends": [
@@ -62,8 +62,16 @@
     ]
   },
   "exports": {
-    ".": "./dist/index.js",
-    "./button": "./dist/button.js"
+    ".": {
+      "types": "./dist/types/index.d.ts",
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.js"
+    },
+    "./button": {
+      "types": "./dist/types/components/button/types.d.ts",
+      "import": "./dist/button.mjs",
+      "require": "./dist/button.js"
+    }
   },
   "files": [
     "README.md",
@@ -76,8 +84,8 @@
     "fluidattacks"
   ],
   "license": "MPL-2.0",
-  "main": "dist/index.mjs",
-  "module": "dist/index.js",
+  "main": "dist/index.js",
+  "module": "dist/index.mjs",
   "name": "@fluidattacks/design",
   "peerDependencies": {
     "@cloudinary/react": "1.13.1",
@@ -90,8 +98,7 @@
     "motion": "11.15.0",
     "prismjs": "1.29.0",
     "react-international-phone": "4.3.0",
-    "react-joyride": "2.9.3",
-    "react-tooltip": "5.28.0"
+    "react-joyride": "2.9.3"
   },
   "publishConfig": {
     "access": "public"
@@ -108,6 +115,6 @@
     "storybook": "storybook dev",
     "test-storybook": "test-storybook"
   },
-  "types": "dist/types/index.d.ts",
-  "version": "3.0.1"
+  "typings": "dist/types/index.d.ts",
+  "version": "3.1.1"
 }