@wirekyt/react 0.0.1 → 0.0.3

package/dist/date-picker.js

@@ -0,0 +1,543 @@
+import { t as __exportAll } from "./rolldown-runtime-D7D4PA-g.js";
+import { c as createSplitProps, l as useComposedRefs, u as createContext$1 } from "./utils-CqLmqrgj.js";
+import { n as useEnvironmentContext } from "./environment-BTgKwk5E.js";
+import { a as useMachine, i as normalizeProps, t as mergeProps } from "./core-CEYOEcVI.js";
+import { n as wire } from "./factory-Nm__-4xn.js";
+import { a as useLocaleContext } from "./providers-FEHnDTvb.js";
+import { a as splitPresenceProps, i as usePresence, n as usePresenceContext, t as PresenceProvider } from "./presence-I8Rceflw.js";
+import { uniq } from "@wirekyt/dom/utils";
+import { Fragment, forwardRef, useId, useMemo } from "react";
+import { jsx } from "react/jsx-runtime";
+import * as datePicker from "@wirekyt/dom/machines/date-picker";
+import { anatomy, parse as parseDate } from "@wirekyt/dom/machines/date-picker";
+//#region src/components/date-picker/use-context.ts
+const [DatePickerProvider, useDatePickerContext] = createContext$1({
+	name: "DatePickerContext",
+	hookName: "useDatePickerContext",
+	providerName: "<DatePickerProvider />"
+});
+//#endregion
+//#region src/components/date-picker/clear-trigger.tsx
+const DatePickerClearTrigger = forwardRef((props, ref) => {
+	const mergedProps = mergeProps(useDatePickerContext().getClearTriggerProps(), props);
+	return /* @__PURE__ */ jsx(wire.button, {
+		...mergedProps,
+		ref
+	});
+});
+DatePickerClearTrigger.displayName = "DatePickerClearTrigger";
+//#endregion
+//#region src/components/date-picker/content.tsx
+const DatePickerContent = forwardRef((props, ref) => {
+	const datePicker = useDatePickerContext();
+	const presence = usePresenceContext();
+	const mergedProps = mergeProps(datePicker.getContentProps(), presence.getPresenceProps(), props);
+	const composedRefs = useComposedRefs(presence.ref, ref);
+	if (presence.unmounted) return null;
+	return /* @__PURE__ */ jsx(wire.div, {
+		...mergedProps,
+		ref: composedRefs
+	});
+});
+DatePickerContent.displayName = "DatePickerContent";
+//#endregion
+//#region src/components/date-picker/context.tsx
+const DatePickerContext = (props) => props.children(useDatePickerContext());
+//#endregion
+//#region src/components/date-picker/control.tsx
+const DatePickerControl = forwardRef((props, ref) => {
+	const mergedProps = mergeProps(useDatePickerContext().getControlProps(), props);
+	return /* @__PURE__ */ jsx(wire.div, {
+		...mergedProps,
+		ref
+	});
+});
+DatePickerControl.displayName = "DatePickerControl";
+//#endregion
+//#region src/components/date-picker/input.tsx
+const splitInputProps = createSplitProps();
+const DatePickerInput = forwardRef((props, ref) => {
+	const [inputProps, localProps] = splitInputProps(props, ["index", "fixOnBlur"]);
+	const mergedProps = mergeProps(useDatePickerContext().getInputProps(inputProps), localProps);
+	return /* @__PURE__ */ jsx(wire.input, {
+		...mergedProps,
+		ref
+	});
+});
+DatePickerInput.displayName = "DatePickerInput";
+//#endregion
+//#region src/components/date-picker/label.tsx
+const DatePickerLabel = forwardRef((props, ref) => {
+	const mergedProps = mergeProps(useDatePickerContext().getLabelProps(), props);
+	return /* @__PURE__ */ jsx(wire.label, {
+		...mergedProps,
+		ref
+	});
+});
+DatePickerLabel.displayName = "DatePickerLabel";
+//#endregion
+//#region src/components/date-picker/month-select.tsx
+const DatePickerMonthSelect = forwardRef((props, ref) => {
+	const datePicker = useDatePickerContext();
+	const mergedProps = mergeProps(datePicker.getMonthSelectProps(), props);
+	return /* @__PURE__ */ jsx(wire.select, {
+		...mergedProps,
+		ref,
+		children: datePicker.getMonths().map((month, i) => /* @__PURE__ */ jsx("option", {
+			value: month.value,
+			children: month.label
+		}, i))
+	});
+});
+DatePickerMonthSelect.displayName = "DatePickerMonthSelect";
+//#endregion
+//#region src/components/date-picker/use-view-props-context.ts
+const [DatePickerViewPropsProvider, useDatePickerViewPropsContext] = createContext$1({
+	name: "DatePickerViewContext",
+	hookName: "useDatePickerViewContext",
+	providerName: "<DatePickerViewProvider />",
+	strict: false,
+	defaultValue: { view: "day" }
+});
+//#endregion
+//#region src/components/date-picker/next-trigger.tsx
+const DatePickerNextTrigger = forwardRef((props, ref) => {
+	const datePicker = useDatePickerContext();
+	const viewProps = useDatePickerViewPropsContext();
+	const mergedProps = mergeProps(datePicker.getNextTriggerProps(viewProps), props);
+	return /* @__PURE__ */ jsx(wire.button, {
+		...mergedProps,
+		ref
+	});
+});
+DatePickerNextTrigger.displayName = "DatePickerNextTrigger";
+//#endregion
+//#region src/components/date-picker/positioner.tsx
+const DatePickerPositioner = forwardRef((props, ref) => {
+	const mergedProps = mergeProps(useDatePickerContext().getPositionerProps(), props);
+	if (usePresenceContext().unmounted) return null;
+	return /* @__PURE__ */ jsx(wire.div, {
+		...mergedProps,
+		ref
+	});
+});
+DatePickerPositioner.displayName = "DatePickerPositioner";
+//#endregion
+//#region src/components/date-picker/preset-trigger.tsx
+const splitPresetTriggerProps = createSplitProps();
+const DatePickerPresetTrigger = forwardRef((props, ref) => {
+	const [presetTriggerProps, localProps] = splitPresetTriggerProps(props, ["value"]);
+	const mergedProps = mergeProps(useDatePickerContext().getPresetTriggerProps(presetTriggerProps), localProps);
+	return /* @__PURE__ */ jsx(wire.button, {
+		...mergedProps,
+		ref
+	});
+});
+DatePickerPresetTrigger.displayName = "DatePickerPresetTrigger";
+//#endregion
+//#region src/components/date-picker/prev-trigger.tsx
+const DatePickerPrevTrigger = forwardRef((props, ref) => {
+	const datePicker = useDatePickerContext();
+	const viewProps = useDatePickerViewPropsContext();
+	const mergedProps = mergeProps(datePicker.getPrevTriggerProps(viewProps), props);
+	return /* @__PURE__ */ jsx(wire.button, {
+		...mergedProps,
+		ref
+	});
+});
+DatePickerPrevTrigger.displayName = "DatePickerPrevTrigger";
+//#endregion
+//#region src/components/date-picker/range-text.tsx
+const DatePickerRangeText = forwardRef((props, ref) => {
+	const datePicker = useDatePickerContext();
+	const mergedProps = mergeProps(datePicker.getRangeTextProps(), props);
+	const visibleRangeText = useMemo(() => {
+		const { start, end } = datePicker.visibleRangeText;
+		return uniq([start, end]).filter(Boolean).join(" - ");
+	}, [datePicker.visibleRangeText]);
+	return /* @__PURE__ */ jsx(wire.div, {
+		...mergedProps,
+		ref,
+		children: visibleRangeText
+	});
+});
+DatePickerRangeText.displayName = "DatePickerRangeText";
+//#endregion
+//#region src/components/date-picker/anatomy.ts
+const datePickerAnatomy = anatomy.extendWith("view", "valueText");
+//#endregion
+//#region src/components/date-picker/value-text.tsx
+const DatePickerValueText = forwardRef((props, ref) => {
+	const { children, placeholder, separator = ", ", ...localProps } = props;
+	const datePicker = useDatePickerContext();
+	const hasValue = datePicker.value.length > 0;
+	if (typeof children === "function") return /* @__PURE__ */ jsx(Fragment, { children: hasValue ? datePicker.value.map((value, index) => /* @__PURE__ */ jsx(Fragment, { children: children({
+		value,
+		index,
+		valueAsString: datePicker.valueAsString[index] ?? "",
+		remove: () => {
+			datePicker.setValue(datePicker.value.filter((_, i) => i !== index));
+		}
+	}) }, index)) : placeholder });
+	return /* @__PURE__ */ jsx(wire.span, {
+		...datePickerAnatomy.build().valueText.attrs,
+		...localProps,
+		ref,
+		children: hasValue ? datePicker.valueAsString.join(separator) : placeholder
+	});
+});
+DatePickerValueText.displayName = "DatePickerValueText";
+//#endregion
+//#region src/components/date-picker/use-date-picker.ts
+const useDatePicker = (props) => {
+	const id = useId();
+	const { getRootNode } = useEnvironmentContext();
+	const { dir, locale } = useLocaleContext();
+	const machineProps = {
+		id,
+		dir,
+		locale,
+		getRootNode,
+		...props
+	};
+	const service = useMachine(datePicker.machine, machineProps);
+	return datePicker.connect(service, normalizeProps);
+};
+//#endregion
+//#region src/components/date-picker/root.tsx
+const splitRootProps = createSplitProps();
+const DatePickerRoot = forwardRef((props, ref) => {
+	const [presenceProps, datePickerProps] = splitPresenceProps(props);
+	const [useDatePickerProps, localProps] = splitRootProps(datePickerProps, [
+		"closeOnSelect",
+		"createCalendar",
+		"defaultFocusedValue",
+		"defaultOpen",
+		"defaultValue",
+		"defaultView",
+		"disabled",
+		"fixedWeeks",
+		"focusedValue",
+		"format",
+		"id",
+		"ids",
+		"inline",
+		"invalid",
+		"isDateUnavailable",
+		"locale",
+		"max",
+		"maxView",
+		"min",
+		"minView",
+		"name",
+		"numOfMonths",
+		"onFocusChange",
+		"onOpenChange",
+		"onValueChange",
+		"onViewChange",
+		"onVisibleRangeChange",
+		"open",
+		"outsideDaySelectable",
+		"parse",
+		"placeholder",
+		"positioning",
+		"readOnly",
+		"required",
+		"selectionMode",
+		"startOfWeek",
+		"timeZone",
+		"translations",
+		"value",
+		"view",
+		"openOnClick",
+		"showWeekNumbers",
+		"maxSelectedDates"
+	]);
+	const datePicker = useDatePicker(useDatePickerProps);
+	const presence = usePresence(mergeProps({ present: datePicker.open }, presenceProps));
+	const mergedProps = mergeProps(datePicker.getRootProps(), localProps);
+	return /* @__PURE__ */ jsx(DatePickerProvider, {
+		value: datePicker,
+		children: /* @__PURE__ */ jsx(PresenceProvider, {
+			value: presence,
+			children: /* @__PURE__ */ jsx(wire.div, {
+				...mergedProps,
+				ref
+			})
+		})
+	});
+});
+DatePickerRoot.displayName = "DatePickerRoot";
+//#endregion
+//#region src/components/date-picker/root-provider.tsx
+const splitRootProviderProps = createSplitProps();
+const DatePickerRootProvider = forwardRef((props, ref) => {
+	const [presenceProps, datePickerProps] = splitPresenceProps(props);
+	const [{ value: datePicker }, localProps] = splitRootProviderProps(datePickerProps, ["value"]);
+	const presence = usePresence(mergeProps({ present: datePicker.open }, presenceProps));
+	const mergedProps = mergeProps(datePicker.getRootProps(), localProps);
+	return /* @__PURE__ */ jsx(DatePickerProvider, {
+		value: datePicker,
+		children: /* @__PURE__ */ jsx(PresenceProvider, {
+			value: presence,
+			children: /* @__PURE__ */ jsx(wire.div, {
+				...mergedProps,
+				ref
+			})
+		})
+	});
+});
+DatePickerRootProvider.displayName = "DatePickerRootProvider";
+//#endregion
+//#region src/components/date-picker/use-table-props-context.ts
+const [DatePickerTablePropsProvider, useDatePickerTablePropsContext] = createContext$1({
+	name: "DatePickerTableContext",
+	hookName: "useDatePickerTableContext",
+	providerName: "<DatePickerTableProvider />"
+});
+//#endregion
+//#region src/components/date-picker/table.tsx
+const splitTableProps = createSplitProps();
+const DatePickerTable = forwardRef((props, ref) => {
+	const [{ columns }, localProps] = splitTableProps(props, ["columns"]);
+	const datePicker = useDatePickerContext();
+	const viewProps = useDatePickerViewPropsContext();
+	const tableProps = {
+		columns,
+		id: useId(),
+		...viewProps
+	};
+	const mergedProps = mergeProps(datePicker.getTableProps(tableProps), localProps);
+	return /* @__PURE__ */ jsx(DatePickerTablePropsProvider, {
+		value: tableProps,
+		children: /* @__PURE__ */ jsx(wire.table, {
+			...mergedProps,
+			ref
+		})
+	});
+});
+DatePickerTable.displayName = "DatePickerTable";
+//#endregion
+//#region src/components/date-picker/table-body.tsx
+const DatePickerTableBody = forwardRef((props, ref) => {
+	const datePicker = useDatePickerContext();
+	const tableProps = useDatePickerTablePropsContext();
+	const mergedProps = mergeProps(datePicker.getTableBodyProps(tableProps), props);
+	return /* @__PURE__ */ jsx(wire.tbody, {
+		...mergedProps,
+		ref
+	});
+});
+DatePickerTableBody.displayName = "DatePickerTableBody";
+//#endregion
+//#region src/components/date-picker/use-table-cell-props-context.ts
+const [DatePickerTableCellPropsProvider, useDatePickerTableCellPropsContext] = createContext$1({
+	name: "DatePickerTableCellContext",
+	hookName: "useDatePickerTableCellContext",
+	providerName: "<DatePickerTableCellProvider />"
+});
+//#endregion
+//#region src/components/date-picker/table-cell.tsx
+const splitTableCellProps = createSplitProps();
+const DatePickerTableCell = forwardRef((props, ref) => {
+	const [cellProps, localProps] = splitTableCellProps(props, [
+		"disabled",
+		"value",
+		"visibleRange",
+		"columns"
+	]);
+	const datePicker = useDatePickerContext();
+	const viewProps = useDatePickerViewPropsContext();
+	const mergedProps = mergeProps({
+		day: datePicker.getDayTableCellProps,
+		month: datePicker.getMonthTableCellProps,
+		year: datePicker.getYearTableCellProps
+	}[viewProps.view](cellProps), localProps);
+	return /* @__PURE__ */ jsx(DatePickerTableCellPropsProvider, {
+		value: cellProps,
+		children: /* @__PURE__ */ jsx(wire.td, {
+			ref,
+			...mergedProps
+		})
+	});
+});
+DatePickerTableCell.displayName = "DatePickerTableCell";
+//#endregion
+//#region src/components/date-picker/table-cell-trigger.tsx
+const DatePickerTableCellTrigger = forwardRef((props, ref) => {
+	const datePicker = useDatePickerContext();
+	const tableCellProps = useDatePickerTableCellPropsContext();
+	const viewProps = useDatePickerViewPropsContext();
+	const viewFn = {
+		day: datePicker.getDayTableCellTriggerProps,
+		month: datePicker.getMonthTableCellTriggerProps,
+		year: datePicker.getYearTableCellTriggerProps
+	}[viewProps.view];
+	const mergedProps = mergeProps(viewFn(tableCellProps), props);
+	return /* @__PURE__ */ jsx(wire.div, {
+		ref,
+		...mergedProps
+	});
+});
+DatePickerTableCellTrigger.displayName = "DatePickerTableCellTrigger";
+//#endregion
+//#region src/components/date-picker/table-head.tsx
+const DatePickerTableHead = forwardRef((props, ref) => {
+	const datePicker = useDatePickerContext();
+	const tableProps = useDatePickerTablePropsContext();
+	const mergedProps = mergeProps(datePicker.getTableHeadProps(tableProps), props);
+	return /* @__PURE__ */ jsx(wire.thead, {
+		...mergedProps,
+		ref
+	});
+});
+DatePickerTableHead.displayName = "DatePickerTableHead";
+//#endregion
+//#region src/components/date-picker/table-header.tsx
+const DatePickerTableHeader = forwardRef((props, ref) => {
+	const datePicker = useDatePickerContext();
+	const tableProps = useDatePickerTablePropsContext();
+	const mergedProps = mergeProps(datePicker.getTableHeaderProps(tableProps), props);
+	return /* @__PURE__ */ jsx(wire.th, {
+		...mergedProps,
+		ref
+	});
+});
+DatePickerTableHeader.displayName = "DatePickerTableHeader";
+//#endregion
+//#region src/components/date-picker/week-number-header-cell.tsx
+const DatePickerWeekNumberHeaderCell = forwardRef((props, ref) => {
+	const datePicker = useDatePickerContext();
+	const tableProps = useDatePickerTablePropsContext();
+	const mergedProps = mergeProps(datePicker.getWeekNumberHeaderCellProps(tableProps), props);
+	return /* @__PURE__ */ jsx(wire.th, {
+		...mergedProps,
+		ref
+	});
+});
+DatePickerWeekNumberHeaderCell.displayName = "DatePickerWeekNumberHeaderCell";
+//#endregion
+//#region src/components/date-picker/week-number-cell.tsx
+const splitWeekNumberCellProps = createSplitProps();
+const DatePickerWeekNumberCell = forwardRef((props, ref) => {
+	const [cellProps, localProps] = splitWeekNumberCellProps(props, ["weekIndex", "week"]);
+	const mergedProps = mergeProps(useDatePickerContext().getWeekNumberCellProps(cellProps), localProps);
+	return /* @__PURE__ */ jsx(wire.td, {
+		...mergedProps,
+		ref
+	});
+});
+DatePickerWeekNumberCell.displayName = "DatePickerWeekNumberCell";
+//#endregion
+//#region src/components/date-picker/table-row.tsx
+const DatePickerTableRow = forwardRef((props, ref) => {
+	const datePicker = useDatePickerContext();
+	const tableProps = useDatePickerTablePropsContext();
+	const mergedProps = mergeProps(datePicker.getTableRowProps(tableProps), props);
+	return /* @__PURE__ */ jsx(wire.tr, {
+		...mergedProps,
+		ref
+	});
+});
+DatePickerTableRow.displayName = "DatePickerTableRow";
+//#endregion
+//#region src/components/date-picker/trigger.tsx
+const DatePickerTrigger = forwardRef((props, ref) => {
+	const mergedProps = mergeProps(useDatePickerContext().getTriggerProps(), props);
+	return /* @__PURE__ */ jsx(wire.button, {
+		...mergedProps,
+		ref
+	});
+});
+DatePickerTrigger.displayName = "DatePickerTrigger";
+//#endregion
+//#region src/components/date-picker/view.tsx
+const splitViewProps = createSplitProps();
+const DatePickerView = forwardRef((props, ref) => {
+	const [viewProps, localProps] = splitViewProps(props, ["view"]);
+	const datePicker = useDatePickerContext();
+	return /* @__PURE__ */ jsx(DatePickerViewPropsProvider, {
+		value: viewProps,
+		children: /* @__PURE__ */ jsx(wire.div, {
+			hidden: datePicker.view !== viewProps.view,
+			...datePickerAnatomy.build().view.attrs,
+			...localProps,
+			ref
+		})
+	});
+});
+DatePickerView.displayName = "DatePickerView";
+//#endregion
+//#region src/components/date-picker/view-control.tsx
+const DatePickerViewControl = forwardRef((props, ref) => {
+	const datePicker = useDatePickerContext();
+	const viewProps = useDatePickerViewPropsContext();
+	const mergedProps = mergeProps(datePicker.getViewControlProps(viewProps), props);
+	return /* @__PURE__ */ jsx(wire.div, {
+		...mergedProps,
+		ref
+	});
+});
+DatePickerViewControl.displayName = "DatePickerViewControl";
+//#endregion
+//#region src/components/date-picker/view-trigger.tsx
+const DatePickerViewTrigger = forwardRef((props, ref) => {
+	const datePicker = useDatePickerContext();
+	const viewProps = useDatePickerViewPropsContext();
+	const mergedProps = mergeProps(datePicker.getViewTriggerProps(viewProps), props);
+	return /* @__PURE__ */ jsx(wire.button, {
+		...mergedProps,
+		ref
+	});
+});
+DatePickerViewTrigger.displayName = "DatePickerViewTrigger";
+//#endregion
+//#region src/components/date-picker/year-select.tsx
+const DatePickerYearSelect = forwardRef((props, ref) => {
+	const datePicker = useDatePickerContext();
+	const mergedProps = mergeProps(datePicker.getYearSelectProps(), props);
+	return /* @__PURE__ */ jsx(wire.select, {
+		...mergedProps,
+		ref,
+		children: datePicker.getYears().map((year, i) => /* @__PURE__ */ jsx("option", {
+			value: year.value,
+			children: year.label
+		}, i))
+	});
+});
+DatePickerYearSelect.displayName = "DatePickerYearSelect";
+//#endregion
+//#region src/components/date-picker/date-picker.ts
+var date_picker_exports = /* @__PURE__ */ __exportAll({
+	ClearTrigger: () => DatePickerClearTrigger,
+	Content: () => DatePickerContent,
+	Context: () => DatePickerContext,
+	Control: () => DatePickerControl,
+	Input: () => DatePickerInput,
+	Label: () => DatePickerLabel,
+	MonthSelect: () => DatePickerMonthSelect,
+	NextTrigger: () => DatePickerNextTrigger,
+	Positioner: () => DatePickerPositioner,
+	PresetTrigger: () => DatePickerPresetTrigger,
+	PrevTrigger: () => DatePickerPrevTrigger,
+	RangeText: () => DatePickerRangeText,
+	Root: () => DatePickerRoot,
+	RootProvider: () => DatePickerRootProvider,
+	Table: () => DatePickerTable,
+	TableBody: () => DatePickerTableBody,
+	TableCell: () => DatePickerTableCell,
+	TableCellTrigger: () => DatePickerTableCellTrigger,
+	TableHead: () => DatePickerTableHead,
+	TableHeader: () => DatePickerTableHeader,
+	TableRow: () => DatePickerTableRow,
+	Trigger: () => DatePickerTrigger,
+	ValueText: () => DatePickerValueText,
+	View: () => DatePickerView,
+	ViewControl: () => DatePickerViewControl,
+	ViewTrigger: () => DatePickerViewTrigger,
+	WeekNumberCell: () => DatePickerWeekNumberCell,
+	WeekNumberHeaderCell: () => DatePickerWeekNumberHeaderCell,
+	YearSelect: () => DatePickerYearSelect
+});
+//#endregion
+export { date_picker_exports as DatePicker, DatePickerClearTrigger, DatePickerContent, DatePickerContext, DatePickerControl, DatePickerInput, DatePickerLabel, DatePickerMonthSelect, DatePickerNextTrigger, DatePickerPositioner, DatePickerPresetTrigger, DatePickerPrevTrigger, DatePickerRangeText, DatePickerRoot, DatePickerRootProvider, DatePickerTable, DatePickerTableBody, DatePickerTableCell, DatePickerTableCellTrigger, DatePickerTableHead, DatePickerTableHeader, DatePickerTableRow, DatePickerTrigger, DatePickerValueText, DatePickerView, DatePickerViewControl, DatePickerViewTrigger, DatePickerWeekNumberCell, DatePickerWeekNumberHeaderCell, DatePickerYearSelect, datePickerAnatomy, parseDate, useDatePicker, useDatePickerContext };