@evolve.ui/core-components 1.0.0

package/SplitButton-DK-LdIwN.d.cts

@@ -0,0 +1,80 @@
+import { ReactNode } from "react";
+import { Placement } from "@floating-ui/react";
+
+//#region src/SplitButton/SplitButton.d.ts
+type Props = {
+  /**
+   * Accessible label for the split button group wrapper.
+   * Defaults to the string value of `label` when `label` is a string.
+   */
+  'aria-label'?: string;
+  /**
+   * `MenuItem` components to render inside the dropdown.
+   *
+   * Usage:
+   * ```tsx
+   * <SplitButton label="Export CSV" onDefaultAction={handleExport}>
+   *   <MenuItem primaryLabel="Export PDF" onClick={handlePdf} />
+   *   <MenuItem primaryLabel="Export Excel" onClick={handleExcel} />
+   * </SplitButton>
+   * ```
+   */
+  children: ReactNode; /** Additional CSS class applied to the wrapper element */
+  className?: string; /** Test id applied to the wrapper element for consumer test targeting */
+  'data-testid'?: string; /** Disables both the default action button and the menu trigger */
+  disabled?: boolean; /** Label for the default action button */
+  label: ReactNode;
+  /**
+   * Shows a loading spinner on the default action button and disables the
+   * dropdown trigger to prevent new selections while an action is in-flight.
+   *
+   * @default false
+   */
+  loading?: boolean;
+  /**
+   * Preferred placement of the dropdown menu. Flip middleware will
+   * automatically move it to the opposite side if there is insufficient
+   * viewport space.
+   *
+   * @default 'bottom-start'
+   */
+  menuPlacement?: Placement;
+  /**
+   * Accessible label for the menu trigger (caret) button.
+   * Defaults to `"See more {label} actions"` when `label` is a string.
+   */
+  menuTriggerAriaLabel?: string; /** Callback fired when the default action button is clicked */
+  onDefaultAction: () => void;
+  /**
+   * Button size.
+   *
+   * @default 'md'
+   */
+  size?: 'md' | 'sm';
+  /**
+   * Visual variant — `'filled'` (primary) or `'outlined'` (secondary).
+   *
+   * @default 'filled'
+   */
+  variant?: 'filled' | 'outlined';
+};
+/**
+ * A split button pairs a primary default action with a dropdown menu of
+ * related secondary actions. The left button triggers the action immediately;
+ * the right caret button opens the dropdown.
+ *
+ * Use `MenuItem` children to populate the dropdown:
+ * ```tsx
+ * <SplitButton label="Export CSV" onDefaultAction={handleExport}>
+ *   <MenuItem primaryLabel="Export PDF" onClick={handlePdf} />
+ *   <MenuItem primaryLabel="Export Excel" onClick={handleExcel} />
+ * </SplitButton>
+ * ```
+ */
+declare const SplitButton: {
+  (props: Props): import("react/jsx-runtime").JSX.Element;
+  displayName: string;
+};
+//#endregion
+export { SplitButton as t };
+//# sourceMappingURL=SplitButton-DK-LdIwN.d.cts.map

package/SplitButton-DK-LdIwN.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SplitButton-DK-LdIwN.d.cts","names":[],"sources":["../src/SplitButton/SplitButton.tsx"],"mappings":";;;;KAqCK,KAAA;;AAf0D;;;EAoB3D,YAAA;EAoBO;;;;;;;;;;;EARP,QAAA,EAAU,SAAA,EAeV;EAbA,SAAA,WAqBgB;EAnBhB,aAAA,WA0BA;EAxBA,QAAA,YAoCA;EAlCA,KAAA,EAAO,SAAA;EAkCA;AAmMX;;;;;EA9NI,OAAA;EA8NoC;;;;;;;EAtNpC,aAAA,GAAgB,SAAA;;;;;EAKhB,oBAAA;EAEA,eAAA;;;;;;EAMA,IAAA;;;;;;EAMA,OAAA;AAAA;;;;;;;;;;;;;;cAmMS,WAAA;EAAA,QAAsB,KAAK,+BAAA,GAAA,CAAA,OAAA"}

package/SplitButton-DK-LdIwN.d.mts

@@ -0,0 +1,80 @@
+import { ReactNode } from "react";
+import { Placement } from "@floating-ui/react";
+
+//#region src/SplitButton/SplitButton.d.ts
+type Props = {
+  /**
+   * Accessible label for the split button group wrapper.
+   * Defaults to the string value of `label` when `label` is a string.
+   */
+  'aria-label'?: string;
+  /**
+   * `MenuItem` components to render inside the dropdown.
+   *
+   * Usage:
+   * ```tsx
+   * <SplitButton label="Export CSV" onDefaultAction={handleExport}>
+   *   <MenuItem primaryLabel="Export PDF" onClick={handlePdf} />
+   *   <MenuItem primaryLabel="Export Excel" onClick={handleExcel} />
+   * </SplitButton>
+   * ```
+   */
+  children: ReactNode; /** Additional CSS class applied to the wrapper element */
+  className?: string; /** Test id applied to the wrapper element for consumer test targeting */
+  'data-testid'?: string; /** Disables both the default action button and the menu trigger */
+  disabled?: boolean; /** Label for the default action button */
+  label: ReactNode;
+  /**
+   * Shows a loading spinner on the default action button and disables the
+   * dropdown trigger to prevent new selections while an action is in-flight.
+   *
+   * @default false
+   */
+  loading?: boolean;
+  /**
+   * Preferred placement of the dropdown menu. Flip middleware will
+   * automatically move it to the opposite side if there is insufficient
+   * viewport space.
+   *
+   * @default 'bottom-start'
+   */
+  menuPlacement?: Placement;
+  /**
+   * Accessible label for the menu trigger (caret) button.
+   * Defaults to `"See more {label} actions"` when `label` is a string.
+   */
+  menuTriggerAriaLabel?: string; /** Callback fired when the default action button is clicked */
+  onDefaultAction: () => void;
+  /**
+   * Button size.
+   *
+   * @default 'md'
+   */
+  size?: 'md' | 'sm';
+  /**
+   * Visual variant — `'filled'` (primary) or `'outlined'` (secondary).
+   *
+   * @default 'filled'
+   */
+  variant?: 'filled' | 'outlined';
+};
+/**
+ * A split button pairs a primary default action with a dropdown menu of
+ * related secondary actions. The left button triggers the action immediately;
+ * the right caret button opens the dropdown.
+ *
+ * Use `MenuItem` children to populate the dropdown:
+ * ```tsx
+ * <SplitButton label="Export CSV" onDefaultAction={handleExport}>
+ *   <MenuItem primaryLabel="Export PDF" onClick={handlePdf} />
+ *   <MenuItem primaryLabel="Export Excel" onClick={handleExcel} />
+ * </SplitButton>
+ * ```
+ */
+declare const SplitButton: {
+  (props: Props): import("react/jsx-runtime").JSX.Element;
+  displayName: string;
+};
+//#endregion
+export { SplitButton as t };
+//# sourceMappingURL=SplitButton-DK-LdIwN.d.mts.map

