@apple-pie/slice 0.1.59 → 0.2.0

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

@@ -0,0 +1,2 @@
+import type { AttachmentProps } from './_types';
+export declare function Attachment(props: Readonly<AttachmentProps>): import("react").JSX.Element;

package/dist/types/components/Attachment/AttachmentImagePreview.d.ts

@@ -0,0 +1,6 @@
+/** Mount with the source as its key so loading/error state belongs to one URL. */
+export declare function AttachmentImagePreview({ src, iconSize, color }: {
+    src: string;
+    iconSize: number;
+    color: string;
+}): import("react").JSX.Element;

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

@@ -0,0 +1,47 @@
+import type React from 'react';
+import type { ColorValue } from '../../theme';
+import type { FileIconTypes } from '../FileIcon';
+import type { FileItem } from '../FileList';
+import type { FixedSize, ToolTip } from '../sharedTypes';
+export declare enum ContentType {
+    Text = "text",
+    File = "file"
+}
+export type ContentFormat = FileIconTypes;
+export type Content = File | FileItem | string;
+export type AttachmentBaseProps = {
+    /** Accepts a raw File, clipboard text, or FileItem. FileItem.uploading and FileItem.progress drive upload status; FileItem.error replaces the preview. */
+    content?: Content;
+    textColor?: ColorValue;
+    textColorLight?: ColorValue;
+    textSize?: FixedSize;
+    borderColor?: ColorValue;
+    borderWidth?: number;
+    borderStyle?: React.CSSProperties['borderStyle'];
+    borderRadius?: number | string;
+    iconSize?: number;
+    iconGap?: number;
+    /** Exact padding inside each information row. */
+    padding?: number | string;
+    width?: number | string;
+    height?: number | string;
+    thumbTextSize?: number;
+    thumbPadding?: number | string;
+    /** Removal is shown only when a handler is supplied; false hides it. */
+    canRemove?: boolean;
+    /** Accessible name of the attachment group; defaults to the displayed filename. */
+    attachmentName?: string;
+    /** Override the contextual action name, which includes the original filename extension. */
+    removeLabel?: string;
+    /** Optional preview action; supports mouse and native keyboard activation. */
+    onOpen?: React.MouseEventHandler<HTMLButtonElement>;
+    openLabel?: string;
+    disabled?: boolean;
+    /** Controlled removal: update parent state here. The click does not bubble to the wrapper. */
+    onRemove?: React.MouseEventHandler<HTMLButtonElement>;
+    onToolTip?: (tip: ToolTip | null) => void;
+    backgroundColor?: ColorValue;
+    thumbColor?: ColorValue;
+    size?: FixedSize;
+};
+export type AttachmentProps = AttachmentBaseProps & Omit<React.HTMLAttributes<HTMLDivElement>, keyof AttachmentBaseProps | keyof React.AriaAttributes | 'role' | 'children' | 'dangerouslySetInnerHTML'>;

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

@@ -0,0 +1,3 @@
+export { Attachment } from './Attachment';
+export type { AttachmentProps, Content, ContentFormat } from './_types';
+export { ContentType } from './_types';

package/dist/types/components/Attachment/useContentThumbnail.d.ts

@@ -0,0 +1,19 @@
+import { FileIconTypes } from '../FileIcon';
+import { type Content, ContentType } from './_types';
+export type ContentThumbnail = {
+    type: 'image';
+    src: string;
+} | {
+    type: 'text';
+    text: string;
+};
+/** Image URLs belong to this hook and are revoked on replacement or unmount. */
+export declare function useContentThumbnail(content: Content | undefined): {
+    contentType: ContentType | undefined;
+    contentFormat: "other" | "audio" | "code" | "video" | FileIconTypes | "pdf" | "text" | "sheet" | "preso" | "md" | "image" | undefined;
+    thumbnail: ContentThumbnail | undefined;
+    isLoading: boolean;
+    fileName: string | undefined;
+    fileExtension: string | undefined;
+    fileSize: string | undefined;
+};

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) => React.JSX.Element>;
+export declare const AudioBubble: React.MemoExoticComponent<(rawProps: AudioBubbleProps) => React.JSX.Element>;

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

@@ -1,11 +1,12 @@
 import type React from 'react';
