@rowsncolumns/spreadsheet 10.2.70 → 10.2.71

package/dist/cjs/components/toolbar/text-format-selector.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"text-format-selector.d.ts","sourceRoot":"","sources":["../../../../components/toolbar/text-format-selector.tsx"],"names":[],"mappings":"AAqBA,OAAO,KAAe,MAAM,OAAO,CAAC;AAIpC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAE9C,MAAM,MAAM,uBAAuB,GAAG;IACpC;;OAEG;IACH,UAAU,CAAC,EAAE,UAAU,GAAG,IAAI,CAAC;IAC/B;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,kBAAkB,EAAE,CAAC,CAAC,SAAS,MAAM,UAAU,EAC7C,IAAI,EAAE,CAAC,EACP,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC,KACjB,IAAI,CAAC;IACV,oBAAoB,CAAC,IAAI,IAAI,CAAC;CAC/B,CAAC;AAEF,eAAO,MAAM,kBAAkB,0GAO1B,uBAAuB,uBAoY3B,CAAC"}
+{"version":3,"file":"text-format-selector.d.ts","sourceRoot":"","sources":["../../../../components/toolbar/text-format-selector.tsx"],"names":[],"mappings":"AAyBA,OAAO,KAAe,MAAM,OAAO,CAAC;AAIpC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAE9C,MAAM,MAAM,uBAAuB,GAAG;IACpC;;OAEG;IACH,UAAU,CAAC,EAAE,UAAU,GAAG,IAAI,CAAC;IAC/B;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,kBAAkB,EAAE,CAAC,CAAC,SAAS,MAAM,UAAU,EAC7C,IAAI,EAAE,CAAC,EACP,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC,KACjB,IAAI,CAAC;IACV,oBAAoB,CAAC,IAAI,IAAI,CAAC;CAC/B,CAAC;AAEF,eAAO,MAAM,kBAAkB,0GAO1B,uBAAuB,uBAqY3B,CAAC"}

package/dist/cjs/components/toolbar/text-format-selector.js

