@bysages/solid 0.2.2 → 0.3.0

package/dist/components/progress-group/index.d.mts

@@ -0,0 +1,22 @@
+import { JSX } from "solid-js";
+//#region src/components/progress-group/index.d.ts
+/** One verdict on the bar. */
+export interface ProgressSegment {
+  value: number;
+  label?: string;
+  pigment?: "primary" | "success" | "warning" | "danger" | "info";
+}
+/**
+ * One bar, several verdicts: the segments stand shoulder to shoulder,
+ * each as wide as its share of the whole and speaking its own pigment;
+ * the legend reads them back beneath (swatch, label, value) unless the
+ * caller declines it. The whole is the sum of the parts unless the
+ * caller brings a larger one — the remainder then shows as groove.
+ */
+export interface ProgressGroupProps extends JSX.HTMLAttributes<HTMLDivElement> {
+  segments: ProgressSegment[];
+  max?: number;
+  showLegend?: boolean;
+}
+export declare function ProgressGroup(props: ProgressGroupProps): JSX.Element;
+//#endregion

package/dist/components/progress-group/index.mjs

@@ -0,0 +1,84 @@
+import { injectComponentStyle } from "@bysages/core";
+import { createComponent, effect, insert, setAttribute, setStyleProperty, spread, template } from "@solidjs/web";
+import { For, Show, splitProps } from "solid-js";
+//#region src/components/progress-group/index.tsx
+var _tmpl$ = /* @__PURE__ */ template(`<div data-scope=progress-group data-part=legend>`);
+var _tmpl$2 = /* @__PURE__ */ template(`<div><div data-scope=progress-group data-part=track>`);
+var _tmpl$3 = /* @__PURE__ */ template(`<div data-scope=progress-group data-part=segment role=progressbar aria-valuemin=0>`);
+var _tmpl$4 = /* @__PURE__ */ template(`<div data-scope=progress-group data-part=legend-item><span data-scope=progress-group data-part=swatch aria-hidden=true></span><span data-scope=progress-group data-part=legend-label></span><span data-scope=progress-group data-part=legend-value>`);
+function ProgressGroup(props) {
+	injectComponentStyle("progress-group");
+	const [own, rest] = splitProps(props, [
+		"segments",
+		"max",
+		"showLegend"
+	]);
+	const total = () => own.max ?? own.segments.reduce((sum, segment) => sum + segment.value, 0);
+	const share = (value) => {
+		const whole = total();
+		return whole > 0 ? `${value / whole * 100}%` : "0%";
+	};
+	const nameOf = (segment, index) => segment.label ?? segment.pigment ?? `Segment ${index + 1}`;
+	var _el$ = _tmpl$2();
+	var _el$2 = _el$.firstChild;
+	spread(_el$, [rest, {
+		"data-scope": "progress-group",
+		"data-part": "root"
+	}], true);
+	insert(_el$2, createComponent(For, {
+		get each() {
+			return own.segments;
+		},
+		children: (segment, index) => (() => {
+			var _el$4 = _tmpl$3();
+			effect(() => {
+				return {
+					e: segment.pigment,
+					t: segment.value,
+					a: total(),
+					o: nameOf(segment, index()),
+					i: share(segment.value)
+				};
+			}, ({ e, t, a, o, i }, _p$) => {
+				e !== _p$?.e && setAttribute(_el$4, "data-pigment", e);
+				t !== _p$?.t && setAttribute(_el$4, "aria-valuenow", t);
+				a !== _p$?.a && setAttribute(_el$4, "aria-valuemax", a);
+				o !== _p$?.o && setAttribute(_el$4, "aria-label", o);
+				i !== _p$?.i && setStyleProperty(_el$4, "inline-size", i);
+			});
+			return _el$4;
+		})()
+	}));
+	insert(_el$, createComponent(Show, {
+		get when() {
+			return own.showLegend ?? true;
+		},
+		get children() {
+			var _el$3 = _tmpl$();
+			insert(_el$3, createComponent(For, {
+				get each() {
+					return own.segments;
+				},
+				children: (segment, index) => (() => {
+					var _el$5 = _tmpl$4();
+					var _el$7 = _el$5.firstChild.nextSibling;
+					var _el$8 = _el$7.nextSibling;
+					insert(_el$7, () => {
+						return nameOf(segment, index());
+					});
+					insert(_el$8, () => {
+						return String(segment.value);
+					});
+					effect(() => segment.pigment, (_v$) => {
+						setAttribute(_el$5, "data-pigment", _v$);
+					});
+					return _el$5;
+				})()
+			}));
+			return _el$3;
+		}
+	}), null);
+	return _el$;
+}
+//#endregion
+export { ProgressGroup };