+import type { ColorValue } from '../../theme/colors/resolveColor';
 export type AudioBubbleBaseProps = {
     audioStream?: MediaStream | MediaStreamTrack | null;
     playing?: boolean;
     size?: number;
-    backgroundColor?: string;
+    backgroundColor?: ColorValue;
     glow?: boolean;
-    glowColor?: string;
+    glowColor?: ColorValue;
     glowSize?: number;
     glowOffset?: number;
     minScale?: number;
@@ -13,6 +14,6 @@ export type AudioBubbleBaseProps = {
     intensity?: number;
     peakIntensity?: number;
     risePerSeconds?: number;
-    ReleasePerSeconds?: number;
+    releasePerSeconds?: number;
 };
 export type AudioBubbleProps = Omit<React.HTMLAttributes<HTMLDivElement>, keyof AudioBubbleBaseProps> & AudioBubbleBaseProps;

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

@@ -0,0 +1,5 @@
+import React from 'react';
+import type { AudioLevelProps } from './_types';
+declare function BaseAudioLevel(rawProps: Readonly<AudioLevelProps>): React.JSX.Element;
+export declare const AudioLevel: React.MemoExoticComponent<typeof BaseAudioLevel>;
+export {};

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

@@ -0,0 +1,22 @@
+import type React from 'react';
+import type { ColorValue } from '../../theme/colors/resolveColor';
+export type AudioLevelBaseProps = {
+    audioStream?: MediaStream | MediaStreamTrack | null;
+    playing?: boolean;
+    levelName?: string;
+    backgroundColor?: ColorValue;
+    backgroundColorActive?: ColorValue;
+    borderRadius?: number | string;
+    borderColor?: ColorValue;
+    borderWidth?: number;
+    width?: number | string;
+    gap?: number;
+    height?: number;
+    minActiveBars?: number;
+    barCount?: number;
+    intensity?: number;
+    peakIntensity?: number;
+    risePerSeconds?: number;
+    releasePerSeconds?: number;
+};
+export type AudioLevelProps = Omit<React.HTMLAttributes<HTMLDivElement>, keyof AudioLevelBaseProps | keyof React.AriaAttributes | 'role'> & AudioLevelBaseProps;

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

@@ -0,0 +1,2 @@
+export { AudioLevel } from './AudioLevel';
+export type { AudioLevelProps } from './_types';

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

@@ -1,3 +1,8 @@
 import React from 'react';
 import type { AvatarProps } from './_types';
-export declare const Avatar: React.MemoExoticComponent<(props: AvatarProps) => React.JSX.Element>;
+export declare const Avatar: <T = unknown>(props: AvatarProps<T>) => React.JSX.Element;
+/** Internal overflow renderer: shares the avatar's frame, tooltip, and keyboard behavior. */
+export declare function AvatarOverflow({ count, onClick, }: {
+    count: number;
+    onClick?: React.MouseEventHandler<HTMLDivElement>;
+}): React.JSX.Element;

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

@@ -1,24 +1,37 @@
 import type React from 'react';
+import type { ColorValue } from '../../theme/colors/resolveColor';
 import type { ToolTip } from '../sharedTypes';
-export type AvatarBaseProps = {
+export type AvatarBaseProps<T = unknown> = {
+    /** Optional application data passed unchanged as the second argument to every event callback. */
+    info?: T;
+    /** Width and height. Numbers use pixels; strings accept CSS lengths. */
     size?: number | string;
-    frame?: number | string;
+    /** Display name used for initials and identity labels. */
     name?: string;
+    /** Identity fallback when the trimmed name is empty. */
     email?: string;
-    textColor?: string;
+    /** Photo URL. Initials remain visible while loading and on failure. */
     image?: string;
-    color?: string;
+    /** Opt into native browser lazy loading. Defaults to false. */
+    lazyLoad?: boolean;
+    /** Theme typography size for initials. Defaults to m. */
+    textSize?: 'xs' | 's' | 'm' | 'l' | 'xl';
+    textColor?: ColorValue;
+    backgroundColor?: ColorValue;
     borderWidth?: number;
-    borderSize?: number;
-    borderColor?: string;
-    borderColorHover?: string;
-    backgroundColor?: string;
-    fontSize?: number | string;
-    onToolTip?: (tip: ToolTip | null) => void;
-    onClick?: (e: React.MouseEvent<HTMLDivElement>) => void;
-    onKeyDown?: (e: React.KeyboardEvent<HTMLDivElement>) => void;
+    borderColor?: ColorValue;
+    borderColorHover?: ColorValue;
+    outerBorderWidth?: number;
+    outerBorderColor?: ColorValue;
+    /** Tooltip payload on hover or focus; null after both end. */
+    onToolTip?: (tip: ToolTip | null, info: T | undefined) => void;
+    onClick?: (e: React.MouseEvent<HTMLDivElement>, info: T | undefined) => void;
+    onKeyDown?: (e: React.KeyboardEvent<HTMLDivElement>, info: T | undefined) => void;
     tabIndex?: number;
-    outerBorderSize?: number;
-    outerBorderColor?: string;
 };
-export type AvatarProps = Omit<React.HTMLAttributes<HTMLDivElement>, keyof AvatarBaseProps> & AvatarBaseProps;
+/** Preserve each native event's specific React type while adding the optional application data. */
+type AvatarEventHandlers<T> = {
+    [Key in keyof React.DOMAttributes<HTMLDivElement> as Key extends `on${string}` ? Key : never]: NonNullable<React.DOMAttributes<HTMLDivElement>[Key]> extends (event: infer Event) => void ? (event: Event, info: T | undefined) => void : never;
+};
+export type AvatarProps<T = unknown> = Omit<React.HTMLAttributes<HTMLDivElement>, keyof AvatarBaseProps<T> | keyof AvatarEventHandlers<T> | 'color' | 'children'> & AvatarBaseProps<T> & AvatarEventHandlers<T>;
+export {};

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) => React.JSX.Element>;
+export declare const AvatarGroup: React.MemoExoticComponent<(rawProps: AvatarGroupProps) => React.JSX.Element>;

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

@@ -0,0 +1,7 @@
+import type { AvatarProps } from '../Avatar';
+type AvatarGroupDefaults = Pick<AvatarProps, 'backgroundColor' | 'size' | 'lazyLoad' | 'textSize' | 'borderWidth' | 'borderColor' | 'borderColorHover' | 'outerBorderWidth' | 'outerBorderColor' | 'onToolTip'>;
+export declare const AvatarGroupContext: import("react").Context<{
+    avatarProps: AvatarGroupDefaults;
+    itemClassName: string;
+} | null>;
+export {};

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

@@ -1,27 +1,38 @@
 import type React from 'react';
+import type { AvatarProps } from '../Avatar';
 import type { ToolTip } from '../sharedTypes';
-export type AvatarInfo = {
+export type AvatarInfo = Pick<AvatarProps, 'image' | 'email' | 'textColor' | 'backgroundColor'> & {
+    /** Unique, stable identity within the group. Used as the React key, not a DOM id. */
+    id?: string | number;
     first?: string;
     last?: string;
-    image?: any;
-    avatar?: string;
-    email?: string;
-    textColor?: string;
-    color?: string;
-    backgroundColor?: string;
 };
-export type AvatarGroupBaseProps = {
+/** Overflow lists preserve input order and exclude the generated +N avatar. */
+export type AvatarGroupMore = {
+    source: 'avatars';
+    more: AvatarInfo[];
+    all: AvatarInfo[];
+} | {
+    source: 'children';
+    more: React.ReactNode[];
+    all: React.ReactNode[];
+};
+export type AvatarGroupBaseProps = Pick<AvatarProps, 'backgroundColor' | 'borderWidth' | 'borderColor' | 'borderColorHover' | 'outerBorderWidth' | 'outerBorderColor' | 'lazyLoad' | 'textSize'> & {
+    /** Used only when children is undefined. */
     avatars?: AvatarInfo[] | null;
+    /** Avatar children replace avatars, including when null or empty. */
+    children?: React.ReactNode;
+    /** Maximum visible people, followed by a +N avatar when needed. Omitted means unlimited. */
+    limit?: number;
+    /** Runs when the overflow avatar is clicked or activated by keyboard. */
+    onMore?: (details: AvatarGroupMore) => void;
+    /** Width and height of each avatar in pixels. Defaults to 40. */
     size?: number;
     overlap?: number;
-    borderWidth?: number;
-    borderSize?: number;
-    borderColor?: string;
-    borderColorHover?: string;
     gap?: number;
+    /** Accessible group label. Defaults to people when omitted or blank. */
+    groupName?: string;
     margin?: number;
-    outerBorderSize?: number;
-    outerBorderColor?: string;
     onToolTip?: (tip: ToolTip | null) => void;
 };
-export type AvatarGroupProps = Omit<React.HTMLAttributes<HTMLDivElement>, keyof AvatarGroupBaseProps> & AvatarGroupBaseProps;
+export type AvatarGroupProps = Omit<React.HTMLAttributes<HTMLDivElement>, keyof AvatarGroupBaseProps | keyof React.AriaAttributes | 'role' | 'color' | 'children'> & AvatarGroupBaseProps;

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

@@ -1,2 +1,2 @@
 export { AvatarGroup } from './AvatarGroup';
-export type { AvatarGroupProps, AvatarInfo } from './_types';
+export type { AvatarGroupProps, AvatarGroupMore, AvatarInfo } from './_types';

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) => React.JSX.Element | null>;
+export declare const Badge: React.MemoExoticComponent<(rawProps: BadgeProps) => React.JSX.Element | null>;

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

@@ -1,8 +1,16 @@
 import type React from 'react';
+import type { ColorValue } from '../../theme/colors/resolveColor';
 type BadgeBaseProps = {
-    count?: number | string;
-    hideNull?: boolean;
+    /** Override the variant's background with a theme token or CSS color. */
+    backgroundColor?: ColorValue;
+    /** Override the variant's text with a theme token or CSS color. */
+    textColor?: ColorValue;
+    /** Number or short label. Missing, blank, and non-finite values are hidden. Numbers above 99 display as 99+. */
+    count?: number | string | null;
+    /** Hide numeric zero. Defaults to true; string labels are not parsed as numbers. */
+    hideZero?: boolean;
+    /** Theme color preset. Defaults to dark. */
     variant?: 'light' | 'dark';
 };
-export type BadgeProps = Omit<React.HTMLAttributes<HTMLDivElement>, keyof BadgeBaseProps> & BadgeBaseProps;
+export type BadgeProps = Omit<React.HTMLAttributes<HTMLDivElement>, keyof BadgeBaseProps | 'children' | 'color'> & BadgeBaseProps;
 export {};

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

@@ -1,15 +1,16 @@
 import React from 'react';
-import type { ToolTip } from '../sharedTypes';
 import type { ButtonHandle } from './_types';
-export declare const Button: React.NamedExoticComponent<Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, keyof {
+export declare const Button: React.NamedExoticComponent<Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "fill" | "initial" | "underline" | "children" | "link" | "progress" | "animate" | "exit" | "backgroundColor" | "borderColor" | "borderRadius" | "borderWidth" | "color" | "gap" | "transition" | "width" | "duration" | "label" | "onClick" | "target" | "onDrag" | "onDragEnd" | "onDragStart" | "onAnimationStart" | "iconLeft" | "round" | "tooltip" | "variant" | "iconColor" | "textColor" | "iconSize" | "textSize" | "state" | "onToolTip" | "count" | "variants" | "buttonSize" | "iconFill" | "showDot" | keyof import("../sharedTypes").PaddingProps | "iconRight" | "backgroundColorDisabled" | "working" | "trigger" | "destructive"> & import("../sharedTypes").PaddingProps & {
+    buttonSize?: import("../sharedTypes").ButtonSize;
+    gap?: number;
+} & {
     children?: React.ReactNode;
-    size?: "large" | "medium" | "small";
     variant?: "solid" | "outline" | "text";
     state?: "normal" | "hover" | "disabled";
     width?: string;
     label?: string;
-    iconRight?: string;
-    iconLeft?: string;
+    iconRight?: import("../Icon").SliceIcon;
+    iconLeft?: import("../Icon").SliceIcon;
     iconFill?: boolean;
     fill?: boolean;
     count?: number;
@@ -18,11 +19,13 @@ export declare const Button: React.NamedExoticComponent<Omit<React.ButtonHTMLAtt
     tooltip?: string;
     iconSize?: number;
     borderRadius?: number | string;
-    iconColor?: string;
-    backgroundColor?: string;
-    backgroundColorDisabled?: string;
-    labelColor?: string;
-    labelSize?: "xs" | "s" | "m" | "l" | "xl";
+    borderWidth?: number | string;
+    borderColor?: import("../..").ColorValue;
+    iconColor?: import("../..").ColorValue;
+    backgroundColor?: import("../..").ColorValue;
+    backgroundColorDisabled?: import("../..").ColorValue;
+    textColor?: import("../..").ColorValue;
+    textSize?: import("../sharedTypes").FixedSize;
     transition?: import("motion-dom").Transition;
     variants?: import("motion-dom").Variants;
     initial?: string;
@@ -34,49 +37,13 @@ export declare const Button: React.NamedExoticComponent<Omit<React.ButtonHTMLAtt
     duration?: number;
     trigger?: boolean;
     destructive?: boolean;
-    paddingRight?: number;
-    paddingLeft?: number;
     link?: string;
     target?: "_blank" | "_self" | "_parent" | "_top";
-    onToolTip?: (tip: ToolTip | null) => void;
-    onClick?: (e: React.MouseEvent<HTMLButtonElement, MouseEvent> | undefined) => void;
-}> & {
-    children?: React.ReactNode;
-    size?: "large" | "medium" | "small";
-    variant?: "solid" | "outline" | "text";
-    state?: "normal" | "hover" | "disabled";
-    width?: string;
-    label?: string;
-    iconRight?: string;
-    iconLeft?: string;
-    iconFill?: boolean;
-    fill?: boolean;
-    count?: number;
-    showDot?: boolean;
-    round?: boolean;
-    tooltip?: string;
-    iconSize?: number;
-    borderRadius?: number | string;
-    iconColor?: string;
-    backgroundColor?: string;
-    backgroundColorDisabled?: string;
-    labelColor?: string;
-    labelSize?: "xs" | "s" | "m" | "l" | "xl";
-    transition?: import("motion-dom").Transition;
-    variants?: import("motion-dom").Variants;
-    initial?: string;
-    animate?: string;
-    exit?: string;
-    underline?: boolean;
-    progress?: boolean;
-    working?: boolean;
-    duration?: number;
-    trigger?: boolean;
-    destructive?: boolean;
-    paddingRight?: number;
-    paddingLeft?: number;
-    link?: string;
-    target?: "_blank" | "_self" | "_parent" | "_top";
-    onToolTip?: (tip: ToolTip | null) => void;
+    onToolTip?: (tip: import("../sharedTypes").ToolTip | null) => void;
     onClick?: (e: React.MouseEvent<HTMLButtonElement, MouseEvent> | undefined) => void;
+} & {
+    onDrag?: ((event: MouseEvent | TouchEvent | PointerEvent, info: import("motion-dom").PanInfo) => void) | undefined;
+    onDragEnd?: ((event: MouseEvent | TouchEvent | PointerEvent, info: import("motion-dom").PanInfo) => void) | undefined;
+    onDragStart?: ((event: MouseEvent | TouchEvent | PointerEvent, info: import("motion-dom").PanInfo) => void) | undefined;
+    onAnimationStart?: ((definition: import("motion-dom").AnimationDefinition) => void) | undefined;
 } & React.RefAttributes<ButtonHandle>>;

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

@@ -1,15 +1,16 @@
-import type { Transition, Variants } from 'motion/react';
+import type { HTMLMotionProps, Transition, Variants } from 'motion/react';
 import type React from 'react';
-import type { ToolTip } from '../sharedTypes';
-type ButtonBaseProps = {
+import type { ColorValue } from '../../theme/colors/resolveColor';
+import type { SliceIcon } from '../Icon/_types';
+import type { ButtonStyleProps, FixedSize, ToolTip } from '../sharedTypes';
+type ButtonBaseProps = ButtonStyleProps & {
     children?: React.ReactNode;
-    size?: 'large' | 'medium' | 'small';
     variant?: 'solid' | 'outline' | 'text';
     state?: 'normal' | 'hover' | 'disabled';
     width?: string;
     label?: string;
-    iconRight?: string;
-    iconLeft?: string;
+    iconRight?: SliceIcon;
+    iconLeft?: SliceIcon;
     iconFill?: boolean;
     fill?: boolean;
     count?: number;
@@ -18,11 +19,15 @@ type ButtonBaseProps = {
     tooltip?: string;
     iconSize?: number;
     borderRadius?: number | string;
-    iconColor?: string;
-    backgroundColor?: string;
-    backgroundColorDisabled?: string;
-    labelColor?: string;
-    labelSize?: 'xs' | 's' | 'm' | 'l' | 'xl';
+    /** Overrides the variant border width in every state. Numbers use pixels. */
+    borderWidth?: number | string;
+    /** Overrides the variant border color in every state. */
+    borderColor?: ColorValue;
+    iconColor?: ColorValue;
+    backgroundColor?: ColorValue;
+    backgroundColorDisabled?: ColorValue;
+    textColor?: ColorValue;
+    textSize?: FixedSize;
     transition?: Transition;
     variants?: Variants;
     initial?: string;
@@ -34,14 +39,13 @@ type ButtonBaseProps = {
     duration?: number;
     trigger?: boolean;
     destructive?: boolean;
-    paddingRight?: number;
-    paddingLeft?: number;
     link?: string;
     target?: '_blank' | '_self' | '_parent' | '_top';
     onToolTip?: (tip: ToolTip | null) => void;
     onClick?: (e: React.MouseEvent<HTMLButtonElement, MouseEvent> | undefined) => void;
 };
-export type ButtonProps = Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, keyof ButtonBaseProps> & ButtonBaseProps;
+type MotionEvents = Pick<HTMLMotionProps<'button'>, 'onAnimationStart' | 'onDrag' | 'onDragStart' | 'onDragEnd'>;
+export type ButtonProps = Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, keyof ButtonBaseProps | keyof MotionEvents | 'color'> & ButtonBaseProps & MotionEvents;
 export interface ButtonHandle {
     triggerClick: () => void;
 }

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

@@ -1,17 +1,3 @@
 import React from 'react';
-import type { ToolTip } from '../sharedTypes';
 import type { ButtonBarProps } from './_types';
 export declare const ButtonBar: React.NamedExoticComponent<Readonly<ButtonBarProps>>;
-interface ButtonProps {
-    classNames?: string;
-    icon?: string;
-    iconSize: number;
-    iconColor?: string;
-    onClick?: () => void;
-    onMouseEnter?: () => void;
-    onMouseLeave?: () => void;
-    toolTip?: string;
-    onToolTip?: (tip: ToolTip | null) => void;
-}
-export declare const BarButton: React.NamedExoticComponent<Readonly<ButtonProps>>;
-export {};

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

@@ -1,28 +1,31 @@
 import type React from 'react';
-import type { ToolTip } from '../sharedTypes';
+import type { ColorValue } from '../../theme/colors/resolveColor';
+import type { SliceIcon } from '../Icon/_types';
+import type { ButtonSize, ToolTip } from '../sharedTypes';
 export type BarButton = {
-    icon?: string;
+    icon?: SliceIcon;
     action?: string;
-    label?: string;
+    /** Accessible button name and tooltip text. */
     tip: string;
 };
 type ButtonBarBaseProps = {
     buttons?: BarButton[];
-    frameSize?: number;
+    buttonGap?: number;
+    padding?: number;
+    selectionRadius?: number | string;
+    buttonSize?: Exclude<ButtonSize, 'auto'>;
     iconSize?: number;
     toggle?: boolean;
-    selected?: number;
+    selectedIndex?: number | null;
+    defaultSelectedIndex?: number | null;
     borderRadius?: number | string;
     borderWidth?: number;
-    borderSize?: number;
-    borderColor?: string;
-    backgroundColor?: string;
-    backgroundColorHover?: string;
-    backgroundColorActive?: string;
-    labelColor?: string;
-    buttonSize?: 's' | 'm' | 'l' | 'xl';
+    borderColor?: ColorValue;
+    backgroundColor?: ColorValue;
+    backgroundColorHover?: ColorValue;
+    backgroundColorSelected?: ColorValue;
     onClick?: (button: BarButton) => void;
-    onChange?: (option: BarButton) => void;
+    onChange?: (button: BarButton) => void;
     onToolTip?: (tip: ToolTip | null) => void;
 };
 export type ButtonBarProps = Omit<React.HTMLAttributes<HTMLDivElement>, keyof ButtonBarBaseProps> & ButtonBarBaseProps;

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

@@ -1,11 +1,9 @@
 import React from 'react';
 import type { CameraElement, DefaultNoVideoPosterProps, ToolbarButtonProps } from './_types';
 export declare const Camera: React.NamedExoticComponent<Omit<React.HTMLAttributes<HTMLDivElement>, keyof import("./_types").BaseCameraProps> & import("./_types").BaseCameraProps & React.RefAttributes<CameraElement>>;
-/**
- * Custom toolbar button with labels for controlling video / audio / etc.
- */
+/** Shared Slice control with the Camera action's controlled state. */
 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 | React.JSX.Element;
+export declare function DefaultNoVideoPoster(props: Readonly<DefaultNoVideoPosterProps>): React.JSX.Element;