package/SplitButton-DK-LdIwN.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SplitButton-DK-LdIwN.d.mts","names":[],"sources":["../src/SplitButton/SplitButton.tsx"],"mappings":";;;;KAqCK,KAAA;;AAf0D;;;EAoB3D,YAAA;EAoBO;;;;;;;;;;;EARP,QAAA,EAAU,SAAA,EAeV;EAbA,SAAA,WAqBgB;EAnBhB,aAAA,WA0BA;EAxBA,QAAA,YAoCA;EAlCA,KAAA,EAAO,SAAA;EAkCA;AAmMX;;;;;EA9NI,OAAA;EA8NoC;;;;;;;EAtNpC,aAAA,GAAgB,SAAA;;;;;EAKhB,oBAAA;EAEA,eAAA;;;;;;EAMA,IAAA;;;;;;EAMA,OAAA;AAAA;;;;;;;;;;;;;;cAmMS,WAAA;EAAA,QAAsB,KAAK,+BAAA,GAAA,CAAA,OAAA"}

package/SplitButton-DcmmLW8j.cjs

@@ -0,0 +1,184 @@
+const require_Icons = require("./Icons.cjs");
+const require_buttonColorClasses = require("./buttonColorClasses-C3hg1at8.cjs");
+const require_Button = require("./Button.cjs");
+const require_menuContext = require("./menuContext-B6MhMBDf.cjs");
+let _evolve_ui_theme_system = require("@evolve.ui/theme-system");
+let react = require("react");
+let react_jsx_runtime = require("react/jsx-runtime");
+let _floating_ui_react = require("@floating-ui/react");
+//#region src/SplitButton/SplitButtonTrigger.tsx
+/**
+* The caret trigger button used inside `SplitButton`. Renders a square button
+* with a `CaretDown` icon, styled to join seamlessly with the default action button.
+*
+* Not intended for standalone use — use `SplitButton` instead.
+*/
+const SplitButtonTrigger = (0, react.forwardRef)(({ className, disabled = false, isOpen = false, size = "md", variant = "filled", ...rest }, ref) => {
+	const isFilled = variant === "filled";
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+		className: (0, _evolve_ui_theme_system.cn)("hui-focus-visible-outline relative flex items-center justify-center rounded-l-none rounded-r-button outline outline-1 -outline-offset-1 transition-colors", isFilled ? require_buttonColorClasses.filledPrimaryClasses : (0, _evolve_ui_theme_system.cn)(require_buttonColorClasses.outlinedPrimaryClasses, "ml-[-1px]"), {
+			"size-[34px]": size === "sm",
+			"size-[42px]": size === "md",
+			"!bg-primary-200 !text-primary-900": isOpen && !isFilled,
+			"!bg-primary-900": isOpen && isFilled
+		}, className),
+		"data-hui-id": "SplitButtonTrigger",
+		disabled,
+		ref,
+		type: "button",
+		...rest,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Icons.CaretDown, {
+			size: size === "md" ? "sm" : "xs",
+			style: "bold"
+		})
+	});
+});
+SplitButtonTrigger.displayName = "SplitButtonTrigger";
+//#endregion
+//#region src/SplitButton/SplitButton.tsx
+/** SSR guard — prevents hydration mismatch on FloatingPortal (same pattern as Menu.tsx) */
+const useHasMounted = () => {
+	const [hasMounted, setHasMounted] = (0, react.useState)(false);
+	(0, react.useEffect)(() => {
+		setHasMounted(true);
+	}, []);
+	return hasMounted;
+};
+const SplitButtonContent = ({ "aria-label": ariaLabel, children, className, "data-testid": dataTestId, disabled = false, label, loading = false, menuPlacement = "bottom-start", menuTriggerAriaLabel, onDefaultAction, size: sizeProp = "md", variant = "filled" }) => {
+	const [isOpen, setIsOpen] = (0, react.useState)(false);
+	const [activeIndex, setActiveIndex] = (0, react.useState)(null);
+	const elementsRef = (0, react.useRef)([]);
+	const labelsRef = (0, react.useRef)([]);
+	const hasMounted = useHasMounted();
+	const tree = (0, _floating_ui_react.useFloatingTree)();
+	const nodeId = (0, _floating_ui_react.useFloatingNodeId)();
+	const { context, floatingStyles, refs } = (0, _floating_ui_react.useFloating)({
+		middleware: [
+			(0, _floating_ui_react.offset)(8),
+			(0, _floating_ui_react.flip)(),
+			(0, _floating_ui_react.shift)({ padding: 2 }),
+			(0, _floating_ui_react.size)({ apply({ elements, rects }) {
+				elements.floating.style.minWidth = `${rects.reference.width}px`;
+			} })
+		],
+		nodeId,
+		onOpenChange: setIsOpen,
+		open: isOpen,
+		placement: menuPlacement,
+		whileElementsMounted: _floating_ui_react.autoUpdate
+	});
+	const { getFloatingProps, getItemProps, getReferenceProps } = (0, _floating_ui_react.useInteractions)([
+		(0, _floating_ui_react.useClick)(context, { event: "click" }),
+		(0, _floating_ui_react.useDismiss)(context, { bubbles: true }),
+		(0, _floating_ui_react.useRole)(context, { role: "menu" }),
+		(0, _floating_ui_react.useListNavigation)(context, {
+			activeIndex,
+			focusItemOnOpen: false,
+			listRef: elementsRef,
+			onNavigate: setActiveIndex
+		}),
+		(0, _floating_ui_react.useTypeahead)(context, {
+			activeIndex,
+			listRef: labelsRef,
+			onMatch: isOpen ? setActiveIndex : void 0
+		})
+	]);
+	(0, react.useEffect)(() => {
+		if (!tree) return;
+		function handleTreeClick() {
+			setIsOpen(false);
+		}
+		tree.events.on("click", handleTreeClick);
+		return () => {
+			tree.events.off("click", handleTreeClick);
+		};
+	}, [tree]);
+	const resolvedMenuTriggerAriaLabel = menuTriggerAriaLabel ?? (typeof label === "string" ? `See more ${label} actions` : "See more actions");
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		"aria-label": ariaLabel ?? (typeof label === "string" ? label : void 0),
+		className: (0, _evolve_ui_theme_system.cn)("relative inline-flex items-stretch", className),
+		"data-hui-id": "SplitButton",
+		"data-testid": dataTestId,
+		ref: refs.setReference,
+		role: "group",
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Button.Button, {
+				className: (0, _evolve_ui_theme_system.cn)("!rounded-r-none", loading && { "!outline-border-disabled": variant === "outlined" }),
+				disabled,
+				loading,
+				onClick: onDefaultAction,
+				size: sizeProp,
+				style: "primary",
+				variant,
+				children: label
+			}),
+			variant === "filled" && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				"aria-hidden": true,
+				className: "w-px shrink-0 self-stretch bg-text-inverse"
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(SplitButtonTrigger, {
+				"aria-label": resolvedMenuTriggerAriaLabel,
+				className: (0, _evolve_ui_theme_system.cn)(loading && !disabled && variant === "filled" && "disabled:!bg-primary-500", loading && !disabled && variant === "outlined" && "disabled:!bg-background-primary disabled:!outline-primary-500"),
+				disabled: disabled || loading,
+				isOpen,
+				size: sizeProp,
+				variant,
+				...getReferenceProps()
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_menuContext.MenuContext.Provider, {
+				value: {
+					activeIndex,
+					getItemProps,
+					isOpen,
+					numberOfColumns: 1,
+					setActiveIndex
+				},
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_floating_ui_react.FloatingList, {
+					elementsRef,
+					labelsRef,
+					children: isOpen && hasMounted && Boolean(refs.domReference) && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_floating_ui_react.FloatingPortal, {
+						root: refs.domReference,
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_floating_ui_react.FloatingFocusManager, {
+							context,
+							initialFocus: -1,
+							modal: false,
+							returnFocus: true,
+							children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+								className: "Menu z-50 cursor-default whitespace-nowrap rounded-container bg-background-primary py-xs text-text-primary shadow-03 outline-0",
+								"data-testid": "split-button-menu",
+								ref: refs.setFloating,
+								style: floatingStyles,
+								...getFloatingProps(),
+								children
+							})
+						})
+					})
+				})
+			})
+		]
+	});
+};
+/**
+* A split button pairs a primary default action with a dropdown menu of
+* related secondary actions. The left button triggers the action immediately;
+* the right caret button opens the dropdown.
+*
+* Use `MenuItem` children to populate the dropdown:
+* ```tsx
+* <SplitButton label="Export CSV" onDefaultAction={handleExport}>
+*   <MenuItem primaryLabel="Export PDF" onClick={handlePdf} />
+*   <MenuItem primaryLabel="Export Excel" onClick={handleExcel} />
+* </SplitButton>
+* ```
+*/
+const SplitButton = (props) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_floating_ui_react.FloatingTree, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SplitButtonContent, { ...props }) });
+SplitButton.displayName = "SplitButton";
+//#endregion
+Object.defineProperty(exports, "SplitButton", {
+	enumerable: true,
+	get: function() {
+		return SplitButton;
+	}
+});
+
+//# sourceMappingURL=SplitButton-DcmmLW8j.cjs.map