package/dist/components/qr-code/index.d.mts

@@ -0,0 +1,8 @@
+import { QrCode as QrCode$1 } from "@ark-ui/solid/qr-code";
+//#region src/components/qr-code/index.d.ts
+/** Ark's QrCode, dressed in the paper-and-ink system: the pattern prints in
+ * ink on the page, with an optional paper badge and a seal-cut download
+ * control. The API is Ark's own — Root, Frame, Pattern, Overlay,
+ * DownloadTrigger. */
+export declare const QrCode: typeof QrCode$1;
+//#endregion

package/dist/components/qr-code/index.mjs

@@ -0,0 +1,11 @@
+import { injectComponentStyle } from "@bysages/core";
+import { QrCode as QrCode$1 } from "@ark-ui/solid/qr-code";
+//#region src/components/qr-code/index.ts
+/** Ark's QrCode, dressed in the paper-and-ink system: the pattern prints in
+* ink on the page, with an optional paper badge and a seal-cut download
+* control. The API is Ark's own — Root, Frame, Pattern, Overlay,
+* DownloadTrigger. */
+const QrCode = QrCode$1;
+injectComponentStyle("qr-code");
+//#endregion
+export { QrCode };

package/dist/components/radio-group/index.d.mts

@@ -0,0 +1,15 @@
+import { RadioGroup as RadioGroup$1, RadioGroupRootProps } from "@ark-ui/solid/radio-group";
+//#region src/components/radio-group/index.d.ts
+/** Ark's RadioGroup, dressed in the paper-and-ink system: a column of
+ * full-circle seals that fill flat with primary ink when chosen, the dot
+ * punched through as paper. The API is Ark's own — Root, Label, Item,
+ * ItemText, ItemControl, Indicator, ItemHiddenInput. */
+type RadioGroupOwnProps = {
+  /** One rung for the dial; the chosen dot rides it. */
+  size?: "sm" | "md" | "lg";
+};
+declare function RadioGroupRoot(props: RadioGroupRootProps & RadioGroupOwnProps): import("solid-js").JSX.Element;
+export declare const RadioGroup: Omit<typeof RadioGroup$1, "Root"> & {
+  Root: typeof RadioGroupRoot;
+};
+//#endregion

package/dist/components/radio-group/index.mjs

@@ -0,0 +1,18 @@
+import { injectComponentStyle } from "@bysages/core";
+import { createComponent, mergeProps } from "@solidjs/web";
+import { splitProps } from "solid-js";
+import { RadioGroup as RadioGroup$1 } from "@ark-ui/solid/radio-group";
+//#region src/components/radio-group/index.tsx
+function RadioGroupRoot(props) {
+	const [own, rest] = splitProps(props, ["size"]);
+	return createComponent(RadioGroup$1.Root, mergeProps(rest, { get "data-size"() {
+		return own.size ?? "md";
+	} }));
+}
+const RadioGroup = {
+	...RadioGroup$1,
+	Root: RadioGroupRoot
+};
+injectComponentStyle("radio-group");
+//#endregion
+export { RadioGroup };

package/dist/components/rating-group/index.d.mts

@@ -0,0 +1,15 @@
+import { RatingGroup as RatingGroup$1, RatingGroupRootProps } from "@ark-ui/solid/rating-group";
+//#region src/components/rating-group/index.d.ts
+/** Ark's RatingGroup, dressed in the paper-and-ink system: a row of quiet
+ * seals whose glyphs take the primary pigment as they light up. The API is
+ * Ark's own — Root, Label, Control, Item, HiddenInput (plus the Context and
+ * ItemContext render helpers). */
+type RatingGroupOwnProps = {
+  /** One rung of the control-height ladder every seal stands on. */
+  size?: "sm" | "md" | "lg";
+};
+declare function RatingGroupRoot(props: RatingGroupRootProps & RatingGroupOwnProps): import("solid-js").JSX.Element;
+export declare const RatingGroup: Omit<typeof RatingGroup$1, "Root"> & {
+  Root: typeof RatingGroupRoot;
+};
+//#endregion

package/dist/components/rating-group/index.mjs

