@nimbus-ds/components 5.31.0 → 5.32.1

package/dist/index.d.ts

@@ -182,6 +182,7 @@ declare const propertiesBox: {
 		"neutral-surfaceHighlight": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
 		"neutral-surfaceDisabled": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
 		"neutral-textLow": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+		"neutral-textHigh": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
 		"ai-generative-surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
 		"ai-generative-surfaceHighlight": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
 		transparent: string;
@@ -217,6 +218,7 @@ declare const propertiesBox: {
 		"neutral-surfaceHighlight": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
 		"neutral-surfaceDisabled": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
 		"neutral-textLow": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+		"neutral-textHigh": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
 		"ai-generative-surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
 		"ai-generative-surfaceHighlight": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
 		transparent: string;
@@ -411,7 +413,9 @@ declare const propertiesBox: {
 		h4: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
 		h5: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
 		h6: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
-	};
+	}; /**
+	 * The paddingBottom property sets the height of the padding area on the bottom of an box.
+	 */
 };
 export type BoxBorderColorProperties = keyof typeof propertiesBox.borderColor;
 export type BoxBorderRadiusProperties = keyof typeof propertiesBox.borderRadius;
@@ -840,7 +844,7 @@ declare const fileUploader: {
 };
 declare const icon: {
 	sprinkle: ((props: {
-		color?: "currentColor" | "primary-interactive" | "primary-surface" | "primary-textLow" | "success-textLow" | "success-surface" | "warning-interactive" | "warning-surface" | "warning-textLow" | "danger-interactive" | "danger-surface" | "danger-textLow" | "neutral-background" | "neutral-interactive" | "neutral-surface" | "neutral-textLow" | "success-interactive" | "ai-generative" | "primary-textHigh" | "success-textHigh" | "warning-textHigh" | "danger-textHigh" | "neutral-textDisabled" | "neutral-textHigh" | undefined;
+		color?: "currentColor" | "primary-interactive" | "primary-surface" | "primary-textLow" | "success-textLow" | "success-surface" | "warning-interactive" | "warning-surface" | "warning-textLow" | "danger-interactive" | "danger-surface" | "danger-textLow" | "neutral-background" | "neutral-interactive" | "neutral-surface" | "neutral-textLow" | "neutral-textHigh" | "success-interactive" | "ai-generative" | "primary-textHigh" | "success-textHigh" | "warning-textHigh" | "danger-textHigh" | "neutral-textDisabled" | undefined;
 		cursor?: Cursor | undefined;
 	}) => string) & {
 		properties: Set<"color" | "cursor">;
@@ -1086,6 +1090,10 @@ declare const text: {
 							default: string;
 							conditions: Record<"xs" | "md" | "lg" | "xl", string>;
 						};
+						"neutral-textHigh": {
+							default: string;
+							conditions: Record<"xs" | "md" | "lg" | "xl", string>;
+						};
 						"success-interactive": {
 							default: string;
 							conditions: Record<"xs" | "md" | "lg" | "xl", string>;
@@ -1114,10 +1122,6 @@ declare const text: {
 							default: string;
 							conditions: Record<"xs" | "md" | "lg" | "xl", string>;
 						};
-						"neutral-textHigh": {
-							default: string;
-							conditions: Record<"xs" | "md" | "lg" | "xl", string>;
-						};
 					};
 					staticScale: {
 						"ai-generative": "transparent";
@@ -4035,5 +4039,93 @@ export interface SegmentedControlContextValue {
  * @throws Error if not within a SegmentedControl
  */
 export declare const useSegmentedControlContext: () => SegmentedControlContextValue;
+export interface SplitButtonActionProperties {
+	/**
+	 * The content of the action item.
+	 * @TJS-type React.ReactNode
+	 */
+	children: ReactNode;
+	/**
+	 * Optional icon to display before the action text.
+	 * @TJS-type React.ReactNode
+	 */
+	icon?: ReactNode;
+	/**
+	 * Callback function when the action is clicked.
+	 * @TJS-type () => void;
+	 */
+	onClick?: () => void;
+	/**
+	 * Disables the action item.
+	 * @default false
+	 */
+	disabled?: boolean;
+}
+export type SplitButtonActionProps = SplitButtonActionProperties & Pick<BoxProps, "backgroundColor" | "borderWidth" | "display" | "alignItems" | "gap" | "p" | "borderRadius">;
+declare const SplitButtonAction: React.FC<SplitButtonActionProps>;
+export interface SplitButtonPrimaryProperties {
+	/**
+	 * The content of the primary button.
+	 * @TJS-type React.ReactNode
+	 */
+	children: ReactNode;
+	/**
+	 * Callback function when the primary button is clicked.
+	 * @TJS-type () => void;
+	 */
+	onClick?: () => void;
+}
+export type SplitButtonPrimaryProps = SplitButtonPrimaryProperties & Omit<ButtonHTMLAttributes<HTMLButtonElement>, "onClick" | "children">;
+declare const SplitButtonPrimary: React.FC<SplitButtonPrimaryProps>;
+export interface SplitButtonSecondaryProperties {
+	/**
+	 * The content of the secondary dropdown menu.
+	 * @TJS-type React.ReactNode
+	 */
+	children: ReactNode;
+	/**
+	 * Accessible label for the dropdown button.
+	 * @default "Show more actions"
+	 */
+	ariaLabel?: string;
+}
+export type SplitButtonSecondaryProps = SplitButtonSecondaryProperties & Omit<ButtonHTMLAttributes<HTMLButtonElement>, "children">;
+declare const SplitButtonSecondary: React.FC<SplitButtonSecondaryProps>;
+export interface SplitButtonComponents {
+	Action: typeof SplitButtonAction;
+	Primary: typeof SplitButtonPrimary;
+	Secondary: typeof SplitButtonSecondary;
+}
+export interface SplitButtonProperties {
+	/**
+	 * The subcomponents (Primary and Secondary).
+	 * @TJS-type React.ReactNode
+	 */
+	children: ReactNode;
+	/**
+	 * Disables the entire split button.
+	 * @default false
+	 */
+	disabled?: boolean;
+	/**
+	 * Controls the visibility of the popover.
+	 */
+	open?: boolean;
+	/**
+	 * Callback function to control popover opening and closing.
+	 * @TJS-type (open: boolean) => void;
+	 */
+	onOpenChange?: (open: boolean) => void;
+	/**
+	 * Position of the popover relative to the button.
+	 * @default bottom-end
+	 */
+	popoverPosition?: PopoverProps["position"];
+}
+export type SplitButtonProps = SplitButtonProperties & Omit<BoxProps, "children" | "display" | "gap" | "position">;
+/**
+ * SplitButton component allows users to perform actions by clicking a primary button and displaying a dropdown menu with additional actions.
+ */
+export declare const SplitButton: React.FC<SplitButtonProps> & SplitButtonComponents;
 
 export {};