@stisocial/ui 0.0.0-stage → 0.1.0

package/dist/components/DatePicker/DatePicker.js

@@ -0,0 +1,104 @@
+"use client";
+import { useLocale, useMessages } from "../../provider/UIProvider.js";
+import listbox_module_default from "../_internal/listbox/listbox.module.js";
+import { useThemeContext } from "../_internal/themeContext.js";
+import { FieldDescription, FieldErrorText, FieldLabel, fieldStyles } from "../Field/Field.js";
+import calendar_module_default from "../_internal/date/calendar.module.js";
+import { CalendarParts } from "../_internal/date/CalendarParts.js";
+import { fromValue, toDate, toDateTime } from "../_internal/date/iso.js";
+import dateField_module_default from "../_internal/date/dateField.module.js";
+import { DateBox, Segments } from "../_internal/date/DateBox.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useContext, useRef, useState } from "react";
+import { Calendar, DatePicker, DatePickerStateContext, Dialog, I18nProvider, Popover, TimeField } from "react-aria-components";
+// src/components/DatePicker/DatePicker.tsx
+/** Saat parçası (DateTimePicker katmanında): seçicinin durumuna bağlıdır. */
+function PopoverTime({ label }) {
+	const state = useContext(DatePickerStateContext);
+	if (!state) return null;
+	return /* @__PURE__ */ jsxs(TimeField, {
+		"aria-label": label,
+		value: state.timeValue,
+		onChange: (t) => {
+			if (t) state.setTimeValue(t);
+		},
+		hourCycle: 24,
+		className: [fieldStyles.root, dateField_module_default.timeRow].join(" "),
+		"data-size": "sm",
+		children: [/* @__PURE__ */ jsx(FieldLabel, { children: label }), /* @__PURE__ */ jsx(DateBox, { children: /* @__PURE__ */ jsx(Segments, {}) })]
+	});
+}
+/** DatePicker ve DateTimePicker'ın ortak gövdesi (iç). */
+function PickerBody({ label, description, errorMessage, showOptional, size = "md", value, defaultValue, onChange, minValue, maxValue, isDateUnavailable, validate, className, withTime, onOpenChange, ...rest }) {
+	const locale = useLocale();
+	const t = useMessages();
+	const anchor = useRef(null);
+	const [open, setOpen] = useState(false);
+	const context = useThemeContext(anchor, open);
+	const parse = withTime ? toDateTime : toDate;
+	return /* @__PURE__ */ jsx(I18nProvider, {
+		locale,
+		children: /* @__PURE__ */ jsxs(DatePicker, {
+			...rest,
+			value: value === void 0 ? void 0 : parse(value),
+			defaultValue: parse(defaultValue),
+			onChange: onChange ? (d) => onChange(fromValue(d)) : void 0,
+			minValue: parse(minValue),
+			maxValue: parse(maxValue),
+			isDateUnavailable: isDateUnavailable ? (d) => isDateUnavailable(d.toString().slice(0, 10)) : void 0,
+			validate: validate ? (d) => validate(fromValue(d)) : void 0,
+			granularity: withTime ? "minute" : "day",
+			hourCycle: 24,
+			firstDayOfWeek: "mon",
+			shouldCloseOnSelect: !withTime,
+			validationBehavior: "native",
+			onOpenChange: (o) => {
+				setOpen(o);
+				onOpenChange?.(o);
+			},
+			className: [fieldStyles.root, className].filter(Boolean).join(" "),
+			"data-size": size,
+			children: [
+				/* @__PURE__ */ jsx("span", {
+					ref: anchor,
+					className: listbox_module_default.anchor,
+					"aria-hidden": "true"
+				}),
+				/* @__PURE__ */ jsx(FieldLabel, {
+					showOptional: showOptional && !rest.isRequired,
+					children: label
+				}),
+				/* @__PURE__ */ jsx(DateBox, {
+					withButton: true,
+					isReadOnly: rest.isReadOnly,
+					children: /* @__PURE__ */ jsx(Segments, {})
+				}),
+				description ? /* @__PURE__ */ jsx(FieldDescription, { children: description }) : null,
+				/* @__PURE__ */ jsx(FieldErrorText, { errorMessage }),
+				/* @__PURE__ */ jsx(Popover, {
+					offset: 6,
+					placement: "bottom start",
+					className: dateField_module_default.popover,
+					...context,
+					children: /* @__PURE__ */ jsxs(Dialog, {
+						className: dateField_module_default.dialog,
+						children: [/* @__PURE__ */ jsx(Calendar, {
+							firstDayOfWeek: "mon",
+							className: calendar_module_default.root,
+							children: /* @__PURE__ */ jsx(CalendarParts, {})
+						}), withTime ? /* @__PURE__ */ jsx(PopoverTime, { label: t.dateTimeTime }) : null]
+					})
+				})
+			]
+		})
+	});
+}
+/**
+* Takvimli tarih seçici: parçalı tarih alanı ve yanında takvim düğmesi; takvim açılır katmanda.
+* Gün yazılabilir ya da takvimden seçilir; seçince katman kapanır ve odak alana döner. Alt+↓
+* takvimi açar, Escape kapatır. Değer ISO günüdür.
+*/
+function DatePicker$1(props) {
+	return /* @__PURE__ */ jsx(PickerBody, { ...props });
+}
+export { DatePicker$1 as DatePicker, PickerBody };