@@ -0,0 +1,18 @@
+import { injectComponentStyle } from "@bysages/core";
+import { createComponent, mergeProps } from "@solidjs/web";
+import { splitProps } from "solid-js";
+import { RatingGroup as RatingGroup$1 } from "@ark-ui/solid/rating-group";
+//#region src/components/rating-group/index.tsx
+function RatingGroupRoot(props) {
+	const [own, rest] = splitProps(props, ["size"]);
+	return createComponent(RatingGroup$1.Root, mergeProps(rest, { get "data-size"() {
+		return own.size ?? "md";
+	} }));
+}
+const RatingGroup = {
+	...RatingGroup$1,
+	Root: RatingGroupRoot
+};
+injectComponentStyle("rating-group");
+//#endregion
+export { RatingGroup };

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

@@ -0,0 +1,22 @@
+import { JSX } from "solid-js";
+//#region src/components/result/index.d.ts
+type Status = "success" | "warning" | "danger" | "info";
+export interface ResultRootProps extends JSX.HTMLAttributes<HTMLDivElement> {
+  /** The verdict the operation returned; the fixed pigments speak it. */
+  status?: Status;
+}
+export declare function ResultRoot(props: ResultRootProps): JSX.Element;
+/** The mark carries all four verdicts and lets the root choose, so the
+ * icon can never drift from the status the root declares. */
+export declare function ResultIcon(props: JSX.HTMLAttributes<HTMLDivElement>): JSX.Element;
+/** A verdict drawn after the deed: the mark washes in the fixed
+ * pigment, the title rides the serif, and the extra carries the way
+ * onward. Any subset composes. */
+export declare const Result: {
+  Root: typeof ResultRoot;
+  Icon: typeof ResultIcon;
+  Title: (props: JSX.HTMLAttributes<HTMLElement>) => JSX.Element;
+  Description: (props: JSX.HTMLAttributes<HTMLElement>) => JSX.Element;
+  Extra: (props: JSX.HTMLAttributes<HTMLElement>) => JSX.Element;
+};
+//#endregion

package/dist/components/result/index.mjs

@@ -0,0 +1,66 @@
+import { injectComponentStyle } from "@bysages/core";
+import { createComponent, effect, insert, mergeProps, spread, template } from "@solidjs/web";
+import { splitProps } from "solid-js";
+//#region src/components/result/index.tsx
+var _tmpl$ = /* @__PURE__ */ template(`<div>`);
+var _tmpl$2 = /* @__PURE__ */ template(`<svg width=24 height=24 viewBox="0 0 24 24"fill=none stroke=currentColor stroke-width=1.5 stroke-linecap=round stroke-linejoin=round aria-hidden=true>`);
+const MARK = { __html: "<g data-for=\"success\"><path d=\"M20 6 9 17l-5-5\"/></g><g data-for=\"warning\"><path d=\"M10.29 3.86 1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0Z\"/><path d=\"M12 9v4\"/><path d=\"M12 17h.01\"/></g><g data-for=\"danger\"><circle cx=\"12\" cy=\"12\" r=\"10\"/><path d=\"m15 9-6 6\"/><path d=\"m9 9 6 6\"/></g><g data-for=\"info\"><circle cx=\"12\" cy=\"12\" r=\"10\"/><path d=\"M12 16v-4\"/><path d=\"M12 8h.01\"/></g>" };
+function ResultRoot(props) {
+	injectComponentStyle("result");
+	const [own, rest] = splitProps(props, ["status"]);
+	var _el$ = _tmpl$();
+	spread(_el$, [rest, {
+		"data-scope": "result",
+		"data-part": "root",
+		get "data-status"() {
+			return own.status ?? "info";
+		}
+	}], false);
+	return _el$;
+}
+/** The mark carries all four verdicts and lets the root choose, so the
+* icon can never drift from the status the root declares. */
+function ResultIcon(props) {
+	injectComponentStyle("result");
+	const [own, rest] = splitProps(props, ["children"]);
+	var _el$2 = _tmpl$();
+	spread(_el$2, [rest, {
+		"data-scope": "result",
+		"data-part": "icon"
+	}], true);
+	insert(_el$2, () => {
+		return own.children ?? (() => {
+			var _el$3 = _tmpl$2();
+			effect(() => MARK.__html, (_v$) => {
+				_el$3.innerHTML = _v$;
+			});
+			return _el$3;
+		})();
+	});
+	return _el$2;
+}
+function part(name, tag) {
+	return function Part(props) {
+		injectComponentStyle("result");
+		const [own, rest] = splitProps(props, ["children"]);
+		return createComponent(tag, mergeProps(rest, {
+			"data-scope": "result",
+			"data-part": name,
+			get children() {
+				return own.children;
+			}
+		}));
+	};
+}
+/** A verdict drawn after the deed: the mark washes in the fixed
+* pigment, the title rides the serif, and the extra carries the way
+* onward. Any subset composes. */
+const Result = {
+	Root: ResultRoot,
+	Icon: ResultIcon,
+	Title: part("title", "h3"),
+	Description: part("description", "p"),
+	Extra: part("extra", "div")
+};
+//#endregion
+export { Result, ResultIcon, ResultRoot };

