@botiverse/raft-ui 0.51.0 → 0.52.0

package/dist/components/file-preview/file-preview.mjs

@@ -0,0 +1,210 @@
+import { filePreview } from "./file-preview.recipe.mjs";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { mergeProps } from "@base-ui/react/merge-props";
+import { useRender } from "@base-ui/react/use-render";
+//#region src/components/file-preview/file-preview.tsx
+function FilePreview({ className, render, ...props }) {
+	const { root } = filePreview();
+	const defaultProps = {
+		"data-slot": "file-preview",
+		className: root({ className })
+	};
+	return useRender({
+		defaultTagName: "span",
+		render,
+		props: mergeProps(defaultProps, props)
+	});
+}
+function FilePreviewDocument({ children, className, render, ...props }) {
+	const { document } = filePreview();
+	const defaultProps = {
+		"aria-hidden": true,
+		"data-slot": "file-preview-document",
+		className: document({ className }),
+		children: /* @__PURE__ */ jsxs(Fragment, { children: [
+			/* @__PURE__ */ jsx("span", { className: "block h-0.5 w-full rounded-full bg-ink-10" }),
+			/* @__PURE__ */ jsxs("span", {
+				className: "flex gap-0.5",
+				children: [/* @__PURE__ */ jsx("span", { className: "h-0.5 w-1/3 rounded-full bg-ink-10" }), /* @__PURE__ */ jsx("span", { className: "h-0.5 w-2/3 rounded-full bg-ink-10" })]
+			}),
+			/* @__PURE__ */ jsxs("span", {
+				className: "flex gap-0.5",
+				children: [/* @__PURE__ */ jsx("span", { className: "h-0.5 w-1/2 rounded-full bg-ink-10" }), /* @__PURE__ */ jsx("span", { className: "h-0.5 w-1/2 rounded-full bg-ink-10" })]
+			}),
+			/* @__PURE__ */ jsxs("span", {
+				className: "flex gap-0.5",
+				children: [/* @__PURE__ */ jsx("span", { className: "h-0.5 w-1/3 rounded-full bg-ink-10" }), /* @__PURE__ */ jsx("span", { className: "h-0.5 w-2/3 rounded-full bg-ink-10" })]
+			}),
+			children
+		] })
+	};
+	return useRender({
+		defaultTagName: "span",
+		render,
+		props: mergeProps(defaultProps, props)
+	});
+}
+function FilePreviewFile({ children, className, render, ...props }) {
+	const { file, fileZip, fileZipDark, fileZipLight, fileZipPull, fileZipRow, fileZipStack, fileZipTeeth } = filePreview();
+	const defaultProps = {
+		"aria-hidden": true,
+		"data-slot": "file-preview-file",
+		className: file({ className }),
+		children: /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("span", {
+			className: fileZip(),
+			children: /* @__PURE__ */ jsxs("span", {
+				className: fileZipStack(),
+				children: [/* @__PURE__ */ jsxs("span", {
+					className: fileZipTeeth(),
+					children: [
+						/* @__PURE__ */ jsxs("span", {
+							className: fileZipRow(),
+							children: [/* @__PURE__ */ jsx("span", { className: fileZipDark() }), /* @__PURE__ */ jsx("span", { className: fileZipLight() })]
+						}),
+						/* @__PURE__ */ jsxs("span", {
+							className: fileZipRow(),
+							children: [/* @__PURE__ */ jsx("span", { className: fileZipLight() }), /* @__PURE__ */ jsx("span", { className: fileZipDark() })]
+						}),
+						/* @__PURE__ */ jsxs("span", {
+							className: fileZipRow(),
+							children: [/* @__PURE__ */ jsx("span", { className: fileZipDark() }), /* @__PURE__ */ jsx("span", { className: fileZipLight() })]
+						}),
+						/* @__PURE__ */ jsxs("span", {
+							className: fileZipRow(),
+							children: [/* @__PURE__ */ jsx("span", { className: fileZipLight() }), /* @__PURE__ */ jsx("span", { className: fileZipDark() })]
+						}),
+						/* @__PURE__ */ jsxs("span", {
+							className: fileZipRow(),
+							children: [/* @__PURE__ */ jsx("span", { className: fileZipDark() }), /* @__PURE__ */ jsx("span", { className: fileZipLight() })]
+						})
+					]
+				}), /* @__PURE__ */ jsx("span", { className: fileZipPull() })]
+			})
+		}), children] })
+	};
+	return useRender({
+		defaultTagName: "span",
+		render,
+		props: mergeProps(defaultProps, props)
+	});
+}
+function FilePreviewCode({ children, className, render, ...props }) {
+	const { code, codeAttributeLine, codeGlyph, codeRow, codeRowIndent, codeSelfClosingLine, codeStack, codeTagLine, codeTextLine, codeTextRow } = filePreview();
+	const defaultProps = {
+		"aria-hidden": true,
+		"data-slot": "file-preview-code",
+		className: code({ className }),
+		children: /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsxs("span", {
+			className: codeStack(),
+			children: [
+				/* @__PURE__ */ jsxs("span", {
+					className: codeRow(),
+					children: [
+						/* @__PURE__ */ jsx("span", {
+							className: codeGlyph(),
+							children: "<"
+						}),
+						/* @__PURE__ */ jsx("span", { className: codeTagLine() }),
+						/* @__PURE__ */ jsx("span", {
+							className: codeGlyph(),
+							children: ">"
+						})
+					]
+				}),
+				/* @__PURE__ */ jsxs("span", {
+					className: codeRowIndent(),
+					children: [
+						/* @__PURE__ */ jsx("span", {
+							className: codeGlyph(),
+							children: "<"
+						}),
+						/* @__PURE__ */ jsx("span", { className: codeAttributeLine() }),
+						/* @__PURE__ */ jsx("span", {
+							className: codeGlyph(),
+							children: ">"
+						})
+					]
+				}),
+				/* @__PURE__ */ jsx("span", {
+					className: codeTextRow(),
+					children: /* @__PURE__ */ jsx("span", { className: codeTextLine() })
+				}),
+				/* @__PURE__ */ jsxs("span", {
+					className: codeRowIndent(),
+					children: [
+						/* @__PURE__ */ jsx("span", {
+							className: codeGlyph(),
+							children: "</"
+						}),
+						/* @__PURE__ */ jsx("span", { className: codeAttributeLine() }),
+						/* @__PURE__ */ jsx("span", {
+							className: codeGlyph(),
+							children: ">"
+						})
+					]
+				}),
+				/* @__PURE__ */ jsxs("span", {
+					className: codeRowIndent(),
+					children: [
+						/* @__PURE__ */ jsx("span", {
+							className: codeGlyph(),
+							children: "<"
+						}),
+						/* @__PURE__ */ jsx("span", { className: codeSelfClosingLine() }),
+						/* @__PURE__ */ jsx("span", {
+							className: codeGlyph(),
+							children: "/>"
+						})
+					]
+				}),
+				/* @__PURE__ */ jsxs("span", {
+					className: codeRow(),
+					children: [
+						/* @__PURE__ */ jsx("span", {
+							className: codeGlyph(),
+							children: "</"
+						}),
+						/* @__PURE__ */ jsx("span", { className: codeTagLine() }),
+						/* @__PURE__ */ jsx("span", {
+							className: codeGlyph(),
+							children: ">"
+						})
+					]
+				})
+			]
+		}), children] })
+	};
+	return useRender({
+		defaultTagName: "span",
+		render,
+		props: mergeProps(defaultProps, props)
+	});
+}
+function FilePreviewBadge({ placement, className, render, ...props }) {
+	const { badge } = filePreview({ placement });
+	const defaultProps = {
+		"data-slot": "file-preview-badge",
+		className: badge({ className })
+	};
+	return useRender({
+		defaultTagName: "span",
+		render,
+		props: mergeProps(defaultProps, props)
+	});
+}
+function FilePreviewMedia({ children, className, render, ...props }) {
+	const { media } = filePreview();
+	const defaultProps = {
+		"aria-hidden": true,
+		"data-slot": "file-preview-media",
+		className: media({ className }),
+		children
+	};
+	return useRender({
+		defaultTagName: "span",
+		render,
+		props: mergeProps(defaultProps, props)
+	});
+}
+//#endregion
+export { FilePreview, FilePreviewBadge, FilePreviewCode, FilePreviewDocument, FilePreviewFile, FilePreviewMedia };

