@neo4j-ndl/react 2.16.26 → 3.0.0-alpha-9886872

package/lib/types/layout/Flex.d.ts

@@ -19,16 +19,11 @@
  *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
 
-import React, { type ComponentPropsWithoutRef } from 'react';
-import { type CustomElementType, type Radius, type Spacing } from './types';
+import React from 'react';
+import { type Radius, type Spacing } from './types';
+import { type PolymorphicComponentPropsWithRef } from '../_common/types';
 type AllowedFlexElements = 'div' | 'span' | 'ul' | 'ol' | 'li';
-type BaseFlexProps<T extends CustomElementType> = {
-    /**
-     * The DOM element to render as the Flex,
-     * meaning the root node of the children collection.
-     * @default div
-     */
-    as?: AllowedFlexElements;
+type BaseFlexProps = {
     /**
      * @default tokens.space['4']
      */
@@ -70,9 +65,9 @@ type BaseFlexProps<T extends CustomElementType> = {
      */
     alignItems?: React.CSSProperties['alignItems'];
     children?: React.ReactNode;
+    style?: React.CSSProperties;
 };
-export type FlexProps<T extends CustomElementType> = Omit<ComponentPropsWithoutRef<T>, 'as'> & BaseFlexProps<T>;
-type FlexComponent = <T extends CustomElementType>(props: FlexProps<T>) => React.ReactNode;
+type FlexComponent = <T extends AllowedFlexElements = 'div'>(props: PolymorphicComponentPropsWithRef<T, BaseFlexProps>) => React.ReactNode | null;
 /**
  * Flex is a general-purpose container that helps
  * lay out components with consistent spacing in a row or column.

package/lib/types/loading-spinner/LoadingSpinner.d.ts

@@ -19,6 +19,7 @@
  *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
 import React from 'react';
+import { type HtmlAttributes } from '../_common/types';
 /**
  *
  *
@@ -29,6 +30,7 @@ import React from 'react';
 export type LoadingSpinnerProps = {
     size?: 'small' | 'medium' | 'large';
     className?: string;
+    htmlAttributes?: HtmlAttributes<'div'>;
 };
 /**
  *

package/lib/types/modal/Modal.d.ts

@@ -19,13 +19,13 @@
  *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
 import React from 'react';
-import { type ComponentPropsWithoutRefAsObj } from '../helpers';
+import { type HtmlAttributes } from '../_common/types';
 export declare enum ModalCloseReason {
     BACKDROP_CLICK = "backdropClick",
     ESCAPE_KEY_DOWN = "escapeKeyDown"
 }
 export interface ModalProps {
-    open: boolean;
+    isOpen: boolean;
     children: React.ReactNode;
     /**
      * We provide convenient default sizes for the modal,
@@ -36,8 +36,10 @@ export interface ModalProps {
     container?: Element;
     onClose?: (e: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>, reason?: ModalCloseReason) => void;
     /** Forwards the props to the modal container's wrapper - use with caution */
-    rootProps?: ComponentPropsWithoutRefAsObj<'div'>;
+    rootProps?: HtmlAttributes<'div'>;
     /** Forwards the props to the modal container */
-    modalProps?: ComponentPropsWithoutRefAsObj<'div'>;
+    modalProps?: HtmlAttributes<'div'>;
+    /** HTML attributes */
+    htmlAttributes?: HtmlAttributes<'div'>;
 }
 export declare const Modal: React.ForwardRefExoticComponent<ModalProps & React.RefAttributes<HTMLDivElement>>;

package/lib/types/popover/Popover.d.ts

@@ -18,72 +18,43 @@
  *  You should have received a copy of the GNU General Public License
  *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
-import React, { type ComponentProps } from 'react';
-import FocusLock from 'react-focus-lock';
-/**
- * A modified version of the Material UI (@mui/material) Popover component.
- * We use a modified/slimmed version for easier maintenance.
- *
- * See the LICENSES.txt file for license for @mui/material
- */
-type ElementBase = Omit<React.HTMLProps<HTMLElement>, 'as' | 'size'> & {
-    /** Override the root element rendered for the component */
-    as?: string | React.ComponentType<any>;
+import React from 'react';
+import { type OffsetOptions } from '@floating-ui/react';
+export type PlacementOptions = 'bottom-end-top-end' | 'bottom-start-top-start' | 'bottom-middle-top-middle' | 'top-end-bottom-end' | 'top-start-bottom-start' | 'top-middle-bottom-middle' | 'bottom-start-bottom-end' | 'top-start-top-end' | 'middle-start-middle-end' | 'bottom-end-bottom-start' | 'top-end-top-start' | 'middle-end-middle-start';
+export interface PopoverProps {
+    /** if the popover is open */
+    isOpen?: boolean;
+    children: React.ReactNode;
+    /** Can be used if the anchor should be separated from the trigger */
+    anchorElement?: Element | null;
+    /** The placement of the floating element is determined by two sets of words. The first set of words specifies the point on the anchor element where the floating element will be attached. The second set of coordinates specifies the point on the floating element that will attach to the anchor element.*/
+    placement?: PlacementOptions;
+    /** can take either a number, an object or a function. Full documentation here:  https://floating-ui.com/docs/offset   */
+    offset?: OffsetOptions;
+    /**  Called when the floating element is opened or closed */
+    onOpenChange?: (isOpen: boolean, event?: Event) => void;
+    /** Use anchorEl for portal's container. Should be used if the popover is inside an Dialog */
+    hasAnchorPortal?: boolean;
+    /** If the popover should constrain the focus inside the popover while open */
+    shouldCaptureFocus?: boolean;
+    /** The role of the popover */
+    role?: 'tooltip' | 'dialog' | 'alertdialog' | 'menu' | 'listbox' | 'grid' | 'tree';
+}
+export declare const usePopoverContext: () => import("./use-popover").UsePopoverReturn;
+export declare const Popover: {
+    ({ children, anchorElement, placement, isOpen, offset, hasAnchorPortal, shouldCaptureFocus, onOpenChange, role, }: PopoverProps): import("react/jsx-runtime").JSX.Element;
+    Trigger: React.ForwardRefExoticComponent<PopoverTriggerProps & React.RefAttributes<HTMLElement>>;
+    Content: React.ForwardRefExoticComponent<{
+        htmlAttributes?: import("../_common/types").HtmlAttributes<React.ElementType<any>> | undefined;
+        as?: React.ElementType<any> | undefined;
+    } & PopoverContentProps & React.RefAttributes<unknown>>;
 };
-type Vertical = 'top' | 'bottom';
-type Horizontal = 'left' | 'right' | 'center';
-export interface PopoverProps extends ElementBase {
-    open: boolean;
-    children: React.ReactNode | string;
-    /** The element the menu should attach to */
-    anchorEl?: HTMLElement | React.RefObject<HTMLElement> | null;
-    /**
-     * The position on the anchor element
-     * that the menu should attach to
-     *
-     *      +-----------------+
-     *      |                 |
-     *      | Popover         | +--Transform Origin
-     *      | Parent Element  | |  top, left
-     *      |                 | |
-     *      +-----------------+ |
-     *                        | +-------------+
-     *      Anchor Origin ----+ |  Popped     |
-     *      bottom,right        |  Element    |
-     *                          +-------------+
-     *
-     */
-    anchorOrigin?: {
-        vertical: Vertical;
-        horizontal: Horizontal;
-    };
-    /** The position on the menu element that should attach to the anchorOrigin point
-     on the anchorEl */
-    transformOrigin?: {
-        vertical: Vertical;
-        horizontal: Horizontal;
-    };
-    /** The offset number in px of the transform origin point relative to the anchor origin point */
-    transformOriginOffsetFromAnchorOrigin?: {
-        vertical: number;
-        horizontal: number;
-    };
-    onClose?: (e: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>) => void;
-    /** Additional classes */
+export interface PopoverTriggerProps {
+    children: React.ReactNode;
+    hasButtonWrapper?: boolean;
+}
+export interface PopoverContentProps {
+    children: React.ReactNode;
     className?: string;
-    /** Whether the menu is nested. IE is this menu a sub menu */
-    nested?: boolean;
-    /** Disable backdrop -  Allows event capturing - and pointer events to pass to elements below */
-    disableBackdrop?: boolean;
-    /** Use anchorEl for portal's container */
-    anchorPortal?: boolean;
-    /** If the popover should constrain the focus inside the popover while open */
-    captureFocus?: boolean;
-    /**
-     * Props to pass to the FocusLock component
-     * @see https://github.com/theKashey/react-focus-lock
-     */
-    focusLockProps?: ComponentProps<typeof FocusLock>;
+    style?: React.CSSProperties;
 }
-export declare const Popover: React.ForwardRefExoticComponent<Omit<PopoverProps, "ref"> & React.RefAttributes<unknown>>;
-export {};

package/lib/types/popover/index.d.ts

@@ -19,3 +19,7 @@
  *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
 export * from './Popover';
+import { type PopoverOptions } from './use-popover';
+export type { PopoverOptions };
+import { type OffsetOptions, type Placement } from '@floating-ui/react';
+export type { OffsetOptions as PopoverOffsetOptions, Placement as PopoverPlacement, };

package/lib/types/popover/use-popover.d.ts

@@ -0,0 +1,44 @@
+/**
+ *
+ *  Copyright (c) "Neo4j"
+ *  Neo4j Sweden AB [http://neo4j.com]
+ *
+ *  This file is part of Neo4j.
+ *
+ *  Neo4j is free software: you can redistribute it and/or modify
+ *  it under the terms of the GNU General Public License as published by
+ *  the Free Software Foundation, either version 3 of the License, or
+ *  (at your option) any later version.
+ *
+ *  This program is distributed in the hope that it will be useful,
+ *  but WITHOUT ANY WARRANTY; without even the implied warranty of
+ *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ *  GNU General Public License for more details.
+ *
+ *  You should have received a copy of the GNU General Public License
+ *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
+ */
+import { type OffsetOptions, type Placement, useFloating, type UseInteractionsReturn } from '@floating-ui/react';
+export interface PopoverOptions {
+    isInitialOpen?: boolean;
+    placement?: Placement;
+    isOpen?: boolean;
+    onOpenChange?: (open: boolean, event?: Event) => void;
+    offsetOption?: OffsetOptions;
+    anchorElement?: Element | null;
+    anchorElementAsPortalAnchor?: boolean;
+    shouldCaptureFocus?: boolean;
+    role?: 'tooltip' | 'dialog' | 'alertdialog' | 'menu' | 'listbox' | 'grid' | 'tree';
+}
+export interface UsePopoverReturn extends UseInteractionsReturn, ReturnType<typeof useFloating> {
+    isOpen: boolean;
+    setIsOpen: (isOpen: boolean) => void;
+    labelId: string | undefined;
+    descriptionId: string | undefined;
+    transitionStyles: React.CSSProperties;
+    setLabelId: (labelId: string | undefined) => void;
+    setDescriptionId: (descriptionId: string | undefined) => void;
+    anchorElementAsPortalAnchor: boolean | undefined;
+    shouldCaptureFocus: boolean | undefined;
+}
+export declare function usePopover({ isInitialOpen, placement, isOpen: controlledOpen, onOpenChange: setControlledOpen, offsetOption, anchorElement, anchorElementAsPortalAnchor, shouldCaptureFocus, role: roleProp, }?: PopoverOptions): UsePopoverReturn;

package/lib/types/portal/Portal.d.ts

@@ -20,7 +20,7 @@
  */
 
 interface PortalProps {
-    children: React.ReactNode | null;
+    children: React.ReactNode;
     container?: Element;
 }
 export declare const Portal: (props: PortalProps) => JSX.Element;

package/lib/types/progress-bar/ProgressBar.d.ts

@@ -19,10 +19,13 @@
  *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
 import React from 'react';
-export interface ProgressBarProps extends Omit<React.HTMLProps<HTMLDivElement>, 'size'> {
+import { type HtmlAttributes } from '../_common/types';
+export interface ProgressBarProps {
     heading?: string;
     value: number;
     size: 'small' | 'large';
     className?: string;
+    /** HTML attributes */
+    htmlAttributes?: HtmlAttributes<'div'>;
 }
-export declare const ProgressBar: React.ForwardRefExoticComponent<Omit<ProgressBarProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const ProgressBar: React.ForwardRefExoticComponent<ProgressBarProps & React.RefAttributes<HTMLDivElement>>;

package/lib/types/segmented-control/SegmentedControl.d.ts

@@ -19,9 +19,10 @@
  *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
 import React from 'react';
-import { type ElementBase } from '../helpers';
+import { type PolymorphicComponentPropsWithRef } from '../_common/types';
 type SegmentedControlID = string | number;
-export interface SegmentedControlProps<T extends SegmentedControlID> extends ElementBase {
+export interface SegmentedControlProps<T extends SegmentedControlID> {
+    className?: string;
     /** Size of the selector */
     size?: 'small' | 'large';
     /** If selector items will include only icons (makes controls rectangular) */
@@ -34,11 +35,18 @@ export interface SegmentedControlProps<T extends SegmentedControlID> extends Ele
     /** Currently selected option */
     selected: T;
     children: React.ReactNode | string;
+    /** If the component is in a floating state*/
+    isFloating?: boolean;
 }
-declare const SegmentedControl: (<T extends SegmentedControlID>(props: SegmentedControlProps<T> & React.RefAttributes<unknown>) => React.ReactElement | null) & {
-    Item: React.ForwardRefExoticComponent<Omit<React.HTMLProps<HTMLElement>, "as" | "selected" | "size" | "onChange" | "ref"> & {
-        as?: string | React.ComponentType<any>;
+type SegmentControlComponent = <U extends SegmentedControlID, T extends React.ElementType = 'div'>(props: PolymorphicComponentPropsWithRef<T, SegmentedControlProps<U>>) => React.ReactNode | null;
+declare const SegmentedControl: SegmentControlComponent & {
+    Item: React.ForwardRefExoticComponent<{
+        htmlAttributes?: import("../_common/types").HtmlAttributes<React.ElementType<any>> | undefined;
+        as?: React.ElementType<any> | undefined;
     } & {
+        as?: string | React.ComponentType<any>;
+        className?: string;
+        children?: React.ReactNode;
         value: string;
     } & React.RefAttributes<unknown>>;
 };

package/lib/types/side-navigation/SideNavigation.d.ts

@@ -19,42 +19,58 @@
  *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
 import React from 'react';
-import { type ElementBase } from '../helpers';
+import { type PolymorphicComponent, type PolymorphicComponentPropsWithRef, type HtmlAttributes } from '../_common/types';
 type SideNavigationPosition = 'left' | 'right';
 type SideNavigationSize = 'small' | 'large';
-interface SideNavigationProps extends ElementBase<HTMLDivElement> {
+interface SideNavigationProps {
     /** True if the menu is expanded. */
-    expanded: boolean;
+    isExpanded: boolean;
     /** What to do on expanded change. */
-    onExpandedChange?: (expanded: boolean) => void;
+    onExpandedChange?: (isExpanded: boolean) => void;
     /** True if icons will be used in the menu. */
-    iconMenu?: boolean;
+    hasIconMenu?: boolean;
     /** Position. */
     position?: SideNavigationPosition;
     /** Size of the component */
     size?: SideNavigationSize;
+    /** HTML attributes */
+    htmlAttributes?: HtmlAttributes<'div'>;
+    children?: React.ReactNode;
+    className?: string;
 }
-export type SideNavigationListProps = ElementBase<HTMLUListElement>;
-export interface SideNavigationItemProps extends ElementBase<HTMLAnchorElement> {
+export type SideNavigationListProps = {
+    className?: string;
+    children?: React.ReactNode;
+    /** HTML attributes */
+    htmlAttributes?: HtmlAttributes<'ul'>;
+};
+export interface SideNavigationItemProps {
     icon?: React.ReactNode;
     children?: React.ReactNode;
-    selected?: boolean;
+    isSelected?: boolean;
     /** Flag to indicate if the side navigation item can be selected or not */
-    selectable?: boolean;
+    isSelectable?: boolean;
+    className?: string;
+    style?: React.CSSProperties;
 }
-export interface SideNavigationItemBadgeProps extends Omit<ElementBase<HTMLSpanElement>, 'as'> {
+type SideNavigationItemComponent = <T extends React.ElementType = 'a'>(props: PolymorphicComponentPropsWithRef<T, SideNavigationItemProps>) => React.ReactNode | null;
+export interface SideNavigationItemBadgeProps {
     children?: number;
     type?: 'info' | 'warning' | 'critical';
+    /** HTML attributes */
+    htmlAttributes?: HtmlAttributes<'span'>;
+    className?: string;
+    style: React.CSSProperties;
 }
-export type SideNavigationGroupHeaderProps = ElementBase<HTMLLIElement>;
+export type SideNavigationGroupHeaderProps = {
+    children?: React.ReactNode;
+    className?: string;
+    style?: React.CSSProperties;
+};
 declare const SideNavigation: React.ForwardRefExoticComponent<SideNavigationProps & React.RefAttributes<HTMLDivElement>> & {
-    List: React.ForwardRefExoticComponent<Omit<React.HTMLProps<HTMLUListElement>, "as" | "selected" | "size" | "onChange" | "ref"> & {
-        as?: string | React.ComponentType<any>;
-    } & React.RefAttributes<HTMLUListElement>>;
-    GroupHeader: React.ForwardRefExoticComponent<Omit<React.HTMLProps<HTMLLIElement>, "as" | "selected" | "size" | "onChange" | "ref"> & {
-        as?: string | React.ComponentType<any>;
-    } & React.RefAttributes<HTMLParagraphElement>>;
-    Item: React.ForwardRefExoticComponent<SideNavigationItemProps & React.RefAttributes<any>>;
-    ItemBadge: React.ForwardRefExoticComponent<SideNavigationItemBadgeProps & React.RefAttributes<any>>;
+    List: React.ForwardRefExoticComponent<SideNavigationListProps & React.RefAttributes<HTMLUListElement>>;
+    GroupHeader: PolymorphicComponent<SideNavigationGroupHeaderProps, "li">;
+    Item: SideNavigationItemComponent;
+    ItemBadge: React.ForwardRefExoticComponent<SideNavigationItemBadgeProps & React.RefAttributes<HTMLSpanElement>>;
 };
 export { SideNavigation };

package/lib/types/slider/Slider.d.ts

@@ -19,13 +19,11 @@
  *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
 import React from 'react';
-import { type ComponentPropsWithoutRefAsObj } from '../helpers';
+import { type HtmlAttributes } from '../_common/types';
 export interface SliderPropsBase {
-    as?: string | React.ComponentType<any>;
     /** Forwards the props to the slider container's wrapper */
-    rootProps?: ComponentPropsWithoutRefAsObj<'div'>;
     /** Forwards the input element(s) of the slider */
-    inputProps?: ComponentPropsWithoutRefAsObj<'input'>;
+    inputProps?: HtmlAttributes<'input'>;
     /**
      * Which value interval will be added or removed from
      * the current value when moving the slider button.
@@ -54,6 +52,10 @@ export interface SliderPropsBase {
      * of the steps in the slider.
      */
     showSteps?: boolean;
+    /** HTML attributes */
+    htmlAttributes?: HtmlAttributes<'div'>;
+    /** Additional classnames */
+    className?: string;
 }
 type SingleSlider = SliderPropsBase & {
     type?: 'single' | undefined;
@@ -70,6 +72,7 @@ type RangeSlider = SliderPropsBase & {
      */
     values: [number, number];
     onChange: (value: [number, number]) => void;
+    className?: string;
 };
 export type SliderProps = SingleSlider | RangeSlider;
 export declare const Slider: (props: SliderProps & React.RefAttributes<HTMLDivElement>) => React.ReactElement | null;

package/lib/types/status-indicator/StatusIndicator.d.ts

@@ -19,9 +19,11 @@
  *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
 import React from 'react';
-import { type ElementBase } from '../helpers';
-export interface StatusIndicatorProps extends ElementBase<HTMLSpanElement> {
+import { type HtmlAttributes } from '../_common/types';
+export interface StatusIndicatorProps {
     /** Status indicator type. Defaults to "unknown". */
     type?: 'unknown' | 'success' | 'info' | 'warning' | 'danger';
+    htmlAttributes?: HtmlAttributes<'span'>;
+    className?: string;
 }
 export declare const StatusIndicator: React.ForwardRefExoticComponent<StatusIndicatorProps & React.RefAttributes<HTMLSpanElement>>;

package/lib/types/tabs/Tabs.d.ts

@@ -19,7 +19,7 @@
  *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
 import React from 'react';
-import { type ElementBase } from '../helpers';
+import { type PolymorphicComponentPropsWithRef } from '../_common/types';
 type TabId = string | number;
 type Size = 'small' | 'large';
 type Fill = 'underline' | 'filled';
@@ -37,23 +37,17 @@ export interface BaseTabsProps<T extends TabId> {
     fill?: Fill;
     size?: Size;
     className?: string;
-    /**
-     * Replace the component rendered to wrap the tabs
-     */
-    as?: string | React.ComponentType<any>;
 }
-interface TabProps<T extends TabId> extends ElementBase<HTMLButtonElement> {
+type TabsComponentType = <U extends TabId, T extends React.ElementType = 'div'>(props: PolymorphicComponentPropsWithRef<T, BaseTabsProps<U>>) => React.ReactNode | null;
+interface TabProps<T extends TabId> {
     tabId: T;
     children: React.ReactNode | string;
     className?: string;
-    disabled?: boolean;
-    /**
-     * Replace the component rendered as the tab
-     */
-    as?: string | React.ComponentType<any>;
+    isDisabled?: boolean;
 }
+type TabsTabComponent = <U extends TabId = TabId, T extends React.ElementType = 'div'>(props: PolymorphicComponentPropsWithRef<T, TabProps<U>>) => React.ReactNode | null;
 interface TabPanelProps {
-    children: React.ReactNode | string;
+    children: React.ReactNode;
     /**
      * The currently selected tabId. Determines if
      * this tab is visible or not
@@ -61,13 +55,10 @@ interface TabPanelProps {
     value: TabId;
     tabId: TabId;
     className?: string;
-    /**
-     * Replace the component rendered as the tab panel
-     */
-    as?: string | React.ComponentType<any>;
 }
-declare const Tabs: (<T extends TabId>(props: BaseTabsProps<T> & React.RefAttributes<unknown>) => React.ReactElement | null) & {
-    Tab: <T extends TabId = TabId>(props: TabProps<T> & React.RefAttributes<unknown>) => React.ReactElement | null;
-    TabPanel: React.ForwardRefExoticComponent<TabPanelProps & React.RefAttributes<unknown>>;
+type TabsTabPanelComponent = <T extends React.ElementType = 'div'>(props: PolymorphicComponentPropsWithRef<T, TabPanelProps>) => React.ReactNode | null;
+declare const Tabs: TabsComponentType & {
+    Tab: TabsTabComponent;
+    TabPanel: TabsTabPanelComponent;
 };
 export { Tabs };

package/lib/types/tag/Tag.d.ts

@@ -19,7 +19,7 @@
  *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
 import React from 'react';
-import { type ElementBase } from '../helpers';
+import { type HtmlAttributes } from '../_common/types';
 /**
  *
  *
@@ -27,24 +27,26 @@ import { type ElementBase } from '../helpers';
  *
  *
  */
-export interface CommonTagProps extends ElementBase {
+export interface CommonTagProps {
     children: string | React.ReactNode;
     /** Type of the tag */
     type?: 'destructive' | 'default';
     /** Size of the tag */
     size?: 'small' | 'medium' | 'large';
+    className?: string;
+    htmlAttributes?: HtmlAttributes<'div'>;
 }
-export interface RemoveableTagProps extends CommonTagProps {
+export interface RemovableTagProps extends CommonTagProps {
     /** Adds a "x" icon is set to true */
-    removeable: true;
-    /** Handler when remove icon is clicked. Required if `removeable` is true */
+    isRemovable: true;
+    /** Handler when remove icon is clicked. Required if `removable` is true */
     onRemove: (e: React.KeyboardEvent<HTMLElement> | React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
 }
 export interface NonRemovableTagProps extends CommonTagProps {
-    removeable?: false;
+    isRemovable?: false;
     onRemove?: never;
 }
-export type TagProps = RemoveableTagProps | NonRemovableTagProps;
+export type TagProps = RemovableTagProps | NonRemovableTagProps;
 /**
  *
  *

package/lib/types/{textarea/Textarea.d.ts → text-area/TextArea.d.ts}

@@ -18,8 +18,9 @@
  *  You should have received a copy of the GNU General Public License
  *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
-import { type ComponentPropsWithoutRef, type ReactNode } from 'react';
+import React, { type ReactNode } from 'react';
 import { type TooltipObjectProps } from '../_common/input/types';
+import { type HtmlAttributes } from '../_common/types';
 /**
  *
  *
@@ -27,16 +28,16 @@ import { type TooltipObjectProps } from '../_common/input/types';
  *
  *
  */
-export interface TextareaProps extends Omit<Omit<ComponentPropsWithoutRef<'textarea'>, 'nonce' | 'size'>, 'label'> {
+export interface TextAreaProps {
     /** Label text */
     label?: ReactNode;
     /** Displays with fluid width */
-    fluid?: boolean;
+    isFluid?: boolean;
     /** Help message */
     helpText?: string | ReactNode;
     /** Error message */
     errorText?: string | ReactNode;
-    /** Size of the textarea */
+    /** Size of the textArea */
     size?: 'small' | 'medium' | 'large';
     /** If the component is optional to fill in */
     isOptional?: boolean;
@@ -44,12 +45,27 @@ export interface TextareaProps extends Omit<Omit<ComponentPropsWithoutRef<'texta
     informationIconText?: React.ReactNode;
     /** Pass props to the underlying Tip component */
     tooltipProps?: TooltipObjectProps;
+    isDisabled?: boolean;
+    /** HTML attributes */
+    htmlAttributes?: HtmlAttributes<'textarea'>;
+    ariaLabel?: string;
+    /**
+     * Additional classnames will be applied to the root element.
+     */
+    className?: string;
+    /**
+     * Additional css styling. Will be applied to the root element.
+     */
+    style?: React.CSSProperties;
+    isReadOnly?: boolean;
+    value?: string;
+    placeholder?: string;
 }
 /**
  *
  *
- * Textarea Component
+ * TextArea Component
  *
  *
  */
-export declare const Textarea: import("react").ForwardRefExoticComponent<TextareaProps & import("react").RefAttributes<HTMLTextAreaElement>>;
+export declare const TextArea: React.ForwardRefExoticComponent<TextAreaProps & React.RefAttributes<HTMLTextAreaElement>>;

package/lib/types/{cypher-code-block → text-area}/index.d.ts

@@ -18,4 +18,4 @@
  *  You should have received a copy of the GNU General Public License
  *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
-export * from './CypherCodeBlock';
+export * from './TextArea';