package/dist/components/scroll-area/index.d.mts

@@ -0,0 +1,7 @@
+import { ScrollArea as ScrollArea$1 } from "@ark-ui/solid/scroll-area";
+//#region src/components/scroll-area/index.d.ts
+/** Ark's ScrollArea, dressed in the paper-and-ink system: native bars
+ * give way to quiet ink lanes that surface on hover and scroll. The API
+ * is Ark's own — Root, Viewport, Content, Scrollbar, Thumb, Corner. */
+export declare const ScrollArea: typeof ScrollArea$1;
+//#endregion

package/dist/components/scroll-area/index.mjs

@@ -0,0 +1,10 @@
+import { injectComponentStyle } from "@bysages/core";
+import { ScrollArea as ScrollArea$1 } from "@ark-ui/solid/scroll-area";
+//#region src/components/scroll-area/index.ts
+/** Ark's ScrollArea, dressed in the paper-and-ink system: native bars
+* give way to quiet ink lanes that surface on hover and scroll. The API
+* is Ark's own — Root, Viewport, Content, Scrollbar, Thumb, Corner. */
+const ScrollArea = ScrollArea$1;
+injectComponentStyle("scroll-area");
+//#endregion
+export { ScrollArea };

package/dist/components/segment-group/index.d.mts

@@ -0,0 +1,17 @@
+import { SegmentGroup as SegmentGroup$1, SegmentGroupRootProps } from "@ark-ui/solid/segment-group";
+//#region src/components/segment-group/index.d.ts
+type SegmentGroupOwnProps = {
+  /** One rung of the control-height ladder for the segments. The
+   * family keeps its compact register, so the rungs sit one notch
+   * below the global ladder - the default md rests at the small
+   * height. */
+  size?: "sm" | "md" | "lg";
+};
+declare function SegmentGroupRoot(props: SegmentGroupRootProps & SegmentGroupOwnProps): import("solid-js").JSX.Element;
+/** SegmentGroup, dressed in the paper-and-ink system: a hairline tray
+ * where one flat ink plate travels beneath the checked seal. The parts - Root, Label, Indicator, Item, ItemText, ItemControl,
+ * ItemHiddenInput. */
+export declare const SegmentGroup: Omit<typeof SegmentGroup$1, "Root"> & {
+  Root: typeof SegmentGroupRoot;
+};
+//#endregion

package/dist/components/segment-group/index.mjs

@@ -0,0 +1,23 @@
+import { injectComponentStyle } from "@bysages/core";
+import { createComponent, splitProps } from "solid-js";
+import { SegmentGroup as SegmentGroup$1 } from "@ark-ui/solid/segment-group";
+//#region src/components/segment-group/index.tsx
+function SegmentGroupRoot(props) {
+	const [own, rest] = splitProps(props, ["size"]);
+	return createComponent(SegmentGroup$1.Root, {
+		get "data-size"() {
+			return own.size ?? "md";
+		},
+		...rest
+	});
+}
+/** SegmentGroup, dressed in the paper-and-ink system: a hairline tray
+* where one flat ink plate travels beneath the checked seal. The parts - Root, Label, Indicator, Item, ItemText, ItemControl,
+* ItemHiddenInput. */
+const SegmentGroup = {
+	...SegmentGroup$1,
+	Root: SegmentGroupRoot
+};
+injectComponentStyle("segment-group");
+//#endregion
+export { SegmentGroup };

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

@@ -0,0 +1,2 @@
+import { i as NativeSelectProps, n as NativeSelect, r as NativeSelectOption, t as Select } from "../../index-YPUiqD3n.mjs";
+export { NativeSelect, type NativeSelectOption, type NativeSelectProps, Select };

package/dist/components/select/index.mjs

@@ -0,0 +1,2 @@
+import { n as NativeSelect, t as Select } from "../../select-CHaXbzLX.mjs";
+export { NativeSelect, Select };

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

