@ctrl-ui/react 0.8.2 → 0.8.5

package/dist/ui/trigger-menu.d.ts

@@ -2,7 +2,7 @@ import { OpenChangeEventDetails } from "../control-props.js";
 import { PopupKnobStyle } from "../knob-contracts/popup-knobs.js";
 import { CSSProperties, ComponentProps, ReactNode } from "react";
 //#region src/ui/trigger-menu.d.ts
-type TriggerMenuProps = {
+export type TriggerMenuProps = {
   open: boolean;
   onOpenChange?: (open: boolean, eventDetails: OpenChangeEventDetails) => void;
   anchorRect: DOMRect | null;
@@ -14,33 +14,32 @@ type TriggerMenuProps = {
 } & {
   style?: CSSProperties & PopupKnobStyle;
 };
-type TriggerMenuListProps = ComponentProps<"div"> & {
+export type TriggerMenuListProps = ComponentProps<"div"> & {
   style?: CSSProperties & PopupKnobStyle;
 };
-type TriggerMenuItemProps = Omit<Omit<ComponentProps<"div">, "onSelect"> & {
+export type TriggerMenuItemProps = Omit<Omit<ComponentProps<"div">, "onSelect"> & {
   active?: boolean;
   disabled?: boolean;
 }, "style"> & {
   style?: CSSProperties & PopupKnobStyle;
 };
-type TriggerMenuEmptyProps = Omit<ComponentProps<"div">, "style"> & {
+export type TriggerMenuEmptyProps = Omit<ComponentProps<"div">, "style"> & {
   style?: CSSProperties & PopupKnobStyle;
 };
-type TriggerMenuGroupProps = ComponentProps<"div"> & {
+export type TriggerMenuGroupProps = ComponentProps<"div"> & {
   style?: CSSProperties & PopupKnobStyle;
 };
-type TriggerMenuGroupLabelProps = Omit<ComponentProps<"div">, "style"> & {
+export type TriggerMenuGroupLabelProps = Omit<ComponentProps<"div">, "style"> & {
   style?: CSSProperties & PopupKnobStyle;
 };
-type TriggerMenuIconProps = Omit<ComponentProps<"span">, "style"> & {
+export type TriggerMenuIconProps = Omit<ComponentProps<"span">, "style"> & {
   style?: CSSProperties & PopupKnobStyle;
 };
-declare function TriggerMenu({ open, onOpenChange, anchorRect, side, align, sideOffset, className, children }: TriggerMenuProps): import("react").JSX.Element;
-declare function TriggerMenuList({ className, ...props }: TriggerMenuListProps): import("react").JSX.Element;
-declare function TriggerMenuItem({ className, active, disabled, onMouseDown, ...props }: TriggerMenuItemProps): import("react").JSX.Element;
-declare function TriggerMenuIcon({ className, ...props }: TriggerMenuIconProps): import("react").JSX.Element;
-declare function TriggerMenuEmpty({ className, ...props }: TriggerMenuEmptyProps): import("react").JSX.Element;
-declare function TriggerMenuGroup({ className, ...props }: TriggerMenuGroupProps): import("react").JSX.Element;
-declare function TriggerMenuGroupLabel({ className, ...props }: TriggerMenuGroupLabelProps): import("react").JSX.Element;
-//#endregion
-export { TriggerMenu, TriggerMenuEmpty, TriggerMenuEmptyProps, TriggerMenuGroup, TriggerMenuGroupLabel, TriggerMenuGroupLabelProps, TriggerMenuGroupProps, TriggerMenuIcon, TriggerMenuIconProps, TriggerMenuItem, TriggerMenuItemProps, TriggerMenuList, TriggerMenuListProps, TriggerMenuProps };
+export declare function TriggerMenu({ open, onOpenChange, anchorRect, side, align, sideOffset, className, children }: TriggerMenuProps): import("react").JSX.Element;
+export declare function TriggerMenuList({ className, ...props }: TriggerMenuListProps): import("react").JSX.Element;
+export declare function TriggerMenuItem({ className, active, disabled, onMouseDown, ...props }: TriggerMenuItemProps): import("react").JSX.Element;
+export declare function TriggerMenuIcon({ className, ...props }: TriggerMenuIconProps): import("react").JSX.Element;
+export declare function TriggerMenuEmpty({ className, ...props }: TriggerMenuEmptyProps): import("react").JSX.Element;
+export declare function TriggerMenuGroup({ className, ...props }: TriggerMenuGroupProps): import("react").JSX.Element;
+export declare function TriggerMenuGroupLabel({ className, ...props }: TriggerMenuGroupLabelProps): import("react").JSX.Element;
+//#endregion

package/dist/ui/trigger-menu.js

@@ -1,11 +1,13 @@
 "use client";
 import { cn } from "../lib/cn.js";
-import { skinEffects, skinId } from "../skin.js";
+import { controlEffectsAttribute } from "../skin.js";
+import { useSkin } from "../skin-provider.js";
 import { popupItemStructureClasses } from "../surface-variants.js";
 import { jsx } from "react/jsx-runtime";
 import { Popover } from "@base-ui/react/popover";
 //#region src/ui/trigger-menu.tsx
 function TriggerMenu({ open, onOpenChange, anchorRect, side = "top", align = "start", sideOffset = 8, className, children }) {
+	const skin = useSkin();
 	return /* @__PURE__ */ jsx(Popover.Root, {
 		open,
 		onOpenChange: (next, eventDetails) => onOpenChange?.(next, eventDetails),
@@ -15,13 +17,13 @@ function TriggerMenu({ open, onOpenChange, anchorRect, side = "top", align = "st
 			"data-popup-kind": "trigger-menu",
 			"data-control-family": "popup",
 			"data-slot": "positioner",
-			"data-skin": skinId(),
-			"data-effects": skinEffects(),
+			"data-skin": skin.id,
+			"data-effects": controlEffectsAttribute(skin.effects),
 			anchor: anchorRect === null ? void 0 : () => ({ getBoundingClientRect: () => anchorRect }),
 			side,
 			align,
 			sideOffset,
-			className: "z-[80]",
+			className: "z-(--z-popup)",
 			children: /* @__PURE__ */ jsx(Popover.Popup, {
 				"data-control-ui": "trigger-menu",
 				"data-popup-kind": "trigger-menu",

package/dist/ui/use-switch-drag.d.ts

@@ -0,0 +1,7 @@
+//#region src/ui/use-switch-drag.d.ts
+export declare function useSwitchDrag(): {
+  thumbRef: import("react").RefObject<HTMLSpanElement | null>;
+  dragProps: Pick<import("@base-ui/react").SwitchRootProps, "onClick" | "onKeyDown" | "onLostPointerCapture" | "onPointerCancel" | "onPointerDown" | "onPointerMove" | "onPointerUp">;
+  dragProgress: number | null;
+};
+//#endregion

package/dist/ui/use-switch-drag.js

@@ -0,0 +1,104 @@
+"use client";
+import { useRef, useState } from "react";
+//#region src/ui/use-switch-drag.ts
+const dragThresholdPx = 3;
+function switchDragProgress(gesture, clientX) {
+	const deltaX = (clientX - gesture.startX) * gesture.direction;
+	return Math.max(0, Math.min(1, gesture.startProgress + deltaX / gesture.travel));
+}
+function isSwitchLocked(root) {
+	return root.hasAttribute("data-disabled") || root.hasAttribute("data-readonly");
+}
+function useSwitchDrag() {
+	const thumbRef = useRef(null);
+	const [dragProgress, setDragProgress] = useState(null);
+	const gestureRef = useRef(null);
+	function cancelDrag(gesture) {
+		gesture.canceled = true;
+		setDragProgress(null);
+	}
+	return {
+		thumbRef,
+		dragProps: {
+			onPointerDown(event) {
+				const root = event.currentTarget;
+				if (!(event.isPrimary && event.button === 0 && !isSwitchLocked(root)) || !thumbRef.current) return;
+				setDragProgress(null);
+				const styles = getComputedStyle(root);
+				const travel = root.clientWidth - Number.parseFloat(styles.paddingLeft) - Number.parseFloat(styles.paddingRight) - thumbRef.current.offsetWidth;
+				if (travel <= 0) return;
+				const progress = root.hasAttribute("data-checked") ? 1 : 0;
+				gestureRef.current = {
+					pointerId: event.pointerId,
+					startX: event.clientX,
+					startY: event.clientY,
+					startProgress: progress,
+					travel,
+					direction: styles.direction === "rtl" ? -1 : 1,
+					dragged: false,
+					released: false,
+					canceled: false
+				};
+				root.setPointerCapture(event.pointerId);
+			},
+			onPointerMove(event) {
+				const gesture = gestureRef.current;
+				if (!gesture || gesture.pointerId !== event.pointerId || gesture.released) return;
+				const root = event.currentTarget;
+				if (gesture.canceled || isSwitchLocked(root)) {
+					cancelDrag(gesture);
+					return;
+				}
+				const deltaX = event.clientX - gesture.startX;
+				const deltaY = event.clientY - gesture.startY;
+				if (!gesture.dragged) {
+					if (Math.abs(deltaY) > Math.max(dragThresholdPx, Math.abs(deltaX))) {
+						cancelDrag(gesture);
+						return;
+					}
+					if (Math.abs(deltaX) < dragThresholdPx) return;
+					gesture.dragged = true;
+				}
+				setDragProgress(switchDragProgress(gesture, event.clientX));
+			},
+			onPointerUp(event) {
+				const gesture = gestureRef.current;
+				if (!gesture || gesture.pointerId !== event.pointerId) return;
+				gesture.released = true;
+				setDragProgress(null);
+				if (!gesture.dragged || gesture.canceled) return;
+				const root = event.currentTarget;
+				const shouldToggle = switchDragProgress(gesture, event.clientX) >= .5 !== root.hasAttribute("data-checked") && !isSwitchLocked(root);
+				gesture.canceled = true;
+				if (shouldToggle) root.click();
+			},
+			onPointerCancel(event) {
+				const gesture = gestureRef.current;
+				if (!gesture || gesture.pointerId !== event.pointerId) return;
+				cancelDrag(gesture);
+			},
+			onLostPointerCapture(event) {
+				const gesture = gestureRef.current;
+				if (!gesture || gesture.pointerId !== event.pointerId || gesture.released) return;
+				cancelDrag(gesture);
+			},
+			onKeyDown(event) {
+				if (event.key !== "Escape" || !gestureRef.current) return;
+				cancelDrag(gestureRef.current);
+			},
+			onClick(event) {
+				if (event.detail === 0) return;
+				const gesture = gestureRef.current;
+				gestureRef.current = null;
+				if (gesture?.canceled) {
+					event.preventDefault();
+					event.stopPropagation();
+					event.preventBaseUIHandler();
+				}
+			}
+		},
+		dragProgress
+	};
+}
+//#endregion
+export { useSwitchDrag };

package/dist/user-ask.d.ts

@@ -6,45 +6,46 @@ import { CSSProperties, ComponentProps } from "react";
 type UserAskStyleProps<Props, Style> = Omit<Props, "style"> & {
   style?: CSSProperties & Style;
 };
-declare function UserAsk({ onComplete, onDismiss, autoFocus, className, children, ...props }: UserAskProps): import("react").JSX.Element;
-type UserAskHeaderProps = ComponentProps<"header"> & {
+export declare function UserAsk({ onComplete, onDismiss, autoFocus, className, children, ...props }: UserAskProps): import("react").JSX.Element;
+export type UserAskHeaderProps = ComponentProps<"header"> & {
   style?: CSSProperties & UserAskKnobStyle;
 };
-declare function UserAskHeader({ className, ...props }: UserAskHeaderProps): import("react").JSX.Element;
-type UserAskTitleProps = UserAskStyleProps<ComponentProps<"h3">, UserAskKnobStyle>;
-declare function UserAskTitle({ className, children, ...props }: UserAskTitleProps): import("react").JSX.Element;
-type UserAskPaginationProps = UserAskStyleProps<ComponentProps<"div">, UserAskKnobStyle>;
-declare function UserAskPagination({ className, ...props }: UserAskPaginationProps): import("react").JSX.Element | null;
-type UserAskQuestionProps = Omit<ComponentProps<"div">, "title"> & {
+export declare function UserAskHeader({ className, ...props }: UserAskHeaderProps): import("react").JSX.Element;
+export type UserAskTitleProps = UserAskStyleProps<ComponentProps<"h3">, UserAskKnobStyle>;
+export declare function UserAskTitle({ className, children, ...props }: UserAskTitleProps): import("react").JSX.Element;
+export type UserAskPaginationProps = UserAskStyleProps<ComponentProps<"div">, UserAskKnobStyle>;
+export declare function UserAskPagination({ className, ...props }: UserAskPaginationProps): import("react").JSX.Element | null;
+export type UserAskQuestionProps = Omit<ComponentProps<"div">, "title"> & {
   id: string;
   title: string;
-  /** Pre-selects option carrying this value (e.g. recommended one) until user picks another. */
-  defaultValue?: string;
+  /** Lets the question keep several answers; resolves to a string array. */
+  multiple?: boolean;
+  /** Pre-selects options carrying these values (e.g. recommended one) until user picks another. */
+  defaultValue?: string | string[];
 } & {
   style?: CSSProperties & UserAskKnobStyle;
 };
-declare function UserAskQuestion({ id, title, defaultValue, className, children, ...props }: UserAskQuestionProps): import("react").JSX.Element;
-type UserAskOptionProps = UserAskStyleProps<Omit<ComponentProps<"button">, "value">, UserAskKnobStyle> & {
+export declare function UserAskQuestion({ id, title, multiple, defaultValue, className, children, ...props }: UserAskQuestionProps): import("react").JSX.Element;
+export type UserAskOptionProps = UserAskStyleProps<Omit<ComponentProps<"button">, "value">, UserAskKnobStyle> & {
   value: string;
   recommended?: boolean;
 };
-declare function UserAskOption({ value, recommended, disabled, className, children, onClick, ...props }: UserAskOptionProps): import("react").JSX.Element;
-type UserAskOptionLabelProps = UserAskStyleProps<ComponentProps<"span">, UserAskKnobStyle>;
-declare function UserAskOptionLabel({ className, children, ...props }: UserAskOptionLabelProps): import("react").JSX.Element;
-type UserAskOptionDescriptionProps = UserAskStyleProps<ComponentProps<"span">, UserAskKnobStyle>;
-declare function UserAskOptionDescription({ className, ...props }: UserAskOptionDescriptionProps): import("react").JSX.Element;
-type UserAskOptionInputProps = UserAskStyleProps<Omit<ComponentProps<"input">, "value">, UserAskKnobStyle> & {
+export declare function UserAskOption({ value, recommended, disabled, className, children, onClick, ...props }: UserAskOptionProps): import("react").JSX.Element;
+export type UserAskOptionLabelProps = UserAskStyleProps<ComponentProps<"span">, UserAskKnobStyle>;
+export declare function UserAskOptionLabel({ className, children, ...props }: UserAskOptionLabelProps): import("react").JSX.Element;
+export type UserAskOptionDescriptionProps = UserAskStyleProps<ComponentProps<"span">, UserAskKnobStyle>;
+export declare function UserAskOptionDescription({ className, ...props }: UserAskOptionDescriptionProps): import("react").JSX.Element;
+export type UserAskOptionInputProps = UserAskStyleProps<Omit<ComponentProps<"input">, "value">, UserAskKnobStyle> & {
   /** Row label while unselected (option's "Other" affordance). */
   label?: string;
 };
-declare function UserAskOptionInput({ label, placeholder, disabled, className, onChange, style, ...props }: UserAskOptionInputProps): import("react").JSX.Element;
-type UserAskFooterProps = ComponentProps<"footer"> & {
+export declare function UserAskOptionInput({ label, placeholder, disabled, className, onChange, style, ...props }: UserAskOptionInputProps): import("react").JSX.Element;
+export type UserAskFooterProps = ComponentProps<"footer"> & {
   style?: CSSProperties & UserAskKnobStyle;
 };
-declare function UserAskFooter({ className, ...props }: UserAskFooterProps): import("react").JSX.Element;
-type UserAskDismissProps = ComponentProps<typeof Button>;
-declare function UserAskDismiss({ className, children, onClick, ...props }: UserAskDismissProps): import("react").JSX.Element;
-type UserAskSubmitProps = ComponentProps<typeof Button>;
-declare function UserAskSubmit({ className, children, disabled, onClick, ...props }: UserAskSubmitProps): import("react").JSX.Element;
-//#endregion
-export { UserAsk, UserAskDismiss, UserAskDismissProps, UserAskFooter, UserAskFooterProps, UserAskHeader, UserAskHeaderProps, UserAskOption, UserAskOptionDescription, UserAskOptionDescriptionProps, UserAskOptionInput, UserAskOptionInputProps, UserAskOptionLabel, UserAskOptionLabelProps, UserAskOptionProps, UserAskPagination, UserAskPaginationProps, UserAskQuestion, UserAskQuestionProps, UserAskSubmit, UserAskSubmitProps, UserAskTitle, UserAskTitleProps };
+export declare function UserAskFooter({ className, ...props }: UserAskFooterProps): import("react").JSX.Element;
+export type UserAskDismissProps = ComponentProps<typeof Button>;
+export declare function UserAskDismiss({ className, children, onClick, ...props }: UserAskDismissProps): import("react").JSX.Element;
+export type UserAskSubmitProps = ComponentProps<typeof Button>;
+export declare function UserAskSubmit({ className, children, disabled, onClick, ...props }: UserAskSubmitProps): import("react").JSX.Element;
+//#endregion

package/dist/user-ask.js

@@ -126,30 +126,37 @@ function UserAskPagination({ className, ...props }) {
 		]
 	});
 }
-function UserAskQuestion({ id, title, defaultValue, className, children, ...props }) {
+function UserAskQuestion({ id, title, multiple = false, defaultValue, className, children, ...props }) {
 	const ask = useUserAskContext();
 	const key = useId();
 	const active = ask.activeQuestion?.key === key;
-	useEffect(() => ask.registerQuestion({
-		key,
-		id,
-		title,
-		defaultValue
-	}), [
+	const defaultKey = Array.isArray(defaultValue) ? defaultValue.join("\0") : defaultValue;
+	useEffect(() => {
+		const defaultValues = defaultKey === void 0 ? void 0 : defaultKey.split("\0");
+		return ask.registerQuestion({
+			key,
+			id,
+			title,
+			multiple,
+			defaultValues
+		});
+	}, [
 		ask.registerQuestion,
 		key,
 		id,
 		title,
-		defaultValue
+		multiple,
+		defaultKey
 	]);
 	useEffect(() => () => ask.unregisterQuestion(key), [ask.unregisterQuestion, key]);
 	return /* @__PURE__ */ jsx(UserAskQuestionContext.Provider, {
 		value: {
 			id,
-			active
+			active,
+			multiple
 		},
 		children: /* @__PURE__ */ jsx("div", {
-			role: "radiogroup",
+			role: multiple ? "group" : "radiogroup",
 			"aria-labelledby": active ? ask.titleId : void 0,
 			hidden: !active,
 			"data-control-ui": "user-ask",
@@ -202,12 +209,13 @@ function UserAskOption({ value, recommended = false, disabled = false, className
 		},
 		children: /* @__PURE__ */ jsxs("button", {
 			type: "button",
-			role: "radio",
+			role: question.multiple ? "checkbox" : "radio",
 			"aria-checked": selected,
 			disabled,
 			"data-control-ui": "user-ask",
 			"data-control-family": "user-ask",
 			"data-slot": "option",
+			"data-multiple": question.multiple ? "" : void 0,
 			"data-selected": selected ? "" : void 0,
 			"data-recommended": recommended ? "" : void 0,
 			onClick: handleClick,
@@ -218,6 +226,7 @@ function UserAskOption({ value, recommended = false, disabled = false, className
 				"data-control-ui": "user-ask",
 				"data-control-family": "user-ask",
 				"data-slot": "option-indicator",
+				"data-multiple": question.multiple ? "" : void 0,
 				"data-selected": selected ? "" : void 0,
 				className: "inline-flex shrink-0 items-center justify-center",
 				children: selected ? /* @__PURE__ */ jsx(Check, { className: "size-3" }) : index + 1
@@ -285,12 +294,13 @@ function UserAskOptionInput({ label = "Other", placeholder = "Type your own answ
 	}
 	if (!selected) return /* @__PURE__ */ jsxs("button", {
 		type: "button",
-		role: "radio",
+		role: question.multiple ? "checkbox" : "radio",
 		"aria-checked": false,
 		disabled,
 		"data-control-ui": "user-ask",
 		"data-control-family": "user-ask",
 		"data-slot": "option",
+		"data-multiple": question.multiple ? "" : void 0,
 		"data-freeform": "",
 		onClick: () => ask.select(question.id, key),
 		className: cn(optionRowClasses, "disabled:cursor-not-allowed", className),
@@ -300,6 +310,7 @@ function UserAskOptionInput({ label = "Other", placeholder = "Type your own answ
 			"data-control-ui": "user-ask",
 			"data-control-family": "user-ask",
 			"data-slot": "option-indicator",
+			"data-multiple": question.multiple ? "" : void 0,
 			className: "inline-flex shrink-0 items-center justify-center",
 			children: index + 1
 		}), /* @__PURE__ */ jsx("span", {
@@ -314,11 +325,25 @@ function UserAskOptionInput({ label = "Other", placeholder = "Type your own answ
 		"data-control-ui": "user-ask",
 		"data-control-family": "user-ask",
 		"data-slot": "option",
+		"data-multiple": question.multiple ? "" : void 0,
 		"data-selected": "",
 		"data-freeform": "",
 		className: cn(optionRowClasses, className),
 		style,
-		children: [/* @__PURE__ */ jsx("span", {
+		children: [question.multiple ? /* @__PURE__ */ jsx("button", {
+			type: "button",
+			role: "checkbox",
+			"aria-checked": true,
+			"aria-label": `Clear ${label}`,
+			"data-control-ui": "user-ask",
+			"data-control-family": "user-ask",
+			"data-slot": "option-indicator",
+			"data-multiple": "",
+			"data-selected": "",
+			onClick: () => ask.select(question.id, key),
+			className: "inline-flex shrink-0 items-center justify-center",
+			children: /* @__PURE__ */ jsx(Check, { className: "size-3" })
+		}) : /* @__PURE__ */ jsx("span", {
 			"aria-hidden": "true",
 			"data-control-ui": "user-ask",
 			"data-control-family": "user-ask",

package/package.json

@@ -1,11 +1,11 @@
 {
   "name": "@ctrl-ui/react",
-  "version": "0.8.2",
-  "description": "Control UI components, blocks, and primitives with the Refined skin, as a versioned package.",
+  "version": "0.8.5",
+  "description": "Control UI components, blocks, and primitives with neutral defaults and consumer-owned themes.",
   "license": "MIT",
   "repository": {
     "type": "git",
-    "url": "https://github.com/damien-schneider/control-ui.git",
+    "url": "git+https://github.com/damien-schneider/control-ui.git",
     "directory": "packages/components"
   },
   "homepage": "https://control-ui.dev",
@@ -34,29 +34,30 @@
     "lint": "biome lint ."
   },
   "peerDependencies": {
-    "@base-ui/react": "^1.7.0",
-    "@tanstack/react-virtual": "^3.14.9",
+    "@base-ui/react": "^1.8.0",
+    "@tanstack/react-virtual": "^3.14.13",
     "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",
     "cmdk": "^1.1.1",
     "diff": "^9.0.0",
-    "libphonenumber-js": "^1.13.10",
-    "lucide-react": "^1.31.0",
+    "libphonenumber-js": "^1.13.13",
+    "lucide-react": "^1.47.0",
     "prosemirror-commands": "^1.7.2",
     "prosemirror-history": "^1.5.0",
     "prosemirror-keymap": "^1.2.3",
     "prosemirror-model": "^1.25.11",
     "prosemirror-state": "^1.4.4",
-    "prosemirror-view": "^1.42.2",
+    "prosemirror-view": "^1.42.3",
     "react": "^19.2.8",
     "react-day-picker": "^10.0.1",
+    "react-dom": "^19.2.8",
     "react-email": "^6.9.5",
-    "react-phone-number-input": "^3.4.17",
-    "react-resizable-panels": "^4.12.2",
+    "react-phone-number-input": "^3.4.18",
+    "react-resizable-panels": "^4.12.4",
     "shiki": "^4.4.3",
-    "streamdown": "^2.5.0",
-    "tailwind-merge": "^3.6.0",
-    "zod": "^4.4.3"
+    "streamdown": "^2.6.0",
+    "tailwind-merge": "^3.7.0",
+    "zod": "^4.6.5"
   },
   "peerDependenciesMeta": {
     "@tanstack/react-virtual": {
@@ -112,8 +113,8 @@
     }
   },
   "devDependencies": {
-    "@types/bun": "^1.3.14",
-    "@types/react": "^19.2.18",
-    "tsdown": "0.22.14"
+    "@types/bun": "^1.4.2",
+    "@types/react": "^19.3.0",
+    "tsdown": "0.23.0"
   }
 }

package/dist/code-block-editor.d.ts

@@ -1,59 +0,0 @@
-import { ButtonKnobStyle } from "./knob-contracts/button-knobs.js";
-import { Button } from "./ui/button.js";
-import { CodeBlockEditorKnobStyle } from "./knob-contracts/code-block-editor-knobs.js";
-import { CodeKnobStyle } from "./knob-contracts/code-knobs.js";
-import { CodeBlockEditorTokenLines } from "./lib/code-block-shiki.js";
-import { CSSProperties, ComponentProps, ReactNode } from "react";
-//#region src/code-block-editor.d.ts
-type CodeBlockEditorStyleProps<Props, Style> = Omit<Props, "style"> & {
-  style?: CSSProperties & Style;
-};
-type CodeBlockEditorOverflow = "wrap" | "scroll";
-type CodeBlockEditorHighlight = "auto" | "none";
-type CodeBlockEditorChrome = "standalone" | "embedded";
-type CodeBlockEditorDensity = "default" | "compact";
-type CodeBlockEditorVariant = "default" | "command";
-type CodeBlockEditorProps = CodeBlockEditorStyleProps<ComponentProps<"figure">, CodeBlockEditorKnobStyle> & {
-  overflow?: CodeBlockEditorOverflow;
-  chrome?: CodeBlockEditorChrome;
-  density?: CodeBlockEditorDensity;
-  variant?: CodeBlockEditorVariant;
-};
-type CodeBlockEditorHeaderProps = CodeBlockEditorStyleProps<ComponentProps<"figcaption">, CodeBlockEditorKnobStyle>;
-type CodeBlockEditorTitleProps = CodeBlockEditorStyleProps<ComponentProps<"span">, CodeBlockEditorKnobStyle>;
-type CodeBlockEditorActionsProps = ComponentProps<"div"> & {
-  style?: CSSProperties & CodeBlockEditorKnobStyle;
-};
-type CodeBlockEditorCopyProps = Omit<ComponentProps<typeof Button>, "children" | "onClick"> & {
-  value: string;
-  children?: ReactNode;
-  copiedLabel?: ReactNode;
-  copiedAriaLabel?: string;
-};
-type CodeBlockEditorContentProps = CodeBlockEditorStyleProps<Omit<ComponentProps<"pre">, "children">, CodeBlockEditorKnobStyle> & {
-  code: string;
-  lang?: string;
-  tokens?: CodeBlockEditorTokenLines | null;
-  highlight?: CodeBlockEditorHighlight;
-  maxHeight?: string;
-  scrollAreaClassName?: string;
-};
-type CodeBlockEditorTextareaProps = CodeBlockEditorStyleProps<Omit<ComponentProps<"textarea">, "defaultValue" | "value">, CodeBlockEditorKnobStyle> & {
-  value?: string;
-  defaultValue?: string;
-  onValueChange?: (value: string) => void;
-  fileName?: string;
-};
-declare function CodeBlockEditor({ overflow, chrome, density, variant, className, children, ...props }: CodeBlockEditorProps): import("react").JSX.Element;
-declare function CodeBlockEditorHeader({ className, ...props }: CodeBlockEditorHeaderProps): import("react").JSX.Element;
-declare function CodeBlockEditorTitle({ className, ...props }: CodeBlockEditorTitleProps): import("react").JSX.Element;
-declare function CodeBlockEditorActions({ className, ...props }: CodeBlockEditorActionsProps): import("react").JSX.Element;
-declare function CodeBlockEditorCopy({ value, copiedLabel, copiedAriaLabel, children, className, "aria-label": ariaLabel, ...props }: CodeBlockEditorCopyProps): import("react").JSX.Element;
-type CodeBlockEditorFloatingCopyProps = Omit<CodeBlockEditorCopyProps, "children" | "copiedLabel" | "style"> & {
-  style?: CSSProperties & ButtonKnobStyle & CodeKnobStyle;
-};
-declare function CodeBlockEditorFloatingCopy({ className, ...props }: CodeBlockEditorFloatingCopyProps): import("react").JSX.Element;
-declare function CodeBlockEditorContent({ code, lang, tokens, highlight, maxHeight, scrollAreaClassName, className, ...props }: CodeBlockEditorContentProps): import("react").JSX.Element;
-declare function CodeBlockEditorTextarea({ value, defaultValue, onValueChange, onChange, fileName, className, "aria-label": ariaLabel, ...props }: CodeBlockEditorTextareaProps): import("react").JSX.Element;
-//#endregion
-export { CodeBlockEditor, CodeBlockEditorActions, CodeBlockEditorActionsProps, CodeBlockEditorChrome, CodeBlockEditorContent, CodeBlockEditorContentProps, CodeBlockEditorCopy, CodeBlockEditorCopyProps, CodeBlockEditorDensity, CodeBlockEditorFloatingCopy, CodeBlockEditorFloatingCopyProps, CodeBlockEditorHeader, CodeBlockEditorHeaderProps, CodeBlockEditorHighlight, CodeBlockEditorOverflow, CodeBlockEditorProps, CodeBlockEditorTextarea, CodeBlockEditorTextareaProps, CodeBlockEditorTitle, CodeBlockEditorTitleProps, CodeBlockEditorVariant };