@panneau/lists 5.0.0-alpha.20 → 5.0.0-alpha.22

package/dist/layouts/CalendarLayout.js

@@ -2,6 +2,7 @@ import { messages } from "../messages.js";
 import CalendarLayout_module_default from "./CalendarLayout.module.js";
 import { ItemTitle } from "./ItemTitle.js";
 import { getItemDays } from "./calendarDays.js";
+import highlight_module_default from "./highlight.module.js";
 import { currentMonth, isMonth, shiftMonth } from "@panneau/core";
 import { c } from "react/compiler-runtime";
 import { Button, IconButton, usePanneauIntl } from "@panneau/ui";
@@ -47,8 +48,8 @@ function getWeeks(month, firstDay) {
 * month. On narrow lists, the days that have items, one under the other.
 */
 function CalendarLayout(t0) {
-	const $ = c(45);
-	const { items, columns, renderValue, getItemLabel, getItemHref, isCurrent, label, calendar } = t0;
+	const $ = c(46);
+	const { items, columns, renderValue, getItemLabel, getItemHref, isCurrent, isHighlighted, label, calendar } = t0;
 	const intl = usePanneauIntl();
 	let t1;
 	let t2;
@@ -57,7 +58,7 @@ function CalendarLayout(t0) {
 	let t5;
 	let t6;
 	let t7;
-	if ($[0] !== calendar || $[1] !== columns || $[2] !== getItemHref || $[3] !== getItemLabel || $[4] !== intl || $[5] !== isCurrent || $[6] !== items || $[7] !== label || $[8] !== renderValue) {
+	if ($[0] !== calendar || $[1] !== columns || $[2] !== getItemHref || $[3] !== getItemLabel || $[4] !== intl || $[5] !== isCurrent || $[6] !== isHighlighted || $[7] !== items || $[8] !== label || $[9] !== renderValue) {
 		const today = currentMonth();
 		const month = calendar !== void 0 && isMonth(calendar.month) ? calendar.month : today;
 		const [t8, t9] = month.split("-").map(Number);
@@ -77,30 +78,30 @@ function CalendarLayout(t0) {
 			timeZone: "UTC"
 		});
 		let t10;
-		if ($[16] !== intl.locale) {
+		if ($[17] !== intl.locale) {
 			t10 = (format) => new Intl.DateTimeFormat(intl.locale, {
 				weekday: format,
 				timeZone: "UTC"
 			});
-			$[16] = intl.locale;
-			$[17] = t10;
-		} else t10 = $[17];
+			$[17] = intl.locale;
+			$[18] = t10;
+		} else t10 = $[18];
 		const weekday = t10;
 		let t11;
 		let t12;
 		let t13;
-		if ($[18] === Symbol.for("react.memo_cache_sentinel")) {
+		if ($[19] === Symbol.for("react.memo_cache_sentinel")) {
 			const now = /* @__PURE__ */ new Date();
 			t11 = pad(now.getFullYear(), 4);
 			t12 = pad(now.getMonth() + 1);
 			t13 = pad(now.getDate());
-			$[18] = t11;
-			$[19] = t12;
-			$[20] = t13;
+			$[19] = t11;
+			$[20] = t12;
+			$[21] = t13;
 		} else {
-			t11 = $[18];
-			t12 = $[19];
-			t13 = $[20];
+			t11 = $[19];
+			t12 = $[20];
+			t13 = $[21];
 		}
 		const todayDay = `${t11}-${t12}-${t13}`;
 		const byDay = /* @__PURE__ */ new Map();
@@ -122,23 +123,23 @@ function CalendarLayout(t0) {
 		const more = calendar?.more ?? null;
 		t5 = CalendarLayout_module_default.calendar;
 		let t14;
-		if ($[21] !== intl) {
+		if ($[22] !== intl) {
 			t14 = intl.formatMessage(messages.previousMonth);
-			$[21] = intl;
-			$[22] = t14;
-		} else t14 = $[22];
+			$[22] = intl;
+			$[23] = t14;
+		} else t14 = $[23];
 		let t15;
-		if ($[23] !== intl) {
+		if ($[24] !== intl) {
 			t15 = intl.formatMessage(messages.thisMonth);
-			$[23] = intl;
-			$[24] = t15;
-		} else t15 = $[24];
+			$[24] = intl;
+			$[25] = t15;
+		} else t15 = $[25];
 		let t16;
-		if ($[25] !== intl) {
+		if ($[26] !== intl) {
 			t16 = intl.formatMessage(messages.nextMonth);
-			$[25] = intl;
-			$[26] = t16;
-		} else t16 = $[26];
+			$[26] = intl;
+			$[27] = t16;
+		} else t16 = $[27];
 		t6 = /* @__PURE__ */ jsxs("div", {
 			className: CalendarLayout_module_default.header,
 			children: [/* @__PURE__ */ jsx("p", {
@@ -167,7 +168,7 @@ function CalendarLayout(t0) {
 				]
 			})]
 		});
-		if ($[27] !== intl || $[28] !== items || $[29] !== more) {
+		if ($[28] !== intl || $[29] !== items || $[30] !== more) {
 			t7 = more !== null ? /* @__PURE__ */ jsx("p", {
 				className: CalendarLayout_module_default.more,
 				role: "status",
@@ -176,15 +177,15 @@ function CalendarLayout(t0) {
 					total: more.total
 				}) : intl.formatMessage(messages.calendarMoreUnknown, { shown: items.length })
 			}) : null;
-			$[27] = intl;
-			$[28] = items;
-			$[29] = more;
-			$[30] = t7;
-		} else t7 = $[30];
+			$[28] = intl;
+			$[29] = items;
+			$[30] = more;
+			$[31] = t7;
+		} else t7 = $[31];
 		t2 = CalendarLayout_module_default.grid;
 		t3 = `${label}, ${monthLabel}`;
 		let t17;
-		if ($[31] !== weekday) {
+		if ($[32] !== weekday) {
 			t17 = (day_0) => {
 				const date = /* @__PURE__ */ new Date(`${day_0}T00:00:00Z`);
 				return /* @__PURE__ */ jsx("th", {
@@ -195,9 +196,9 @@ function CalendarLayout(t0) {
 					})
 				}, day_0);
 			};
-			$[31] = weekday;
-			$[32] = t17;
-		} else t17 = $[32];
+			$[32] = weekday;
+			$[33] = t17;
+		} else t17 = $[33];
 		t4 = /* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsx("tr", { children: (weeks[0] ?? []).map(t17) }) });
 		t1 = weeks.map((week) => /* @__PURE__ */ jsx("tr", { children: week.map((day_1) => {
 			const entries = [...byDay.get(day_1) ?? []].sort(_temp);
@@ -221,7 +222,9 @@ function CalendarLayout(t0) {
 					children: entries.map((t18) => {
 						const { item: item_0 } = t18;
 						return /* @__PURE__ */ jsx("li", {
+							className: isHighlighted?.(item_0) === true ? highlight_module_default.highlighted : void 0,
 							"data-current": isCurrent?.(item_0) === true || void 0,
+							"data-highlighted": isHighlighted?.(item_0) === true || void 0,
 							children: /* @__PURE__ */ jsx(ItemTitle, {
 								href: getItemHref?.(item_0) ?? null,
 								current: isCurrent?.(item_0) ?? false,
@@ -238,46 +241,47 @@ function CalendarLayout(t0) {
 		$[3] = getItemLabel;
 		$[4] = intl;
 		$[5] = isCurrent;
-		$[6] = items;
-		$[7] = label;
-		$[8] = renderValue;
-		$[9] = t1;
-		$[10] = t2;
-		$[11] = t3;
-		$[12] = t4;
-		$[13] = t5;
-		$[14] = t6;
-		$[15] = t7;
+		$[6] = isHighlighted;
+		$[7] = items;
+		$[8] = label;
+		$[9] = renderValue;
+		$[10] = t1;
+		$[11] = t2;
+		$[12] = t3;
+		$[13] = t4;
+		$[14] = t5;
+		$[15] = t6;
+		$[16] = t7;
 	} else {
-		t1 = $[9];
-		t2 = $[10];
-		t3 = $[11];
-		t4 = $[12];
-		t5 = $[13];
-		t6 = $[14];
-		t7 = $[15];
+		t1 = $[10];
+		t2 = $[11];
+		t3 = $[12];
+		t4 = $[13];
+		t5 = $[14];
+		t6 = $[15];
+		t7 = $[16];
 	}
 	let t8;
-	if ($[33] !== t1) {
+	if ($[34] !== t1) {
 		t8 = /* @__PURE__ */ jsx("tbody", { children: t1 });
-		$[33] = t1;
-		$[34] = t8;
-	} else t8 = $[34];
+		$[34] = t1;
+		$[35] = t8;
+	} else t8 = $[35];
 	let t9;
-	if ($[35] !== t2 || $[36] !== t3 || $[37] !== t4 || $[38] !== t8) {
+	if ($[36] !== t2 || $[37] !== t3 || $[38] !== t4 || $[39] !== t8) {
 		t9 = /* @__PURE__ */ jsxs("table", {
 			className: t2,
 			"aria-label": t3,
 			children: [t4, t8]
 		});
-		$[35] = t2;
-		$[36] = t3;
-		$[37] = t4;
-		$[38] = t8;
-		$[39] = t9;
-	} else t9 = $[39];
+		$[36] = t2;
+		$[37] = t3;
+		$[38] = t4;
+		$[39] = t8;
+		$[40] = t9;
+	} else t9 = $[40];
 	let t10;
-	if ($[40] !== t5 || $[41] !== t6 || $[42] !== t7 || $[43] !== t9) {
+	if ($[41] !== t5 || $[42] !== t6 || $[43] !== t7 || $[44] !== t9) {
 		t10 = /* @__PURE__ */ jsxs("div", {
 			className: t5,
 			children: [
@@ -286,12 +290,12 @@ function CalendarLayout(t0) {
 				t9
 			]
 		});
-		$[40] = t5;
-		$[41] = t6;
-		$[42] = t7;
-		$[43] = t9;
-		$[44] = t10;
-	} else t10 = $[44];
+		$[41] = t5;
+		$[42] = t6;
+		$[43] = t7;
+		$[44] = t9;
+		$[45] = t10;
+	} else t10 = $[45];
 	return t10;
 }
 function _temp(a, b) {

package/dist/layouts/CalendarLayout.js.map

@@ -1 +1 @@
-{"version":3,"file":"CalendarLayout.js","names":["ChevronLeft","ChevronRight","currentMonth","isMonth","shiftMonth","isDateRangeValue","Button","IconButton","usePanneauIntl","messages","ListItem","ListLayoutProps","styles","ItemTitle","getItemDays","pad","value","length","String","padStart","dayOf","date","Date","getUTCFullYear","getUTCMonth","getUTCDate","sortKey","start","end","getFirstDay","locale","info","Intl","Locale","getWeekInfo","firstDay","weekInfo","getWeeks","month","year","index","split","map","Number","first","UTC","last","offset","getUTCDay","days","time","getTime","push","Array","from","_","week","slice","CalendarLayout","t0","$","_c","items","columns","renderValue","getItemLabel","getItemHref","isCurrent","label","calendar","intl","t1","t2","t3","t4","t5","t6","t7","today","undefined","t8","t9","title","weeks","monthLabel","DateTimeFormat","timeZone","format","dayLabel","weekday","day","t10","t11","t12","t13","Symbol","for","now","getFullYear","getMonth","getDate","todayDay","byDay","Map","shown","at","forEach","item","field","set","get","more","t14","formatMessage","previousMonth","t15","thisMonth","t16","nextMonth","header","navigation","onMonthChange","total","calendarMore","calendarMoreUnknown","grid","t17","day_0","day_1","entries","sort","_temp","startsWith","dayNumber","t18","item_0","id","a","b","localeCompare","_c","styles"],"sources":["../../src/layouts/CalendarLayout.tsx"],"sourcesContent":["import { ChevronLeft, ChevronRight } from 'lucide-react';\n\nimport { currentMonth, isMonth, shiftMonth } from '@panneau/core';\nimport { isDateRangeValue } from '@panneau/fields/daterange';\nimport { Button, IconButton, usePanneauIntl } from '@panneau/ui';\n\nimport { messages } from '../messages';\nimport type { ListItem, ListLayoutProps } from '../types';\nimport styles from './CalendarLayout.module.css';\nimport { ItemTitle } from './ItemTitle';\nimport { getItemDays } from './calendarDays';\n\nfunction pad(value: number, length = 2): string {\n    return String(value).padStart(length, '0');\n}\n\nfunction dayOf(date: Date): string {\n    return `${pad(date.getUTCFullYear(), 4)}-${pad(date.getUTCMonth() + 1)}-${pad(date.getUTCDate())}`;\n}\n\n/** What orders the items of a day: a date-time, or the start of a range. */\nfunction sortKey(value: unknown): string {\n    if (isDateRangeValue(value)) {\n        return value.start ?? value.end ?? '';\n    }\n    return typeof value === 'string' ? value : '';\n}\n\n/** The first day of the week in a locale: 1 for Monday to 7 for Sunday. */\nfunction getFirstDay(locale: string): number {\n    try {\n        const info = new Intl.Locale(locale) as Intl.Locale & {\n            getWeekInfo?: () => { firstDay: number };\n            weekInfo?: { firstDay: number };\n        };\n        return info.getWeekInfo?.().firstDay ?? info.weekInfo?.firstDay ?? 1;\n    } catch {\n        return 1;\n    }\n}\n\n/** The weeks that show a month, as days (`2026-11-02`), from the first day of the week. */\nfunction getWeeks(month: string, firstDay: number): string[][] {\n    const [year = 1970, index = 1] = month.split('-').map(Number);\n    const first = new Date(Date.UTC(year, index - 1, 1));\n    const last = new Date(Date.UTC(year, index, 0));\n    // getUTCDay(): 0 for Sunday; firstDay: 7 for Sunday.\n    const offset = (first.getUTCDay() - (firstDay % 7) + 7) % 7;\n    const start = Date.UTC(year, index - 1, 1 - offset);\n    const days: string[] = [];\n    for (let time = start; days.length % 7 !== 0 || time <= last.getTime(); time += 86_400_000) {\n        days.push(dayOf(new Date(time)));\n    }\n    return Array.from({ length: days.length / 7 }, (_, week) => days.slice(week * 7, week * 7 + 7));\n}\n\n/**\n * Items on the days of a month (decision 0044), and a range on each day it covers (decision 0053):\n * the weeks of the month, from the first day of the week of the locale, with the title of each item\n * as its link, in the order of their dates, and buttons to the previous, the next and the current\n * month. On narrow lists, the days that have items, one under the other.\n */\nexport function CalendarLayout({\n    items,\n    columns,\n    renderValue,\n    getItemLabel,\n    getItemHref,\n    isCurrent,\n    label,\n    calendar,\n}: ListLayoutProps) {\n    const intl = usePanneauIntl();\n    const today = currentMonth();\n    const month = calendar !== undefined && isMonth(calendar.month) ? calendar.month : today;\n    const [year = 1970, index = 1] = month.split('-').map(Number);\n    const [title] = columns;\n    const weeks = getWeeks(month, getFirstDay(intl.locale));\n    const monthLabel = new Intl.DateTimeFormat(intl.locale, {\n        month: 'long',\n        year: 'numeric',\n        timeZone: 'UTC',\n    }).format(new Date(Date.UTC(year, index - 1, 1)));\n    const dayLabel = new Intl.DateTimeFormat(intl.locale, {\n        weekday: 'long',\n        day: 'numeric',\n        month: 'long',\n        timeZone: 'UTC',\n    });\n    const weekday = (format: 'short' | 'long') =>\n        new Intl.DateTimeFormat(intl.locale, { weekday: format, timeZone: 'UTC' });\n    const now = new Date();\n    const todayDay = `${pad(now.getFullYear(), 4)}-${pad(now.getMonth() + 1)}-${pad(now.getDate())}`;\n\n    const byDay = new Map<string, { item: ListItem; value: string }[]>();\n    if (calendar !== undefined) {\n        const shown = { first: weeks[0]?.[0] ?? '', last: weeks.at(-1)?.at(-1) ?? '' };\n        items.forEach((item) => {\n            const value = item[calendar.field];\n            getItemDays(value, shown, calendar.timeZone).forEach((day) => {\n                byDay.set(day, [...(byDay.get(day) ?? []), { item, value: sortKey(value) }]);\n            });\n        });\n    }\n    const more = calendar?.more ?? null;\n\n    return (\n        <div className={styles.calendar}>\n            <div className={styles.header}>\n                <p className={styles.month} aria-live=\"polite\">\n                    {monthLabel}\n                </p>\n                <div className={styles.navigation}>\n                    <IconButton\n                        icon={ChevronLeft}\n                        label={intl.formatMessage(messages.previousMonth)}\n                        onPress={() => calendar?.onMonthChange(shiftMonth(month, -1))}\n                    />\n                    <Button\n                        size=\"sm\"\n                        isDisabled={month === today}\n                        onPress={() => calendar?.onMonthChange(today)}\n                    >\n                        {intl.formatMessage(messages.thisMonth)}\n                    </Button>\n                    <IconButton\n                        icon={ChevronRight}\n                        label={intl.formatMessage(messages.nextMonth)}\n                        onPress={() => calendar?.onMonthChange(shiftMonth(month, 1))}\n                    />\n                </div>\n            </div>\n            {more !== null ? (\n                <p className={styles.more} role=\"status\">\n                    {more.total !== null\n                        ? intl.formatMessage(messages.calendarMore, {\n                              shown: items.length,\n                              total: more.total,\n                          })\n                        : intl.formatMessage(messages.calendarMoreUnknown, {\n                              shown: items.length,\n                          })}\n                </p>\n            ) : null}\n            <table className={styles.grid} aria-label={`${label}, ${monthLabel}`}>\n                <thead>\n                    <tr>\n                        {(weeks[0] ?? []).map((day) => {\n                            const date = new Date(`${day}T00:00:00Z`);\n                            return (\n                                <th key={day} scope=\"col\">\n                                    <abbr title={weekday('long').format(date)}>\n                                        {weekday('short').format(date)}\n                                    </abbr>\n                                </th>\n                            );\n                        })}\n                    </tr>\n                </thead>\n                <tbody>\n                    {weeks.map((week) => (\n                        <tr key={week[0]}>\n                            {week.map((day) => {\n                                const entries = [...(byDay.get(day) ?? [])].sort((a, b) =>\n                                    a.value.localeCompare(b.value),\n                                );\n                                return (\n                                    <td\n                                        key={day}\n                                        data-outside={!day.startsWith(month) || undefined}\n                                        data-empty={entries.length === 0 || undefined}\n                                        aria-current={day === todayDay ? 'date' : undefined}\n                                    >\n                                        <time dateTime={day} className={styles.day}>\n                                            <span aria-hidden=\"true\" className={styles.dayNumber}>\n                                                {Number(day.slice(8))}\n                                            </span>\n                                            <span className={styles.dayLabel}>\n                                                {dayLabel.format(new Date(`${day}T00:00:00Z`))}\n                                            </span>\n                                        </time>\n                                        {entries.length > 0 ? (\n                                            <ul className={styles.items}>\n                                                {entries.map(({ item }) => (\n                                                    <li\n                                                        key={item.id}\n                                                        data-current={\n                                                            isCurrent?.(item) === true || undefined\n                                                        }\n                                                    >\n                                                        <ItemTitle\n                                                            href={getItemHref?.(item) ?? null}\n                                                            current={isCurrent?.(item) ?? false}\n                                                        >\n                                                            {title !== undefined\n                                                                ? renderValue(item, title)\n                                                                : getItemLabel(item)}\n                                                        </ItemTitle>\n                                                    </li>\n                                                ))}\n                                            </ul>\n                                        ) : null}\n                                    </td>\n                                );\n                            })}\n                        </tr>\n                    ))}\n                </tbody>\n            </table>\n        </div>\n    );\n}\n"],"mappings":"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"}
+{"version":3,"file":"CalendarLayout.js","names":["ChevronLeft","ChevronRight","currentMonth","isMonth","shiftMonth","isDateRangeValue","Button","IconButton","usePanneauIntl","messages","ListItem","ListLayoutProps","styles","ItemTitle","getItemDays","highlight","pad","value","length","String","padStart","dayOf","date","Date","getUTCFullYear","getUTCMonth","getUTCDate","sortKey","start","end","getFirstDay","locale","info","Intl","Locale","getWeekInfo","firstDay","weekInfo","getWeeks","month","year","index","split","map","Number","first","UTC","last","offset","getUTCDay","days","time","getTime","push","Array","from","_","week","slice","CalendarLayout","t0","$","_c","items","columns","renderValue","getItemLabel","getItemHref","isCurrent","isHighlighted","label","calendar","intl","t1","t2","t3","t4","t5","t6","t7","today","undefined","t8","t9","title","weeks","monthLabel","DateTimeFormat","timeZone","format","dayLabel","weekday","day","t10","t11","t12","t13","Symbol","for","now","getFullYear","getMonth","getDate","todayDay","byDay","Map","shown","at","forEach","item","field","set","get","more","t14","formatMessage","previousMonth","t15","thisMonth","t16","nextMonth","header","navigation","onMonthChange","total","calendarMore","calendarMoreUnknown","grid","t17","day_0","day_1","entries","sort","_temp","startsWith","dayNumber","t18","item_0","id","highlighted","a","b","localeCompare","_c","styles","highlight"],"sources":["../../src/layouts/CalendarLayout.tsx"],"sourcesContent":["import { ChevronLeft, ChevronRight } from 'lucide-react';\n\nimport { currentMonth, isMonth, shiftMonth } from '@panneau/core';\nimport { isDateRangeValue } from '@panneau/fields/daterange';\nimport { Button, IconButton, usePanneauIntl } from '@panneau/ui';\n\nimport { messages } from '../messages';\nimport type { ListItem, ListLayoutProps } from '../types';\nimport styles from './CalendarLayout.module.css';\nimport { ItemTitle } from './ItemTitle';\nimport { getItemDays } from './calendarDays';\nimport highlight from './highlight.module.css';\n\nfunction pad(value: number, length = 2): string {\n    return String(value).padStart(length, '0');\n}\n\nfunction dayOf(date: Date): string {\n    return `${pad(date.getUTCFullYear(), 4)}-${pad(date.getUTCMonth() + 1)}-${pad(date.getUTCDate())}`;\n}\n\n/** What orders the items of a day: a date-time, or the start of a range. */\nfunction sortKey(value: unknown): string {\n    if (isDateRangeValue(value)) {\n        return value.start ?? value.end ?? '';\n    }\n    return typeof value === 'string' ? value : '';\n}\n\n/** The first day of the week in a locale: 1 for Monday to 7 for Sunday. */\nfunction getFirstDay(locale: string): number {\n    try {\n        const info = new Intl.Locale(locale) as Intl.Locale & {\n            getWeekInfo?: () => { firstDay: number };\n            weekInfo?: { firstDay: number };\n        };\n        return info.getWeekInfo?.().firstDay ?? info.weekInfo?.firstDay ?? 1;\n    } catch {\n        return 1;\n    }\n}\n\n/** The weeks that show a month, as days (`2026-11-02`), from the first day of the week. */\nfunction getWeeks(month: string, firstDay: number): string[][] {\n    const [year = 1970, index = 1] = month.split('-').map(Number);\n    const first = new Date(Date.UTC(year, index - 1, 1));\n    const last = new Date(Date.UTC(year, index, 0));\n    // getUTCDay(): 0 for Sunday; firstDay: 7 for Sunday.\n    const offset = (first.getUTCDay() - (firstDay % 7) + 7) % 7;\n    const start = Date.UTC(year, index - 1, 1 - offset);\n    const days: string[] = [];\n    for (let time = start; days.length % 7 !== 0 || time <= last.getTime(); time += 86_400_000) {\n        days.push(dayOf(new Date(time)));\n    }\n    return Array.from({ length: days.length / 7 }, (_, week) => days.slice(week * 7, week * 7 + 7));\n}\n\n/**\n * Items on the days of a month (decision 0044), and a range on each day it covers (decision 0053):\n * the weeks of the month, from the first day of the week of the locale, with the title of each item\n * as its link, in the order of their dates, and buttons to the previous, the next and the current\n * month. On narrow lists, the days that have items, one under the other.\n */\nexport function CalendarLayout({\n    items,\n    columns,\n    renderValue,\n    getItemLabel,\n    getItemHref,\n    isCurrent,\n    isHighlighted,\n    label,\n    calendar,\n}: ListLayoutProps) {\n    const intl = usePanneauIntl();\n    const today = currentMonth();\n    const month = calendar !== undefined && isMonth(calendar.month) ? calendar.month : today;\n    const [year = 1970, index = 1] = month.split('-').map(Number);\n    const [title] = columns;\n    const weeks = getWeeks(month, getFirstDay(intl.locale));\n    const monthLabel = new Intl.DateTimeFormat(intl.locale, {\n        month: 'long',\n        year: 'numeric',\n        timeZone: 'UTC',\n    }).format(new Date(Date.UTC(year, index - 1, 1)));\n    const dayLabel = new Intl.DateTimeFormat(intl.locale, {\n        weekday: 'long',\n        day: 'numeric',\n        month: 'long',\n        timeZone: 'UTC',\n    });\n    const weekday = (format: 'short' | 'long') =>\n        new Intl.DateTimeFormat(intl.locale, { weekday: format, timeZone: 'UTC' });\n    const now = new Date();\n    const todayDay = `${pad(now.getFullYear(), 4)}-${pad(now.getMonth() + 1)}-${pad(now.getDate())}`;\n\n    const byDay = new Map<string, { item: ListItem; value: string }[]>();\n    if (calendar !== undefined) {\n        const shown = { first: weeks[0]?.[0] ?? '', last: weeks.at(-1)?.at(-1) ?? '' };\n        items.forEach((item) => {\n            const value = item[calendar.field];\n            getItemDays(value, shown, calendar.timeZone).forEach((day) => {\n                byDay.set(day, [...(byDay.get(day) ?? []), { item, value: sortKey(value) }]);\n            });\n        });\n    }\n    const more = calendar?.more ?? null;\n\n    return (\n        <div className={styles.calendar}>\n            <div className={styles.header}>\n                <p className={styles.month} aria-live=\"polite\">\n                    {monthLabel}\n                </p>\n                <div className={styles.navigation}>\n                    <IconButton\n                        icon={ChevronLeft}\n                        label={intl.formatMessage(messages.previousMonth)}\n                        onPress={() => calendar?.onMonthChange(shiftMonth(month, -1))}\n                    />\n                    <Button\n                        size=\"sm\"\n                        isDisabled={month === today}\n                        onPress={() => calendar?.onMonthChange(today)}\n                    >\n                        {intl.formatMessage(messages.thisMonth)}\n                    </Button>\n                    <IconButton\n                        icon={ChevronRight}\n                        label={intl.formatMessage(messages.nextMonth)}\n                        onPress={() => calendar?.onMonthChange(shiftMonth(month, 1))}\n                    />\n                </div>\n            </div>\n            {more !== null ? (\n                <p className={styles.more} role=\"status\">\n                    {more.total !== null\n                        ? intl.formatMessage(messages.calendarMore, {\n                              shown: items.length,\n                              total: more.total,\n                          })\n                        : intl.formatMessage(messages.calendarMoreUnknown, {\n                              shown: items.length,\n                          })}\n                </p>\n            ) : null}\n            <table className={styles.grid} aria-label={`${label}, ${monthLabel}`}>\n                <thead>\n                    <tr>\n                        {(weeks[0] ?? []).map((day) => {\n                            const date = new Date(`${day}T00:00:00Z`);\n                            return (\n                                <th key={day} scope=\"col\">\n                                    <abbr title={weekday('long').format(date)}>\n                                        {weekday('short').format(date)}\n                                    </abbr>\n                                </th>\n                            );\n                        })}\n                    </tr>\n                </thead>\n                <tbody>\n                    {weeks.map((week) => (\n                        <tr key={week[0]}>\n                            {week.map((day) => {\n                                const entries = [...(byDay.get(day) ?? [])].sort((a, b) =>\n                                    a.value.localeCompare(b.value),\n                                );\n                                return (\n                                    <td\n                                        key={day}\n                                        data-outside={!day.startsWith(month) || undefined}\n                                        data-empty={entries.length === 0 || undefined}\n                                        aria-current={day === todayDay ? 'date' : undefined}\n                                    >\n                                        <time dateTime={day} className={styles.day}>\n                                            <span aria-hidden=\"true\" className={styles.dayNumber}>\n                                                {Number(day.slice(8))}\n                                            </span>\n                                            <span className={styles.dayLabel}>\n                                                {dayLabel.format(new Date(`${day}T00:00:00Z`))}\n                                            </span>\n                                        </time>\n                                        {entries.length > 0 ? (\n                                            <ul className={styles.items}>\n                                                {entries.map(({ item }) => (\n                                                    <li\n                                                        key={item.id}\n                                                        className={\n                                                            isHighlighted?.(item) === true\n                                                                ? highlight.highlighted\n                                                                : undefined\n                                                        }\n                                                        data-current={\n                                                            isCurrent?.(item) === true || undefined\n                                                        }\n                                                        data-highlighted={\n                                                            isHighlighted?.(item) === true ||\n                                                            undefined\n                                                        }\n                                                    >\n                                                        <ItemTitle\n                                                            href={getItemHref?.(item) ?? null}\n                                                            current={isCurrent?.(item) ?? false}\n                                                        >\n                                                            {title !== undefined\n                                                                ? renderValue(item, title)\n                                                                : getItemLabel(item)}\n                                                        </ItemTitle>\n                                                    </li>\n                                                ))}\n                                            </ul>\n                                        ) : null}\n                                    </td>\n                                );\n                            })}\n                        </tr>\n                    ))}\n                </tbody>\n            </table>\n        </div>\n    );\n}\n"],"mappings":"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"}

package/dist/layouts/CardsLayout.d.ts

@@ -1,4 +1,4 @@
 import type { ListLayoutProps } from '../types.js';
 /** Items as cards: the first column is the title, the others are listed under it. */
-export declare function CardsLayout({ items, columns, renderValue, getItemLabel, getItemHref, isCurrent, selectable, isSelected, onToggle, renderActions, label, pageSelection, }: ListLayoutProps): import("react").JSX.Element;
+export declare function CardsLayout({ items, columns, renderValue, getItemLabel, getItemHref, isCurrent, isHighlighted, selectable, isSelected, onToggle, renderActions, label, pageSelection, }: ListLayoutProps): import("react").JSX.Element;
 //# sourceMappingURL=CardsLayout.d.ts.map

package/dist/layouts/CardsLayout.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CardsLayout.d.ts","sourceRoot":"","sources":["../../src/layouts/CardsLayout.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,UAAU,CAAC;AAIhD,qFAAqF;AACrF,wBAAgB,WAAW,CAAC,EACxB,KAAK,EACL,OAAO,EACP,WAAW,EACX,YAAY,EACZ,WAAW,EACX,SAAS,EACT,UAAU,EACV,UAAU,EACV,QAAQ,EACR,aAAa,EACb,KAAK,EACL,aAAa,GAChB,EAAE,eAAe,+BA6DjB"}
+{"version":3,"file":"CardsLayout.d.ts","sourceRoot":"","sources":["../../src/layouts/CardsLayout.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,UAAU,CAAC;AAKhD,qFAAqF;AACrF,wBAAgB,WAAW,CAAC,EACxB,KAAK,EACL,OAAO,EACP,WAAW,EACX,YAAY,EACZ,WAAW,EACX,SAAS,EACT,aAAa,EACb,UAAU,EACV,UAAU,EACV,QAAQ,EACR,aAAa,EACb,KAAK,EACL,aAAa,GAChB,EAAE,eAAe,+BA+DjB"}

package/dist/layouts/CardsLayout.js

@@ -1,6 +1,8 @@
 import { messages } from "../messages.js";
 import { ItemTitle } from "./ItemTitle.js";
+import highlight_module_default from "./highlight.module.js";
 import { RowActionsFit, fitContent, useRowActionsFit } from "../actions/fit.js";
+import { cx } from "../cx.js";
 import CardsLayout_module_default from "./CardsLayout.module.js";
 import { c } from "react/compiler-runtime";
 import { Checkbox, usePanneauIntl } from "@panneau/ui";
@@ -9,7 +11,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 /** Items as cards: the first column is the title, the others are listed under it. */
 function CardsLayout(t0) {
 	const $ = c(18);
-	const { items, columns, renderValue, getItemLabel, getItemHref, isCurrent, selectable, isSelected, onToggle, renderActions, label, pageSelection } = t0;
+	const { items, columns, renderValue, getItemLabel, getItemHref, isCurrent, isHighlighted, selectable, isSelected, onToggle, renderActions, label, pageSelection } = t0;
 	const intl = usePanneauIntl();
 	const [title, ...others] = columns;
 	let t1;
@@ -36,10 +38,12 @@ function CardsLayout(t0) {
 		const selected = selectable && isSelected(item);
 		const actions = renderActions(item);
 		const current = isCurrent?.(item) ?? false;
+		const highlighted = isHighlighted?.(item) ?? false;
 		return /* @__PURE__ */ jsxs("li", {
-			className: CardsLayout_module_default.card,
+			className: cx(CardsLayout_module_default.card, highlighted && highlight_module_default.highlighted),
 			"data-selected": selected || void 0,
 			"data-current": current || void 0,
+			"data-highlighted": highlighted || void 0,
 			children: [
 				/* @__PURE__ */ jsxs("div", {
 					className: CardsLayout_module_default.header,

package/dist/layouts/CardsLayout.js.map

@@ -1 +1 @@
-{"version":3,"file":"CardsLayout.js","names":["Checkbox","usePanneauIntl","RowActionsFit","fitContent","useRowActionsFit","messages","ListLayoutProps","styles","ItemTitle","CardsLayout","t0","$","_c","items","columns","renderValue","getItemLabel","getItemHref","isCurrent","selectable","isSelected","onToggle","renderActions","label","pageSelection","intl","title","others","t1","fitLevel","measureList","T0","t2","t4","map","item","selected","actions","current","id","card","undefined","header","formatMessage","selectItem","length","values","column","value","t5","t3","cards","t6","t7","_c","styles"],"sources":["../../src/layouts/CardsLayout.tsx"],"sourcesContent":["import { Checkbox, usePanneauIntl } from '@panneau/ui';\n\nimport { RowActionsFit, fitContent, useRowActionsFit } from '../actions/fit';\nimport { messages } from '../messages';\nimport type { ListLayoutProps } from '../types';\nimport styles from './CardsLayout.module.css';\nimport { ItemTitle } from './ItemTitle';\n\n/** Items as cards: the first column is the title, the others are listed under it. */\nexport function CardsLayout({\n    items,\n    columns,\n    renderValue,\n    getItemLabel,\n    getItemHref,\n    isCurrent,\n    selectable,\n    isSelected,\n    onToggle,\n    renderActions,\n    label,\n    pageSelection,\n}: ListLayoutProps) {\n    const intl = usePanneauIntl();\n    const [title, ...others] = columns;\n    const [fitLevel, measureList] = useRowActionsFit(fitContent(items, columns));\n    return (\n        <RowActionsFit value={fitLevel}>\n            <div ref={measureList}>\n                {selectable ? <div className={styles.pageSelection}>{pageSelection}</div> : null}\n                <ul className={styles.cards} aria-label={label}>\n                    {items.map((item) => {\n                        const selected = selectable && isSelected(item);\n                        const actions = renderActions(item);\n                        const current = isCurrent?.(item) ?? false;\n                        return (\n                            <li\n                                key={item.id}\n                                className={styles.card}\n                                data-selected={selected || undefined}\n                                data-current={current || undefined}\n                            >\n                                <div className={styles.header}>\n                                    <div className={styles.title}>\n                                        <ItemTitle\n                                            href={getItemHref?.(item) ?? null}\n                                            current={current}\n                                        >\n                                            {title !== undefined\n                                                ? renderValue(item, title)\n                                                : getItemLabel(item)}\n                                        </ItemTitle>\n                                    </div>\n                                    {selectable ? (\n                                        <Checkbox\n                                            aria-label={intl.formatMessage(messages.selectItem, {\n                                                item: getItemLabel(item),\n                                            })}\n                                            isSelected={selected}\n                                            onChange={() => onToggle(item)}\n                                        />\n                                    ) : null}\n                                </div>\n                                {others.length > 0 ? (\n                                    <dl className={styles.values}>\n                                        {others.map((column) => (\n                                            <div key={column.id} className={styles.value}>\n                                                <dt>{column.label ?? column.id}</dt>\n                                                <dd>{renderValue(item, column)}</dd>\n                                            </div>\n                                        ))}\n                                    </dl>\n                                ) : null}\n                                {actions !== null ? (\n                                    <div className={styles.actions}>{actions}</div>\n                                ) : null}\n                            </li>\n                        );\n                    })}\n                </ul>\n            </div>\n        </RowActionsFit>\n    );\n}\n"],"mappings":"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"}
+{"version":3,"file":"CardsLayout.js","names":["Checkbox","usePanneauIntl","RowActionsFit","fitContent","useRowActionsFit","cx","messages","ListLayoutProps","styles","ItemTitle","highlight","CardsLayout","t0","$","_c","items","columns","renderValue","getItemLabel","getItemHref","isCurrent","isHighlighted","selectable","isSelected","onToggle","renderActions","label","pageSelection","intl","title","others","t1","fitLevel","measureList","T0","t2","t4","map","item","selected","actions","current","highlighted","id","card","undefined","header","formatMessage","selectItem","length","values","column","value","t5","t3","cards","t6","t7","_c","styles","highlight"],"sources":["../../src/layouts/CardsLayout.tsx"],"sourcesContent":["import { Checkbox, usePanneauIntl } from '@panneau/ui';\n\nimport { RowActionsFit, fitContent, useRowActionsFit } from '../actions/fit';\nimport { cx } from '../cx';\nimport { messages } from '../messages';\nimport type { ListLayoutProps } from '../types';\nimport styles from './CardsLayout.module.css';\nimport { ItemTitle } from './ItemTitle';\nimport highlight from './highlight.module.css';\n\n/** Items as cards: the first column is the title, the others are listed under it. */\nexport function CardsLayout({\n    items,\n    columns,\n    renderValue,\n    getItemLabel,\n    getItemHref,\n    isCurrent,\n    isHighlighted,\n    selectable,\n    isSelected,\n    onToggle,\n    renderActions,\n    label,\n    pageSelection,\n}: ListLayoutProps) {\n    const intl = usePanneauIntl();\n    const [title, ...others] = columns;\n    const [fitLevel, measureList] = useRowActionsFit(fitContent(items, columns));\n    return (\n        <RowActionsFit value={fitLevel}>\n            <div ref={measureList}>\n                {selectable ? <div className={styles.pageSelection}>{pageSelection}</div> : null}\n                <ul className={styles.cards} aria-label={label}>\n                    {items.map((item) => {\n                        const selected = selectable && isSelected(item);\n                        const actions = renderActions(item);\n                        const current = isCurrent?.(item) ?? false;\n                        const highlighted = isHighlighted?.(item) ?? false;\n                        return (\n                            <li\n                                key={item.id}\n                                className={cx(styles.card, highlighted && highlight.highlighted)}\n                                data-selected={selected || undefined}\n                                data-current={current || undefined}\n                                data-highlighted={highlighted || undefined}\n                            >\n                                <div className={styles.header}>\n                                    <div className={styles.title}>\n                                        <ItemTitle\n                                            href={getItemHref?.(item) ?? null}\n                                            current={current}\n                                        >\n                                            {title !== undefined\n                                                ? renderValue(item, title)\n                                                : getItemLabel(item)}\n                                        </ItemTitle>\n                                    </div>\n                                    {selectable ? (\n                                        <Checkbox\n                                            aria-label={intl.formatMessage(messages.selectItem, {\n                                                item: getItemLabel(item),\n                                            })}\n                                            isSelected={selected}\n                                            onChange={() => onToggle(item)}\n                                        />\n                                    ) : null}\n                                </div>\n                                {others.length > 0 ? (\n                                    <dl className={styles.values}>\n                                        {others.map((column) => (\n                                            <div key={column.id} className={styles.value}>\n                                                <dt>{column.label ?? column.id}</dt>\n                                                <dd>{renderValue(item, column)}</dd>\n                                            </div>\n                                        ))}\n                                    </dl>\n                                ) : null}\n                                {actions !== null ? (\n                                    <div className={styles.actions}>{actions}</div>\n                                ) : null}\n                            </li>\n                        );\n                    })}\n                </ul>\n            </div>\n        </RowActionsFit>\n    );\n}\n"],"mappings":"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"}

package/dist/layouts/GalleryLayout.d.ts

@@ -4,5 +4,5 @@ import type { ListLayoutProps } from '../types.js';
  * resource), its title under it, its checkbox and its actions. An item without an image shows a
  * placeholder.
  */
-export declare function GalleryLayout({ items, columns, renderValue, getItemLabel, getItemHref, getItemImage, isCurrent, selectable, isSelected, onToggle, renderActions, label, pageSelection, }: ListLayoutProps): import("react").JSX.Element;
+export declare function GalleryLayout({ items, columns, renderValue, getItemLabel, getItemHref, getItemImage, isCurrent, isHighlighted, selectable, isSelected, onToggle, renderActions, label, pageSelection, }: ListLayoutProps): import("react").JSX.Element;
 //# sourceMappingURL=GalleryLayout.d.ts.map

package/dist/layouts/GalleryLayout.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"GalleryLayout.d.ts","sourceRoot":"","sources":["../../src/layouts/GalleryLayout.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,UAAU,CAAC;AAIhD;;;;GAIG;AACH,wBAAgB,aAAa,CAAC,EAC1B,KAAK,EACL,OAAO,EACP,WAAW,EACX,YAAY,EACZ,WAAW,EACX,YAAY,EACZ,SAAS,EACT,UAAU,EACV,UAAU,EACV,QAAQ,EACR,aAAa,EACb,KAAK,EACL,aAAa,GAChB,EAAE,eAAe,+BAkEjB"}
+{"version":3,"file":"GalleryLayout.d.ts","sourceRoot":"","sources":["../../src/layouts/GalleryLayout.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,UAAU,CAAC;AAKhD;;;;GAIG;AACH,wBAAgB,aAAa,CAAC,EAC1B,KAAK,EACL,OAAO,EACP,WAAW,EACX,YAAY,EACZ,WAAW,EACX,YAAY,EACZ,SAAS,EACT,aAAa,EACb,UAAU,EACV,UAAU,EACV,QAAQ,EACR,aAAa,EACb,KAAK,EACL,aAAa,GAChB,EAAE,eAAe,+BAoEjB"}

package/dist/layouts/GalleryLayout.js

@@ -1,6 +1,8 @@
 import { messages } from "../messages.js";
 import { ItemTitle } from "./ItemTitle.js";
+import highlight_module_default from "./highlight.module.js";
 import { RowActionsFit, fitContent, useRowActionsFit } from "../actions/fit.js";
+import { cx } from "../cx.js";
 import GalleryLayout_module_default from "./GalleryLayout.module.js";
 import { c } from "react/compiler-runtime";
 import { Checkbox, Icon, usePanneauIntl } from "@panneau/ui";
@@ -13,8 +15,8 @@ import { ImageOff } from "lucide-react";
 * placeholder.
 */
 function GalleryLayout(t0) {
-	const $ = c(41);
-	const { items, columns, renderValue, getItemLabel, getItemHref, getItemImage, isCurrent, selectable, isSelected, onToggle, renderActions, label, pageSelection } = t0;
+	const $ = c(43);
+	const { items, columns, renderValue, getItemLabel, getItemHref, getItemImage, isCurrent, isHighlighted, selectable, isSelected, onToggle, renderActions, label, pageSelection } = t0;
 	const intl = usePanneauIntl();
 	const [title] = columns;
 	let t1;
@@ -36,18 +38,20 @@ function GalleryLayout(t0) {
 		$[5] = t2;
 	} else t2 = $[5];
 	let t3;
-	if ($[6] !== getItemHref || $[7] !== getItemImage || $[8] !== getItemLabel || $[9] !== intl || $[10] !== isCurrent || $[11] !== isSelected || $[12] !== items || $[13] !== onToggle || $[14] !== renderActions || $[15] !== renderValue || $[16] !== selectable || $[17] !== title) {
+	if ($[6] !== getItemHref || $[7] !== getItemImage || $[8] !== getItemLabel || $[9] !== intl || $[10] !== isCurrent || $[11] !== isHighlighted || $[12] !== isSelected || $[13] !== items || $[14] !== onToggle || $[15] !== renderActions || $[16] !== renderValue || $[17] !== selectable || $[18] !== title) {
 		let t4;
-		if ($[19] !== getItemHref || $[20] !== getItemImage || $[21] !== getItemLabel || $[22] !== intl || $[23] !== isCurrent || $[24] !== isSelected || $[25] !== onToggle || $[26] !== renderActions || $[27] !== renderValue || $[28] !== selectable || $[29] !== title) {
+		if ($[20] !== getItemHref || $[21] !== getItemImage || $[22] !== getItemLabel || $[23] !== intl || $[24] !== isCurrent || $[25] !== isHighlighted || $[26] !== isSelected || $[27] !== onToggle || $[28] !== renderActions || $[29] !== renderValue || $[30] !== selectable || $[31] !== title) {
 			t4 = (item) => {
 				const selected = selectable && isSelected(item);
 				const actions = renderActions(item);
 				const current = isCurrent?.(item) ?? false;
+				const highlighted = isHighlighted?.(item) ?? false;
 				const image = getItemImage?.(item) ?? null;
 				return /* @__PURE__ */ jsxs("li", {
-					className: GalleryLayout_module_default.tile,
+					className: cx(GalleryLayout_module_default.tile, highlighted && highlight_module_default.highlighted),
 					"data-selected": selected || void 0,
 					"data-current": current || void 0,
+					"data-highlighted": highlighted || void 0,
 					children: [/* @__PURE__ */ jsxs("div", {
 						className: GalleryLayout_module_default.media,
 						children: [image !== null ? /* @__PURE__ */ jsx("img", {
@@ -84,66 +88,68 @@ function GalleryLayout(t0) {
 					})]
 				}, item.id);
 			};
-			$[19] = getItemHref;
-			$[20] = getItemImage;
-			$[21] = getItemLabel;
-			$[22] = intl;
-			$[23] = isCurrent;
-			$[24] = isSelected;
-			$[25] = onToggle;
-			$[26] = renderActions;
-			$[27] = renderValue;
-			$[28] = selectable;
-			$[29] = title;
-			$[30] = t4;
-		} else t4 = $[30];
+			$[20] = getItemHref;
+			$[21] = getItemImage;
+			$[22] = getItemLabel;
+			$[23] = intl;
+			$[24] = isCurrent;
+			$[25] = isHighlighted;
+			$[26] = isSelected;
+			$[27] = onToggle;
+			$[28] = renderActions;
+			$[29] = renderValue;
+			$[30] = selectable;
+			$[31] = title;
+			$[32] = t4;
+		} else t4 = $[32];
 		t3 = items.map(t4);
 		$[6] = getItemHref;
 		$[7] = getItemImage;
 		$[8] = getItemLabel;
 		$[9] = intl;
 		$[10] = isCurrent;
-		$[11] = isSelected;
-		$[12] = items;
-		$[13] = onToggle;
-		$[14] = renderActions;
-		$[15] = renderValue;
-		$[16] = selectable;
-		$[17] = title;
-		$[18] = t3;
-	} else t3 = $[18];
+		$[11] = isHighlighted;
+		$[12] = isSelected;
+		$[13] = items;
+		$[14] = onToggle;
+		$[15] = renderActions;
+		$[16] = renderValue;
+		$[17] = selectable;
+		$[18] = title;
+		$[19] = t3;
+	} else t3 = $[19];
 	let t4;
-	if ($[31] !== label || $[32] !== t3) {
+	if ($[33] !== label || $[34] !== t3) {
 		t4 = /* @__PURE__ */ jsx("ul", {
 			className: GalleryLayout_module_default.gallery,
 			"aria-label": label,
 			children: t3
 		});
-		$[31] = label;
-		$[32] = t3;
-		$[33] = t4;
-	} else t4 = $[33];
+		$[33] = label;
+		$[34] = t3;
+		$[35] = t4;
+	} else t4 = $[35];
 	let t5;
-	if ($[34] !== measureList || $[35] !== t2 || $[36] !== t4) {
+	if ($[36] !== measureList || $[37] !== t2 || $[38] !== t4) {
 		t5 = /* @__PURE__ */ jsxs("div", {
 			ref: measureList,
 			children: [t2, t4]
 		});
-		$[34] = measureList;
-		$[35] = t2;
-		$[36] = t4;
-		$[37] = t5;
-	} else t5 = $[37];
+		$[36] = measureList;
+		$[37] = t2;
+		$[38] = t4;
+		$[39] = t5;
+	} else t5 = $[39];
 	let t6;
-	if ($[38] !== fitLevel || $[39] !== t5) {
+	if ($[40] !== fitLevel || $[41] !== t5) {
 		t6 = /* @__PURE__ */ jsx(RowActionsFit, {
 			value: fitLevel,
 			children: t5
 		});
-		$[38] = fitLevel;
-		$[39] = t5;
-		$[40] = t6;
-	} else t6 = $[40];
+		$[40] = fitLevel;
+		$[41] = t5;
+		$[42] = t6;
+	} else t6 = $[42];
 	return t6;
 }
 //#endregion