@@ -0,0 +1,11 @@
+import { JSX } from "solid-js";
+//#region src/components/separator/index.d.ts
+/** The paper-ink hairline as a component: a named rule between sections.
+ * Decorative separators drop the separator role, since the page reads
+ * fine without them. */
+export interface SeparatorProps extends JSX.HTMLAttributes<HTMLDivElement> {
+  orientation?: "horizontal" | "vertical";
+  decorative?: boolean;
+}
+export declare function Separator(props: SeparatorProps): JSX.Element;
+//#endregion

package/dist/components/separator/index.mjs

@@ -0,0 +1,27 @@
+import { injectComponentStyle } from "@bysages/core";
+import { spread, template } from "@solidjs/web";
+import { splitProps } from "solid-js";
+//#region src/components/separator/index.tsx
+var _tmpl$ = /* @__PURE__ */ template(`<div>`);
+function Separator(props) {
+	injectComponentStyle("separator");
+	const [own, rest] = splitProps(props, ["orientation", "decorative"]);
+	const orientation = () => own.orientation ?? "horizontal";
+	var _el$ = _tmpl$();
+	spread(_el$, [rest, {
+		get role() {
+			return own.decorative ? "none" : "separator";
+		},
+		"data-scope": "separator",
+		"data-part": "root",
+		get "data-orientation"() {
+			return orientation();
+		},
+		get "aria-orientation"() {
+			return own.decorative ? void 0 : orientation();
+		}
+	}], false);
+	return _el$;
+}
+//#endregion
+export { Separator };

package/dist/components/signature-pad/index.d.mts

@@ -0,0 +1,8 @@
+import { SignaturePad as SignaturePad$1 } from "@ark-ui/solid/signature-pad";
+//#region src/components/signature-pad/index.d.ts
+/** Ark's SignaturePad, dressed in the paper-and-ink system: a quiet paper
+ * field with a guide hairline where ink — real ink strokes — is laid down.
+ * The API is Ark's own — Root, Label, Control, Segment, SegmentPath, Guide,
+ * ClearTrigger, HiddenInput, Context. */
+export declare const SignaturePad: typeof SignaturePad$1;
+//#endregion

package/dist/components/signature-pad/index.mjs

@@ -0,0 +1,11 @@
+import { injectComponentStyle } from "@bysages/core";
+import { SignaturePad as SignaturePad$1 } from "@ark-ui/solid/signature-pad";
+//#region src/components/signature-pad/index.ts
+/** Ark's SignaturePad, dressed in the paper-and-ink system: a quiet paper
+* field with a guide hairline where ink — real ink strokes — is laid down.
+* The API is Ark's own — Root, Label, Control, Segment, SegmentPath, Guide,
+* ClearTrigger, HiddenInput, Context. */
+const SignaturePad = SignaturePad$1;
+injectComponentStyle("signature-pad");
+//#endregion
+export { SignaturePad };

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

@@ -0,0 +1,7 @@
+import { JSX } from "solid-js";
+//#region src/components/skeleton/index.d.ts
+/** A waiting sheet of unset paper. Size it from the outside; the breath
+ * is the component's own. */
+export type SkeletonProps = JSX.HTMLAttributes<HTMLDivElement>;
+export declare function Skeleton(props: SkeletonProps): JSX.Element;
+//#endregion

package/dist/components/skeleton/index.mjs

@@ -0,0 +1,15 @@
+import { injectComponentStyle } from "@bysages/core";
+import { spread, template } from "@solidjs/web";
+//#region src/components/skeleton/index.tsx
+var _tmpl$ = /* @__PURE__ */ template(`<div>`);
+function Skeleton(props) {
+	injectComponentStyle("skeleton");
+	var _el$ = _tmpl$();
+	spread(_el$, [props, {
+		"data-scope": "skeleton",
+		"data-part": "root"
+	}], false);
+	return _el$;
+}
+//#endregion
+export { Skeleton };

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

@@ -0,0 +1,15 @@
+import { Slider as Slider$1, SliderRootProps } from "@ark-ui/solid/slider";
+//#region src/components/slider/index.d.ts
+/** Ark's Slider, dressed in the paper-and-ink system: a recessed track the
+ * primary ink runs along, a paper-seal thumb, and hairline tick markers.
+ * The API is Ark's own — Root, Label, ValueText, Control, Track, Range,
+ * Thumb, MarkerGroup, Marker, DraggingIndicator, HiddenInput. */
+type SliderOwnProps = {
+  /** One rung of the part-size ladder for the thumb seal. */
+  size?: "sm" | "md" | "lg";
+};
+declare function SliderRoot(props: SliderRootProps & SliderOwnProps): import("solid-js").JSX.Element;
+export declare const Slider: Omit<typeof Slider$1, "Root"> & {
+  Root: typeof SliderRoot;
+};
+//#endregion

