@nori-ui/core 1.0.6 → 1.1.0

package/dist/components/Breadcrumb/index.js

@@ -1,10 +1,10 @@
-export { Breadcrumb, getBreadcrumbJsonLd } from '../../chunk-LVWNMQGR.js';
-import '../../chunk-YNKKEO2A.js';
-import '../../chunk-RFW5SRZA.js';
-import '../../chunk-FT2XBBQJ.js';
+export { Breadcrumb, getBreadcrumbJsonLd } from '../../chunk-WDNDTSNX.js';
+import '../../chunk-7D2BHQ6M.js';
+import '../../chunk-MJ4AGXS7.js';
+import '../../chunk-6PO2IWB3.js';
 import '../../chunk-ZIBNLXIV.js';
-import '../../chunk-5A2QOOVN.js';
 import '../../chunk-CHXHRJNZ.js';
+import '../../chunk-5A2QOOVN.js';
 import '../../chunk-R5JMDDCB.js';
 import '../../chunk-WCQVDF3K.js';
 //# sourceMappingURL=index.js.map

package/dist/components/Button/index.js

@@ -1,8 +1,8 @@
-export { Button } from '../../chunk-5XEGZFG5.js';
+export { Button } from '../../chunk-LWQZ257T.js';
 import '../../chunk-ACLHDHX3.js';
 import '../../chunk-ZIBNLXIV.js';
-import '../../chunk-5A2QOOVN.js';
 import '../../chunk-CHXHRJNZ.js';
+import '../../chunk-5A2QOOVN.js';
 import '../../chunk-R5JMDDCB.js';
 import '../../chunk-WCQVDF3K.js';
 //# sourceMappingURL=index.js.map

package/dist/components/Calendar/index.cjs

@@ -298,6 +298,13 @@ function useThemeColors() {
 }
 __name(useThemeColors, "useThemeColors");
 