package/dist/components/file-preview/file-preview.recipe.d.mts

@@ -0,0 +1,99 @@
+//#region src/components/file-preview/file-preview.recipe.d.ts
+export declare const filePreview: import("tailwind-variants/lite").TVReturnType<{
+  placement: {
+    corner: {
+      badge: string;
+    };
+    inline: {
+      badge: string;
+    };
+  };
+}, {
+  root: string[];
+  document: string[];
+  file: string[];
+  code: string[];
+  fileZip: string[];
+  fileZipStack: string[];
+  fileZipTeeth: string[];
+  fileZipRow: string[];
+  fileZipDark: string[];
+  fileZipLight: string[];
+  fileZipPull: string[];
+  codeStack: string[];
+  codeRow: string[];
+  codeRowIndent: string[];
+  codeTextRow: string[];
+  codeGlyph: string[];
+  codeTagLine: string[];
+  codeAttributeLine: string[];
+  codeTextLine: string[];
+  codeSelfClosingLine: string[];
+  badge: string[];
+  media: string[];
+}, undefined, {
+  placement: {
+    corner: {
+      badge: string;
+    };
+    inline: {
+      badge: string;
+    };
+  };
+}, {
+  root: string[];
+  document: string[];
+  file: string[];
+  code: string[];
+  fileZip: string[];
+  fileZipStack: string[];
+  fileZipTeeth: string[];
+  fileZipRow: string[];
+  fileZipDark: string[];
+  fileZipLight: string[];
+  fileZipPull: string[];
+  codeStack: string[];
+  codeRow: string[];
+  codeRowIndent: string[];
+  codeTextRow: string[];
+  codeGlyph: string[];
+  codeTagLine: string[];
+  codeAttributeLine: string[];
+  codeTextLine: string[];
+  codeSelfClosingLine: string[];
+  badge: string[];
+  media: string[];
+}, import("tailwind-variants/lite").TVReturnTypeLike<{
+  placement: {
+    corner: {
+      badge: string;
+    };
+    inline: {
+      badge: string;
+    };
+  };
+}, {
+  root: string[];
+  document: string[];
+  file: string[];
+  code: string[];
+  fileZip: string[];
+  fileZipStack: string[];
+  fileZipTeeth: string[];
+  fileZipRow: string[];
+  fileZipDark: string[];
+  fileZipLight: string[];
+  fileZipPull: string[];
+  codeStack: string[];
+  codeRow: string[];
+  codeRowIndent: string[];
+  codeTextRow: string[];
+  codeGlyph: string[];
+  codeTagLine: string[];
+  codeAttributeLine: string[];
+  codeTextLine: string[];
+  codeSelfClosingLine: string[];
+  badge: string[];
+  media: string[];
+}>>;
+//#endregion