package/dist/components/DatePicker/index.d.ts

@@ -0,0 +1,2 @@
+import { DatePicker, DatePickerProps } from "./DatePicker.js";
+export { DatePicker, type DatePickerProps };

package/dist/components/DateRangePicker/DateRangePicker.d.ts

@@ -0,0 +1,48 @@
+import { ErrorMessage } from "../Field/Field.js";
+import { useMessages } from "../../provider/UIProvider.js";
+import { DateRangeValue } from "../_internal/date/iso.js";
+import { ReactNode } from "react";
+export interface DateRangePreset {
+  label: string;
+  value: DateRangeValue;
+}
+export interface DateRangePickerProps {
+  label: ReactNode;
+  description?: ReactNode;
+  errorMessage?: ErrorMessage;
+  showOptional?: boolean;
+  size?: "sm" | "md" | "lg";
+  /** Aralık (`{ start, end }`, ISO günleri); boşsa `null`. */
+  value?: DateRangeValue | null;
+  defaultValue?: DateRangeValue | null;
+  onChange?: (value: DateRangeValue | null) => void;
+  minValue?: string;
+  maxValue?: string;
+  isDateUnavailable?: (date: string) => boolean;
+  allowsNonContiguousRanges?: boolean;
+  /**
+   * Hazır aralıklar. Varsayılan: bugün, dün, son 7 gün, son 30 gün, bu ay, geçen ay, bu yıl
+   * (uygulamanın saat dilimine göre). `false` gizler; dizi verilirse onlar gösterilir.
+   */
+  presets?: readonly DateRangePreset[] | false;
+  /** Başlangıç ve bitişin form alanı adları (ISO gün). */
+  startName?: string;
+  endName?: string;
+  isRequired?: boolean;
+  isDisabled?: boolean;
+  isReadOnly?: boolean;
+  isInvalid?: boolean;
+  validate?: (value: DateRangeValue | null) => string | string[] | true | null | undefined;
+  autoFocus?: boolean;
+  className?: string;
+  id?: string;
+}
+/** Saat dilimine göre varsayılan hazır aralıklar. */
+export declare function defaultRangePresets(timeZone: string, t: ReturnType<typeof useMessages>): DateRangePreset[];
+/**
+ * Tarih aralığı seçici: başlangıç ve bitiş parçalı alanları, takvim düğmesi; katmanda hazır
+ * aralıklar (raporlar için) ve iki aylık aralık takvimi. Hazır aralık seçilince katman kapanır.
+ * Değer ISO günlerinden oluşan aralıktır.
+ */
+export declare function DateRangePicker({ label, description, errorMessage, showOptional, size, value, defaultValue, onChange, minValue, maxValue, isDateUnavailable, presets, validate, className, ...rest }: DateRangePickerProps): import("react").JSX.Element;
+export type { DateRangeValue };

package/dist/components/DateRangePicker/DateRangePicker.js

