@apple-pie/slice 0.1.42 → 0.1.44

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

@@ -1,3 +1,3 @@
 import React from 'react';
 import type { AudioBubbleProps } from './_types';
-export declare const AudioBubble: React.MemoExoticComponent<(props: AudioBubbleProps) => import("react/jsx-runtime").JSX.Element>;
+export declare const AudioBubble: React.MemoExoticComponent<(props: AudioBubbleProps) => React.JSX.Element>;

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

@@ -1,3 +1,3 @@
 import React from 'react';
 import type { AvatarProps } from './_types';
-export declare const Avatar: React.MemoExoticComponent<(props: AvatarProps) => import("react/jsx-runtime").JSX.Element>;
+export declare const Avatar: React.MemoExoticComponent<(props: AvatarProps) => React.JSX.Element>;

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

@@ -1,3 +1,3 @@
 import React from 'react';
 import type { AvatarGroupProps } from './_types';
-export declare const AvatarGroup: React.MemoExoticComponent<(props: AvatarGroupProps) => import("react/jsx-runtime").JSX.Element>;
+export declare const AvatarGroup: React.MemoExoticComponent<(props: AvatarGroupProps) => React.JSX.Element>;

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

@@ -1,3 +1,3 @@
 import React from 'react';
 import type { BadgeProps } from './_types';
-export declare const Badge: React.MemoExoticComponent<(props: BadgeProps) => import("react/jsx-runtime").JSX.Element | null>;
+export declare const Badge: React.MemoExoticComponent<(props: BadgeProps) => React.JSX.Element | null>;

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

@@ -25,8 +25,8 @@ export declare const Button: React.NamedExoticComponent<Omit<React.ButtonHTMLAtt
     bgColorDisabled?: string;
     labelColor?: string;
     labelSize?: "xs" | "s" | "m" | "l";
-    transition?: import("framer-motion").Transition;
-    variants?: import("framer-motion").Variants;
+    transition?: import("motion-dom").Transition;
+    variants?: import("motion-dom").Variants;
     initial?: string;
     animate?: string;
     exit?: string;
@@ -66,8 +66,8 @@ export declare const Button: React.NamedExoticComponent<Omit<React.ButtonHTMLAtt
     bgColorDisabled?: string;
     labelColor?: string;
     labelSize?: "xs" | "s" | "m" | "l";
-    transition?: import("framer-motion").Transition;
-    variants?: import("framer-motion").Variants;
+    transition?: import("motion-dom").Transition;
+    variants?: import("motion-dom").Variants;
     initial?: string;
     animate?: string;
     exit?: string;

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

@@ -4,8 +4,8 @@ export declare const Camera: React.NamedExoticComponent<Omit<React.HTMLAttribute
 /**
  * Custom toolbar button with labels for controlling video / audio / etc.
  */
-export declare function ToolbarButton(props: Readonly<ToolbarButtonProps>): import("react/jsx-runtime").JSX.Element;
+export declare function ToolbarButton(props: Readonly<ToolbarButtonProps>): React.JSX.Element;
 /**
  * the default poster image when no video is available
  */
-export declare function DefaultNoVideoPoster(props: Readonly<DefaultNoVideoPosterProps>): string | import("react/jsx-runtime").JSX.Element;
+export declare function DefaultNoVideoPoster(props: Readonly<DefaultNoVideoPosterProps>): string | React.JSX.Element;

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

@@ -1,3 +1,3 @@
 import React from 'react';
 import type { CheckBoxProps } from './_types';
-export declare const CheckBox: React.MemoExoticComponent<(props: CheckBoxProps) => import("react/jsx-runtime").JSX.Element>;
+export declare const CheckBox: React.MemoExoticComponent<(props: CheckBoxProps) => React.JSX.Element>;

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

@@ -1,3 +1,3 @@
 import React from 'react';
 import type { ChipProps } from './_types';
-export declare const Chip: React.MemoExoticComponent<(props: ChipProps) => import("react/jsx-runtime").JSX.Element>;
+export declare const Chip: React.MemoExoticComponent<(props: ChipProps) => React.JSX.Element>;

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

@@ -1,8 +1,13 @@
+import React from 'react';
 import type { ColumnDefinition, DataTableProps, SortKey } from './_types';