package/dist/components/file-preview/file-preview.recipe.mjs

@@ -0,0 +1,39 @@
+import { tv } from "../../lib/tv.mjs";
+//#region src/components/file-preview/file-preview.recipe.ts
+const filePreview = tv({
+	slots: {
+		root: ["relative flex h-10 w-10 shrink-0 items-center justify-center"],
+		document: ["relative h-10 w-8 stack-y-1.5 rounded-md rounded-tr-[15%] p-1.5 ring-1", "bg-layer-card shadow-none ring-line-hairline"],
+		file: ["relative flex h-10 w-8 items-center justify-center rounded-md rounded-tr-[15%] ring-1", "bg-layer-card shadow-none ring-line-hairline"],
+		code: ["relative flex h-10 w-8 items-center justify-center rounded-md rounded-tr-[15%] ring-1", "bg-layer-card shadow-none ring-line-hairline"],
+		fileZip: ["flex h-7 items-center justify-center"],
+		fileZipStack: ["relative -translate-y-0.5 flex flex-col items-center"],
+		fileZipTeeth: ["stack-y-px"],
+		fileZipRow: ["flex overflow-hidden rounded-full"],
+		fileZipDark: ["size-0.5", "bg-foreground/40"],
+		fileZipLight: ["size-0.5", "bg-foreground/15"],
+		fileZipPull: ["mt-0.5 h-1 w-2.5 rounded-sm border", "border-foreground/40 bg-foreground/10"],
+		codeStack: ["-translate-y-0.5 stack-y-px"],
+		codeRow: ["flex items-center gap-0.5 leading-none"],
+		codeRowIndent: ["flex items-center gap-0.5 pl-1.5 leading-none"],
+		codeTextRow: ["block pl-3"],
+		codeGlyph: ["font-mono text-[4px] leading-none text-foreground/30"],
+		codeTagLine: ["h-0.5 w-3 rounded-full", "bg-foreground/40"],
+		codeAttributeLine: ["h-0.5 w-2.5 rounded-full", "bg-foreground/25"],
+		codeTextLine: ["h-0.5 w-6 rounded-full bg-foreground/10"],
+		codeSelfClosingLine: ["h-0.5 w-2 rounded-full", "bg-foreground/40"],
+		badge: [
+			"w-fit whitespace-nowrap",
+			"rounded-sticker bg-fill-muted px-1 py-0.5 ring-1 ring-line-hairline",
+			"font-mono text-[10px] leading-none font-bold text-foreground-muted"
+		],
+		media: ["relative h-10 w-8 overflow-hidden rounded-md ring-1", "bg-fill-muted shadow-none ring-line-hairline"]
+	},
+	variants: { placement: {
+		corner: { badge: "absolute -right-1.5 bottom-0.5 z-10" },
+		inline: { badge: "inline-flex h-3.5 w-7 shrink-0 items-center justify-center px-0 py-0" }
+	} },
+	defaultVariants: { placement: "corner" }
+});
+//#endregion
+export { filePreview };