@@ -0,0 +1,185 @@
+"use client";
+import { useFormatter, useLocale, useMessages } from "../../provider/UIProvider.js";
+import listbox_module_default from "../_internal/listbox/listbox.module.js";
+import { useThemeContext } from "../_internal/themeContext.js";
+import { FieldDescription, FieldErrorText, FieldLabel, fieldStyles } from "../Field/Field.js";
+import calendar_module_default from "../_internal/date/calendar.module.js";
+import { CalendarParts } from "../_internal/date/CalendarParts.js";
+import { fromValue, toDate, toRange, todayIn } from "../_internal/date/iso.js";
+import dateField_module_default from "../_internal/date/dateField.module.js";
+import { DateBox, Segments } from "../_internal/date/DateBox.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useMemo, useRef, useState } from "react";
+import { Button, DateRangePicker, Dialog, I18nProvider, Popover, RangeCalendar } from "react-aria-components";
+import { endOfMonth, startOfMonth, startOfYear } from "@internationalized/date";
+// src/components/DateRangePicker/DateRangePicker.tsx
+/** Saat dilimine göre varsayılan hazır aralıklar. */
+function defaultRangePresets(timeZone, t) {
+	const now = todayIn(timeZone);
+	const iso = (d) => d.toString();
+	const lastMonth = now.subtract({ months: 1 });
+	return [
+		{
+			label: t.today,
+			value: {
+				start: iso(now),
+				end: iso(now)
+			}
+		},
+		{
+			label: t.yesterday,
+			value: {
+				start: iso(now.subtract({ days: 1 })),
+				end: iso(now.subtract({ days: 1 }))
+			}
+		},
+		{
+			label: t.rangeLast7,
+			value: {
+				start: iso(now.subtract({ days: 6 })),
+				end: iso(now)
+			}
+		},
+		{
+			label: t.rangeLast30,
+			value: {
+				start: iso(now.subtract({ days: 29 })),
+				end: iso(now)
+			}
+		},
+		{
+			label: t.rangeThisMonth,
+			value: {
+				start: iso(startOfMonth(now)),
+				end: iso(now)
+			}
+		},
+		{
+			label: t.rangeLastMonth,
+			value: {
+				start: iso(startOfMonth(lastMonth)),
+				end: iso(endOfMonth(lastMonth))
+			}
+		},
+		{
+			label: t.rangeThisYear,
+			value: {
+				start: iso(startOfYear(now)),
+				end: iso(now)
+			}
+		}
+	];
+}
+const sameRange = (a, b) => a?.start === b.start && a?.end === b.end;
+/**
+* Tarih aralığı seçici: başlangıç ve bitiş parçalı alanları, takvim düğmesi; katmanda hazır
+* aralıklar (raporlar için) ve iki aylık aralık takvimi. Hazır aralık seçilince katman kapanır.
+* Değer ISO günlerinden oluşan aralıktır.
+*/
+function DateRangePicker$1({ label, description, errorMessage, showOptional, size = "md", value, defaultValue, onChange, minValue, maxValue, isDateUnavailable, presets, validate, className, ...rest }) {
+	const locale = useLocale();
+	const t = useMessages();
+	const timeZone = useFormatter().context.timeZone;
+	const anchor = useRef(null);
+	const [open, setOpen] = useState(false);
+	const context = useThemeContext(anchor, open);
+	const [inner, setInner] = useState(defaultValue ?? null);
+	const current = value === void 0 ? inner : value;
+	const shownPresets = useMemo(() => presets === false ? [] : presets ?? defaultRangePresets(timeZone, t), [
+		presets,
+		timeZone,
+		t
+	]);
+	const change = (next) => {
+		if (value === void 0) setInner(next);
+		onChange?.(next);
+	};
+	const inRange = (p) => {
+		const min = toDate(minValue);
+		const max = toDate(maxValue);
+		const r = toRange(p.value);
+		return Boolean(r && (!min || r.start.compare(min) >= 0) && (!max || r.end.compare(max) <= 0));
+	};
+	return /* @__PURE__ */ jsx(I18nProvider, {
+		locale,
+		children: /* @__PURE__ */ jsxs(DateRangePicker, {
+			...rest,
+			value: toRange(current),
+			onChange: (r) => change(r ? {
+				start: fromValue(r.start),
+				end: fromValue(r.end)
+			} : null),
+			minValue: toDate(minValue),
+			maxValue: toDate(maxValue),
+			isDateUnavailable: isDateUnavailable ? (d) => isDateUnavailable(d.toString()) : void 0,
+			validate: validate ? (r) => validate(r ? {
+				start: fromValue(r.start),
+				end: fromValue(r.end)
+			} : null) : void 0,
+			firstDayOfWeek: "mon",
+			isOpen: open,
+			onOpenChange: setOpen,
+			validationBehavior: "native",
+			className: [fieldStyles.root, className].filter(Boolean).join(" "),
+			"data-size": size,
+			children: [
+				/* @__PURE__ */ jsx("span", {
+					ref: anchor,
+					className: listbox_module_default.anchor,
+					"aria-hidden": "true"
+				}),
+				/* @__PURE__ */ jsx(FieldLabel, {
+					showOptional: showOptional && !rest.isRequired,
+					children: label
+				}),
+				/* @__PURE__ */ jsxs(DateBox, {
+					withButton: true,
+					wrap: true,
+					isReadOnly: rest.isReadOnly,
+					children: [
+						/* @__PURE__ */ jsx(Segments, { slot: "start" }),
+						/* @__PURE__ */ jsx("span", {
+							className: dateField_module_default.separator,
+							"aria-hidden": "true",
+							children: "–"
+						}),
+						/* @__PURE__ */ jsx(Segments, { slot: "end" })
+					]
+				}),
+				description ? /* @__PURE__ */ jsx(FieldDescription, { children: description }) : null,
+				/* @__PURE__ */ jsx(FieldErrorText, { errorMessage }),
+				/* @__PURE__ */ jsx(Popover, {
+					offset: 6,
+					placement: "bottom start",
+					className: dateField_module_default.popover,
+					...context,
+					children: /* @__PURE__ */ jsxs(Dialog, {
+						className: dateField_module_default.dialog,
+						children: [shownPresets.length > 0 ? /* @__PURE__ */ jsx("div", {
+							role: "group",
+							"aria-label": t.rangePresets,
+							className: dateField_module_default.presets,
+							children: shownPresets.map((p) => /* @__PURE__ */ jsx(Button, {
+								className: dateField_module_default.preset,
+								"aria-pressed": sameRange(current, p.value),
+								isDisabled: !inRange(p),
+								onPress: () => {
+									change(p.value);
+									setOpen(false);
+								},
+								children: p.label
+							}, p.label))
+						}) : null, /* @__PURE__ */ jsx(RangeCalendar, {
+							firstDayOfWeek: "mon",
+							visibleDuration: { months: 2 },
+							"data-range": "",
+							className: calendar_module_default.root,
+							children: /* @__PURE__ */ jsx(CalendarParts, { months: 2 })
+						})]
+					})
+				})
+			]
+		})
+	});
+}
+export { DateRangePicker$1 as DateRangePicker, defaultRangePresets };