-export declare function DataTable<T>(props: Readonly<DataTableProps<T>>): import("react/jsx-runtime").JSX.Element;
+export declare function DataTable<T>(props: Readonly<DataTableProps<T>>): React.JSX.Element;
 interface DefaultHeaderRendererProps<T> {
     col: ColumnDefinition<T, unknown>;
     sortKey: SortKey<T>;
 }
-export declare function DefaultHeaderRenderer<T>(props: Readonly<DefaultHeaderRendererProps<T>>): import("react/jsx-runtime").JSX.Element;
+export declare function DefaultHeaderRenderer<T>(props: Readonly<DefaultHeaderRendererProps<T>>): React.JSX.Element;
+interface DefaultCellRendererProps<T> {
+    value: unknown;
+}
+export declare function DefaultCellRenderer<T>(props: Readonly<DefaultCellRendererProps<T>>): string;
 export {};

package/dist/types/components/DataTable/_data.d.ts

@@ -8,4 +8,5 @@ export type SampleTableData = {
     started: Date;
 };
 export declare const sampleTableData: SampleTableData[];
-export declare const sampleTableColumnDefinitions: ColumnDefinition<SampleTableData, any>[];
+export declare const moreSampleData: () => SampleTableData[];
+export declare const sampleTableColumnDefinitions: ColumnDefinition<SampleTableData>[];

package/dist/types/components/DataTable/_types.d.ts

@@ -8,7 +8,7 @@ export type HeaderContext<T, V> = {
     column: ColumnDefinition<T, V>;
     sortKey?: SortKey<T>;
 };
