@journ/nude 0.1.0

package/dist/calendar-parts.js

@@ -0,0 +1,213 @@
+"use client";
+import { StepButton } from "./step-button.js";
+import { useState, useSyncExternalStore } from "react";
+import { jsx } from "react/jsx-runtime";
+import { createRequiredContext, useControllableState } from "@journ/lift";
+import { addMonths, formatMonthYear, startOfMonth } from "@journ/fitter-happier";
+//#region src/calendar-parts.tsx
+const YEAR_PAGE_SIZE = 12;
+const dayKey = (date) => `${date.getFullYear()}-${date.getMonth()}-${date.getDate()}`;
+const isSameDay = (a, b) => b !== null && dayKey(a) === dayKey(b);
+const isSameMonth = (a, b) => b !== null && a.getFullYear() === b.getFullYear() && a.getMonth() === b.getMonth();
+const yearPageStart = (month) => Math.floor(month.getFullYear() / 12) * 12;
+const monthGrid = (month, weekStartsOn) => {
+	const offset = (month.getDay() - weekStartsOn + 7) % 7;
+	return Array.from({ length: 42 }, (_, index) => new Date(month.getFullYear(), month.getMonth(), index - offset + 1));
+};
+const noopSubscribe = () => () => void 0;
+const useToday = () => {
+	const key = useSyncExternalStore(noopSubscribe, () => dayKey(/* @__PURE__ */ new Date()), () => null);
+	if (key === null) return null;
+	const [year, month, date] = key.split("-").map(Number);
+	return new Date(year ?? 0, month ?? 0, date ?? 1);
+};
+const [CalendarContext, useCalendar] = createRequiredContext("Calendar.Provider or Calendar.Root");
+const Provider = ({ state, actions, meta, children }) => /* @__PURE__ */ jsx(CalendarContext, {
+	value: {
+		state,
+		actions,
+		meta
+	},
+	children
+});
+/** Month, view and paging shared by every calendar-based picker. */
+const useCalendarNavigation = (initialMonth, initialView = "days") => {
+	const [month, setMonth] = useState(() => startOfMonth(initialMonth));
+	const [view, setView] = useState(initialView);
+	const step = view === "days" ? 1 : view === "months" ? 12 : 144;
+	return {
+		month,
+		view,
+		navigation: {
+			showMonth: (next) => setMonth(startOfMonth(next)),
+			showView: setView,
+			previous: () => setMonth(addMonths(month, -step)),
+			next: () => setMonth(addMonths(month, step))
+		}
+	};
+};
+/** A fixed default keeps server and client output identical; pass `locale` to localize. */
+const DEFAULT_LOCALE = "en";
+const Root = ({ value, defaultValue = null, onValueChange, defaultMonth, locale = DEFAULT_LOCALE, weekStartsOn = 0, children }) => {
+	const [selected, setSelected] = useControllableState(value, defaultValue, onValueChange);
+	const { month, view, navigation } = useCalendarNavigation(defaultMonth ?? selected ?? /* @__PURE__ */ new Date());
+	const actions = {
+		...navigation,
+		select: (date) => {
+			setSelected(date);
+			if (!isSameMonth(date, month)) navigation.showMonth(date);
+		}
+	};
+	return /* @__PURE__ */ jsx(Provider, {
+		state: {
+			selected,
+			month,
+			view
+		},
+		actions,
+		meta: {
+			locale,
+			weekStartsOn
+		},
+		children
+	});
+};
+const Frame = (props) => /* @__PURE__ */ jsx("div", {
+	"data-slot": "calendar",
+	...props
+});
+const Header = (props) => /* @__PURE__ */ jsx("div", {
+	"data-slot": "calendar-header",
+	...props
+});
+const Heading = ({ onClick, ...props }) => {
+	const { state, actions, meta } = useCalendar();
+	const start = yearPageStart(state.month);
+	const label = state.view === "days" ? formatMonthYear(state.month, meta.locale) : state.view === "months" ? String(state.month.getFullYear()) : `${start} – ${start + 12 - 1}`;
+	return /* @__PURE__ */ jsx("button", {
+		type: "button",
+		"data-slot": "calendar-heading",
+		"aria-live": "polite",
+		disabled: state.view === "years",
+		...props,
+		onClick: (event) => {
+			onClick?.(event);
+			actions.showView(state.view === "days" ? "months" : "years");
+		},
+		children: label
+	});
+};
+const Previous = (props) => {
+	const { actions } = useCalendar();
+	return /* @__PURE__ */ jsx(StepButton, {
+		"data-slot": "calendar-previous",
+		"aria-label": "Previous",
+		...props,
+		onStep: actions.previous
+	});
+};
+const Next = (props) => {
+	const { actions } = useCalendar();
+	return /* @__PURE__ */ jsx(StepButton, {
+		"data-slot": "calendar-next",
+		"aria-label": "Next",
+		...props,
+		onStep: actions.next
+	});
+};
+const cellState = (selected, today, inRange = false) => selected ? "selected" : inRange ? "inRange" : today ? "today" : "idle";
+const isInRange = (date, range) => range?.to != null && date.getTime() > range.from.getTime() && date.getTime() < range.to.getTime();
+const Weekdays = ({ classNames, ...props }) => {
+	const { state, meta } = useCalendar();
+	if (state.view !== "days") return null;
+	const format = new Intl.DateTimeFormat(meta.locale, { weekday: "short" });
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "calendar-weekdays",
+		"aria-hidden": true,
+		...props,
+		children: monthGrid(state.month, meta.weekStartsOn).slice(0, 7).map((date) => /* @__PURE__ */ jsx("span", {
+			"data-slot": "calendar-weekday",
+			className: classNames?.weekday,
+			children: format.format(date)
+		}, date.getDay()))
+	});
+};
+const Days = ({ classNames, ...props }) => {
+	const { state, actions, meta } = useCalendar();
+	const today = useToday();
+	if (state.view !== "days") return null;
+	const format = new Intl.DateTimeFormat(meta.locale, { dateStyle: "full" });
+	const isEdge = (date) => state.range ? isSameDay(date, state.range.from) || isSameDay(date, state.range.to) : isSameDay(date, state.selected);
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "calendar-days",
+		...props,
+		children: monthGrid(state.month, meta.weekStartsOn).map((date) => {
+			const current = cellState(isEdge(date), isSameDay(date, today), isInRange(date, state.range));
+			return /* @__PURE__ */ jsx("button", {
+				type: "button",
+				"data-slot": "calendar-day",
+				"data-state": current,
+				"aria-label": format.format(date),
+				"aria-pressed": isEdge(date),
+				"aria-current": isSameDay(date, today) ? "date" : void 0,
+				"data-outside": date.getMonth() !== state.month.getMonth(),
+				onClick: () => actions.select(date),
+				className: classNames?.day?.(current),
+				children: date.getDate()
+			}, dayKey(date));
+		})
+	});
+};
+const Months = ({ classNames, ...props }) => {
+	const { state, actions, meta } = useCalendar();
+	const today = useToday();
+	if (state.view !== "months") return null;
+	const format = new Intl.DateTimeFormat(meta.locale, { month: "short" });
+	const year = state.month.getFullYear();
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "calendar-months",
+		...props,
+		children: Array.from({ length: 12 }, (_, index) => new Date(year, index, 1)).map((date) => {
+			const current = cellState(isSameMonth(date, state.selected), isSameMonth(date, today));
+			return /* @__PURE__ */ jsx("button", {
+				type: "button",
+				"data-slot": "calendar-month",
+				"data-state": current,
+				"aria-pressed": isSameMonth(date, state.selected),
+				onClick: () => {
+					actions.showMonth(date);
+					actions.showView("days");
+				},
+				className: classNames?.month?.(current),
+				children: format.format(date)
+			}, date.getMonth());
+		})
+	});
+};
+const Years = ({ classNames, ...props }) => {
+	const { state, actions } = useCalendar();
+	const today = useToday();
+	if (state.view !== "years") return null;
+	const start = yearPageStart(state.month);
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "calendar-years",
+		...props,
+		children: Array.from({ length: 12 }, (_, index) => start + index).map((year) => {
+			const current = cellState(state.selected?.getFullYear() === year, today?.getFullYear() === year);
+			return /* @__PURE__ */ jsx("button", {
+				type: "button",
+				"data-slot": "calendar-year",
+				"data-state": current,
+				"aria-pressed": state.selected?.getFullYear() === year,
+				onClick: () => {
+					actions.showMonth(new Date(year, state.month.getMonth(), 1));
+					actions.showView("months");
+				},
+				className: classNames?.year?.(current),
+				children: year
+			}, year);
+		})
+	});
+};
+//#endregion
+export { Days, Frame, Header, Heading, Months, Next, Previous, Provider, Root, Weekdays, YEAR_PAGE_SIZE, Years, useCalendar, useCalendarNavigation };