package/dist/components/DateRangePicker/index.d.ts

@@ -0,0 +1,3 @@
+import { DateRangeValue } from "../_internal/date/iso.js";
+import { DateRangePicker, DateRangePickerProps, DateRangePreset, defaultRangePresets } from "./DateRangePicker.js";
+export { DateRangePicker, DateRangePickerProps, DateRangePreset, type DateRangeValue, defaultRangePresets };

package/dist/components/DateTime/DateTime.css

@@ -0,0 +1,12 @@
+@layer sti.reset, sti.tokens, sti.base, sti.components, sti.variants, sti.utilities;
+@layer sti.components {
+  .sti-DateTime-root-b12eb {
+    --sti-datetime-font: var(--sti-font-numeric);
+    font-family: var(--sti-datetime-font);
+    font-variant-numeric: tabular-nums;
+  }
+
+  .sti-DateTime-root-b12eb[data-format="time"], .sti-DateTime-root-b12eb[data-format="calendar"] {
+    white-space: nowrap;
+  }
+}

package/dist/components/DateTime/DateTime.d.ts

@@ -0,0 +1,77 @@
+import { Locale } from "../../provider/locale.js";
+import { DateValue } from "./instant.js";
+import { DateStyle, DayLabels } from "../../format/dates.js";
+export type DateTimeFormat = "date" | "dateTime" | "time" | "monthYear" | "calendar";
+/**
+ * Yıl gösterimi: `always` yılı her zaman yazar; `auto` yılı yalnız `now` ile aynı yıl değilse
+ * yazar ("6 Kasım", ama "3 Mart 2025").
+ */
+export type YearDisplay = "always" | "auto";
+interface DateTimeBaseProps {
+  /**
+   * Tarih: `Date`, Unix milisaniyesi ya da ISO 8601 metni. Metin takvim günü ("1990-03-12") ya
+   * da saat dilimi farkıyla an ("2026-11-06T14:05:00+03:00") olmalıdır; geçersiz değer hata verir.
+   */
+  value: DateValue;
+  /** Dil; varsayılan Türkçe. İstemci ağacında `useFormatter().context.locale` verilir. */
+  locale?: Locale;
+  /** Saatin yazıldığı IANA saat dilimi; varsayılan "Europe/Istanbul". Takvim gününe uygulanmaz. */
+  timeZone?: string;
+  className?: string;
+  id?: string;
+}
+/** Tarih: uzun ("6 Kasım 2026"); yılı `yearDisplay` belirler. */
+interface DateLongProps {
+  format?: "date";
+  dateStyle?: "long";
+  yearDisplay?: YearDisplay;
+  /** `yearDisplay="auto"` için karşılaştırılan an; verilmezse çizildiği an. */
+  now?: Date | number;
+  seconds?: never;
+  dayLabels?: never;
+}
+/** Tarih: kısa ("6 Kas 2026") ya da sayısal ("06.11.2026"); yıl her zaman yazılır. */
+interface DateCompactProps {
+  format?: "date";
+  dateStyle: Exclude<DateStyle, "long">;
+  yearDisplay?: never;
+  now?: never;
+  seconds?: never;
+  dayLabels?: never;
+}
+/** Tarih ve saat: "6 Kasım 2026 14:05". */
+interface DateAndTimeProps {
+  format: "dateTime";
+  yearDisplay?: YearDisplay;
+  now?: Date | number;
+}
+/** Saat: "14:05", saniyeli "14:05:09". */
+interface TimeProps {
+  format: "time";
+  seconds?: boolean;
+}
+/** Ay ve yıl: "Kasım 2026". */
+interface MonthYearProps {
+  format: "monthYear";
+}
+/** Takvime göre: "Bugün 14:05", "Dün 09:10", "3 Kas 14:05"; başka yıldaysa "3 Mart 2025 14:05". */
+interface CalendarProps {
+  format: "calendar";
+  /** Karşılaştırılan an; verilmezse çizildiği an. */
+  now?: Date | number;
+  /**
+   * "Bugün", "Dün", "Yarın" metinleri (zorunlu). Sunucu bileşeni yerleşik metin taşımaz
+   * (kılavuz §3): metin uygulamanın sözlüğünden gelir; istemci ağacında `useMessages()` doğrudan
+   * verilebilir (`dayLabels={useMessages()}`), böylece sağlayıcıdaki metin değişiklikleri de geçer.
+   */
+  dayLabels: DayLabels;
+}
+export type DateTimeProps = DateTimeBaseProps & (DateLongProps | DateCompactProps | DateAndTimeProps | TimeProps | MonthYearProps | CalendarProps);
+/**
+ * Tarih ve saat gösterimi: `<time dateTime="…">` içinde dilin ve saat diliminin kuralıyla yazılmış
+ * metin. Sunucu bileşenidir: aynı değer, dil ve saat dilimiyle sunucu da tarayıcı da aynı metni
+ * üretir. Tam tarih `title` ile verilmez (dokunmatikte ve klavyede ulaşılamaz, ekran okuyucuda
+ * tekrar eder); gereken bilgi görünen metindedir.
+ */
+export declare function DateTime(props: DateTimeProps): import("react").JSX.Element;
+export type { DateValue };