-export type ColumnDefinition<T, V = unknown> = {
+type ColumnBase<T, V> = {
     id: string;
     title: string;
     width?: number | string;
@@ -17,10 +17,24 @@ export type ColumnDefinition<T, V = unknown> = {
     padding?: number | string;
     nowrap?: boolean;
     sort?: keyof T;
-    accessor: (row: T) => V;
     renderHeader?: (ctx: HeaderContext<T, V>) => ReactNode;
     renderCell?: (ctx: CellContext<T, V>) => ReactNode;
 };
+type KeyColumn<T> = {
+    [K in keyof T]: ColumnBase<T, T[K]> & {
+        key: K;
+        accessor?: never;
+    };
+}[keyof T];
+export type AccessorColumn<T, V> = ColumnBase<T, V> & {
+    accessor: (row: T) => V;
+    key?: never;
+};
+type PlainColumn<T> = ColumnBase<T, undefined> & {
+    key?: never;
+    accessor?: never;
+};
+export type ColumnDefinition<T, V = unknown> = KeyColumn<T> | AccessorColumn<T, V> | PlainColumn<T>;
 export interface DataTableProps<T> {
     height: number | string;
     width: number | string;
@@ -31,9 +45,14 @@ export interface DataTableProps<T> {
     freezeColumnBackgroundColor?: string;
     headerBackgroundColor?: string;
     candyStripeBackgroundColor?: string;
+    handleHoverColor?: string;
     borderStyle?: 'box' | 'row' | 'none';
+    borderRadius?: number | string;
     borderColor?: string;
     tableData?: T[];
+    colResize?: boolean;
+    onColumnResize?: (columnId: string, width: number) => void;
+    onColumnReorder?: (columnOrder: string[]) => void;
     columnDefinitions: ColumnDefinition<T, any>[];
     getRowId?: (row: T, index: number) => string | number;
     filter?: (row: T, index: number, array: T[]) => boolean;
@@ -49,3 +68,4 @@ export type SortKey<T> = {
     key?: keyof T;
     dir: 'asc' | 'desc';
 } | undefined;
+export {};

package/dist/types/components/DataTable/_useReorderColumns.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import type { ColumnDefinition } from './_types';
+export declare function useReorderColumns<T>(columnDefinitions: ColumnDefinition<T, unknown>[], setColumnOrder: React.Dispatch<React.SetStateAction<string[] | null>>, setDraggedColId: React.Dispatch<React.SetStateAction<string | null>>, onColumnReorder: ((columnOrder: string[]) => void) | undefined, freezeColumn: boolean): {
+    dragStart: (col: ColumnDefinition<T, unknown>, e: React.DragEvent) => void;
+    dragOver: (col: ColumnDefinition<T, unknown>, colIndex: number, e: React.DragEvent<HTMLTableCellElement>) => void;
+    dragDrop: (e: React.DragEvent | DragEvent, global?: boolean) => void;
+};

package/dist/types/components/DataTable/_useReorderColumns.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/types/components/DataTable/_useResizeColumn.d.ts

@@ -0,0 +1,18 @@
+import type React from 'react';
+export type ResizeVisualElements = {
+    handle?: React.RefObject<HTMLDivElement | null> | null;
+    parent?: React.RefObject<HTMLDivElement | null> | null;
+};
+export type ResizeColElements = {
+    id: string;
+    cell: HTMLElement;
+    col: HTMLTableColElement;
+};
+export type ColRefs = React.RefObject<Record<string, HTMLTableColElement | null>>;
+export declare function useResizeColumn(elements: ResizeVisualElements, colResize: boolean, setColumnWidths: (value: React.SetStateAction<Record<string, string | number>>) => void, onColumnResize: ((columnId: string, width: number) => void) | undefined): {
+    clientX: number | undefined;
+    clientY: number | undefined;
+    resizing: boolean;
+    dragResize: (id: string, e: React.MouseEvent<HTMLDivElement>, colRefs: ColRefs) => void;
+    hoverResize: (show: boolean, e: React.MouseEvent<HTMLDivElement> | React.FocusEvent<HTMLDivElement>) => void;
+};

package/dist/types/components/DataTable/columnHelper.d.ts

@@ -1,5 +1,12 @@
-import type { ColumnDefinition } from './_types';
+import type { AccessorColumn, ColumnDefinition } from './_types';
 export declare function createColumnHelper<T>(): {
-    accessor<V>(accessor: (row: T) => V, def: Omit<ColumnDefinition<T, V>, "accessor">): ColumnDefinition<T, V>;
+    accessor<V>(accessor: (row: T) => V, def: Omit<AccessorColumn<T, V>, "accessor">): ColumnDefinition<T, V>;
 };
+export declare function resolveColumnValue<T>(col: ColumnDefinition<T, any>, row: T): any;
 export declare const resolveAlignValue: (value?: "start" | "center" | "end") => "center" | "flex-end" | "flex-start";
+export declare const resolveDragHandleXPos: (elements: {
+    cell?: HTMLElement | null;
+    handle?: HTMLDivElement | null;
+    parent?: HTMLDivElement | null;
+    position?: "left" | "right";
+}) => void;

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

@@ -1,3 +1,3 @@
 import React from 'react';
 import type { DivInputProps } from './_types';
-export declare const DivInput: React.MemoExoticComponent<(props: DivInputProps) => import("react/jsx-runtime").JSX.Element>;
+export declare const DivInput: React.MemoExoticComponent<(props: DivInputProps) => React.JSX.Element>;

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

@@ -1,3 +1,3 @@
 import React from 'react';
 import { type DotProps } from './_types';
-export declare const Dot: React.MemoExoticComponent<(props: DotProps) => import("react/jsx-runtime").JSX.Element>;
+export declare const Dot: React.MemoExoticComponent<(props: DotProps) => React.JSX.Element>;

package/dist/types/components/DraggablePanel/DrggablePanel.d.ts

@@ -30,7 +30,7 @@ type DraggablePanelBaseProps = {
     isTouchDevice?: boolean;
 };
 export type DraggablePanelProps = Omit<React.HTMLAttributes<HTMLDivElement>, keyof DraggablePanelBaseProps> & DraggablePanelBaseProps;
-export declare const DraggablePanel: React.MemoExoticComponent<(props: DraggablePanelProps) => import("react/jsx-runtime").JSX.Element>;
+export declare const DraggablePanel: React.MemoExoticComponent<(props: DraggablePanelProps) => React.JSX.Element>;
 export type DragHandleProps = {
     width?: number;
     height?: number;
@@ -39,5 +39,5 @@ export type DragHandleProps = {
     strokeColor?: string;
     color?: string;
 };
-export declare const DragHandle: React.MemoExoticComponent<(props: Readonly<DragHandleProps>) => import("react/jsx-runtime").JSX.Element>;
+export declare const DragHandle: React.MemoExoticComponent<(props: Readonly<DragHandleProps>) => React.JSX.Element>;
 export {};

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

@@ -1,3 +1,3 @@
 import React from 'react';
 import type { ErrorSummaryProps } from './_types';
-export declare const ErrorSummary: React.MemoExoticComponent<(props: ErrorSummaryProps) => import("react/jsx-runtime").JSX.Element>;
+export declare const ErrorSummary: React.MemoExoticComponent<(props: ErrorSummaryProps) => React.JSX.Element>;

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

@@ -1,3 +1,3 @@
 import React from 'react';
 import type { FileIconProps } from './_types';
-export declare const FileIcon: React.MemoExoticComponent<(props: FileIconProps) => import("react/jsx-runtime").JSX.Element | null>;
+export declare const FileIcon: React.MemoExoticComponent<(props: FileIconProps) => React.JSX.Element | null>;

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

@@ -1,3 +1,3 @@
 import React from 'react';
 import type { FileListProps } from './_types';
-export declare const FileList: React.MemoExoticComponent<(props: FileListProps) => import("react/jsx-runtime").JSX.Element>;
+export declare const FileList: React.MemoExoticComponent<(props: FileListProps) => React.JSX.Element>;

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

@@ -24,7 +24,7 @@ export declare const FlexDiv: React.NamedExoticComponent<Omit<React.HTMLAttribut
     enter?: any;
     exit?: any;
     animate?: any;
-    transition?: import("framer-motion").Transition;
+    transition?: import("motion-dom").Transition;
     variants?: any;
     gap?: number;
     borderRadius?: number;
@@ -55,7 +55,7 @@ export declare const FlexDiv: React.NamedExoticComponent<Omit<React.HTMLAttribut
     enter?: any;
     exit?: any;
     animate?: any;
-    transition?: import("framer-motion").Transition;
+    transition?: import("motion-dom").Transition;
     variants?: any;
     gap?: number;
     borderRadius?: number;

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

@@ -1,3 +1,3 @@
 import React from 'react';
 import type { GrouperProps } from './_types';
-export declare const Grouper: React.MemoExoticComponent<(props: GrouperProps) => import("react/jsx-runtime").JSX.Element>;
+export declare const Grouper: React.MemoExoticComponent<(props: GrouperProps) => React.JSX.Element>;

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

@@ -1,3 +1,3 @@
 import React from 'react';
 import type { IconProps } from './_types';
-export declare const Icon: React.MemoExoticComponent<(props: IconProps) => import("react/jsx-runtime").JSX.Element | null>;
+export declare const Icon: React.MemoExoticComponent<(props: IconProps) => React.JSX.Element | null>;

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

@@ -1,3 +1,3 @@
 import React from 'react';
 import type { IconButtonProps } from './_types';
-export declare const IconButton: React.MemoExoticComponent<(props: IconButtonProps) => import("react/jsx-runtime").JSX.Element>;
+export declare const IconButton: React.MemoExoticComponent<(props: IconButtonProps) => React.JSX.Element>;

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

@@ -1,2 +1,3 @@
+import type React from 'react';
 import { type LabelProps } from './_types';
-export declare function Label(props: Readonly<LabelProps>): import("react/jsx-runtime").JSX.Element;
+export declare function Label(props: Readonly<LabelProps>): React.JSX.Element;

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

@@ -1,5 +1,5 @@
 import React from 'react';
 import type { LevelProps } from './_types';
-declare function BaseLevel(props: Readonly<LevelProps>): import("react/jsx-runtime").JSX.Element;
+declare function BaseLevel(props: Readonly<LevelProps>): React.JSX.Element;
 export declare const Level: React.MemoExoticComponent<typeof BaseLevel>;
 export {};

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

@@ -1,2 +1,3 @@
+import React from 'react';
 import type { ModalControllerProps } from './_types';
-export declare function ModalController(props: Readonly<ModalControllerProps>): import("react/jsx-runtime").JSX.Element;
+export declare function ModalController(props: Readonly<ModalControllerProps>): React.JSX.Element;

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

@@ -1,3 +1,3 @@
 import React from 'react';
 import type { OverlayProps } from './_types';
-export declare const Overlay: React.MemoExoticComponent<(props: OverlayProps) => import("react/jsx-runtime").JSX.Element>;
+export declare const Overlay: React.MemoExoticComponent<(props: OverlayProps) => React.JSX.Element>;

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

@@ -1,3 +1,3 @@
 import React from 'react';
 import type { PagerProps } from './_types';
-export declare const Pager: React.MemoExoticComponent<(props: PagerProps) => import("react/jsx-runtime").JSX.Element>;
+export declare const Pager: React.MemoExoticComponent<(props: PagerProps) => React.JSX.Element>;

package/dist/types/components/Progress/DoneCheck/DoneCheck.d.ts

@@ -1,3 +1,3 @@
 import React from 'react';
 import type { DoneCheckProps } from './_types';
-export declare const DoneCheck: React.MemoExoticComponent<(props: DoneCheckProps) => import("react/jsx-runtime").JSX.Element>;
+export declare const DoneCheck: React.MemoExoticComponent<(props: DoneCheckProps) => React.JSX.Element>;

package/dist/types/components/Progress/ProgressIndicator/ProgressIndicator.d.ts

@@ -1,3 +1,4 @@
+import type React from 'react';
 import type { ProgressIndicatorProps } from './_types';
-export declare function ProgressIndicator(props: Readonly<ProgressIndicatorProps>): import("react/jsx-runtime").JSX.Element;
-export declare const OpenCircle: (size: number | string, secondsPerSpin: number, color: string, stroke?: number, playing?: boolean, inset?: boolean, gradientId?: string) => import("react/jsx-runtime").JSX.Element;
+export declare function ProgressIndicator(props: Readonly<ProgressIndicatorProps>): React.JSX.Element;
+export declare const OpenCircle: (size: number | string, secondsPerSpin: number, color: string, stroke?: number, playing?: boolean, inset?: boolean, gradientId?: string) => React.JSX.Element;

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

@@ -1,3 +1,3 @@
 import React from 'react';
 import type { SliderProps } from './_types';
-export declare const Slider: React.MemoExoticComponent<(props: SliderProps) => import("react/jsx-runtime").JSX.Element>;
+export declare const Slider: React.MemoExoticComponent<(props: SliderProps) => React.JSX.Element>;

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

@@ -1,3 +1,3 @@
 import React from 'react';
 import type { SpacerProps } from './_types';
-export declare const Spacer: React.MemoExoticComponent<(props: SpacerProps) => import("react/jsx-runtime").JSX.Element>;
+export declare const Spacer: React.MemoExoticComponent<(props: SpacerProps) => React.JSX.Element>;

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

@@ -1,3 +1,3 @@
 import React from 'react';
 import type { TabBarProps } from './_types';
-export declare const TabBar: React.MemoExoticComponent<(props: TabBarProps) => import("react/jsx-runtime").JSX.Element>;
+export declare const TabBar: React.MemoExoticComponent<(props: TabBarProps) => React.JSX.Element>;

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

@@ -1,3 +1,3 @@
 import React from 'react';
 import type { TextAreaProps } from './_types';
-export declare const TextArea: React.MemoExoticComponent<(props: TextAreaProps) => import("react/jsx-runtime").JSX.Element>;
+export declare const TextArea: React.MemoExoticComponent<(props: TextAreaProps) => React.JSX.Element>;

package/dist/types/components/Textfield/TextField.d.ts

@@ -1,3 +1,3 @@
 import React from 'react';
 import { type TextFieldProps } from './_types';
-export declare const TextField: React.MemoExoticComponent<(props: TextFieldProps) => import("react/jsx-runtime").JSX.Element>;
+export declare const TextField: React.MemoExoticComponent<(props: TextFieldProps) => React.JSX.Element>;

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

@@ -1,2 +1,3 @@
+import type React from 'react';
 import type { ToggleButtonProps } from './_types';
-export declare function ToggleButton(props: Readonly<ToggleButtonProps>): import("react/jsx-runtime").JSX.Element;
+export declare function ToggleButton(props: Readonly<ToggleButtonProps>): React.JSX.Element;

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

@@ -1,2 +1,3 @@
+import type React from 'react';
 import type { VideoControllerProps } from './_types';
-export declare function VideoController(props: Readonly<VideoControllerProps>): import("react/jsx-runtime").JSX.Element;
+export declare function VideoController(props: Readonly<VideoControllerProps>): React.JSX.Element;

package/dist/types/providers/ThemeProvider.d.ts

@@ -13,5 +13,5 @@ type ThemeContextValue = {
     setSystemTheme: (value: boolean) => void;
 };
 export declare function useThemeContext(): ThemeContextValue;
-export declare function ThemeProvider(props: Readonly<ThemeProviderProps>): import("react/jsx-runtime").JSX.Element;
+export declare function ThemeProvider(props: Readonly<ThemeProviderProps>): React.JSX.Element;
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@apple-pie/slice",
-	"version": "0.1.42",
+	"version": "0.1.44",
 	"main": "dist/cjs/index.js",
 	"module": "dist/esm/index.mjs",
 	"exports": {