@hitachivantara/uikit-react-core 6.8.2 → 6.9.0

package/dist/TimeAgo/formatUtils.js

@@ -1,66 +1,58 @@
-const formatTimeAgo = (timeAgoMs, locale, showSeconds = false, referenceDate = /* @__PURE__ */ new Date()) => {
-  const relFormatter = new Intl.RelativeTimeFormat(locale, { numeric: "auto" });
-  const dayFormatter = new Intl.DateTimeFormat(locale, {
-    hour: "numeric",
-    minute: "numeric",
-    ...showSeconds && { second: "numeric" }
-  });
-  const weekFormatter = new Intl.DateTimeFormat(locale, {
-    weekday: "short",
-    hour: "numeric",
-    minute: "numeric",
-    ...showSeconds && { second: "numeric" }
-  });
-  const fullFormatter = new Intl.DateTimeFormat(locale, {
-    year: "numeric",
-    month: "short",
-    day: "numeric",
-    hour: "numeric",
-    minute: "numeric",
-    ...showSeconds && { second: "numeric" }
-  });
-  const date = new Date(timeAgoMs);
-  const secsAgo = Math.floor((referenceDate.getTime() - timeAgoMs) / 1e3);
-  const minsAgo = Math.floor(secsAgo / 60);
-  const getStartOfDay = (offset) => {
-    const d = new Date(referenceDate);
-    d.setHours(0, 0, 0, 0);
-    d.setDate(d.getDate() + offset);
-    return d;
-  };
-  const startOfYesterday = getStartOfDay(-1);
-  const startOfToday = getStartOfDay(0);
-  const startOfTomorrow = getStartOfDay(1);
-  const startOfDayAfterTomorrow = getStartOfDay(2);
-  const secsInDay = date.getHours() * 3600 + date.getMinutes() * 60 + date.getSeconds();
-  const secsInWeek = date.getDay() * 86400 + secsInDay;
-  switch (true) {
-    case date >= startOfDayAfterTomorrow:
-      return fullFormatter.format(date);
-    case date >= startOfTomorrow:
-      return `${relFormatter.format(1, "days")}, ${dayFormatter.format(date)}`;
-    case minsAgo < -60:
-      return `${relFormatter.format(0, "days")}, ${dayFormatter.format(date)}`;
-    case minsAgo < -2:
-      return relFormatter.format(-minsAgo, "minutes");
-    case secsAgo < 0:
-      return relFormatter.format(Math.abs(secsAgo), "seconds");
-    case secsAgo < 20:
-      return relFormatter.format(0, "seconds");
-    case minsAgo < 2:
-      return relFormatter.format(-secsAgo, "seconds");
-    case minsAgo < 60:
-      return relFormatter.format(-minsAgo, "minutes");
-    case date >= startOfToday:
-      return `${relFormatter.format(0, "days")}, ${dayFormatter.format(date)}`;
-    case date >= startOfYesterday:
-      return `${relFormatter.format(-1, "days")}, ${dayFormatter.format(date)}`;
-    case secsAgo < secsInWeek:
-      return weekFormatter.format(date);
-    default:
-      return fullFormatter.format(date);
-  }
-};
-export {
-  formatTimeAgo
+//#region src/TimeAgo/formatUtils.ts
+/**
+* Relative time thresholds defined by
+* {@link https://xd.adobe.com/view/1b7df235-5cf8-4b51-a2f0-0be1bb591c55-4e2e/ Design System}
+*/
+var formatTimeAgo = (timeAgoMs, locale, showSeconds = false, referenceDate = /* @__PURE__ */ new Date()) => {
+	const relFormatter = new Intl.RelativeTimeFormat(locale, { numeric: "auto" });
+	const dayFormatter = new Intl.DateTimeFormat(locale, {
+		hour: "numeric",
+		minute: "numeric",
+		...showSeconds && { second: "numeric" }
+	});
+	const weekFormatter = new Intl.DateTimeFormat(locale, {
+		weekday: "short",
+		hour: "numeric",
+		minute: "numeric",
+		...showSeconds && { second: "numeric" }
+	});
+	const fullFormatter = new Intl.DateTimeFormat(locale, {
+		year: "numeric",
+		month: "short",
+		day: "numeric",
+		hour: "numeric",
+		minute: "numeric",
+		...showSeconds && { second: "numeric" }
+	});
+	const date = new Date(timeAgoMs);
+	const secsAgo = Math.floor((referenceDate.getTime() - timeAgoMs) / 1e3);
+	const minsAgo = Math.floor(secsAgo / 60);
+	const getStartOfDay = (offset) => {
+		const d = new Date(referenceDate);
+		d.setHours(0, 0, 0, 0);
+		d.setDate(d.getDate() + offset);
+		return d;
+	};
+	const startOfYesterday = getStartOfDay(-1);
+	const startOfToday = getStartOfDay(0);
+	const startOfTomorrow = getStartOfDay(1);
+	const startOfDayAfterTomorrow = getStartOfDay(2);
+	const secsInDay = date.getHours() * 3600 + date.getMinutes() * 60 + date.getSeconds();
+	const secsInWeek = date.getDay() * 86400 + secsInDay;
+	switch (true) {
+		case date >= startOfDayAfterTomorrow: return fullFormatter.format(date);
+		case date >= startOfTomorrow: return `${relFormatter.format(1, "days")}, ${dayFormatter.format(date)}`;
+		case minsAgo < -60: return `${relFormatter.format(0, "days")}, ${dayFormatter.format(date)}`;
+		case minsAgo < -2: return relFormatter.format(-minsAgo, "minutes");
+		case secsAgo < 0: return relFormatter.format(Math.abs(secsAgo), "seconds");
+		case secsAgo < 20: return relFormatter.format(0, "seconds");
+		case minsAgo < 2: return relFormatter.format(-secsAgo, "seconds");
+		case minsAgo < 60: return relFormatter.format(-minsAgo, "minutes");
+		case date >= startOfToday: return `${relFormatter.format(0, "days")}, ${dayFormatter.format(date)}`;
+		case date >= startOfYesterday: return `${relFormatter.format(-1, "days")}, ${dayFormatter.format(date)}`;
+		case secsAgo < secsInWeek: return weekFormatter.format(date);
+		default: return fullFormatter.format(date);
+	}
 };
+//#endregion
+export { formatTimeAgo };

package/dist/TimeAgo/useTimeAgo.js

@@ -1,22 +1,22 @@
-import { useState, useEffect } from "react";
 import { formatTimeAgo } from "./formatUtils.js";
 import { useTimeout } from "./useTimeout.js";
+import { useEffect, useState } from "react";
+//#region src/TimeAgo/useTimeAgo.ts
 function useTimeAgo(timestamp = Date.now(), options) {
-  const { locale, disableRefresh = false, showSeconds = false } = options || {};
-  const [timeAgo, setTimeAgo] = useState(
-    () => formatTimeAgo(timestamp, locale, showSeconds)
-  );
-  const refreshTime = disableRefresh ? 0 : 1e4;
-  useEffect(() => {
-    const newTimeAgo = formatTimeAgo(timestamp, locale, showSeconds);
-    setTimeAgo(newTimeAgo);
-  }, [timestamp, locale, showSeconds]);
-  useTimeout(() => {
-    const newTimeAgo = formatTimeAgo(timestamp, locale, showSeconds);
-    setTimeAgo(newTimeAgo);
-  }, refreshTime);
-  return timeAgo;
+	const { locale, disableRefresh = false, showSeconds = false } = options || {};
+	const [timeAgo, setTimeAgo] = useState(() => formatTimeAgo(timestamp, locale, showSeconds));
+	const refreshTime = disableRefresh ? 0 : 1e4;
+	useEffect(() => {
+		setTimeAgo(formatTimeAgo(timestamp, locale, showSeconds));
+	}, [
+		timestamp,
+		locale,
+		showSeconds
+	]);
+	useTimeout(() => {
+		setTimeAgo(formatTimeAgo(timestamp, locale, showSeconds));
+	}, refreshTime);
+	return timeAgo;
 }
-export {
-  useTimeAgo as default
-};
+//#endregion
+export { useTimeAgo as default };

package/dist/TimeAgo/useTimeout.js

@@ -1,15 +1,15 @@
-import { useRef, useEffect } from "react";
-const useTimeout = (callback, delay) => {
-  const savedCallback = useRef(callback);
-  useEffect(() => {
-    savedCallback.current = callback;
-  }, [callback]);
-  useEffect(() => {
-    if (!delay) return void 0;
-    const id = setTimeout(() => savedCallback.current(), delay);
-    return () => clearTimeout(id);
-  }, [delay]);
-};
-export {
-  useTimeout
+import { useEffect, useRef } from "react";
+//#region src/TimeAgo/useTimeout.ts
+var useTimeout = (callback, delay) => {
+	const savedCallback = useRef(callback);
+	useEffect(() => {
+		savedCallback.current = callback;
+	}, [callback]);
+	useEffect(() => {
+		if (!delay) return void 0;
+		const id = setTimeout(() => savedCallback.current(), delay);
+		return () => clearTimeout(id);
+	}, [delay]);
 };
+//#endregion
+export { useTimeout };

package/dist/TimePicker/Placeholder.js

@@ -1,58 +1,52 @@
-import { jsxs, jsx } from "react/jsx-runtime";
 import { forwardRef, useRef } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
 import { useDateSegment } from "react-aria/useDateField";
-const getDateValue = (date) => {
-  if (!date) return "";
-  const { hour, minute, second } = date;
-  return [hour, minute, second].map((el) => String(el).padStart(2, "0")).join(":");
+//#region src/TimePicker/Placeholder.tsx
+/** Convert `Date` into `hh:mm:ss` format */
+var getDateValue = (date) => {
+	if (!date) return "";
+	const { hour, minute, second } = date;
+	return [
+		hour,
+		minute,
+		second
+	].map((el) => String(el).padStart(2, "0")).join(":");
 };
-const PlaceholderSegment = ({
-  segment,
-  state,
-  value
-}) => {
-  const ref = useRef(null);
-  const { segmentProps } = useDateSegment(segment, state, ref);
-  if (segment.type === "literal" && segment.text === "⁦") return;
-  return /* @__PURE__ */ jsx("div", { ref, ...segmentProps, children: value });
+var PlaceholderSegment = ({ segment, state, value }) => {
+	const ref = useRef(null);
+	const { segmentProps } = useDateSegment(segment, state, ref);
+	if (segment.type === "literal" && segment.text === "⁦") return;
+	return /* @__PURE__ */ jsx("div", {
+		ref,
+		...segmentProps,
+		children: value
+	});
 };
-const Placeholder = forwardRef(
-  function Placeholder2(props, ref) {
-    const { name, state, placeholders, onKeyDown, ...others } = props;
-    const { value, segments } = state;
-    return (
-      // eslint-disable-next-line jsx-a11y/no-static-element-interactions
-      /* @__PURE__ */ jsxs(
-        "div",
-        {
-          ref,
-          onKeyDown: (event) => {
-            event.stopPropagation();
-            onKeyDown?.(event);
-          },
-          ...others,
-          children: [
-            name && /* @__PURE__ */ jsx("input", { type: "hidden", name, value: getDateValue(value) }),
-            segments.map((segment, i) => /* @__PURE__ */ jsx(
-              PlaceholderSegment,
-              {
-                segment,
-                state,
-                value: renderSegment(segment, placeholders[segment.type])
-              },
-              segment.type === "literal" ? `literal-${i}` : segment.type
-            ))
-          ]
-        }
-      )
-    );
-  }
-);
+var Placeholder = forwardRef(function Placeholder(props, ref) {
+	const { name, state, placeholders, onKeyDown, ...others } = props;
+	const { value, segments } = state;
+	return /* @__PURE__ */ jsxs("div", {
+		ref,
+		onKeyDown: (event) => {
+			event.stopPropagation();
+			onKeyDown?.(event);
+		},
+		...others,
+		children: [name && /* @__PURE__ */ jsx("input", {
+			type: "hidden",
+			name,
+			value: getDateValue(value)
+		}), segments.map((segment, i) => /* @__PURE__ */ jsx(PlaceholderSegment, {
+			segment,
+			state,
+			value: renderSegment(segment, placeholders[segment.type])
+		}, segment.type === "literal" ? `literal-${i}` : segment.type))]
+	});
+});
 function renderSegment(segment, placeholder) {
-  if (segment.type === "literal") return segment.text;
-  if (segment.isPlaceholder) return placeholder ?? segment.text;
-  return segment.text.padStart(2, "0");
+	if (segment.type === "literal") return segment.text;
+	if (segment.isPlaceholder) return placeholder ?? segment.text;
+	return segment.text.padStart(2, "0");
 }
-export {
-  Placeholder
-};
+//#endregion
+export { Placeholder };