package/dist/components/DateTime/DateTime.js

@@ -0,0 +1,66 @@
+import { contextOf } from "../../format/context.js";
+import { dayKey, formatCalendarDate, formatCalendarDateTime, formatDate, formatDateTime, formatMonthYear, formatTime } from "../../format/dates.js";
+import DateTime_module_default from "./DateTime.module.js";
+import { dayAsUtc, parseDateValue } from "./instant.js";
+import { jsx } from "react/jsx-runtime";
+// src/components/DateTime/DateTime.tsx
+const yearOf = (instant, timeZone) => dayKey(instant, timeZone).slice(0, 4);
+/** Görünen metin (sunucu ve istemcide aynı). */
+function dateTimeText(props) {
+	const ctx = contextOf({
+		locale: props.locale,
+		timeZone: props.timeZone
+	});
+	const parsed = parseDateValue(props.value);
+	const now = "now" in props && props.now !== void 0 ? props.now : Date.now();
+	if (parsed.kind === "day") {
+		const utc = {
+			locale: ctx.locale,
+			timeZone: "UTC"
+		};
+		switch (props.format) {
+			case void 0:
+			case "date": {
+				if ("dateStyle" in props && props.dateStyle && props.dateStyle !== "long") return formatDate(dayAsUtc(parsed.day), utc, props.dateStyle);
+				const withYear = !("yearDisplay" in props && props.yearDisplay === "auto") || parsed.day.slice(0, 4) !== yearOf(now, ctx.timeZone);
+				return formatCalendarDate(parsed.day, ctx, { withYear });
+			}
+			case "monthYear": return formatMonthYear(dayAsUtc(parsed.day), utc);
+			default: throw new RangeError(`Takvim gününün saati yoktur; "${props.format}" biçimi için an verilmeli: ${parsed.day}`);
+		}
+	}
+	const date = parsed.date;
+	const sameYear = () => yearOf(date, ctx.timeZone) === yearOf(now, ctx.timeZone);
+	switch (props.format) {
+		case void 0:
+		case "date":
+			if ("dateStyle" in props && props.dateStyle && props.dateStyle !== "long") return formatDate(date, ctx, props.dateStyle);
+			if ("yearDisplay" in props && props.yearDisplay === "auto" && sameYear()) return formatCalendarDate(dayKey(date, ctx.timeZone), ctx, { withYear: false });
+			return formatDate(date, ctx, "long");
+		case "dateTime": {
+			const withYear = !(props.yearDisplay === "auto" && sameYear());
+			return formatDateTime(date, ctx, { withYear });
+		}
+		case "time": return formatTime(date, ctx, { seconds: props.seconds === true });
+		case "monthYear": return formatMonthYear(date, ctx);
+		case "calendar": return formatCalendarDateTime(date, now, props.dayLabels, ctx);
+	}
+}
+/**
+* Tarih ve saat gösterimi: `<time dateTime="…">` içinde dilin ve saat diliminin kuralıyla yazılmış
+* metin. Sunucu bileşenidir: aynı değer, dil ve saat dilimiyle sunucu da tarayıcı da aynı metni
+* üretir. Tam tarih `title` ile verilmez (dokunmatikte ve klavyede ulaşılamaz, ekran okuyucuda
+* tekrar eder); gereken bilgi görünen metindedir.
+*/
+function DateTime(props) {
+	const parsed = parseDateValue(props.value);
+	const machine = parsed.kind === "day" ? parsed.day : parsed.date.toISOString();
+	return /* @__PURE__ */ jsx("time", {
+		id: props.id,
+		className: [DateTime_module_default.root, props.className].filter(Boolean).join(" "),
+		dateTime: machine,
+		"data-format": props.format ?? "date",
+		children: dateTimeText(props)
+	});
+}
+export { DateTime, dateTimeText };

