@agility/plenum-ui 2.0.0-rc9 → 2.0.1

package/dist/index.d.ts

@@ -72,6 +72,7 @@ declare module '@agility/plenum-ui/stories/atoms/buttons/Button/Alternative/Alte
   export default meta;
   type Story = StoryObj<typeof Button>;
   export const Alternative: Story;
+  export const AlternativeDisabled: Story;
   export const AlternativeTrailingIcon: Story;
   export const AlternativeLeadingIcon: Story;
   export const AlternativeExtraSmall: Story;
@@ -83,10 +84,10 @@ declare module '@agility/plenum-ui/stories/atoms/buttons/Button/Alternative/Alte
 
 }
 declare module '@agility/plenum-ui/stories/atoms/buttons/Button/Button' {
-  import { HTMLAttributeAnchorTarget } from "react";
+  import React, { HTMLAttributeAnchorTarget } from "react";
   import { UnifiedIconName, IDynamicIconProps } from "@agility/plenum-ui/stories/atoms/icons/index";
   export type BTNActionType = "primary" | "secondary" | "alternative" | "danger";
-  export interface IButtonProps extends React.ComponentPropsWithoutRef<"button"> {
+  export interface IButtonProps extends Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> {
       /** Is the button a Primary CTA, alternative or danger button? */
       actionType?: BTNActionType;
       /** How lg should the button be? - Defaults to 'base'. */
@@ -111,12 +112,8 @@ declare module '@agility/plenum-ui/stories/atoms/buttons/Button/Button' {
       isLoading?: boolean;
       className?: string;
       iconObj?: React.ReactNode;
-      ref?: React.LegacyRef<HTMLButtonElement>;
   }
-  /**
-   * Primary UI component for user interaction
-   */
-  const Button: ({ actionType, size, label, icon, iconObj, CustomSVGIcon, fullWidth, iconPosition, asLink, isLoading, className, ref, ...props }: IButtonProps) => import("react/jsx-runtime").JSX.Element;
+  const Button: React.ForwardRefExoticComponent<IButtonProps & React.RefAttributes<HTMLButtonElement>>;
   export default Button;
 
 }
@@ -127,6 +124,7 @@ declare module '@agility/plenum-ui/stories/atoms/buttons/Button/Danger/Danger.st
   export default meta;
   type Story = StoryObj<typeof Button>;
   export const Danger: Story;
+  export const DangerDisabled: Story;
   export const DangerTrailingIcon: Story;
   export const DangerLeadingIcon: Story;
   export const DangerSimpleIconName: Story;
@@ -144,6 +142,7 @@ declare module '@agility/plenum-ui/stories/atoms/buttons/Button/Primary/Primary.
   export default meta;
   type Story = StoryObj<typeof Button>;
   export const Primary: Story;
+  export const PrimaryDisabled: Story;
   export const PrimaryLeadingIcon: Story;
   export const PrimarySimpleIconName: Story;
   export const PrimaryTrailingIcon: Story;
@@ -161,6 +160,7 @@ declare module '@agility/plenum-ui/stories/atoms/buttons/Button/Secondary/Second
   export default meta;
   type Story = StoryObj<typeof Button>;
   export const Secondary: Story;
+  export const SecondaryDisabled: Story;
   export const SecondaryTrailingIcon: Story;
   export const SecondaryLeadingIcon: Story;
   export const SecondarySimpleIconName: Story;
@@ -198,7 +198,7 @@ declare module '@agility/plenum-ui/stories/atoms/buttons/Capsule/Capsule' {
   /**
    * Capsule Style Button
    */
-  export interface ICapsuleProps extends React.ComponentPropsWithoutRef<"button"> {
+  export interface ICapsuleProps extends React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement> {
       /** Is the button a Primary CTA, alternative or danger button? */
       actionType: BTNActionType;
       /** How lg should the button be? - Defaults to 'base'. */
@@ -271,12 +271,12 @@ declare module '@agility/plenum-ui/stories/atoms/icons/DynamicIcon' {
   import { ClassNameWithAutocomplete } from "@/utils/types";
   export type IconName = keyof typeof SolidIcons | keyof typeof OutlineIcons;
   export type FAIconName = keyof typeof FA;
-  export type UnifiedIconName = IconName | TablerIconName | FAIconName;
+  export type UnifiedIconName = TablerIconName | IconName | FAIconName;
   export function isHeroIcon(name: UnifiedIconName): name is keyof typeof SolidIcons | keyof typeof OutlineIcons;
   export function isTablerIcon(name: UnifiedIconName): name is TablerIconName;
   export function isFAIcon(name: UnifiedIconName): name is keyof typeof FA;
   export function isUnifiedIconName(name: UnifiedIconName): name is UnifiedIconName;
-  export interface IDynamicIconProps extends React.ComponentProps<"i"> {
+  export interface IDynamicIconProps extends React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement> {
       icon: UnifiedIconName;
       className?: ClassNameWithAutocomplete;
       outline?: boolean;
@@ -324,7 +324,7 @@ declare module '@agility/plenum-ui/stories/atoms/icons/TablerIcon' {
   import React from "react";
   import { TablerIconName } from "@agility/plenum-ui/stories/atoms/icons/tablerIconNames";
   import { ClassNameWithAutocomplete } from "@/utils/types";
-  export interface ITablerIconProps extends React.ComponentProps<"i"> {
+  export interface ITablerIconProps extends React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement> {
       icon: TablerIconName;
       className?: ClassNameWithAutocomplete;
   }
@@ -401,13 +401,10 @@ declare module '@agility/plenum-ui/stories/atoms/loaders/index' {
 }
 declare module '@agility/plenum-ui/stories/index' {
   import { IAvatarProps, IBadgeProps, IButtonProps, ICapsuleProps, IDynamicIconProps, IIconWithShadowProps, ILoaderProps, IRadialProgressProps, UnifiedIconName, IconName, FAIconName, BTNActionType, Avatar, Badge, Button, Capsule, DynamicIcon, IconWithShadow, Loader, RadialProgress, isFAIcon, isHeroIcon, isTablerIcon, isUnifiedIconName } from "@agility/plenum-ui/stories/atoms/index";
-  import { ICheckboxProps, IComboboxProps, IInputFieldProps, IInputLabelProps, INestedInputButtonProps, IRadioProps, ISelectProps, ITextareaProps, IToggleSwitchProps, AcceptedInputTypes, Checkbox, Combobox, InputField, InputLabel, NestedInputButton, Radio, Select, Textarea, ToggleSwitch, TextInput, ITextInputProps } from "@agility/plenum-ui/stories/molecules/index";
-  import { IAnimatedLabelInputProps, IButtonDropdownProps, IDropdownClassnames, IDropdownProps, IEmptySectionPlaceholderProps, IItemProp, IFormInputWithAddonsProps, AnimatedLabelInput, ButtonDropdown, Dropdown, EmptySectionPlaceholder, FormInputWithAddons, TextInputSelect, ITextInputSelectProps } from "@agility/plenum-ui/stories/organisms/index";
-  export type { IAvatarProps, IBadgeProps, IButtonProps, ICapsuleProps, ITextInputSelectProps, IDynamicIconProps, IIconWithShadowProps, ILoaderProps, IRadialProgressProps, ICheckboxProps, IComboboxProps, IInputFieldProps, IInputLabelProps, INestedInputButtonProps, IRadioProps, ISelectProps, ITextareaProps, IToggleSwitchProps, AcceptedInputTypes, IAnimatedLabelInputProps, IButtonDropdownProps, IDropdownClassnames, IDropdownProps, IEmptySectionPlaceholderProps, IItemProp, IFormInputWithAddonsProps, UnifiedIconName, IconName, FAIconName, BTNActionType, ITextInputProps };
-  export { Avatar, Checkbox, Combobox, InputField, InputLabel, NestedInputButton, Radio, Select, Textarea, ToggleSwitch, AnimatedLabelInput, ButtonDropdown, Dropdown, EmptySectionPlaceholder, FormInputWithAddons, Badge, Button, Capsule, DynamicIcon, IconWithShadow, Loader, RadialProgress, isFAIcon, isHeroIcon, isTablerIcon, isUnifiedIconName, TextInput, TextInputSelect };
-
-}
-declare module '@agility/plenum-ui/stories/layouts/index' {
+  import { ICheckboxProps, IComboboxProps, IInputFieldProps, IInputLabelProps, INestedInputButtonProps, IRadioProps, ISelectProps, ITextareaProps, IToggleSwitchProps, AcceptedInputTypes, Checkbox, Combobox, InputField, InputLabel, NestedInputButton, Radio, Select, Textarea, ToggleSwitch, TextInput, ITextInputProps, ISimpleSelectOptions } from "@agility/plenum-ui/stories/molecules/index";
+  import { IAnimatedLabelInputProps, AnimatedLabelTextArea, IAnimatedLabelTextAreaProps, IButtonDropdownProps, IDropdownProps, IEmptySectionPlaceholderProps, IItemProp, IFormInputWithAddonsProps, AnimatedLabelInput, ButtonDropdown, Dropdown, EmptySectionPlaceholder, FormInputWithAddons, TextInputSelect, ITextInputSelectProps } from "@agility/plenum-ui/stories/organisms/index";
+  export type { IAvatarProps, IBadgeProps, IButtonProps, ICapsuleProps, ITextInputSelectProps, IDynamicIconProps, IIconWithShadowProps, ILoaderProps, IRadialProgressProps, ICheckboxProps, IComboboxProps, IInputFieldProps, IInputLabelProps, INestedInputButtonProps, IRadioProps, ISelectProps, ITextareaProps, IToggleSwitchProps, AcceptedInputTypes, IAnimatedLabelInputProps, IAnimatedLabelTextAreaProps, IButtonDropdownProps, IDropdownProps, IEmptySectionPlaceholderProps, IItemProp, IFormInputWithAddonsProps, UnifiedIconName, IconName, FAIconName, BTNActionType, ITextInputProps, ISimpleSelectOptions };
+  export { Avatar, Checkbox, Combobox, InputField, InputLabel, NestedInputButton, Radio, Select, Textarea, ToggleSwitch, AnimatedLabelInput, AnimatedLabelTextArea, ButtonDropdown, Dropdown, EmptySectionPlaceholder, FormInputWithAddons, Badge, Button, Capsule, DynamicIcon, IconWithShadow, Loader, RadialProgress, isFAIcon, isHeroIcon, isTablerIcon, isUnifiedIconName, TextInput, TextInputSelect };
 
 }
 declare module '@agility/plenum-ui/stories/molecules/index' {
@@ -437,13 +434,13 @@ declare module '@agility/plenum-ui/stories/molecules/inputs/InputCounter/index'
 declare module '@agility/plenum-ui/stories/molecules/inputs/InputField/InputField' {
   import React from "react";
   export type AcceptedInputTypes = "date" | "datetime-local" | "email" | "month" | "number" | "password" | "search" | "submit" | "tel" | "text" | "url" | "currency";
-  export interface IInputFieldProps extends React.ComponentPropsWithoutRef<"input"> {
+  export interface IInputFieldProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "onChange"> {
       /** Callback on change */
       handleChange: (value: string) => void;
       /** Input ID*/
-      id: string;
+      id?: string;
       /** Input Name */
-      name: string;
+      name?: string;
       /** Force the focus state on the input */
       isFocused?: boolean;
       /** Error condition */
@@ -460,11 +457,11 @@ declare module '@agility/plenum-ui/stories/molecules/inputs/InputField/InputFiel
       required?: boolean;
       /** use input psuedo classes for :valid and :invalid styles. on by default */
       clientSideCheck?: boolean;
-      /**ref for input */
-      ref?: React.Ref<HTMLInputElement>;
+      /** Placeholder text */
+      placeholder?: string;
   }
-  const InputField: React.FC<IInputFieldProps>;
-  export default InputField;
+  const _InputField: React.ForwardRefExoticComponent<IInputFieldProps & React.RefAttributes<HTMLInputElement>>;
+  export default _InputField;
 
 }
 declare module '@agility/plenum-ui/stories/molecules/inputs/InputField/index' {
@@ -554,7 +551,7 @@ declare module '@agility/plenum-ui/stories/molecules/inputs/TextInput/TextInput'
       /** Max length of input character  */
       maxLength?: number;
       /** Callback on change */
-      onChange(value: string): void;
+      handleChange(value: string): void;
       /** input value */
       value: string;
       /**Placeholder input text*/
@@ -597,6 +594,8 @@ declare module '@agility/plenum-ui/stories/molecules/inputs/checkbox/Checkbox' {
       hasBorder?: boolean;
       /** any arbitrary classNames to add to the wrapper */
       className?: string;
+      /** Label ClassName */
+      labelClassName?: string;
   }
   /** Comment */
   const Checkbox: FC<ICheckboxProps>;
@@ -732,10 +731,10 @@ declare module '@agility/plenum-ui/stories/molecules/inputs/radio/index' {
 }
 declare module '@agility/plenum-ui/stories/molecules/inputs/select/Select' {
   import React from "react";
-  export type ISimpleSelectOptions = {
+  export interface ISimpleSelectOptions {
       label: string;
       value: string;
-  };
+  }
   export interface ISelectProps {
       /** Label */
       label?: string;
@@ -755,19 +754,12 @@ declare module '@agility/plenum-ui/stories/molecules/inputs/select/Select' {
       isRequired?: boolean;
       value?: string;
       className?: string;
+      onFocus?: () => void;
+      onBlur?: () => void;
   }
   const Select: React.FC<ISelectProps>;
   export default Select;
 
-}
-declare module '@agility/plenum-ui/stories/molecules/inputs/select/Select.stories' {
-  import type { Meta, StoryObj } from "@storybook/react";
-  import Select from "@agility/plenum-ui/stories/molecules/inputs/select/Select";
-  const meta: Meta<typeof Select>;
-  type Story = StoryObj<typeof Select>;
-  export const DefaultSelect: Story;
-  export default meta;
-
 }
 declare module '@agility/plenum-ui/stories/molecules/inputs/select/index' {
   import Select, { ISelectProps, ISimpleSelectOptions } from "@agility/plenum-ui/stories/molecules/inputs/select/Select";
@@ -777,13 +769,17 @@ declare module '@agility/plenum-ui/stories/molecules/inputs/select/index' {
 }
 declare module '@agility/plenum-ui/stories/molecules/inputs/textArea/TextArea' {
   import React from "react";
+  interface ILabelProps extends React.DetailedHTMLProps<React.LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement> {
+      display: string;
+      htmlFor?: string;
+  }
   export interface ITextareaProps extends Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, "onChange"> {
       /** Input ID */
       id?: string;
       /** Input Name */
       name?: string;
       /** Label for the input */
-      label?: string;
+      label?: ILabelProps;
       /** Error state */
       isError?: boolean;
       /** If field is required */
@@ -812,15 +808,6 @@ declare module '@agility/plenum-ui/stories/molecules/inputs/textArea/TextArea' {
   const Textarea: React.FC<ITextareaProps>;
   export default Textarea;
 
-}
-declare module '@agility/plenum-ui/stories/molecules/inputs/textArea/TextArea.stories' {
-  import type { Meta, StoryObj } from "@storybook/react";
-  import Textarea from "@agility/plenum-ui/stories/molecules/inputs/textArea/TextArea";
-  const meta: Meta<typeof Textarea>;
-  type Story = StoryObj<typeof Textarea>;
-  export const DefaultTextarea: Story;
-  export default meta;
-
 }
 declare module '@agility/plenum-ui/stories/molecules/inputs/textArea/index' {
   import TextArea, { ITextareaProps } from "@agility/plenum-ui/stories/molecules/inputs/textArea/TextArea";
@@ -831,19 +818,22 @@ declare module '@agility/plenum-ui/stories/molecules/inputs/textArea/index' {
 declare module '@agility/plenum-ui/stories/molecules/inputs/toggleSwitch/ToggleSwitch' {
   import React from "react";
   import { IDynamicIconProps } from "@/stories/atoms";
+  interface ToggleSwitchLabel {
+      text: string | JSX.Element;
+      className?: string;
+      xPosition?: "left" | "right";
+  }
   export interface IToggleSwitchProps {
       isChecked: boolean;
       onChange: (isChecked: boolean) => void;
-      label?: {
-          text: string | JSX.Element;
-          className?: string;
-          xPosition?: "left" | "right";
-      };
-      screenReaderLabel: string;
+      label?: ToggleSwitchLabel;
+      screenReaderLabel?: string;
       name: string;
       id: string;
-      variant: "base" | "short";
+      variant?: "base" | "short";
       withIcon?: IDynamicIconProps;
+      disabled?: boolean;
+      groupClassName?: string;
   }
   const ToggleSwitch: React.FC<IToggleSwitchProps>;
   export default ToggleSwitch;
@@ -858,19 +848,19 @@ declare module '@agility/plenum-ui/stories/molecules/inputs/toggleSwitch/index'
 declare module '@agility/plenum-ui/stories/organisms/AnimatedLabelInput/AnimatedLabelInput' {
   import React from "react";
   import { IInputFieldProps } from "@/stories/molecules/inputs/InputField";
-  import { ITextareaProps } from "@/stories/molecules/inputs/textArea/TextArea";
-  interface ILabelProps extends React.ComponentPropsWithoutRef<"label"> {
+  interface ILabelProps extends React.DetailedHTMLProps<React.LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement> {
       display: string;
   }
-  export interface IAnimatedLabelInputProps {
+  export interface IAnimatedLabelInputProps extends Omit<IInputFieldProps, "handleChange"> {
       id: string;
       containerStyles?: string;
       message?: string;
-      input?: IInputFieldProps;
-      textarea?: ITextareaProps;
       required?: boolean;
       isError?: boolean;
+      isShowCounter?: boolean;
+      maxLength?: number;
       label: ILabelProps;
+      handleChange: (value: string) => void;
   }
   const AnimatedLabelInput: React.FC<IAnimatedLabelInputProps>;
   export default AnimatedLabelInput;
@@ -878,8 +868,29 @@ declare module '@agility/plenum-ui/stories/organisms/AnimatedLabelInput/Animated
 }
 declare module '@agility/plenum-ui/stories/organisms/AnimatedLabelInput/index' {
   import AnimatedLabelInput, { IAnimatedLabelInputProps } from "@agility/plenum-ui/stories/organisms/AnimatedLabelInput/AnimatedLabelInput";
-  export default AnimatedLabelInput;
   export type { IAnimatedLabelInputProps };
+  export default AnimatedLabelInput;
+
+}
+declare module '@agility/plenum-ui/stories/organisms/AnimatedLabelTextArea/AnimatedLabelTextArea' {
+  import React from "react";
+  import { ITextareaProps } from "@/stories/molecules/inputs/textArea";
+  export interface IAnimatedLabelTextAreaProps extends ITextareaProps {
+      id: string;
+      containerStyles?: string;
+      message?: string;
+      required?: boolean;
+      isError?: boolean;
+      handleChange: (value: string) => void;
+  }
+  const AnimatedLabelTextArea: React.FC<IAnimatedLabelTextAreaProps>;
+  export default AnimatedLabelTextArea;
+
+}
+declare module '@agility/plenum-ui/stories/organisms/AnimatedLabelTextArea/index' {
+  import AnimatedLabelTextArea, { IAnimatedLabelTextAreaProps } from "@agility/plenum-ui/stories/organisms/AnimatedLabelTextArea/AnimatedLabelTextArea";
+  export type { IAnimatedLabelTextAreaProps };
+  export default AnimatedLabelTextArea;
 
 }
 declare module '@agility/plenum-ui/stories/organisms/ButtonDropdown/ButtonDropdown' {
@@ -889,6 +900,7 @@ declare module '@agility/plenum-ui/stories/organisms/ButtonDropdown/ButtonDropdo
   export interface IButtonDropdownProps {
       button: IButtonProps;
       dropDown: IDropdownProps;
+      hideDivider?: boolean;
       placement?: IDropdownProps["placement"];
       offsetOptions?: IDropdownProps["offsetOptions"];
   }
@@ -909,36 +921,47 @@ declare module '@agility/plenum-ui/stories/organisms/DropdownComponent/DropdownC
   import React, { HTMLAttributes } from "react";
   import { Placement } from "@floating-ui/react";
   import { ClassNameWithAutocomplete } from "utils/types";
-  import { IDynamicIconProps, UnifiedIconName } from "@/stories/atoms/icons";
-  export interface IItemProp extends HTMLAttributes<HTMLButtonElement> {
-      icon?: IDynamicIconProps | UnifiedIconName;
+  import { IDynamicIconProps } from "@/stories/atoms/icons";
+  export interface IItemProp {
+      icon?: IDynamicIconProps;
       iconPosition?: "trailing" | "leading";
-      label: string;
+      label: string | JSX.Element;
       onClick?(): void;
       isEmphasized?: boolean;
       key: React.Key;
-  }
-  export interface IDropdownClassnames {
-      groupClassname?: ClassNameWithAutocomplete;
-      itemsClassname?: ClassNameWithAutocomplete;
-      itemClassname?: ClassNameWithAutocomplete;
-      activeItemClassname?: ClassNameWithAutocomplete;
-      buttonClassname?: ClassNameWithAutocomplete;
+      iconObj?: JSX.Element;
   }
   export interface IDropdownProps extends HTMLAttributes<HTMLDivElement> {
       items: IItemProp[][];
       label: string;
       CustomDropdownTrigger?: React.ReactNode;
       id: string;
-      classNames?: IDropdownClassnames;
+      groupClassname?: ClassNameWithAutocomplete;
+      itemsClassname?: ClassNameWithAutocomplete;
+      itemClassname?: ClassNameWithAutocomplete;
+      activeItemClassname?: ClassNameWithAutocomplete;
+      buttonClassname?: ClassNameWithAutocomplete;
+      iconClassname?: ClassNameWithAutocomplete;
+      iconSpacingClassname?: ClassNameWithAutocomplete;
       placement?: Placement;
       offsetOptions?: Partial<{
           mainAxis: number;
           crossAxis: number;
           alignmentAxis: number | null;
       }>;
+      disabled?: boolean;
+      onFocus?: () => void;
+      onBlur?: () => void;
   }
-  export const defaultClassNames: IDropdownClassnames;
+  export const defaultClassNames: {
+      groupClassname: string;
+      itemsClassname: string;
+      itemClassname: string;
+      activeItemClassname: string;
+      buttonClassname: string;
+      iconClassname: string;
+      iconSpacingClassname: string;
+  };
   /** Comment */
   const Dropdown: React.FC<IDropdownProps>;
   export default Dropdown;
@@ -951,8 +974,8 @@ declare module '@agility/plenum-ui/stories/organisms/DropdownComponent/dropdownI
 
 }
 declare module '@agility/plenum-ui/stories/organisms/DropdownComponent/index' {
-  import Dropdown, { IItemProp, IDropdownClassnames, IDropdownProps, defaultClassNames } from "@agility/plenum-ui/stories/organisms/DropdownComponent/DropdownComponent";
-  export type { IItemProp, IDropdownClassnames, IDropdownProps };
+  import Dropdown, { IItemProp, IDropdownProps, defaultClassNames } from "@agility/plenum-ui/stories/organisms/DropdownComponent/DropdownComponent";
+  export type { IItemProp, IDropdownProps };
   export { defaultClassNames };
   export default Dropdown;
 
@@ -981,8 +1004,8 @@ declare module '@agility/plenum-ui/stories/organisms/EmptySectionPlaceholder/Emp
 }
 declare module '@agility/plenum-ui/stories/organisms/EmptySectionPlaceholder/index' {
   import EmptySectionPlaceholder, { IEmptySectionPlaceholderProps } from "@agility/plenum-ui/stories/organisms/EmptySectionPlaceholder/EmptySectionPlaceholder";
-  export default EmptySectionPlaceholder;
   export type { IEmptySectionPlaceholderProps };
+  export default EmptySectionPlaceholder;
 
 }
 declare module '@agility/plenum-ui/stories/organisms/FormInputWithAddons/FormInputWithAddons' {
@@ -1093,13 +1116,14 @@ declare module '@agility/plenum-ui/stories/organisms/TextInputSelect/index' {
 }
 declare module '@agility/plenum-ui/stories/organisms/index' {
   import AnimatedLabelInput, { IAnimatedLabelInputProps } from "@agility/plenum-ui/stories/organisms/AnimatedLabelInput/index";
+  import AnimatedLabelTextArea, { IAnimatedLabelTextAreaProps } from "@agility/plenum-ui/stories/organisms/AnimatedLabelTextArea/index";
   import ButtonDropdown, { IButtonDropdownProps } from "@agility/plenum-ui/stories/organisms/ButtonDropdown/index";
-  import Dropdown, { IDropdownClassnames, IDropdownProps, IItemProp } from "@agility/plenum-ui/stories/organisms/DropdownComponent/index";
+  import Dropdown, { IDropdownProps, IItemProp } from "@agility/plenum-ui/stories/organisms/DropdownComponent/index";
   import EmptySectionPlaceholder, { IEmptySectionPlaceholderProps } from "@agility/plenum-ui/stories/organisms/EmptySectionPlaceholder/index";
   import FormInputWithAddons, { IFormInputWithAddonsProps } from "@agility/plenum-ui/stories/organisms/FormInputWithAddons/index";
   import TextInputSelect, { ITextInputSelectProps } from "@agility/plenum-ui/stories/organisms/TextInputSelect/index";
-  export type { IAnimatedLabelInputProps, IButtonDropdownProps, IDropdownClassnames, IDropdownProps, IEmptySectionPlaceholderProps, IItemProp, IFormInputWithAddonsProps, ITextInputSelectProps };
-  export { AnimatedLabelInput, ButtonDropdown, Dropdown, EmptySectionPlaceholder, FormInputWithAddons, TextInputSelect };
+  export type { IAnimatedLabelInputProps, IAnimatedLabelTextAreaProps, IButtonDropdownProps, IDropdownProps, IEmptySectionPlaceholderProps, IItemProp, IFormInputWithAddonsProps, ITextInputSelectProps };
+  export { AnimatedLabelInput, AnimatedLabelTextArea, ButtonDropdown, Dropdown, EmptySectionPlaceholder, FormInputWithAddons, TextInputSelect };
 
 }
 declare module '@agility/plenum-ui/utils/types' {