@@ -14,12 +14,8 @@ exports.TextFormatSelector = (0, react_1.memo)(function (_a) {
     var localeDateFormat = (0, utils_1.getDefaultDateFormat)(locale);
     var longDateFormat = (0, utils_1.getLongDateFormat)(locale);
     var focusSheet = (0, atoms_1.useFocusSheet)();
-    var date = new Date(Date.UTC(2023, 8, 26, 0, 0, 0));
-    var dateformat = new Intl.DateTimeFormat(locale).format(date);
+    var sampleDate = new Date(2023, 8, 26, 15, 59, 0);
     var currencySymbol = (0, helpers_1.getCurrencySymbol)(locale, currency);
-    var longDate = new Intl.DateTimeFormat(locale, {
-        dateStyle: "full",
-    }).format(date);
     var percentPattern = "0%";
     var scientficPattern = "0.00E+00";
     var isScientific = ((_b = cellFormat === null || cellFormat === void 0 ? void 0 : cellFormat.numberFormat) === null || _b === void 0 ? void 0 : _b.pattern) === scientficPattern;
@@ -35,6 +31,11 @@ exports.TextFormatSelector = (0, react_1.memo)(function (_a) {
     var isTimePattern = ((_g = cellFormat === null || cellFormat === void 0 ? void 0 : cellFormat.numberFormat) === null || _g === void 0 ? void 0 : _g.pattern) === timePattern;
     var dateTimePattern = "[$-".concat(locale, "]").concat(localeDateFormat, " hh:mm:ss");
     var isDateTimePattern = ((_h = cellFormat === null || cellFormat === void 0 ? void 0 : cellFormat.numberFormat) === null || _h === void 0 ? void 0 : _h.pattern) === dateTimePattern;
+    // Previews render through the exact pattern each item applies, so the
+    // menu can never disagree with the formatted cell.
+    var dateformat = (0, utils_1.ssfFormat)(localeDateFormat, sampleDate, locale);
+    var longDate = (0, utils_1.ssfFormat)(longDateFormat, sampleDate, locale);
+    var dateTime = (0, utils_1.ssfFormat)(dateTimePattern, sampleDate, locale);
     var durationPattern = "[$-".concat(locale, "][h]:mm:ss");
     var isDurationPattern = ((_j = cellFormat === null || cellFormat === void 0 ? void 0 : cellFormat.numberFormat) === null || _j === void 0 ? void 0 : _j.pattern) === durationPattern;
     var currencyRoundedPattern = "\"".concat(currencySymbol, "\"#,##0");
@@ -241,9 +242,7 @@ exports.TextFormatSelector = (0, react_1.memo)(function (_a) {
                     react_1.default.createElement(ui_1.DropdownMenuItemIndicator, null,
                         react_1.default.createElement(icons_1.CheckIcon, null)),
                     "Date time",
-                    react_1.default.createElement(ui_1.DropdownRightSlot, null,
-                        dateformat,
-                        " 15:59:00")),
+                    react_1.default.createElement(ui_1.DropdownRightSlot, null, dateTime)),
                 react_1.default.createElement(ui_1.DropdownMenuCheckboxItem, { checked: isDurationPattern, onCheckedChange: function () {
                         onChangeFormatting("numberFormat", {
                             type: "TIME",

package/dist/cjs/release-date.js

@@ -4,4 +4,4 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.releaseDate = void 0;
 exports.releaseDate = 
 // @ts-ignore
-(_a = new Date("2026-09-03")) !== null && _a !== void 0 ? _a : new Date("2025-06-18");
+(_a = new Date("2026-09-04")) !== null && _a !== void 0 ? _a : new Date("2025-06-18");

package/dist/esm/components/toolbar/text-format-selector.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"text-format-selector.d.ts","sourceRoot":"","sources":["../../../../components/toolbar/text-format-selector.tsx"],"names":[],"mappings":"AAqBA,OAAO,KAAe,MAAM,OAAO,CAAC;AAIpC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAE9C,MAAM,MAAM,uBAAuB,GAAG;IACpC;;OAEG;IACH,UAAU,CAAC,EAAE,UAAU,GAAG,IAAI,CAAC;IAC/B;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,kBAAkB,EAAE,CAAC,CAAC,SAAS,MAAM,UAAU,EAC7C,IAAI,EAAE,CAAC,EACP,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC,KACjB,IAAI,CAAC;IACV,oBAAoB,CAAC,IAAI,IAAI,CAAC;CAC/B,CAAC;AAEF,eAAO,MAAM,kBAAkB,0GAO1B,uBAAuB,uBAoY3B,CAAC"}
+{"version":3,"file":"text-format-selector.d.ts","sourceRoot":"","sources":["../../../../components/toolbar/text-format-selector.tsx"],"names":[],"mappings":"AAyBA,OAAO,KAAe,MAAM,OAAO,CAAC;AAIpC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAE9C,MAAM,MAAM,uBAAuB,GAAG;IACpC;;OAEG;IACH,UAAU,CAAC,EAAE,UAAU,GAAG,IAAI,CAAC;IAC/B;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,kBAAkB,EAAE,CAAC,CAAC,SAAS,MAAM,UAAU,EAC7C,IAAI,EAAE,CAAC,EACP,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC,KACjB,IAAI,CAAC;IACV,oBAAoB,CAAC,IAAI,IAAI,CAAC;CAC/B,CAAC;AAEF,eAAO,MAAM,kBAAkB,0GAO1B,uBAAuB,uBAqY3B,CAAC"}

package/dist/esm/components/toolbar/text-format-selector.js

@@ -1,6 +1,6 @@
 import { CheckIcon, ChevronRightIcon, MdOutlineArrowDropDown, } from "@rowsncolumns/icons";
 import { DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuItem, DropdownMenuItemIndicator, DropdownMenuPortal, DropdownMenuSeparator, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, DropdownRightSlot, IconButton, } from "@rowsncolumns/ui";
-import { getDefaultDateFormat, getLongDateFormat } from "@rowsncolumns/utils";
+import { getDefaultDateFormat, getLongDateFormat, ssfFormat, } from "@rowsncolumns/utils";
 import React, { memo } from "react";
 import { useFocusSheet } from "../../atoms";
 import { getCurrencySymbol } from "../../helpers";
@@ -8,12 +8,8 @@ export const TextFormatSelector = memo(({ locale = "en-US", currency = "USD", ce
     const localeDateFormat = getDefaultDateFormat(locale);
     const longDateFormat = getLongDateFormat(locale);
     const focusSheet = useFocusSheet();
-    const date = new Date(Date.UTC(2023, 8, 26, 0, 0, 0));
-    const dateformat = new Intl.DateTimeFormat(locale).format(date);
+    const sampleDate = new Date(2023, 8, 26, 15, 59, 0);
     const currencySymbol = getCurrencySymbol(locale, currency);
-    const longDate = new Intl.DateTimeFormat(locale, {
-        dateStyle: "full",
-    }).format(date);
     const percentPattern = "0%";
     const scientficPattern = "0.00E+00";
     const isScientific = cellFormat?.numberFormat?.pattern === scientficPattern;
@@ -29,6 +25,11 @@ export const TextFormatSelector = memo(({ locale = "en-US", currency = "USD", ce
     const isTimePattern = cellFormat?.numberFormat?.pattern === timePattern;
     const dateTimePattern = `[$-${locale}]${localeDateFormat} hh:mm:ss`;
     const isDateTimePattern = cellFormat?.numberFormat?.pattern === dateTimePattern;
+    // Previews render through the exact pattern each item applies, so the
+    // menu can never disagree with the formatted cell.
+    const dateformat = ssfFormat(localeDateFormat, sampleDate, locale);
+    const longDate = ssfFormat(longDateFormat, sampleDate, locale);
+    const dateTime = ssfFormat(dateTimePattern, sampleDate, locale);
     const durationPattern = `[$-${locale}][h]:mm:ss`;
     const isDurationPattern = cellFormat?.numberFormat?.pattern === durationPattern;
     const currencyRoundedPattern = `"${currencySymbol}"#,##0`;
@@ -235,9 +236,7 @@ export const TextFormatSelector = memo(({ locale = "en-US", currency = "USD", ce
                     React.createElement(DropdownMenuItemIndicator, null,
                         React.createElement(CheckIcon, null)),
                     "Date time",
-                    React.createElement(DropdownRightSlot, null,
-                        dateformat,
-                        " 15:59:00")),
+                    React.createElement(DropdownRightSlot, null, dateTime)),
                 React.createElement(DropdownMenuCheckboxItem, { checked: isDurationPattern, onCheckedChange: () => {
                         onChangeFormatting("numberFormat", {
                             type: "TIME",

package/dist/esm/release-date.js

@@ -1,3 +1,3 @@
 export const releaseDate = 
 // @ts-ignore
-new Date("2026-09-03") ?? new Date("2025-06-18");
+new Date("2026-09-04") ?? new Date("2025-06-18");

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rowsncolumns/spreadsheet",
-  "version": "10.2.70",
+  "version": "10.2.71",
   "author": "Vinay M",
   "license": "SEE LICENSE IN LICENSE.md",
   "main": "./dist/cjs/index.js",
@@ -44,7 +44,7 @@
     "@rowsncolumns/functions": ">=14.0.29",
     "@rowsncolumns/grid": ">=13.2.32",
     "@rowsncolumns/icons": ">=7.2.30",
-    "@rowsncolumns/ui": ">=15.0.38",
+    "@rowsncolumns/ui": ">=15.0.40",
     "@rowsncolumns/utils": ">=9.2.35",
     "@rowsncolumns/version-comparison": ">=8.0.33",
     "@tanstack/react-virtual": "3.13.9",