package/dist/calendar.d.ts

@@ -0,0 +1,17 @@
+import { CalendarActions, CalendarContextValue, CalendarMeta, CalendarRange, CalendarState, CalendarView, Days, Frame, Header, Heading, Months, Next, Previous, Provider, Root, RootProps, Weekday, Weekdays, Years, useCalendar } from "./calendar-parts.js";
+//#region src/calendar.d.ts
+declare const Calendar: {
+  Provider: typeof Provider;
+  Root: typeof Root;
+  Frame: typeof Frame;
+  Header: typeof Header;
+  Heading: typeof Heading;
+  Previous: typeof Previous;
+  Next: typeof Next;
+  Weekdays: typeof Weekdays;
+  Days: typeof Days;
+  Months: typeof Months;
+  Years: typeof Years;
+};
+//#endregion
+export { Calendar, type CalendarActions, type CalendarContextValue, type CalendarMeta, type RootProps as CalendarProps, type CalendarRange, type CalendarState, type CalendarView, type Weekday, useCalendar };

package/dist/calendar.js

@@ -0,0 +1,17 @@
+import { Days, Frame, Header, Heading, Months, Next, Previous, Provider, Root, Weekdays, Years, useCalendar } from "./calendar-parts.js";
+//#region src/calendar.tsx
+const Calendar = {
+	Provider,
+	Root,
+	Frame,
+	Header,
+	Heading,
+	Previous,
+	Next,
+	Weekdays,
+	Days,
+	Months,
+	Years
+};
+//#endregion
+export { Calendar, useCalendar };