package/dist/components/slider/index.mjs

@@ -0,0 +1,18 @@
+import { injectComponentStyle } from "@bysages/core";
+import { createComponent, mergeProps } from "@solidjs/web";
+import { splitProps } from "solid-js";
+import { Slider as Slider$1 } from "@ark-ui/solid/slider";
+//#region src/components/slider/index.tsx
+function SliderRoot(props) {
+	const [own, rest] = splitProps(props, ["size"]);
+	return createComponent(Slider$1.Root, mergeProps(rest, { get "data-size"() {
+		return own.size ?? "md";
+	} }));
+}
+const Slider = {
+	...Slider$1,
+	Root: SliderRoot
+};
+injectComponentStyle("slider");
+//#endregion
+export { Slider };

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

@@ -0,0 +1,9 @@
+import { JSX } from "solid-js";
+//#region src/components/spinner/index.d.ts
+export interface SpinnerProps extends JSX.HTMLAttributes<HTMLElement> {
+  size?: "sm" | "md" | "lg";
+}
+/** A wheel of waiting: one arc of ink turning about its center. Quiet by
+ * default — it reports progress without claiming attention. */
+export declare function Spinner(props: SpinnerProps): JSX.Element;
+//#endregion

package/dist/components/spinner/index.mjs

@@ -0,0 +1,26 @@
+import { injectComponentStyle } from "@bysages/core";
+import { spread, template } from "@solidjs/web";
+import { splitProps } from "solid-js";
+//#region src/components/spinner/index.tsx
+var _tmpl$ = /* @__PURE__ */ template(`<span><svg viewBox="0 0 24 24"fill=none aria-hidden=true><circle cx=12 cy=12 r=9 stroke=currentColor stroke-opacity=0.2 stroke-width=2.5></circle><path d="M21 12a9 9 0 0 0-9-9"stroke=currentColor stroke-width=2.5 stroke-linecap=round>`);
+/** A wheel of waiting: one arc of ink turning about its center. Quiet by
+* default — it reports progress without claiming attention. */
+function Spinner(props) {
+	injectComponentStyle("spinner");
+	const [own, rest] = splitProps(props, ["size"]);
+	var _el$ = _tmpl$();
+	spread(_el$, [rest, {
+		role: "status",
+		get "aria-label"() {
+			return rest["aria-label"] ?? "Loading";
+		},
+		"data-scope": "spinner",
+		"data-part": "root",
+		get "data-size"() {
+			return own.size ?? "md";
+		}
+	}], true);
+	return _el$;
+}
+//#endregion
+export { Spinner };

package/dist/components/split-button/index.d.mts

@@ -0,0 +1,36 @@
+import { JSX } from "solid-js";
+//#region src/components/split-button/index.d.ts
+export interface SplitButtonEntry {
+  label: string;
+  /** Handed back with `onSelect` when the entry is chosen. */
+  value: string;
+  danger?: boolean;
+  disabled?: boolean;
+}
+export interface SplitButtonProps extends Omit<JSX.HTMLAttributes<HTMLDivElement>, "onClick" | "onSelect"> {
+  /** The main action's label. */
+  label: string;
+  /** The dropdown's entries. */
+  items?: SplitButtonEntry[];
+  /** How both halves rest; the arrow always reads as one control with
+   * the main button. */
+  variant?: "solid" | "outline" | "ghost" | "subtle";
+  tone?: "ink" | "info" | "success" | "warning" | "danger";
+  size?: "sm" | "md" | "lg";
+  disabled?: boolean;
+  /** The main button was pressed. */
+  onClick?: (event: MouseEvent) => void;
+  /** An entry was chosen; carries its `value`. */
+  onSelect?: (value: string) => void;
+}
+/**
+ * A primary action with its alternatives one seam away: the main button
+ * fires `onClick`, the fitted arrow opens a paper vessel of the same
+ * register whose entries call `onSelect` with their value. The arrow is
+ * the menu machine's trigger with the button recipe riding over it —
+ * the machine keeps the element (positioning, focus, `data-state`), the
+ * button stylesheet's trigger register dresses it. The popup keeps the
+ * menu parts untouched.
+ */
+export declare function SplitButton(props: SplitButtonProps): JSX.Element;
+//#endregion