+// src/components/Calendar/scroll/ScrollBody.tsx
+var ScrollBody = /* @__PURE__ */ __name((_props) => {
+  throw new Error(
+    "[Calendar] ScrollBody: no platform implementation resolved. Ensure your bundler honors *.web.tsx / *.native.tsx extensions."
+  );
+}, "ScrollBody");
+
 // src/components/Calendar/state/locale-utils.ts
 var getFirstDayOfWeek = /* @__PURE__ */ __name((locale) => {
   try {
@@ -661,8 +668,8 @@ var defaultDictionary = {
   // floatButton
   "floatButton.backToTop": "Back to top",
   // calendar
-  "calendar.header.previous": "Previous",
-  "calendar.header.next": "Next",
+  "calendar.header.previous": "Previous month",
+  "calendar.header.next": "Next month",
   "calendar.header.openMonthView": "Open month picker",
   "calendar.header.openYearView": "Open year picker",
   "calendar.header.openDayView": "Open day picker",
@@ -678,7 +685,10 @@ var defaultDictionary = {
   "checkbox.checked": "Checked",
   "checkbox.unchecked": "Unchecked",
   "switch.on": "On",
-  "switch.off": "Off"
+  "switch.off": "Off",
+  // field
+  "field.requiredIndicator": "*",
+  "field.requiredLabel": "required"
 };
 
 // src/i18n/resolve.ts
@@ -870,9 +880,15 @@ var Select = /* @__PURE__ */ __name((props) => {
     itemHeight = DEFAULT_ITEM_HEIGHT,
     maxMenuHeight = DEFAULT_MAX_MENU,
     className,
-    testID
+    testID,
+    id,
+    name
   } = props;
   const ariaLabel = props["aria-label"];
+  const ariaLabelledBy = props["aria-labelledby"];
+  const ariaDescribedBy = props["aria-describedby"];
+  const ariaInvalid = props["aria-invalid"];
+  const ariaRequired = props["aria-required"];
   const multiple = props.multiple === true;
   const maxSelected = multiple ? props.maxSelected : void 0;
   const maxChips = multiple ? props.maxChips ?? 3 : void 0;
@@ -1236,11 +1252,11 @@ var Select = /* @__PURE__ */ __name((props) => {
     if (!open || searchable || reactNative.Platform.OS !== "web") {
       return;
     }
-    const id = requestAnimationFrame(() => {
+    const id2 = requestAnimationFrame(() => {
       const node = popupRef.current;
       node?.focus?.();
     });
-    return () => cancelAnimationFrame(id);
+    return () => cancelAnimationFrame(id2);
   }, [open, searchable]);
   const onListScroll = react.useCallback(
     (event) => {
@@ -1317,7 +1333,13 @@ var Select = /* @__PURE__ */ __name((props) => {
           "aria-controls": `${baseId}-listbox`,
           "aria-haspopup": "listbox",
           tabIndex: disabled ? -1 : 0,
+          ...id !== void 0 ? { id, nativeID: id } : {},
+          ...name !== void 0 ? { name } : {},
           ...ariaLabel !== void 0 ? { "aria-label": ariaLabel, accessibilityLabel: ariaLabel } : {},
+          ...ariaLabelledBy !== void 0 ? { "aria-labelledby": ariaLabelledBy, accessibilityLabelledBy: ariaLabelledBy } : {},
+          ...ariaDescribedBy !== void 0 ? { "aria-describedby": ariaDescribedBy, accessibilityDescribedBy: ariaDescribedBy } : {},
+          ...ariaInvalid === true ? { "aria-invalid": true } : {},
+          ...ariaRequired === true ? { "aria-required": true } : {},
           ...disabled ? { "aria-disabled": true, disabled: true } : {}
         },
         onPress: () => {
@@ -1991,7 +2013,7 @@ var Caption = /* @__PURE__ */ __name(({
         alignSelf: "center"
       },
       children: [
-        /* @__PURE__ */ jsxRuntime.jsx(NavButton, { label: t("calendar.header.previous", { defaultValue: "Previous" }), onPress: onPrev, children: "\u2039" }),
+        /* @__PURE__ */ jsxRuntime.jsx(NavButton, { label: t("calendar.header.previous", { defaultValue: "Previous month" }), onPress: onPrev, children: "\u2039" }),
         /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: { flexDirection: "row", gap: monthGap, width: titleRowWidth }, children: showMultiTitles ? months.map((m, i) => /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: { width: gridWidth, alignItems: "center" }, children: caption === "dropdown" && view === "day" ? /* @__PURE__ */ jsxRuntime.jsx(
           DropdownPair,
           {
@@ -2037,7 +2059,7 @@ var Caption = /* @__PURE__ */ __name(({
             drilldown: true
           }
         ) }) }),
-        /* @__PURE__ */ jsxRuntime.jsx(NavButton, { label: t("calendar.header.next", { defaultValue: "Next" }), onPress: onNext, children: "\u203A" })
+        /* @__PURE__ */ jsxRuntime.jsx(NavButton, { label: t("calendar.header.next", { defaultValue: "Next month" }), onPress: onNext, children: "\u203A" })
       ]
     }
   );
@@ -2080,8 +2102,53 @@ var DropdownPair = /* @__PURE__ */ __name(({ month, year, monthOptions, yearOpti
   ] });
 }, "DropdownPair");
 var CELL_SIZE = 40;
-var DayCell = /* @__PURE__ */ __name(({ ctx, onPress, onHoverIn, onHoverOut, renderDay }) => {
+var formatterCache = /* @__PURE__ */ new Map();
+var RUNTIME_DEFAULT_LOCALE_KEY = "__default__";
+var getDayFormatter = /* @__PURE__ */ __name((locale) => {
+  const key = locale ?? RUNTIME_DEFAULT_LOCALE_KEY;
+  const cached = formatterCache.get(key);
+  if (cached) {
+    return cached;
+  }
+  try {
+    const fmt = new Intl.DateTimeFormat(locale, {
+      weekday: "long",
+      month: "long",
+      day: "numeric",
+      year: "numeric",
+      timeZone: "UTC"
+    });
+    formatterCache.set(key, fmt);
+    return fmt;
+  } catch {
+    return null;
+  }
+}, "getDayFormatter");
+var formatDayLabel = /* @__PURE__ */ __name((ctx, locale) => {
+  const jsDate = new Date(Date.UTC(ctx.date.year, ctx.date.month - 1, ctx.date.day));
+  const fmt = getDayFormatter(locale);
+  const base = fmt ? fmt.format(jsDate) : (
+    // Fallback if the runtime rejects the locale tag.
+    `${ctx.date.month}/${ctx.date.day}/${ctx.date.year}`
+  );
+  const suffixes = [];
+  if (ctx.isToday) {
+    suffixes.push("today");
+  }
+  if (ctx.isSelected || ctx.isRangeStart || ctx.isRangeEnd) {
+    suffixes.push("selected");
+  }
+  if (ctx.isInRange && !ctx.isRangeStart && !ctx.isRangeEnd) {
+    suffixes.push("in range");
+  }
+  if (ctx.isUnavailable) {
+    suffixes.push("unavailable");
+  }
+  return suffixes.length > 0 ? `${base}, ${suffixes.join(", ")}` : base;
+}, "formatDayLabel");
+var DayCell = /* @__PURE__ */ __name(({ ctx, onPress, onHoverIn, onHoverOut, renderDay, locale }) => {
   const colors = useThemeColors();
+  const accessibilityLabel = formatDayLabel(ctx, locale);
   const isSelectedLike = ctx.isSelected || ctx.isRangeStart || ctx.isRangeEnd;
   const isInsideRange = ctx.isInRange || ctx.isInPreviewRange;
   const isRangeMiddle = isInsideRange && !isSelectedLike;
@@ -2090,7 +2157,8 @@ var DayCell = /* @__PURE__ */ __name(({ ctx, onPress, onHoverIn, onHoverOut, ren
     reactNative.Pressable,
     {
       accessibilityRole: "button",
-      accessibilityState: { disabled: ctx.isUnavailable },
+      accessibilityLabel,
+      accessibilityState: { disabled: ctx.isUnavailable, selected: isSelectedLike },
       disabled: ctx.isUnavailable,
       onPress,
       ...onHoverIn ? { onHoverIn } : {},
@@ -2348,6 +2416,7 @@ var DayGrid = /* @__PURE__ */ __name((props) => {
               DayCell,
               {
                 ctx,
+                locale,
                 onPress: () => onDayPress(date),
                 ...onDayHover ? {
                   onHoverIn: /* @__PURE__ */ __name(() => onDayHover(date), "onHoverIn"),
@@ -2510,6 +2579,9 @@ var focusDayCell = /* @__PURE__ */ __name((root, date, force) => {
   if (!root) {
     return;
   }
+  if (typeof document === "undefined" || typeof root.contains !== "function") {
+    return;
+  }
   if (!force && !root.contains(document.activeElement)) {
     return;
   }
@@ -2614,8 +2686,13 @@ var SingleOrMultiCalendar = /* @__PURE__ */ __name((props) => {
   const colors = useThemeColors();
   const firstDayOfWeek = props.firstDayOfWeek ?? getFirstDayOfWeek(locale);
   const weekendDays = props.weekendDays ?? getWeekendDays(locale);
-  const visibleMonths = pickVisibleMonths(props.visibleMonths, containerWidth);
+  const visibleMonths = props.behavior === "scroll" ? 1 : pickVisibleMonths(props.visibleMonths, containerWidth);
   const { innerWidth, gridsRowWidth } = surfaceMetrics(visibleMonths);
+  react.useEffect(() => {
+    if (process.env.NODE_ENV !== "production" && props.behavior === "scroll" && typeof props.visibleMonths === "number" && props.visibleMonths > 1) {
+      console.warn('[Calendar] visibleMonths is ignored when behavior="scroll"; falling back to single column.');
+    }
+  }, [props.behavior, props.visibleMonths]);
   const containerRef = react.useRef(null);
   const state = useCalendarState({
     ...props.mode !== void 0 ? { mode: props.mode } : {},
@@ -2678,6 +2755,8 @@ var SingleOrMultiCalendar = /* @__PURE__ */ __name((props) => {
       setAnchor((a) => a.add({ years: -10 }));
     } else if (state.view === "month") {
       setAnchor((a) => a.add({ years: -1 }));
+    } else if (props.behavior === "scroll") {
+      state.moveFocus({ months: -1 });
     } else {
       setAnchor((a) => a.add({ months: -1 }));
     }
@@ -2687,6 +2766,8 @@ var SingleOrMultiCalendar = /* @__PURE__ */ __name((props) => {
       setAnchor((a) => a.add({ years: 10 }));
     } else if (state.view === "month") {
       setAnchor((a) => a.add({ years: 1 }));
+    } else if (props.behavior === "scroll") {
+      state.moveFocus({ months: 1 });
     } else {
       setAnchor((a) => a.add({ months: 1 }));
     }
@@ -2749,22 +2830,44 @@ var SingleOrMultiCalendar = /* @__PURE__ */ __name((props) => {
           }
         ),
         /* @__PURE__ */ jsxRuntime.jsxs(FadeIn, { children: [
-          state.view === "day" && /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: { flexDirection: "row", gap: MONTH_GAP, alignSelf: "center", width: gridsRowWidth }, children: months.map((m) => /* @__PURE__ */ jsxRuntime.jsx(
-            DayGrid,
+          state.view === "day" && (props.behavior === "scroll" ? /* @__PURE__ */ jsxRuntime.jsx(
+            ScrollBody,
             {
-              visibleMonth: m,
-              locale,
               mode: props.mode ?? "single",
-              value: state.value,
+              locale,
               focusedDate: state.focusedDate,
-              isUnavailable: state.isUnavailable,
-              weekendDays,
+              onFocusedMonthChange: (next) => setAnchor(next),
+              value: state.value,
+              onSelectDate: (date) => state.selectDate(date, "click"),
               firstDayOfWeek,
-              onDayPress: (date) => state.selectDate(date, "click"),
+              weekendDays,
+              ...props.minValue !== void 0 ? { minValue: props.minValue } : {},
+              ...props.maxValue !== void 0 ? { maxValue: props.maxValue } : {},
+              ...props.isDateUnavailable !== void 0 ? { isDateUnavailable: props.isDateUnavailable } : {},
               ...renderDay ? { renderDay } : {}
-            },
-            `${m.year}-${m.month}`
-          )) }),
+            }
+          ) : /* @__PURE__ */ jsxRuntime.jsx(
+            reactNative.View,
+            {
+              style: { flexDirection: "row", gap: MONTH_GAP, alignSelf: "center", width: gridsRowWidth },
+              children: months.map((m) => /* @__PURE__ */ jsxRuntime.jsx(
+                DayGrid,
+                {
+                  visibleMonth: m,
+                  locale,
+                  mode: props.mode ?? "single",
+                  value: state.value,
+                  focusedDate: state.focusedDate,
+                  isUnavailable: state.isUnavailable,
+                  weekendDays,
+                  firstDayOfWeek,
+                  onDayPress: (date) => state.selectDate(date, "click"),
+                  ...renderDay ? { renderDay } : {}
+                },
+                `${m.year}-${m.month}`
+              ))
+            }
+          )),
           state.view === "month" && /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: { alignItems: "center" }, children: /* @__PURE__ */ jsxRuntime.jsx(
             MonthGrid,
             {
@@ -2799,8 +2902,13 @@ var RangeCalendar = /* @__PURE__ */ __name((props) => {
   const colors = useThemeColors();
   const firstDayOfWeek = props.firstDayOfWeek ?? getFirstDayOfWeek(locale);
   const weekendDays = props.weekendDays ?? getWeekendDays(locale);
-  const visibleMonths = pickVisibleMonths(props.visibleMonths, containerWidth);
+  const visibleMonths = props.behavior === "scroll" ? 1 : pickVisibleMonths(props.visibleMonths, containerWidth);
   const { innerWidth, gridsRowWidth } = surfaceMetrics(visibleMonths);
+  react.useEffect(() => {
+    if (process.env.NODE_ENV !== "production" && props.behavior === "scroll" && typeof props.visibleMonths === "number" && props.visibleMonths > 1) {
+      console.warn('[Calendar] visibleMonths is ignored when behavior="scroll"; falling back to single column.');
+    }
+  }, [props.behavior, props.visibleMonths]);
   const containerRef = react.useRef(null);
   const range = useRangeState({
     ...props.value !== void 0 ? { value: props.value } : {},
@@ -2878,6 +2986,8 @@ var RangeCalendar = /* @__PURE__ */ __name((props) => {
       setAnchor((a) => a.add({ years: -10 }));
     } else if (view === "month") {
       setAnchor((a) => a.add({ years: -1 }));
+    } else if (props.behavior === "scroll") {
+      setFocusedDate((f) => f.add({ months: -1 }));
     } else {
       setAnchor((a) => a.add({ months: -1 }));
     }
@@ -2887,6 +2997,8 @@ var RangeCalendar = /* @__PURE__ */ __name((props) => {
       setAnchor((a) => a.add({ years: 10 }));
     } else if (view === "month") {
       setAnchor((a) => a.add({ years: 1 }));
+    } else if (props.behavior === "scroll") {
+      setFocusedDate((f) => f.add({ months: 1 }));
     } else {
       setAnchor((a) => a.add({ months: 1 }));
     }
@@ -2957,24 +3069,47 @@ var RangeCalendar = /* @__PURE__ */ __name((props) => {
           }
         ),
         /* @__PURE__ */ jsxRuntime.jsxs(FadeIn, { children: [
-          view === "day" && /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: { flexDirection: "row", gap: MONTH_GAP, alignSelf: "center", width: gridsRowWidth }, children: months.map((m) => /* @__PURE__ */ jsxRuntime.jsx(
-            DayGrid,
+          view === "day" && (props.behavior === "scroll" ? /* @__PURE__ */ jsxRuntime.jsx(
+            ScrollBody,
             {
-              visibleMonth: m,
-              locale,
               mode: "range",
+              locale,
+              focusedDate,
+              onFocusedMonthChange: (next) => setAnchor(next),
               value: range.value,
               previewRange: range.previewRange,
-              focusedDate,
-              isUnavailable: range.isUnavailable,
-              weekendDays,
+              onSelectDate: (date) => range.selectDate(date),
               firstDayOfWeek,
-              onDayPress: (date) => range.selectDate(date),
-              onDayHover: (date) => range.setHoveredDate(date),
+              weekendDays,
+              ...props.minValue !== void 0 ? { minValue: props.minValue } : {},
+              ...props.maxValue !== void 0 ? { maxValue: props.maxValue } : {},
+              ...props.isDateUnavailable !== void 0 ? { isDateUnavailable: props.isDateUnavailable } : {},
               ...renderDay ? { renderDay } : {}
-            },
-            `${m.year}-${m.month}`
-          )) }),
+            }
+          ) : /* @__PURE__ */ jsxRuntime.jsx(
+            reactNative.View,
+            {
+              style: { flexDirection: "row", gap: MONTH_GAP, alignSelf: "center", width: gridsRowWidth },
+              children: months.map((m) => /* @__PURE__ */ jsxRuntime.jsx(
+                DayGrid,
+                {
+                  visibleMonth: m,
+                  locale,
+                  mode: "range",
+                  value: range.value,
+                  previewRange: range.previewRange,
+                  focusedDate,
+                  isUnavailable: range.isUnavailable,
+                  weekendDays,
+                  firstDayOfWeek,
+                  onDayPress: (date) => range.selectDate(date),
+                  onDayHover: (date) => range.setHoveredDate(date),
+                  ...renderDay ? { renderDay } : {}
+                },
+                `${m.year}-${m.month}`
+              ))
+            }
+          )),
           view === "month" && /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: { alignItems: "center" }, children: /* @__PURE__ */ jsxRuntime.jsx(
             MonthGrid,
             {