package/dist/card.d.ts

@@ -0,0 +1,12 @@
+//#region src/card.d.ts
+declare const Card: {
+  Root: (props: import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => import("react").ReactNode;
+  Icon: (props: import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => import("react").ReactNode;
+  Header: (props: import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => import("react").ReactNode;
+  Title: (props: import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>) => import("react").ReactNode;
+  Description: (props: import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>) => import("react").ReactNode;
+  Content: (props: import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => import("react").ReactNode;
+  Footer: (props: import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>) => import("react").ReactNode;
+};
+//#endregion
+export { Card };

package/dist/card.js

@@ -0,0 +1,13 @@
+import { part } from "./lib/part.js";
+//#region src/card.tsx
+const Card = {
+	Root: part("div", "card"),
+	Icon: part("span", "card-icon"),
+	Header: part("div", "card-header"),
+	Title: part("h3", "card-title"),
+	Description: part("p", "card-description"),
+	Content: part("div", "card-content"),
+	Footer: part("footer", "card-footer")
+};
+//#endregion
+export { Card };

package/dist/carousel-parts.d.ts

@@ -0,0 +1,29 @@
+import { IconButtonProps } from "./icon-button.js";
+import { ComponentPropsWithRef, ReactNode } from "react";
+import useEmblaCarousel from "embla-carousel-react";
+//#region src/carousel-parts.d.ts
+type Orientation = 'horizontal' | 'vertical';
+type Options = Parameters<typeof useEmblaCarousel>[0];
+type Plugins = Parameters<typeof useEmblaCarousel>[1];
+declare const useCarousel: any;
+type RootProps = Omit<ComponentPropsWithRef<'div'>, 'children'> & {
+  /** Embla options such as `loop` and `align`. */
+  opts?: Options;
+  plugins?: Plugins;
+  orientation?: Orientation;
+  children?: ReactNode;
+};
+/** Slides with Embla. Arrow keys move between slides. */
+declare const Root: ({ opts, plugins, orientation, children, onKeyDownCapture, ...props }: RootProps) => import("react").JSX.Element;
+type ContentProps = ComponentPropsWithRef<'div'> & {
+  classNames?: {
+    viewport?: string;
+  };
+};
+/** The track of slides, inside the viewport Embla scrolls. Embla needs the viewport to clip and the track to be a flex row or column. */
+declare const Content: ({ classNames, ...props }: ContentProps) => import("react").JSX.Element;
+declare const Item: (props: ComponentPropsWithRef<'div'>) => import("react").JSX.Element;
+declare const Previous: (props: IconButtonProps) => import("react").JSX.Element;
+declare const Next: (props: IconButtonProps) => import("react").JSX.Element;
+//#endregion
+export { Content, Item, Next, Previous, Root, type RootProps, useCarousel };

package/dist/carousel-parts.js

@@ -0,0 +1,98 @@
+"use client";
+import { StepButton } from "./step-button.js";
+import { useEffect, useState } from "react";
+import { jsx } from "react/jsx-runtime";
+import { createRequiredContext } from "@journ/lift";
+import useEmblaCarousel from "embla-carousel-react";
+//#region src/carousel-parts.tsx
+const [CarouselContext, useCarousel] = createRequiredContext("Carousel.Root");
+/** Slides with Embla. Arrow keys move between slides. */
+const Root = ({ opts, plugins, orientation = "horizontal", children, onKeyDownCapture, ...props }) => {
+	const [viewport, api] = useEmblaCarousel({
+		...opts,
+		axis: orientation === "horizontal" ? "x" : "y"
+	}, plugins);
+	const [canPrevious, setCanPrevious] = useState(false);
+	const [canNext, setCanNext] = useState(false);
+	useEffect(() => {
+		if (!api) return;
+		const update = () => {
+			setCanPrevious(api.canScrollPrev());
+			setCanNext(api.canScrollNext());
+		};
+		update();
+		api.on("select", update);
+		api.on("reInit", update);
+		return () => {
+			api.off("select", update);
+			api.off("reInit", update);
+		};
+	}, [api]);
+	const previous = () => api?.scrollPrev();
+	const next = () => api?.scrollNext();
+	const [back, forward] = orientation === "horizontal" ? ["ArrowLeft", "ArrowRight"] : ["ArrowUp", "ArrowDown"];
+	return /* @__PURE__ */ jsx(CarouselContext, {
+		value: {
+			viewport,
+			orientation,
+			canPrevious,
+			canNext,
+			previous,
+			next
+		},
+		children: /* @__PURE__ */ jsx("div", {
+			"data-slot": "carousel",
+			"data-orientation": orientation,
+			role: "region",
+			"aria-roledescription": "carousel",
+			...props,
+			onKeyDownCapture: (event) => {
+				onKeyDownCapture?.(event);
+				if (event.key === back) event.preventDefault(), previous();
+				if (event.key === forward) event.preventDefault(), next();
+			},
+			children
+		})
+	});
+};
+/** The track of slides, inside the viewport Embla scrolls. Embla needs the viewport to clip and the track to be a flex row or column. */
+const Content = ({ classNames, ...props }) => {
+	const { viewport } = useCarousel();
+	return /* @__PURE__ */ jsx("div", {
+		ref: viewport,
+		"data-slot": "carousel-viewport",
+		className: classNames?.viewport,
+		children: /* @__PURE__ */ jsx("div", {
+			"data-slot": "carousel-content",
+			...props
+		})
+	});
+};
+const Item = (props) => /* @__PURE__ */ jsx("div", {
+	"data-slot": "carousel-item",
+	role: "group",
+	"aria-roledescription": "slide",
+	...props
+});
+const Previous = (props) => {
+	const { canPrevious, previous } = useCarousel();
+	return /* @__PURE__ */ jsx(StepButton, {
+		"data-slot": "carousel-previous",
+		"aria-label": "Previous slide",
+		disabled: !canPrevious,
+		...props,
+		onStep: previous
+	});
+};
+const Next = (props) => {
+	const { canNext, next } = useCarousel();
+	return /* @__PURE__ */ jsx(StepButton, {
+		"data-slot": "carousel-next",
+		"aria-label": "Next slide",
+		disabled: !canNext,
+		...props,
+		onStep: next
+	});
+};
+//#endregion
+export { Content, Item, Next, Previous, Root, useCarousel };

package/dist/carousel.d.ts

@@ -0,0 +1,11 @@
+import { Content, Item, Next, Previous, Root, RootProps, useCarousel } from "./carousel-parts.js";
+//#region src/carousel.d.ts
+declare const Carousel: {
+  Root: typeof Root;
+  Content: typeof Content;
+  Item: typeof Item;
+  Previous: typeof Previous;
+  Next: typeof Next;
+};
+//#endregion
+export { Carousel, type RootProps as CarouselProps, useCarousel };

package/dist/carousel.js

@@ -0,0 +1,11 @@
+import { Content, Item, Next, Previous, Root, useCarousel } from "./carousel-parts.js";
+//#region src/carousel.tsx
+const Carousel = {
+	Root,
+	Content,
+	Item,
+	Previous,
+	Next
+};
+//#endregion
+export { Carousel, useCarousel };

package/dist/checkbox-parts.d.ts

@@ -0,0 +1,7 @@
+import * as RadixCheckbox from "@radix-ui/react-checkbox";
+//#region src/checkbox-parts.d.ts
+declare const Root: (props: RadixCheckbox.CheckboxProps & import("react").RefAttributes<HTMLButtonElement>) => import("react").ReactNode;
+/** Shown while the root is checked or indeterminate. */
+declare const Indicator: (props: RadixCheckbox.CheckboxIndicatorProps & import("react").RefAttributes<HTMLSpanElement>) => import("react").ReactNode;
+//#endregion
+export { Indicator, Root };

package/dist/checkbox-parts.js

@@ -0,0 +1,9 @@
+"use client";
+import { part } from "./lib/part.js";
+import * as RadixCheckbox from "@radix-ui/react-checkbox";
+//#region src/checkbox-parts.tsx
+const Root = part(RadixCheckbox.Root, "checkbox");
+/** Shown while the root is checked or indeterminate. */
+const Indicator = part(RadixCheckbox.Indicator, "checkbox-indicator");
+//#endregion
+export { Indicator, Root };

package/dist/checkbox.d.ts

@@ -0,0 +1,7 @@
+//#region src/checkbox.d.ts
+declare const Checkbox: {
+  Root: (props: import("@radix-ui/react-checkbox").CheckboxProps & import("react").RefAttributes<HTMLButtonElement>) => import("react").ReactNode;
+  Indicator: (props: import("@radix-ui/react-checkbox").CheckboxIndicatorProps & import("react").RefAttributes<HTMLSpanElement>) => import("react").ReactNode;
+};
+//#endregion
+export { Checkbox };

package/dist/checkbox.js

@@ -0,0 +1,8 @@
+import { Indicator, Root } from "./checkbox-parts.js";
+//#region src/checkbox.tsx
+const Checkbox = {
+	Root,
+	Indicator
+};
+//#endregion
+export { Checkbox };

package/dist/chip.d.ts

@@ -0,0 +1,22 @@
+import { ComponentPropsWithRef } from "react";
+//#region src/chip.d.ts
+declare const Root: (props: import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => import("react").ReactNode;
+/** A small close button for chips that can be dismissed. `label` is the accessible name. */
+declare const Remove: ({ label, ...props }: ComponentPropsWithRef<'button'> & {
+  label: string;
+}) => import("react").JSX.Element;
+type TagProps = ComponentPropsWithRef<typeof Root> & {
+  /** Shows a remove button when given. Leave it out for a chip that cannot be dismissed. */
+  onRemove?: () => void;
+  removeLabel?: string;
+};
+/** A chip with a remove button: the shape of a selected value. */
+declare const Tag: ({ onRemove, removeLabel, children, ...props }: TagProps) => import("react").JSX.Element;
+declare const Chip: {
+  Root: (props: import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => import("react").ReactNode;
+  Dot: (props: import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => import("react").ReactNode;
+  Remove: typeof Remove;
+  Tag: typeof Tag;
+};
+//#endregion
+export { Chip, type TagProps as ChipTagProps };

package/dist/chip.js

@@ -0,0 +1,29 @@
+import { part } from "./lib/part.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/chip.tsx
+const Root = part("span", "chip");
+const Dot = part("span", "chip-dot", { "aria-hidden": true });
+/** A small close button for chips that can be dismissed. `label` is the accessible name. */
+const Remove = ({ label, ...props }) => /* @__PURE__ */ jsx("button", {
+	type: "button",
+	"data-slot": "chip-remove",
+	"aria-label": label,
+	...props
+});
+/** A chip with a remove button: the shape of a selected value. */
+const Tag = ({ onRemove, removeLabel = "Remove", children, ...props }) => /* @__PURE__ */ jsxs(Root, {
+	"data-slot": "chip-tag",
+	...props,
+	children: [children, onRemove && /* @__PURE__ */ jsx(Remove, {
+		label: removeLabel,
+		onClick: onRemove
+	})]
+});
+const Chip = {
+	Root,
+	Dot,
+	Remove,
+	Tag
+};
+//#endregion
+export { Chip };

package/dist/collapsible-parts.d.ts

@@ -0,0 +1,7 @@
+import * as RadixCollapsible from "@radix-ui/react-collapsible";
+//#region src/collapsible-parts.d.ts
+declare const Root: import("react").ForwardRefExoticComponent<RadixCollapsible.CollapsibleProps & import("react").RefAttributes<HTMLDivElement>>;
+declare const Trigger: import("react").ForwardRefExoticComponent<RadixCollapsible.CollapsibleTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
+declare const Content: (props: RadixCollapsible.CollapsibleContentProps & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactNode;
+//#endregion
+export { Content, Root, Trigger };

package/dist/collapsible-parts.js

@@ -0,0 +1,9 @@
+"use client";
+import { part } from "./lib/part.js";
+import * as RadixCollapsible from "@radix-ui/react-collapsible";
+//#region src/collapsible-parts.tsx
+const Root = RadixCollapsible.Root;
+const Trigger = RadixCollapsible.Trigger;
+const Content = part(RadixCollapsible.Content, "collapsible-content");
+//#endregion
+export { Content, Root, Trigger };

package/dist/collapsible.d.ts

@@ -0,0 +1,8 @@
+//#region src/collapsible.d.ts
+declare const Collapsible: {
+  Root: import("react").ForwardRefExoticComponent<import("@radix-ui/react-collapsible").CollapsibleProps & import("react").RefAttributes<HTMLDivElement>>;
+  Trigger: import("react").ForwardRefExoticComponent<import("@radix-ui/react-collapsible").CollapsibleTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
+  Content: (props: import("@radix-ui/react-collapsible").CollapsibleContentProps & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactNode;
+};
+//#endregion
+export { Collapsible };

package/dist/collapsible.js

@@ -0,0 +1,9 @@
+import { Content, Root, Trigger } from "./collapsible-parts.js";
+//#region src/collapsible.tsx
+const Collapsible = {
+	Root,
+	Trigger,
+	Content
+};
+//#endregion
+export { Collapsible };

package/dist/combobox-parts.d.ts

@@ -0,0 +1,85 @@
+import { PickerActions, PickerContextValue, PickerProviderProps, PickerState } from "./lib/picker.js";
+import { ComponentPropsWithRef, ReactNode } from "react";
+import { Command } from "cmdk";
+//#region src/combobox-parts.d.ts
+type ComboboxState = PickerState<string>;
+type ComboboxActions = PickerActions<string>;
+type ComboboxContextValue = Omit<PickerContextValue<string, object>, 'meta'>;
+declare const ContextProvider: ({ state, actions, meta, children }: PickerProviderProps<string, object>) => import("react").JSX.Element, Provider: ({ children, ...props }: PickerProviderProps<string, object>) => import("react").JSX.Element, Trigger: (props: ComponentPropsWithRef<'button'>) => import("react").JSX.Element, Value: ({ placeholder, children, ...props }: import("react").ClassAttributes<HTMLSpanElement> & import("react").HTMLAttributes<HTMLSpanElement> & {
+  placeholder?: string;
+}) => import("react").JSX.Element, useCombobox: any;
+type RootProps = {
+  value?: string | null;
+  defaultValue?: string | null;
+  onValueChange?: (value: string) => void;
+  children?: ReactNode;
+};
+declare const Root: ({ value, defaultValue, onValueChange, children }: RootProps) => import("react").JSX.Element;
+/** Matches without accents or case, against the item's keywords when it has any. */
+declare const Frame: (props: {
+  children?: React.ReactNode;
+} & Pick<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof import("react").HTMLAttributes<HTMLDivElement>> & {
+  ref?: React.Ref<HTMLDivElement>;
+} & {
+  asChild?: boolean;
+}, "asChild" | "key" | keyof import("react").HTMLAttributes<HTMLDivElement>> & {
+  label?: string;
+  shouldFilter?: boolean;
+  filter?: (value: string, search: string, keywords?: string[]) => number;
+  defaultValue?: string;
+  value?: string;
+  onValueChange?: (value: string) => void;
+  loop?: boolean;
+  disablePointerSelection?: boolean;
+  vimBindings?: boolean;
+} & import("react").RefAttributes<HTMLDivElement>) => ReactNode;
+declare const Input: (props: Omit<Pick<Pick<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "key" | keyof import("react").InputHTMLAttributes<HTMLInputElement>> & {
+  ref?: React.Ref<HTMLInputElement>;
+} & {
+  asChild?: boolean;
+}, "asChild" | "key" | keyof import("react").InputHTMLAttributes<HTMLInputElement>>, "onChange" | "type" | "value"> & {
+  value?: string;
+  onValueChange?: (search: string) => void;
+} & import("react").RefAttributes<HTMLInputElement>) => ReactNode;
+declare const List: (props: {
+  children?: React.ReactNode;
+} & Pick<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof import("react").HTMLAttributes<HTMLDivElement>> & {
+  ref?: React.Ref<HTMLDivElement>;
+} & {
+  asChild?: boolean;
+}, "asChild" | "key" | keyof import("react").HTMLAttributes<HTMLDivElement>> & {
+  label?: string;
+} & import("react").RefAttributes<HTMLDivElement>) => ReactNode;
+declare const Empty: (props: {
+  children?: React.ReactNode;
+} & Pick<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof import("react").HTMLAttributes<HTMLDivElement>> & {
+  ref?: React.Ref<HTMLDivElement>;
+} & {
+  asChild?: boolean;
+}, "asChild" | "key" | keyof import("react").HTMLAttributes<HTMLDivElement>> & import("react").RefAttributes<HTMLDivElement>) => ReactNode;
+declare const Group: (props: {
+  children?: React.ReactNode;
+} & Omit<Pick<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof import("react").HTMLAttributes<HTMLDivElement>> & {
+  ref?: React.Ref<HTMLDivElement>;
+} & {
+  asChild?: boolean;
+}, "asChild" | "key" | keyof import("react").HTMLAttributes<HTMLDivElement>>, "heading" | "value"> & {
+  heading?: React.ReactNode;
+  value?: string;
+  forceMount?: boolean;
+} & import("react").RefAttributes<HTMLDivElement>) => ReactNode;
+type ItemProps = Omit<ComponentPropsWithRef<typeof Command.Item>, 'value'> & {
+  value: string;
+};
+type OptionProps = ItemProps & {
+  checked: boolean;
+  /** Runs with the option's value when it is chosen. */
+  onPick: (value: string) => void;
+};
+/** An option that knows nothing about the picker around it. Combobox, MultipleSelector and others build their items from it. */
+declare const Option: ({ value, checked, onPick, onSelect, ...props }: OptionProps) => import("react").JSX.Element;
+declare const Item: (props: ItemProps) => import("react").JSX.Element;
+/** Rendered only inside the checked item. */
+declare const ItemIndicator: (props: ComponentPropsWithRef<'span'>) => import("react").JSX.Element | null;
+//#endregion
+export { type ComboboxActions, type ComboboxContextValue, type ComboboxState, ContextProvider, Empty, Frame, Group, Input, Item, ItemIndicator, type ItemProps, List, Option, type OptionProps, Provider, Root, type RootProps, Trigger, Value, useCombobox };