package/SplitButton-DcmmLW8j.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"SplitButton-DcmmLW8j.cjs","names":["filledPrimaryClasses","outlinedPrimaryClasses","CaretDown","autoUpdate","Button","MenuContext","FloatingList","FloatingPortal","FloatingFocusManager","FloatingTree"],"sources":["../src/SplitButton/SplitButtonTrigger.tsx","../src/SplitButton/SplitButton.tsx"],"sourcesContent":["import { cn } from '@evolve.ui/theme-system';\nimport { forwardRef, HTMLProps } from 'react';\n\nimport { filledPrimaryClasses, outlinedPrimaryClasses } from '../Button/buttonColorClasses';\nimport { CaretDown } from '../Icons/generatedIcons/CaretDown';\n\ntype Props = {\n    /** Whether the menu is currently open — applies pressed visual state to the trigger */\n    isOpen?: boolean;\n    /** Button size, should match the adjacent default action button */\n    size?: 'md' | 'sm';\n    /** Visual variant */\n    variant?: 'filled' | 'outlined';\n} & Omit<HTMLProps<HTMLButtonElement>, 'size' | 'type'>;\n\n/**\n * The caret trigger button used inside `SplitButton`. Renders a square button\n * with a `CaretDown` icon, styled to join seamlessly with the default action button.\n *\n * Not intended for standalone use — use `SplitButton` instead.\n */\nexport const SplitButtonTrigger = forwardRef<HTMLButtonElement, Props>(\n    ({ className, disabled = false, isOpen = false, size = 'md', variant = 'filled', ...rest }, ref) => {\n        const isFilled = variant === 'filled';\n\n        return (\n            <button\n                className={cn(\n                    'hui-focus-visible-outline relative flex items-center justify-center rounded-l-none rounded-r-button outline outline-1 -outline-offset-1 transition-colors',\n                    isFilled ? filledPrimaryClasses : cn(outlinedPrimaryClasses, 'ml-[-1px]'),\n                    {\n                        'size-[34px]': size === 'sm',\n                        'size-[42px]': size === 'md',\n                        // Force the pressed/active visual while the menu is open\n                        '!bg-primary-200 !text-primary-900': isOpen && !isFilled,\n                        '!bg-primary-900': isOpen && isFilled,\n                    },\n                    className\n                )}\n                data-hui-id=\"SplitButtonTrigger\"\n                disabled={disabled}\n                ref={ref}\n                type=\"button\"\n                {...rest}\n            >\n                <CaretDown\n                    size={size === 'md' ? 'sm' : 'xs'}\n                    style=\"bold\"\n                />\n            </button>\n        );\n    }\n);\n\nSplitButtonTrigger.displayName = 'SplitButtonTrigger';\n","import { cn } from '@evolve.ui/theme-system';\nimport {\n    autoUpdate,\n    flip,\n    FloatingFocusManager,\n    FloatingList,\n    FloatingPortal,\n    FloatingTree,\n    offset,\n    Placement,\n    shift,\n    size,\n    useClick,\n    useDismiss,\n    useFloating,\n    useFloatingNodeId,\n    useFloatingTree,\n    useInteractions,\n    useListNavigation,\n    useRole,\n    useTypeahead,\n} from '@floating-ui/react';\nimport { ReactNode, useEffect, useRef, useState } from 'react';\n\nimport { Button } from '../Button/Button';\nimport { MenuContext } from '../Menu/context/menuContext';\nimport { SplitButtonTrigger } from './SplitButtonTrigger';\n\n/** SSR guard — prevents hydration mismatch on FloatingPortal (same pattern as Menu.tsx) */\nconst useHasMounted = () => {\n    const [hasMounted, setHasMounted] = useState(false);\n    useEffect(() => {\n        setHasMounted(true);\n    }, []);\n    return hasMounted;\n};\n\ntype Props = {\n    /**\n     * Accessible label for the split button group wrapper.\n     * Defaults to the string value of `label` when `label` is a string.\n     */\n    'aria-label'?: string;\n    /**\n     * `MenuItem` components to render inside the dropdown.\n     *\n     * Usage:\n     * ```tsx\n     * <SplitButton label=\"Export CSV\" onDefaultAction={handleExport}>\n     *   <MenuItem primaryLabel=\"Export PDF\" onClick={handlePdf} />\n     *   <MenuItem primaryLabel=\"Export Excel\" onClick={handleExcel} />\n     * </SplitButton>\n     * ```\n     */\n    children: ReactNode;\n    /** Additional CSS class applied to the wrapper element */\n    className?: string;\n    /** Test id applied to the wrapper element for consumer test targeting */\n    'data-testid'?: string;\n    /** Disables both the default action button and the menu trigger */\n    disabled?: boolean;\n    /** Label for the default action button */\n    label: ReactNode;\n    /**\n     * Shows a loading spinner on the default action button and disables the\n     * dropdown trigger to prevent new selections while an action is in-flight.\n     *\n     * @default false\n     */\n    loading?: boolean;\n    /**\n     * Preferred placement of the dropdown menu. Flip middleware will\n     * automatically move it to the opposite side if there is insufficient\n     * viewport space.\n     *\n     * @default 'bottom-start'\n     */\n    menuPlacement?: Placement;\n    /**\n     * Accessible label for the menu trigger (caret) button.\n     * Defaults to `\"See more {label} actions\"` when `label` is a string.\n     */\n    menuTriggerAriaLabel?: string;\n    /** Callback fired when the default action button is clicked */\n    onDefaultAction: () => void;\n    /**\n     * Button size.\n     *\n     * @default 'md'\n     */\n    size?: 'md' | 'sm';\n    /**\n     * Visual variant — `'filled'` (primary) or `'outlined'` (secondary).\n     *\n     * @default 'filled'\n     */\n    variant?: 'filled' | 'outlined';\n};\n\nconst SplitButtonContent = ({\n    'aria-label': ariaLabel,\n    children,\n    className,\n    'data-testid': dataTestId,\n    disabled = false,\n    label,\n    loading = false,\n    menuPlacement = 'bottom-start',\n    menuTriggerAriaLabel,\n    onDefaultAction,\n    size: sizeProp = 'md',\n    variant = 'filled',\n}: Props) => {\n    const [isOpen, setIsOpen] = useState(false);\n    const [activeIndex, setActiveIndex] = useState<number | null>(null);\n    const elementsRef = useRef<Array<HTMLSpanElement | null>>([]);\n    const labelsRef = useRef<Array<string | null>>([]);\n    const hasMounted = useHasMounted();\n\n    const tree = useFloatingTree();\n    const nodeId = useFloatingNodeId();\n\n    const { context, floatingStyles, refs } = useFloating<HTMLDivElement>({\n        middleware: [\n            offset(8),\n            flip(),\n            shift({ padding: 2 }),\n            // Match the menu width to the full button width (action + trigger combined)\n            size({\n                apply({ elements, rects }) {\n                    elements.floating.style.minWidth = `${rects.reference.width}px`;\n                },\n            }),\n        ],\n        nodeId,\n        onOpenChange: setIsOpen,\n        open: isOpen,\n        placement: menuPlacement,\n        whileElementsMounted: autoUpdate,\n    });\n\n    const click = useClick(context, { event: 'click' });\n    const dismiss = useDismiss(context, { bubbles: true });\n    const role = useRole(context, { role: 'menu' });\n    const listNavigation = useListNavigation(context, {\n        activeIndex,\n        focusItemOnOpen: false,\n        listRef: elementsRef,\n        onNavigate: setActiveIndex,\n    });\n\n    const typeahead = useTypeahead(context, {\n        activeIndex,\n        listRef: labelsRef,\n        onMatch: isOpen ? setActiveIndex : undefined,\n    });\n\n    const { getFloatingProps, getItemProps, getReferenceProps } = useInteractions([\n        click,\n        dismiss,\n        role,\n        listNavigation,\n        typeahead,\n    ]);\n\n    // Close the dropdown when any MenuItem fires its click tree event.\n    // MenuItem calls tree.events.emit('click') on selection, so we listen here\n    // rather than relying on DOM event bubbling (which MenuItem stops).\n    useEffect(() => {\n        if (!tree) {\n            return;\n        }\n\n        function handleTreeClick() {\n            setIsOpen(false);\n        }\n\n        tree.events.on('click', handleTreeClick);\n        return () => {\n            tree.events.off('click', handleTreeClick);\n        };\n    }, [tree]);\n\n    const resolvedMenuTriggerAriaLabel =\n        menuTriggerAriaLabel ?? (typeof label === 'string' ? `See more ${label} actions` : 'See more actions');\n\n    return (\n        // The wrapper div is the floating-ui reference so placement and min-width\n        // are relative to the full combined button, not just the caret trigger.\n        <div\n            aria-label={ariaLabel ?? (typeof label === 'string' ? label : undefined)}\n            className={cn('relative inline-flex items-stretch', className)}\n            data-hui-id=\"SplitButton\"\n            data-testid={dataTestId}\n            ref={refs.setReference}\n            role=\"group\"\n        >\n            <Button\n                className={cn(\n                    '!rounded-r-none',\n                    loading && {\n                        '!outline-border-disabled': variant === 'outlined',\n                    }\n                )}\n                disabled={disabled}\n                loading={loading}\n                onClick={onDefaultAction}\n                size={sizeProp}\n                style=\"primary\"\n                variant={variant}\n            >\n                {label}\n            </Button>\n\n            {variant === 'filled' && (\n                <div\n                    aria-hidden\n                    className=\"w-px shrink-0 self-stretch bg-text-inverse\"\n                />\n            )}\n\n            <SplitButtonTrigger\n                aria-label={resolvedMenuTriggerAriaLabel}\n                className={cn(\n                    // When loading (not genuinely disabled), keep active visual styles\n                    // but let disabled:cursor-not-allowed through for the not-allowed cursor.\n                    loading && !disabled && variant === 'filled' && 'disabled:!bg-primary-500',\n                    loading &&\n                        !disabled &&\n                        variant === 'outlined' &&\n                        'disabled:!bg-background-primary disabled:!outline-primary-500'\n                )}\n                disabled={disabled || loading}\n                isOpen={isOpen}\n                size={sizeProp}\n                variant={variant}\n                {...getReferenceProps()}\n            />\n\n            <MenuContext.Provider\n                value={{\n                    activeIndex,\n                    getItemProps,\n                    isOpen,\n                    numberOfColumns: 1,\n                    setActiveIndex,\n                }}\n            >\n                <FloatingList\n                    elementsRef={elementsRef}\n                    labelsRef={labelsRef}\n                >\n                    {isOpen && hasMounted && Boolean(refs.domReference) && (\n                        <FloatingPortal root={refs.domReference}>\n                            <FloatingFocusManager\n                                context={context}\n                                initialFocus={-1}\n                                modal={false}\n                                returnFocus\n                            >\n                                <div\n                                    className=\"Menu z-50 cursor-default whitespace-nowrap rounded-container bg-background-primary py-xs text-text-primary shadow-03 outline-0\"\n                                    data-testid=\"split-button-menu\"\n                                    ref={refs.setFloating}\n                                    style={floatingStyles}\n                                    {...getFloatingProps()}\n                                >\n                                    {children}\n                                </div>\n                            </FloatingFocusManager>\n                        </FloatingPortal>\n                    )}\n                </FloatingList>\n            </MenuContext.Provider>\n        </div>\n    );\n};\n\n/**\n * A split button pairs a primary default action with a dropdown menu of\n * related secondary actions. The left button triggers the action immediately;\n * the right caret button opens the dropdown.\n *\n * Use `MenuItem` children to populate the dropdown:\n * ```tsx\n * <SplitButton label=\"Export CSV\" onDefaultAction={handleExport}>\n *   <MenuItem primaryLabel=\"Export PDF\" onClick={handlePdf} />\n *   <MenuItem primaryLabel=\"Export Excel\" onClick={handleExcel} />\n * </SplitButton>\n * ```\n */\nexport const SplitButton = (props: Props) => (\n    <FloatingTree>\n        <SplitButtonContent {...props} />\n    </FloatingTree>\n);\n\nSplitButton.displayName = 'SplitButton';\n"],"mappings":"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"}

