@commercetools/nimbus 2.0.1-rc1 → 2.0.1-rc3

package/dist/draggable-list.d.ts

@@ -1,331 +0,0 @@
-import { DraggableListFieldItemData as DraggableListFieldItemData_2 } from './draggable-list.types';
-import { DraggableListFieldProps as DraggableListFieldProps_2 } from './draggable-list.types';
-import { DraggableListItemData as DraggableListItemData_2 } from './draggable-list.types';
-import { DraggableListItemProps as DraggableListItemProps_2 } from './draggable-list.types';
-import { DraggableListRootProps as DraggableListRootProps_2 } from './draggable-list.types';
-import { GridListItemProps } from 'react-aria-components';
-import { GridListProps } from 'react-aria-components';
-import { HTMLChakraProps } from '@chakra-ui/react';
-import { JSX } from 'react/jsx-runtime';
-import { Key } from 'react-aria-components';
-import { ReactNode } from 'react';
-import { Ref } from 'react';
-import { SlotRecipeProps } from '@chakra-ui/react';
-import { UnstyledProp } from '@chakra-ui/react';
-
-/**
- * DraggableList
- * ============================================================
- * A drag-and-drop list component for reordering items.
- * Built with React Aria Components for accessibility and keyboard navigation.
- *
- * Features:
- * - Drag-and-drop reordering with visual feedback
- * - Keyboard navigation support
- * - Controlled and uncontrolled modes
- * - Accessible drag-and-drop interactions
- * - Customizable item rendering
- *
- * **Important:** You must provide either an `aria-label` or `aria-labelledby`
- * prop for accessibility. The drag-and-drop functionality will not work properly
- * without an accessible label.
- *
- * @example
- * ```tsx
- * <DraggableList.Root items={items} aria-label="Task list">
- *   {(item) => (
- *     <DraggableList.Item key={item.id} id={item.id}>
- *       {item.content}
- *     </DraggableList.Item>
- *   )}
- * </DraggableList.Root>
- * ```
- *
- * @see https://react-spectrum.adobe.com/react-aria/dnd.html
- */
-export declare const DraggableList: {
-    /**
-     * # DraggableList.Root
-     *
-     * The root component that provides context and drag-and-drop functionality.
-     * Manages the state of draggable items and handles reordering logic.
-     *
-     * This component must wrap all DraggableList.Item components and provides
-     * the drag-and-drop context and reordering callbacks.
-     *
-     * Note: If your items have `key` and `label` properties, you can omit the children
-     * prop and the component will render the items automatically.
-     *
-     * @example
-     * ```tsx
-     * // With custom children
-     * <DraggableList.Root items={items} aria-label="Tasks list">
-     *   {(item) => (
-     *     <DraggableList.Item key={item.id} id={item.id}>
-     *       {item.content}
-     *     </DraggableList.Item>
-     *   )}
-     * </DraggableList.Root>
-     *
-     * // Without children (items must have key and label)
-     * <DraggableList.Root items={itemsWithKeyAndLabel} aria-label="Priority list" />
-     * ```
-     */
-    Root: <T extends DraggableListItemData_2>({ children, ref, items, onUpdateItems, removableItems, renderEmptyState: renderEmptyStateFromProps, ...restProps }: DraggableListRootProps_2<T>) => JSX.Element;
-    /**
-     * # DraggableList.Item
-     *
-     * An individual draggable item within the list.
-     * Handles drag interactions and provides visual feedback during dragging.
-     *
-     * This component represents a single item in the draggable list and supports
-     * drag handles, drag previews, and reordering interactions.
-     *
-     * @example
-     * ```tsx
-     * <DraggableList.Root items={items} aria-label="Task list">
-     *   {(item) => (
-     *     <DraggableList.Item key={item.id} id={item.id}>
-     *       <div>{item.title}</div>
-     *       <div>{item.description}</div>
-     *     </DraggableList.Item>
-     *   )}
-     * </DraggableList.Root>
-     * ```
-     */
-    Item: <T extends DraggableListItemData_2>({ children, id, onRemoveItem, textValue: textValueFromProps, ...restProps }: DraggableListItemProps_2<T>) => JSX.Element;
-    /**
-     * # DraggableList.Field
-     *
-     * A standalone form field component for DraggableList that integrates with form libraries.
-     * Provides label, error handling, and hint text support for draggable lists.
-     *
-     * This component is configured entirely through props and does not accept children.
-     * All draggable list configuration is passed via the `items` prop and related properties.
-     *
-     * @example
-     * ```tsx
-     * <DraggableList.Field
-     *   label="Priority Order"
-     *   description="Drag items to reorder"
-     *   error={errors.priorities}
-     *   items={items}
-     *   aria-label="Priority list"
-     * />
-     * ```
-     */
-    Field: <T extends DraggableListFieldItemData_2>({ label, description, error, infoBox, isRequired, isInvalid, isDisabled, isReadOnly, id, items, ...restProps }: DraggableListFieldProps_2<T>) => JSX.Element;
-};
-
-export declare type DraggableListEmptySlotProps = HTMLChakraProps<"div">;
-
-export declare const _DraggableListField: <T extends DraggableListFieldItemData>({ label, description, error, infoBox, isRequired, isInvalid, isDisabled, isReadOnly, id, items, ...restProps }: DraggableListFieldProps<T>) => JSX.Element;
-
-/**
- * Data shape for items used in DraggableList.Field
- *
- * Extends DraggableListItemData with required key and label properties.
- * This ensures all items have the necessary data for default rendering in form fields.
- *
- * @property key - Unique identifier for the item (required)
- * @property label - Display content for the item (required)
- */
-export declare type DraggableListFieldItemData = DraggableListItemData & {
-    key: string;
-    label: string;
-};
-
-/**
- * Props for the DraggableList.Field component
- *
- * A form field wrapper for DraggableList that combines the draggable list
- * functionality with form field labeling, description, and error handling.
- *
- * This component is configured via props only and does not accept children.
- * Items are rendered using their `key` and `label` properties.
- *
- * @template T - Type for item data, must extend DraggableListFieldItemData
- */
-export declare type DraggableListFieldProps<T extends DraggableListFieldItemData> = Omit<DraggableListRootProps<T>, "children" | "direction"> & Omit<FormFieldProps, "slot"> & {
-    /**
-     * The form field label (required)
-     *
-     * If a visible label is not necessary, use `DraggableList.Root`
-     */
-    label: ReactNode;
-    /**
-     * Optional description text displayed below the label
-     */
-    description?: ReactNode;
-    /**
-     * Error message to display when validation fails
-     */
-    error?: ReactNode;
-    /**
-     * Optional info box content for additional context
-     */
-    infoBox?: ReactNode;
-};
-
-export declare const _DraggableListItem: <T extends DraggableListItemData>({ children, id, onRemoveItem, textValue: textValueFromProps, ...restProps }: DraggableListItemProps<T>) => JSX.Element;
-
-export declare type DraggableListItemContentSlotProps = HTMLChakraProps<"div">;
-
-/**
- * Base data shape for draggable list items
- *
- * @property key - Unique identifier for the item (required for default rendering)
- * @property label - Display content for the item (required for default rendering)
- *
- * If either `key` or `label` are not defined, you must provide custom children
- * to the DraggableList.Root component.
- */
-export declare type DraggableListItemData = {
-    key?: string;
-    label?: ReactNode;
-} & Record<string, unknown>;
-
-/**
- * Props for the DraggableList.Item component
- *
- * The item component renders each individual item in the draggable list.
- * Supports drag-and-drop interaction and optional removal.
- *
- * @template T - Type for the item's data object
- */
-export declare type DraggableListItemProps<T extends DraggableListItemData> = Omit<GridListItemProps<T>, "className" | "onClick" | "style" | "translate"> & Omit<DraggableListItemSlotProps, "children"> & {
-    /**
-     * The unique identifier for the item
-     */
-    id?: string;
-    /**
-     * Ref to the item container element
-     */
-    ref?: Ref<HTMLDivElement>;
-    /**
-     * The content to display for this item
-     */
-    children?: ReactNode;
-    /**
-     * Callback fired when the remove button is pressed.
-     * The remove button is only rendered when this callback is provided.
-     * @param key - The key of the item being removed
-     */
-    onRemoveItem?: (key: Key) => void;
-};
-
-export declare type DraggableListItemSlotProps = HTMLChakraProps<"div">;
-
-declare type DraggableListRecipeProps = {
-    /**
-     * Size variant of the draggable list
-     * @default "md"
-     */
-    size?: SlotRecipeProps<"draggableList">["size"];
-};
-
-export declare const _DraggableListRoot: <T extends DraggableListItemData>({ children, ref, items, onUpdateItems, removableItems, renderEmptyState: renderEmptyStateFromProps, ...restProps }: DraggableListRootProps<T>) => JSX.Element;
-
-/**
- * Props for the DraggableList.Root component
- *
- * The root component that provides context and state management for the draggable list.
- * Uses React Aria's GridList for accessibility and drag-and-drop functionality.
- *
- * @template T - Type for item data displayed in the list. Items array type is `T[]`.
- */
-export declare type DraggableListRootProps<T extends DraggableListItemData> = Omit<GridListProps<T>, "autoFocus" | "className" | "style" | "translate" | "renderEmptyState"> & Omit<HTMLChakraProps<"div", SlotRecipeProps<"draggableList">>, "children" | "slot"> & {
-    /**
-     * Array of items to display in the list.
-     * If `children` is not provided, each item must have both `key` and `label` properties.
-     */
-    items?: T[];
-    /**
-     * Callback fired when the list is updated by drag-and-drop or item removal
-     * @param updatedItems - The new array of items after the update
-     */
-    onUpdateItems?: (updatedItems: T[]) => void;
-    /**
-     * Ref to the root container element
-     */
-    ref?: Ref<HTMLDivElement>;
-    /**
-     * Whether to show a remove button for each item.
-     * When an item is removed, `onUpdateItems` is called with the updated list.
-     * @default false
-     */
-    removableItems?: boolean;
-    /**
-     * Custom render function for list items.
-     * If not provided, items will be rendered using their `key` and `label` properties.
-     */
-    children?: GridListProps<T>["children"];
-    /**
-     * Content to display when the list is empty
-     * @default "drop items here"
-     */
-    renderEmptyState?: ReactNode;
-};
-
-export declare type DraggableListRootSlotProps = HTMLChakraProps<"div", DraggableListRecipeProps>;
-
-declare type FormFieldProps = FormFieldRootSlotProps & {
-    /**
-     * Form field content (label, input, description, error)
-     */
-    children?: React.ReactNode;
-    /**
-     * Whether the field is required for form submission
-     * @default false
-     */
-    isRequired?: boolean;
-    /**
-     * Whether the field has a validation error
-     * @default false
-     */
-    isInvalid?: boolean;
-    /**
-     * Whether the field is disabled
-     * @default false
-     */
-    isDisabled?: boolean;
-    /**
-     * Whether the field is read-only
-     * @default false
-     */
-    isReadOnly?: boolean;
-    /**
-     * Unique identifier for the input element
-     */
-    id?: string;
-    /**
-     * Ref forwarding to the root element
-     */
-    ref?: React.Ref<HTMLDivElement>;
-};
-
-declare type FormFieldRecipeProps = {
-    /**
-     * Size variant of the form field
-     * @default "md"
-     */
-    size?: SlotRecipeProps<"formField">["size"];
-    /**
-     * Layout direction for label and input positioning
-     * @default "column"
-     */
-    direction?: SlotRecipeProps<"formField">["direction"];
-};
-
-declare type FormFieldRootSlotProps = HTMLChakraProps<"div", FormFieldRecipeProps & UnstyledProp>;
-
-export { }
-
-
-declare module "slate" {
-    interface CustomTypes {
-        Editor: BaseEditor & ReactEditor & HistoryEditor;
-        Element: CustomElement;
-        Text: CustomText;
-    }
-}