package/dist/components/file-preview/index.d.mts

@@ -0,0 +1,2 @@
+import { FilePreview, FilePreviewBadge, FilePreviewBadgeProps, FilePreviewCode, FilePreviewCodeProps, FilePreviewDocument, FilePreviewDocumentProps, FilePreviewFile, FilePreviewFileProps, FilePreviewMedia, FilePreviewMediaProps, FilePreviewProps } from "./file-preview.mjs";
+export { FilePreview, FilePreviewBadge, type FilePreviewBadgeProps, FilePreviewCode, type FilePreviewCodeProps, FilePreviewDocument, type FilePreviewDocumentProps, FilePreviewFile, type FilePreviewFileProps, FilePreviewMedia, type FilePreviewMediaProps, type FilePreviewProps };

package/dist/components/files/files.d.mts

@@ -0,0 +1,35 @@
+import { ButtonProps } from "../button/button.mjs";
+import { useRender } from "@base-ui/react/use-render";
+//#region src/components/files/files.d.ts
+type FileTag = "button" | "div" | "img" | "section" | "span";
+type DataAttributes = Record<`data-${string}`, string | undefined>;
+type FileSlotProps<Tag extends FileTag> = useRender.ComponentProps<Tag> & DataAttributes;
+export type FilesPanelProps = FileSlotProps<"section">;
+export declare function FilesPanel(props: FilesPanelProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
+export type FilesViewportProps = FileSlotProps<"div">;
+export declare function FilesViewport(props: FilesViewportProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
+export type FilesListProps = FileSlotProps<"div">;
+export declare function FilesList(props: FilesListProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
+export type FileRowProps = FileSlotProps<"div">;
+export declare function FileRow(props: FileRowProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
+export type FileRowOpenProps = FileSlotProps<"button">;
+export declare function FileRowOpen(props: FileRowOpenProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
+export type FileThumbnailProps = FileSlotProps<"span">;
+export declare function FileThumbnail(props: FileThumbnailProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
+export type FileImageProps = FileSlotProps<"img"> & {
+  fit?: "contain" | "cover";
+};
+export declare function FileImage({ fit, ...props }: FileImageProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
+export type FileContentProps = FileSlotProps<"span">;
+export declare function FileContent(props: FileContentProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
+export type FileNameProps = FileSlotProps<"span">;
+export declare function FileName(props: FileNameProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
+export type FileMetaProps = FileSlotProps<"span">;
+export declare function FileMeta(props: FileMetaProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
+export type FileMetaItemProps = FileSlotProps<"span">;
+export declare function FileMetaItem(props: FileMetaItemProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
+export type FileActionsProps = FileSlotProps<"span">;
+export declare function FileActions(props: FileActionsProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
+export type FileActionProps = Omit<ButtonProps, "variant" | "size"> & Pick<Partial<ButtonProps>, "variant" | "size">;
+export declare function FileAction({ variant, size, ...props }: FileActionProps): import("react").JSX.Element;
+//#endregion

package/dist/components/files/files.mjs

@@ -0,0 +1,69 @@
+import { Button } from "../button/button.mjs";
+import { files } from "./files.recipe.mjs";
+import { jsx } from "react/jsx-runtime";
+import { useRender } from "@base-ui/react/use-render";
+//#region src/components/files/files.tsx
+function useFileSlot(slotName, dataSlot, defaultTagName, props) {
+	const slot = files()[slotName];
+	const { className, render, ...otherProps } = props;
+	return useRender({
+		defaultTagName,
+		render,
+		props: {
+			"data-slot": dataSlot,
+			className: slot({ className }),
+			...otherProps
+		}
+	});
+}
+function FilesPanel(props) {
+	return useFileSlot("panel", "files-panel", "section", props);
+}
+function FilesViewport(props) {
+	return useFileSlot("viewport", "files-viewport", "div", props);
+}
+function FilesList(props) {
+	return useFileSlot("list", "files-list", "div", props);
+}
+function FileRow(props) {
+	return useFileSlot("row", "file-row", "div", props);
+}
+function FileRowOpen(props) {
+	return useFileSlot("rowOpen", "file-row-open", "button", {
+		type: "button",
+		...props
+	});
+}
+function FileThumbnail(props) {
+	return useFileSlot("thumbnail", "file-thumbnail", "span", props);
+}
+function FileImage({ fit = "cover", ...props }) {
+	return useFileSlot("image", "file-image", "img", {
+		"data-fit": fit,
+		...props
+	});
+}
+function FileContent(props) {
+	return useFileSlot("content", "file-content", "span", props);
+}
+function FileName(props) {
+	return useFileSlot("name", "file-name", "span", props);
+}
+function FileMeta(props) {
+	return useFileSlot("meta", "file-meta", "span", props);
+}
+function FileMetaItem(props) {
+	return useFileSlot("metaItem", "file-meta-item", "span", props);
+}
+function FileActions(props) {
+	return useFileSlot("actions", "file-actions", "span", props);
+}
+function FileAction({ variant, size = "icon-md", ...props }) {
+	return /* @__PURE__ */ jsx(Button, {
+		variant: variant ?? "ghost",
+		size,
+		...props
+	});
+}
+//#endregion
+export { FileAction, FileActions, FileContent, FileImage, FileMeta, FileMetaItem, FileName, FileRow, FileRowOpen, FileThumbnail, FilesList, FilesPanel, FilesViewport };

package/dist/components/files/files.recipe.mjs

@@ -0,0 +1,40 @@
+import { tv } from "../../lib/tv.mjs";
+//#region src/components/files/files.recipe.ts
+const files = tv({ slots: {
+	panel: ["flex min-h-0 flex-1 flex-col", "bg-layer-canvas text-foreground"],
+	viewport: ["min-h-0 flex-1 overflow-y-auto"],
+	list: ["flex flex-col gap-2 px-5 py-3", "max-md:px-4"],
+	row: [
+		"group/file-row flex w-full min-w-0 gap-3 px-3",
+		"transition-colors",
+		"items-center rounded-container border border-line-hairline bg-layer-card py-2.5 pr-1.5 pl-2.5 shadow-none",
+		"[@media(hover:hover)]:has-[[data-slot=file-row-open]:hover]:overlay-subtle has-[[data-slot=file-row-open]:active]:overlay-medium",
+		"has-data-popup-open:overlay-subtle",
+		"has-[[data-slot=file-row-open]:focus-visible]:shadow-focus"
+	],
+	rowOpen: [
+		"flex min-w-0 flex-1 gap-3 text-left",
+		"focus-visible:outline-2 focus-visible:outline-offset-2",
+		"items-center outline-none",
+		"focus-visible:outline-none"
+	],
+	thumbnail: [
+		"flex shrink-0 items-center justify-center overflow-hidden",
+		"[&_svg]:size-4.5 [&_svg]:shrink-0",
+		"has-data-[slot=file-preview]:overflow-visible has-data-[slot=file-preview]:border-0 has-data-[slot=file-preview]:bg-transparent",
+		"size-9 rounded-chip border-0 bg-fill-muted text-foreground-muted",
+		"has-[[data-slot=file-preview]]:size-9"
+	],
+	image: [
+		"block size-full",
+		"data-[fit=contain]:object-contain data-[fit=cover]:object-cover",
+		"bg-layer-card"
+	],
+	content: ["flex min-w-0 flex-1 flex-col", "justify-center gap-0.5"],
+	name: ["block truncate", "font-sans text-callout font-semibold text-foreground"],
+	meta: ["flex min-w-0 flex-wrap items-center gap-y-1", "mt-0 gap-x-1.5 font-mono text-mono-meta text-foreground-hint"],
+	metaItem: ["inline-flex items-center gap-1 [&_svg]:size-3 [&_svg]:shrink-0"],
+	actions: ["flex shrink-0 self-center items-center gap-1.5"]
+} });
+//#endregion
+export { files };

package/dist/components/files/index.d.mts

@@ -0,0 +1,2 @@
+import { FileAction, FileActionProps, FileActions, FileActionsProps, FileContent, FileContentProps, FileImage, FileImageProps, FileMeta, FileMetaItem, FileMetaItemProps, FileMetaProps, FileName, FileNameProps, FileRow, FileRowOpen, FileRowOpenProps, FileRowProps, FileThumbnail, FileThumbnailProps, FilesList, FilesListProps, FilesPanel, FilesPanelProps, FilesViewport, FilesViewportProps } from "./files.mjs";
+export { FileAction, FileActionProps, FileActions, FileActionsProps, FileContent, FileContentProps, FileImage, FileImageProps, FileMeta, FileMetaItem, FileMetaItemProps, FileMetaProps, FileName, FileNameProps, FileRow, FileRowOpen, FileRowOpenProps, FileRowProps, FileThumbnail, FileThumbnailProps, FilesList, FilesListProps, FilesPanel, FilesPanelProps, FilesViewport, FilesViewportProps };

package/dist/components/filter-chip/filter-chip.d.mts

@@ -0,0 +1,25 @@
+import { StyledProps } from "../../lib/styled-props.mjs";
+import { DataAttributes } from "../../lib/data-attributes.mjs";
+import { ComponentPropsWithRef } from "react";
+import { Button } from "@base-ui/react/button";
+//#region src/components/filter-chip/filter-chip.d.ts
+export type FilterChipProps = ComponentPropsWithRef<"span"> & DataAttributes;
+/**
+ * The filter in effect, beside the filter button that chose it: an `info-soft`
+ * chip as high as the button, with an optional 14px icon, a `FilterChipLabel`
+ * and a `FilterChipRemove` × that resets the filter.
+ */
+export declare function FilterChip({ className, ...props }: FilterChipProps): import("react").JSX.Element;
+export type FilterChipLabelProps = ComponentPropsWithRef<"span">;
+/** The name of the active filter. It truncates when the row has no room. */
+export declare function FilterChipLabel({ className, ...props }: FilterChipLabelProps): import("react").JSX.Element;
+export type FilterChipRemoveProps = Omit<StyledProps<Button.Props>, "aria-label" | "type"> & DataAttributes & {
+  /**
+   * What the × does, said in words: the chip shows only a glyph. Name the
+   * result, such as "Clear Filter" or "Show All".
+   */
+  "aria-label": string;
+};
+/** The × that resets the filter to its default. Shows an X unless given children. */
+export declare function FilterChipRemove({ className, children, render, nativeButton, ...props }: FilterChipRemoveProps): import("react").JSX.Element;
+//#endregion

package/dist/components/filter-chip/filter-chip.mjs

@@ -0,0 +1,59 @@
+import { tv } from "../../lib/tv.mjs";
+import { defaultNativeButton } from "../../lib/default-native-button.mjs";
+import { chipRemoveBase } from "../../lib/chip-remove.mjs";
+import { X } from "lucide-react";
+import { jsx } from "react/jsx-runtime";
+import { Button } from "@base-ui/react/button";
+//#region src/components/filter-chip/filter-chip.tsx
+const filterChip = tv({ slots: {
+	root: [
+		"inline-flex h-8 min-w-0 shrink items-center",
+		"gap-1.5 rounded-control bg-info-soft pr-1 pl-2.5",
+		"font-sans text-control font-semibold text-foreground",
+		"[&>svg]:pointer-events-none [&>svg]:shrink-0",
+		"[&>svg:not([class*='size-'])]:size-3.5 [&>svg:not([class*='stroke-'])]:stroke-2"
+	],
+	label: ["min-w-0 truncate"],
+	remove: [
+		...chipRemoveBase,
+		"relative size-6",
+		"after:absolute after:content-[''] pointer-coarse:after:-inset-2.5"
+	]
+} });
+/**
+* The filter in effect, beside the filter button that chose it: an `info-soft`
+* chip as high as the button, with an optional 14px icon, a `FilterChipLabel`
+* and a `FilterChipRemove` × that resets the filter.
+*/
+function FilterChip({ className, ...props }) {
+	const { root } = filterChip();
+	return /* @__PURE__ */ jsx("span", {
+		"data-slot": "filter-chip",
+		className: root({ className }),
+		...props
+	});
+}
+/** The name of the active filter. It truncates when the row has no room. */
+function FilterChipLabel({ className, ...props }) {
+	const { label } = filterChip();
+	return /* @__PURE__ */ jsx("span", {
+		"data-slot": "filter-chip-label",
+		className: label({ className }),
+		...props
+	});
+}
+/** The × that resets the filter to its default. Shows an X unless given children. */
+function FilterChipRemove({ className, children, render, nativeButton, ...props }) {
+	const { remove } = filterChip();
+	return /* @__PURE__ */ jsx(Button, {
+		...props,
+		render,
+		nativeButton: nativeButton ?? defaultNativeButton(render),
+		type: "button",
+		"data-slot": "filter-chip-remove",
+		className: remove({ className }),
+		children: children ?? /* @__PURE__ */ jsx(X, { "aria-hidden": true })
+	});
+}
+//#endregion
+export { FilterChip, FilterChipLabel, FilterChipRemove };

package/dist/components/filter-chip/index.d.mts

@@ -0,0 +1,2 @@
+import { FilterChip, FilterChipLabel, FilterChipLabelProps, FilterChipProps, FilterChipRemove, FilterChipRemoveProps } from "./filter-chip.mjs";
+export { FilterChip, FilterChipLabel, type FilterChipLabelProps, type FilterChipProps, FilterChipRemove, type FilterChipRemoveProps };

package/dist/components/float-button/float-button.d.mts

@@ -0,0 +1,36 @@
+import { StyledProps } from "../../lib/styled-props.mjs";
+import { FloatButtonOffset, FloatButtonPosition, FloatButtonSide } from "./float-button.position.mjs";
+import { ReactNode } from "react";
+import { Button } from "@base-ui/react/button";
+import { useRender } from "@base-ui/react/use-render";
+//#region src/components/float-button/float-button.d.ts
+export type FloatButtonVariant = "default" | "primary" | "accent" | "outline" | "ghost" | "warning" | "danger";
+export type FloatButtonShape = "circle" | "square" | "pill";
+export type FloatButtonSize = "xs" | "sm" | "md" | "lg";
+export type FloatButtonGroupDirection = "vertical" | "horizontal";
+export interface FloatButtonProps extends StyledProps<Button.Props> {
+  variant?: FloatButtonVariant;
+  shape?: FloatButtonShape;
+  size?: FloatButtonSize;
+  icon?: ReactNode;
+  description?: ReactNode;
+  tooltip?: ReactNode;
+  position?: FloatButtonPosition;
+  side?: FloatButtonSide;
+  offset?: FloatButtonOffset;
+}
+/** @deprecated Not part of the Raft Design System; place actions in the page's header or toolbar. Removed in raft-ui 1.0. */
+export declare function FloatButton({ icon, description, tooltip, variant, shape: shapeProp, size: sizeProp, position, side, offset, className, style, children, nativeButton: nativeButtonProp, render, ...props }: FloatButtonProps): import("react").JSX.Element;
+export type FloatButtonGroupProps = useRender.ComponentProps<"div"> & {
+  direction?: FloatButtonGroupDirection;
+  attached?: boolean;
+  shape?: FloatButtonShape;
+  size?: FloatButtonSize;
+  position?: FloatButtonPosition;
+  side?: FloatButtonSide;
+  offset?: FloatButtonOffset;
+  gap?: number | string;
+};
+/** @deprecated Not part of the Raft Design System; place actions in the page's header or toolbar. Removed in raft-ui 1.0. */
+export declare function FloatButtonGroup({ direction, attached, shape, size, position, side, offset, gap, className, style, render, children, ...props }: FloatButtonGroupProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
+//#endregion