package/SplitButton-WE5ymwCQ.mjs

@@ -0,0 +1,179 @@
+import { CaretDown } from "./Icons.mjs";
+import { c as outlinedPrimaryClasses, i as filledPrimaryClasses } from "./buttonColorClasses-B7OU4aQA.mjs";
+import { Button } from "./Button.mjs";
+import { t as MenuContext } from "./menuContext-4P6eKzkH.mjs";
+import { cn } from "@evolve.ui/theme-system";
+import { forwardRef, useEffect, useRef, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { FloatingFocusManager, FloatingList, FloatingPortal, FloatingTree, autoUpdate, flip, offset, shift, size, useClick, useDismiss, useFloating, useFloatingNodeId, useFloatingTree, useInteractions, useListNavigation, useRole, useTypeahead } from "@floating-ui/react";
+//#region src/SplitButton/SplitButtonTrigger.tsx
+/**
+* The caret trigger button used inside `SplitButton`. Renders a square button
+* with a `CaretDown` icon, styled to join seamlessly with the default action button.
+*
+* Not intended for standalone use — use `SplitButton` instead.
+*/
+const SplitButtonTrigger = forwardRef(({ className, disabled = false, isOpen = false, size = "md", variant = "filled", ...rest }, ref) => {
+	const isFilled = variant === "filled";
+	return /* @__PURE__ */ jsx("button", {
+		className: cn("hui-focus-visible-outline relative flex items-center justify-center rounded-l-none rounded-r-button outline outline-1 -outline-offset-1 transition-colors", isFilled ? filledPrimaryClasses : cn(outlinedPrimaryClasses, "ml-[-1px]"), {
+			"size-[34px]": size === "sm",
+			"size-[42px]": size === "md",
+			"!bg-primary-200 !text-primary-900": isOpen && !isFilled,
+			"!bg-primary-900": isOpen && isFilled
+		}, className),
+		"data-hui-id": "SplitButtonTrigger",
+		disabled,
+		ref,
+		type: "button",
+		...rest,
+		children: /* @__PURE__ */ jsx(CaretDown, {
+			size: size === "md" ? "sm" : "xs",
+			style: "bold"
+		})
+	});
+});
+SplitButtonTrigger.displayName = "SplitButtonTrigger";
+//#endregion
+//#region src/SplitButton/SplitButton.tsx
+/** SSR guard — prevents hydration mismatch on FloatingPortal (same pattern as Menu.tsx) */
+const useHasMounted = () => {
+	const [hasMounted, setHasMounted] = useState(false);
+	useEffect(() => {
+		setHasMounted(true);
+	}, []);
+	return hasMounted;
+};
+const SplitButtonContent = ({ "aria-label": ariaLabel, children, className, "data-testid": dataTestId, disabled = false, label, loading = false, menuPlacement = "bottom-start", menuTriggerAriaLabel, onDefaultAction, size: sizeProp = "md", variant = "filled" }) => {
+	const [isOpen, setIsOpen] = useState(false);
+	const [activeIndex, setActiveIndex] = useState(null);
+	const elementsRef = useRef([]);
+	const labelsRef = useRef([]);
+	const hasMounted = useHasMounted();
+	const tree = useFloatingTree();
+	const nodeId = useFloatingNodeId();
+	const { context, floatingStyles, refs } = useFloating({
+		middleware: [
+			offset(8),
+			flip(),
+			shift({ padding: 2 }),
+			size({ apply({ elements, rects }) {
+				elements.floating.style.minWidth = `${rects.reference.width}px`;
+			} })
+		],
+		nodeId,
+		onOpenChange: setIsOpen,
+		open: isOpen,
+		placement: menuPlacement,
+		whileElementsMounted: autoUpdate
+	});
+	const { getFloatingProps, getItemProps, getReferenceProps } = useInteractions([
+		useClick(context, { event: "click" }),
+		useDismiss(context, { bubbles: true }),
+		useRole(context, { role: "menu" }),
+		useListNavigation(context, {
+			activeIndex,
+			focusItemOnOpen: false,
+			listRef: elementsRef,
+			onNavigate: setActiveIndex
+		}),
+		useTypeahead(context, {
+			activeIndex,
+			listRef: labelsRef,
+			onMatch: isOpen ? setActiveIndex : void 0
+		})
+	]);
+	useEffect(() => {
+		if (!tree) return;
+		function handleTreeClick() {
+			setIsOpen(false);
+		}
+		tree.events.on("click", handleTreeClick);
+		return () => {
+			tree.events.off("click", handleTreeClick);
+		};
+	}, [tree]);
+	const resolvedMenuTriggerAriaLabel = menuTriggerAriaLabel ?? (typeof label === "string" ? `See more ${label} actions` : "See more actions");
+	return /* @__PURE__ */ jsxs("div", {
+		"aria-label": ariaLabel ?? (typeof label === "string" ? label : void 0),
+		className: cn("relative inline-flex items-stretch", className),
+		"data-hui-id": "SplitButton",
+		"data-testid": dataTestId,
+		ref: refs.setReference,
+		role: "group",
+		children: [
+			/* @__PURE__ */ jsx(Button, {
+				className: cn("!rounded-r-none", loading && { "!outline-border-disabled": variant === "outlined" }),
+				disabled,
+				loading,
+				onClick: onDefaultAction,
+				size: sizeProp,
+				style: "primary",
+				variant,
+				children: label
+			}),
+			variant === "filled" && /* @__PURE__ */ jsx("div", {
+				"aria-hidden": true,
+				className: "w-px shrink-0 self-stretch bg-text-inverse"
+			}),
+			/* @__PURE__ */ jsx(SplitButtonTrigger, {
+				"aria-label": resolvedMenuTriggerAriaLabel,
+				className: cn(loading && !disabled && variant === "filled" && "disabled:!bg-primary-500", loading && !disabled && variant === "outlined" && "disabled:!bg-background-primary disabled:!outline-primary-500"),
+				disabled: disabled || loading,
+				isOpen,
+				size: sizeProp,
+				variant,
+				...getReferenceProps()
+			}),
+			/* @__PURE__ */ jsx(MenuContext.Provider, {
+				value: {
+					activeIndex,
+					getItemProps,
+					isOpen,
+					numberOfColumns: 1,
+					setActiveIndex
+				},
+				children: /* @__PURE__ */ jsx(FloatingList, {
+					elementsRef,
+					labelsRef,
+					children: isOpen && hasMounted && Boolean(refs.domReference) && /* @__PURE__ */ jsx(FloatingPortal, {
+						root: refs.domReference,
+						children: /* @__PURE__ */ jsx(FloatingFocusManager, {
+							context,
+							initialFocus: -1,
+							modal: false,
+							returnFocus: true,
+							children: /* @__PURE__ */ jsx("div", {
+								className: "Menu z-50 cursor-default whitespace-nowrap rounded-container bg-background-primary py-xs text-text-primary shadow-03 outline-0",
+								"data-testid": "split-button-menu",
+								ref: refs.setFloating,
+								style: floatingStyles,
+								...getFloatingProps(),
+								children
+							})
+						})
+					})
+				})
+			})
+		]
+	});
+};
+/**
+* A split button pairs a primary default action with a dropdown menu of
+* related secondary actions. The left button triggers the action immediately;
+* the right caret button opens the dropdown.
+*
+* Use `MenuItem` children to populate the dropdown:
+* ```tsx
+* <SplitButton label="Export CSV" onDefaultAction={handleExport}>
+*   <MenuItem primaryLabel="Export PDF" onClick={handlePdf} />
+*   <MenuItem primaryLabel="Export Excel" onClick={handleExcel} />
+* </SplitButton>
+* ```
+*/
+const SplitButton = (props) => /* @__PURE__ */ jsx(FloatingTree, { children: /* @__PURE__ */ jsx(SplitButtonContent, { ...props }) });
+SplitButton.displayName = "SplitButton";
+//#endregion
+export { SplitButton as t };
+
+//# sourceMappingURL=SplitButton-WE5ymwCQ.mjs.map

package/SplitButton-WE5ymwCQ.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"SplitButton-WE5ymwCQ.mjs","names":[],"sources":["../src/SplitButton/SplitButtonTrigger.tsx","../src/SplitButton/SplitButton.tsx"],"sourcesContent":["import { cn } from '@evolve.ui/theme-system';\nimport { forwardRef, HTMLProps } from 'react';\n\nimport { filledPrimaryClasses, outlinedPrimaryClasses } from '../Button/buttonColorClasses';\nimport { CaretDown } from '../Icons/generatedIcons/CaretDown';\n\ntype Props = {\n    /** Whether the menu is currently open — applies pressed visual state to the trigger */\n    isOpen?: boolean;\n    /** Button size, should match the adjacent default action button */\n    size?: 'md' | 'sm';\n    /** Visual variant */\n    variant?: 'filled' | 'outlined';\n} & Omit<HTMLProps<HTMLButtonElement>, 'size' | 'type'>;\n\n/**\n * The caret trigger button used inside `SplitButton`. Renders a square button\n * with a `CaretDown` icon, styled to join seamlessly with the default action button.\n *\n * Not intended for standalone use — use `SplitButton` instead.\n */\nexport const SplitButtonTrigger = forwardRef<HTMLButtonElement, Props>(\n    ({ className, disabled = false, isOpen = false, size = 'md', variant = 'filled', ...rest }, ref) => {\n        const isFilled = variant === 'filled';\n\n        return (\n            <button\n                className={cn(\n                    'hui-focus-visible-outline relative flex items-center justify-center rounded-l-none rounded-r-button outline outline-1 -outline-offset-1 transition-colors',\n                    isFilled ? filledPrimaryClasses : cn(outlinedPrimaryClasses, 'ml-[-1px]'),\n                    {\n                        'size-[34px]': size === 'sm',\n                        'size-[42px]': size === 'md',\n                        // Force the pressed/active visual while the menu is open\n                        '!bg-primary-200 !text-primary-900': isOpen && !isFilled,\n                        '!bg-primary-900': isOpen && isFilled,\n                    },\n                    className\n                )}\n                data-hui-id=\"SplitButtonTrigger\"\n                disabled={disabled}\n                ref={ref}\n                type=\"button\"\n                {...rest}\n            >\n                <CaretDown\n                    size={size === 'md' ? 'sm' : 'xs'}\n                    style=\"bold\"\n                />\n            </button>\n        );\n    }\n);\n\nSplitButtonTrigger.displayName = 'SplitButtonTrigger';\n","import { cn } from '@evolve.ui/theme-system';\nimport {\n    autoUpdate,\n    flip,\n    FloatingFocusManager,\n    FloatingList,\n    FloatingPortal,\n    FloatingTree,\n    offset,\n    Placement,\n    shift,\n    size,\n    useClick,\n    useDismiss,\n    useFloating,\n    useFloatingNodeId,\n    useFloatingTree,\n    useInteractions,\n    useListNavigation,\n    useRole,\n    useTypeahead,\n} from '@floating-ui/react';\nimport { ReactNode, useEffect, useRef, useState } from 'react';\n\nimport { Button } from '../Button/Button';\nimport { MenuContext } from '../Menu/context/menuContext';\nimport { SplitButtonTrigger } from './SplitButtonTrigger';\n\n/** SSR guard — prevents hydration mismatch on FloatingPortal (same pattern as Menu.tsx) */\nconst useHasMounted = () => {\n    const [hasMounted, setHasMounted] = useState(false);\n    useEffect(() => {\n        setHasMounted(true);\n    }, []);\n    return hasMounted;\n};\n\ntype Props = {\n    /**\n     * Accessible label for the split button group wrapper.\n     * Defaults to the string value of `label` when `label` is a string.\n     */\n    'aria-label'?: string;\n    /**\n     * `MenuItem` components to render inside the dropdown.\n     *\n     * Usage:\n     * ```tsx\n     * <SplitButton label=\"Export CSV\" onDefaultAction={handleExport}>\n     *   <MenuItem primaryLabel=\"Export PDF\" onClick={handlePdf} />\n     *   <MenuItem primaryLabel=\"Export Excel\" onClick={handleExcel} />\n     * </SplitButton>\n     * ```\n     */\n    children: ReactNode;\n    /** Additional CSS class applied to the wrapper element */\n    className?: string;\n    /** Test id applied to the wrapper element for consumer test targeting */\n    'data-testid'?: string;\n    /** Disables both the default action button and the menu trigger */\n    disabled?: boolean;\n    /** Label for the default action button */\n    label: ReactNode;\n    /**\n     * Shows a loading spinner on the default action button and disables the\n     * dropdown trigger to prevent new selections while an action is in-flight.\n     *\n     * @default false\n     */\n    loading?: boolean;\n    /**\n     * Preferred placement of the dropdown menu. Flip middleware will\n     * automatically move it to the opposite side if there is insufficient\n     * viewport space.\n     *\n     * @default 'bottom-start'\n     */\n    menuPlacement?: Placement;\n    /**\n     * Accessible label for the menu trigger (caret) button.\n     * Defaults to `\"See more {label} actions\"` when `label` is a string.\n     */\n    menuTriggerAriaLabel?: string;\n    /** Callback fired when the default action button is clicked */\n    onDefaultAction: () => void;\n    /**\n     * Button size.\n     *\n     * @default 'md'\n     */\n    size?: 'md' | 'sm';\n    /**\n     * Visual variant — `'filled'` (primary) or `'outlined'` (secondary).\n     *\n     * @default 'filled'\n     */\n    variant?: 'filled' | 'outlined';\n};\n\nconst SplitButtonContent = ({\n    'aria-label': ariaLabel,\n    children,\n    className,\n    'data-testid': dataTestId,\n    disabled = false,\n    label,\n    loading = false,\n    menuPlacement = 'bottom-start',\n    menuTriggerAriaLabel,\n    onDefaultAction,\n    size: sizeProp = 'md',\n    variant = 'filled',\n}: Props) => {\n    const [isOpen, setIsOpen] = useState(false);\n    const [activeIndex, setActiveIndex] = useState<number | null>(null);\n    const elementsRef = useRef<Array<HTMLSpanElement | null>>([]);\n    const labelsRef = useRef<Array<string | null>>([]);\n    const hasMounted = useHasMounted();\n\n    const tree = useFloatingTree();\n    const nodeId = useFloatingNodeId();\n\n    const { context, floatingStyles, refs } = useFloating<HTMLDivElement>({\n        middleware: [\n            offset(8),\n            flip(),\n            shift({ padding: 2 }),\n            // Match the menu width to the full button width (action + trigger combined)\n            size({\n                apply({ elements, rects }) {\n                    elements.floating.style.minWidth = `${rects.reference.width}px`;\n                },\n            }),\n        ],\n        nodeId,\n        onOpenChange: setIsOpen,\n        open: isOpen,\n        placement: menuPlacement,\n        whileElementsMounted: autoUpdate,\n    });\n\n    const click = useClick(context, { event: 'click' });\n    const dismiss = useDismiss(context, { bubbles: true });\n    const role = useRole(context, { role: 'menu' });\n    const listNavigation = useListNavigation(context, {\n        activeIndex,\n        focusItemOnOpen: false,\n        listRef: elementsRef,\n        onNavigate: setActiveIndex,\n    });\n\n    const typeahead = useTypeahead(context, {\n        activeIndex,\n        listRef: labelsRef,\n        onMatch: isOpen ? setActiveIndex : undefined,\n    });\n\n    const { getFloatingProps, getItemProps, getReferenceProps } = useInteractions([\n        click,\n        dismiss,\n        role,\n        listNavigation,\n        typeahead,\n    ]);\n\n    // Close the dropdown when any MenuItem fires its click tree event.\n    // MenuItem calls tree.events.emit('click') on selection, so we listen here\n    // rather than relying on DOM event bubbling (which MenuItem stops).\n    useEffect(() => {\n        if (!tree) {\n            return;\n        }\n\n        function handleTreeClick() {\n            setIsOpen(false);\n        }\n\n        tree.events.on('click', handleTreeClick);\n        return () => {\n            tree.events.off('click', handleTreeClick);\n        };\n    }, [tree]);\n\n    const resolvedMenuTriggerAriaLabel =\n        menuTriggerAriaLabel ?? (typeof label === 'string' ? `See more ${label} actions` : 'See more actions');\n\n    return (\n        // The wrapper div is the floating-ui reference so placement and min-width\n        // are relative to the full combined button, not just the caret trigger.\n        <div\n            aria-label={ariaLabel ?? (typeof label === 'string' ? label : undefined)}\n            className={cn('relative inline-flex items-stretch', className)}\n            data-hui-id=\"SplitButton\"\n            data-testid={dataTestId}\n            ref={refs.setReference}\n            role=\"group\"\n        >\n            <Button\n                className={cn(\n                    '!rounded-r-none',\n                    loading && {\n                        '!outline-border-disabled': variant === 'outlined',\n                    }\n                )}\n                disabled={disabled}\n                loading={loading}\n                onClick={onDefaultAction}\n                size={sizeProp}\n                style=\"primary\"\n                variant={variant}\n            >\n                {label}\n            </Button>\n\n            {variant === 'filled' && (\n                <div\n                    aria-hidden\n                    className=\"w-px shrink-0 self-stretch bg-text-inverse\"\n                />\n            )}\n\n            <SplitButtonTrigger\n                aria-label={resolvedMenuTriggerAriaLabel}\n                className={cn(\n                    // When loading (not genuinely disabled), keep active visual styles\n                    // but let disabled:cursor-not-allowed through for the not-allowed cursor.\n                    loading && !disabled && variant === 'filled' && 'disabled:!bg-primary-500',\n                    loading &&\n                        !disabled &&\n                        variant === 'outlined' &&\n                        'disabled:!bg-background-primary disabled:!outline-primary-500'\n                )}\n                disabled={disabled || loading}\n                isOpen={isOpen}\n                size={sizeProp}\n                variant={variant}\n                {...getReferenceProps()}\n            />\n\n            <MenuContext.Provider\n                value={{\n                    activeIndex,\n                    getItemProps,\n                    isOpen,\n                    numberOfColumns: 1,\n                    setActiveIndex,\n                }}\n            >\n                <FloatingList\n                    elementsRef={elementsRef}\n                    labelsRef={labelsRef}\n                >\n                    {isOpen && hasMounted && Boolean(refs.domReference) && (\n                        <FloatingPortal root={refs.domReference}>\n                            <FloatingFocusManager\n                                context={context}\n                                initialFocus={-1}\n                                modal={false}\n                                returnFocus\n                            >\n                                <div\n                                    className=\"Menu z-50 cursor-default whitespace-nowrap rounded-container bg-background-primary py-xs text-text-primary shadow-03 outline-0\"\n                                    data-testid=\"split-button-menu\"\n                                    ref={refs.setFloating}\n                                    style={floatingStyles}\n                                    {...getFloatingProps()}\n                                >\n                                    {children}\n                                </div>\n                            </FloatingFocusManager>\n                        </FloatingPortal>\n                    )}\n                </FloatingList>\n            </MenuContext.Provider>\n        </div>\n    );\n};\n\n/**\n * A split button pairs a primary default action with a dropdown menu of\n * related secondary actions. The left button triggers the action immediately;\n * the right caret button opens the dropdown.\n *\n * Use `MenuItem` children to populate the dropdown:\n * ```tsx\n * <SplitButton label=\"Export CSV\" onDefaultAction={handleExport}>\n *   <MenuItem primaryLabel=\"Export PDF\" onClick={handlePdf} />\n *   <MenuItem primaryLabel=\"Export Excel\" onClick={handleExcel} />\n * </SplitButton>\n * ```\n */\nexport const SplitButton = (props: Props) => (\n    <FloatingTree>\n        <SplitButtonContent {...props} />\n    </FloatingTree>\n);\n\nSplitButton.displayName = 'SplitButton';\n"],"mappings":"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"}