package/dist/components/DateTime/DateTime.module.js

@@ -0,0 +1,4 @@
+import './DateTime.css';
+// src/components/DateTime/DateTime.module.css
+var DateTime_module_default = { "root": "sti-DateTime-root-b12eb" };
+export { DateTime_module_default as default };

package/dist/components/DateTime/instant.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Tarih değerinin okunması (DateTime ve RelativeTime ortak; dışa açık değildir). Değer üç biçimde
+ * gelir: `Date`, Unix milisaniyesi ya da ISO 8601 metni. Metin iki türlüdür:
+ * - takvim günü ("1990-03-12"): saati ve saat dilimi yoktur (doğum tarihi, son ödeme günü);
+ * - an ("2026-11-06T14:05:00+03:00", "2026-11-06T11:05:00Z"): saat dilimi farkı zorunludur.
+ *   Farksız metin ("2026-11-06T14:05") reddedilir: sunucu ile tarayıcı onu kendi saat dilimlerinde
+ *   farklı anlar olarak okur ve iki taraf farklı metin üretirdi.
+ */
+export type DateValue = Date | number | string;

package/dist/components/DateTime/instant.js

@@ -0,0 +1,52 @@
+// src/components/DateTime/instant.ts
+const DAY = /^\d{4}-\d{2}-\d{2}$/;
+const INSTANT = /^(\d{4}-\d{2}-\d{2})T(\d{2}):(\d{2})(?::(\d{2})(?:\.\d{1,9})?)?(?:Z|[+-](\d{2}):(\d{2}))$/i;
+const valid = (date) => {
+	if (Number.isNaN(date.getTime())) throw new RangeError("Geçersiz tarih");
+	return date;
+};
+/**
+* An metnini parçalarıyla denetler. `new Date()` takvimde olmayan günü sessizce kaydırır
+* ("2026-02-30T10:00Z" → 2 Mart) ve "24:00"ı ertesi gün sayar; yanlış gün yazılmasın diye
+* gün `dayAsUtc` ile, saat 0–23, dakika ve saniye 0–59, fark en çok ±14:59 olarak denetlenir.
+*/
+function parseInstantText(text, parts) {
+	const [, day = "", hour, minute, second = "0", offsetHour = "0", offsetMinute = "0"] = parts;
+	dayAsUtc(day);
+	if (Number(hour) > 23 || Number(minute) > 59 || Number(second) > 59 || Number(offsetHour) > 14 || Number(offsetMinute) > 59) throw new RangeError(`Geçersiz saat ya da saat dilimi farkı: ${text}`);
+	return valid(new Date(text));
+}
+/** Değeri takvim günü ya da an olarak okur; geçersizse `RangeError` (sessizce yanlış yazmaz). */
+function parseDateValue(value) {
+	if (typeof value === "string") {
+		const text = value.trim();
+		if (DAY.test(text)) return {
+			kind: "day",
+			day: text
+		};
+		const instant = INSTANT.exec(text);
+		if (instant) return {
+			kind: "instant",
+			date: parseInstantText(text, instant)
+		};
+		throw new RangeError(`Tarih ISO 8601 biçiminde verilmeli: takvim günü "YYYY-AA-GG" ya da saat dilimi farkıyla an ("2026-11-06T14:05:00+03:00"). Verilen: ${value}`);
+	}
+	return {
+		kind: "instant",
+		date: valid(value instanceof Date ? value : new Date(value))
+	};
+}
+/** Yalnız an kabul eder (göreli zaman gibi saati gerektiren gösterimler için). */
+function parseInstant(value) {
+	const parsed = parseDateValue(value);
+	if (parsed.kind === "day") throw new RangeError(`Takvim gününün saati yoktur; an verilmeli: ${parsed.day}`);
+	return parsed.date;
+}
+/** Takvim gününü UTC gece yarısındaki an olarak verir (UTC'de biçimlendirilince aynı gündür). */
+function dayAsUtc(day) {
+	const [y, m, d] = day.split("-").map(Number);
+	const date = new Date(Date.UTC(y, m - 1, d));
+	if (date.getUTCMonth() !== m - 1 || date.getUTCDate() !== d) throw new RangeError(`Takvimde olmayan gün: ${day}`);
+	return date;
+}
+export { dayAsUtc, parseDateValue, parseInstant };

package/dist/components/DateTimePicker/DateTimePicker.d.ts

@@ -0,0 +1,9 @@
+import { DatePickerProps } from "../DatePicker/DatePicker.js";
+export type DateTimePickerProps = DatePickerProps;
+/**
+ * Tarih ve saat seçici: parçalı alanda gün, ay, yıl, saat ve dakika; takvim katmanında gün ve altında
+ * saat alanı. Gün seçince katman açık kalır (saat de seçilebilsin). Saat 24 saat düzenindedir.
+ * Değer saat dilimsiz ISO metnidir ("2026-11-07T14:30"): yerel saattir; saat dilimi uygulamanın
+ * (kişinin) saat dilimidir ve sunucuda o dilimle yorumlanır.
+ */
+export declare function DateTimePicker(props: DateTimePickerProps): import("react").JSX.Element;

package/dist/components/DateTimePicker/DateTimePicker.js

@@ -0,0 +1,17 @@
+"use client";
+import { PickerBody } from "../DatePicker/DatePicker.js";
+import { jsx } from "react/jsx-runtime";
+// src/components/DateTimePicker/DateTimePicker.tsx
+/**
+* Tarih ve saat seçici: parçalı alanda gün, ay, yıl, saat ve dakika; takvim katmanında gün ve altında
+* saat alanı. Gün seçince katman açık kalır (saat de seçilebilsin). Saat 24 saat düzenindedir.
+* Değer saat dilimsiz ISO metnidir ("2026-11-07T14:30"): yerel saattir; saat dilimi uygulamanın
+* (kişinin) saat dilimidir ve sunucuda o dilimle yorumlanır.
+*/
+function DateTimePicker(props) {
+	return /* @__PURE__ */ jsx(PickerBody, {
+		...props,
+		withTime: true
+	});
+}
+export { DateTimePicker };

package/dist/components/DateTimePicker/index.d.ts

@@ -0,0 +1,2 @@
+import { DateTimePicker, DateTimePickerProps } from "./DateTimePicker.js";
+export { DateTimePicker, DateTimePickerProps };