@astryx-vue/core 0.1.3 → 0.2.1

package/styles/text.css

@@ -3,7 +3,7 @@
 @layer astryx.components {
   .astryx-text {
     margin: 0;
-    color: var(--astryx-text-foreground, var(--astryx-color-text-primary, #171717));
+    color: var(--astryx-text-foreground, var(--astryx-color-text-primary, light-dark(#171717, #fafafa)));
     font-family: var(--astryx-font-family-body, Figtree, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif);
     font-size: var(--astryx-text-body-size, 0.875rem);
     line-height: var(--astryx-text-body-leading, 1.4286);
@@ -13,18 +13,6 @@
     display: block;
   }
 
-  .astryx-text--color-secondary {
-    color: var(--astryx-color-text-secondary, #525252);
-  }
-
-  .astryx-text--color-accent {
-    color: var(--astryx-color-text-accent, #0074e2);
-  }
-
-  .astryx-text--color-inherit {
-    color: inherit;
-  }
-
   .astryx-text--weight-regular {
     font-weight: var(--astryx-font-weight-regular, 400);
   }
@@ -58,7 +46,7 @@
   }
 
   .astryx-text--type-supporting {
-    color: var(--astryx-text-supporting-foreground, var(--astryx-color-text-secondary, #525252));
+    color: var(--astryx-text-supporting-foreground, var(--astryx-color-text-secondary, light-dark(#525252, #a3a3a3)));
     font-size: var(--astryx-text-supporting-size, 0.75rem);
     line-height: var(--astryx-text-supporting-leading, 1.6667);
   }
@@ -87,6 +75,67 @@
     line-height: 1.2;
   }
 
+  .astryx-text--color-primary {
+    color: var(--astryx-color-text-primary, light-dark(#171717, #fafafa));
+  }
+
+  .astryx-text--color-secondary {
+    color: var(--astryx-color-text-secondary, light-dark(#525252, #a3a3a3));
+  }
+
+  .astryx-text--color-accent {
+    color: var(--astryx-color-text-accent, #0074e2);
+  }
+
+  .astryx-text--color-disabled {
+    color: var(--astryx-color-text-disabled, light-dark(#a3a3a3, #525252));
+  }
+
+  .astryx-text--color-placeholder {
+    color: var(--astryx-color-text-placeholder, #737373);
+  }
+
+  .astryx-text--color-inherit {
+    color: inherit;
+  }
+
+  .astryx-text--wrap-wrap {
+    text-wrap: wrap;
+  }
+
+  .astryx-text--wrap-nowrap {
+    text-wrap: nowrap;
+  }
+
+  .astryx-text--wrap-balance {
+    text-wrap: balance;
+  }
+
+  .astryx-text--wrap-pretty {
+    text-wrap: pretty;
+  }
+
+  .astryx-text--word-normal {
+    word-break: normal;
+  }
+
+  .astryx-text--word-break-word {
+    overflow-wrap: anywhere;
+    word-break: break-word;
+  }
+
+  .astryx-text--word-break-all {
+    word-break: break-all;
+  }
+
+  .astryx-text--strike {
+    text-decoration: line-through;
+  }
+
+  .astryx-text--tabular {
+    font-variant-numeric: tabular-nums;
+  }
+
   .astryx-text--size-sm {
     font-size: var(--astryx-text-sm-size, 0.75rem);
   }

package/styles/theme.css

@@ -0,0 +1,29 @@
+@layer astryx.reset, astryx.tokens, astryx.base, astryx.components, astryx.overrides;
+
+@layer astryx.components {
+  /*
+   * `display: contents` keeps the theme out of layout. Color and font still
+   * inherit through it, so unmarked text uses the primary text token.
+   */
+  .astryx-theme {
+    display: contents;
+    color: var(--astryx-color-text-primary, light-dark(#171717, #fafafa));
+    font-family: var(--astryx-font-family-body, Figtree, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif);
+    /*
+     * These aliases are also declared on :root, where var() is substituted
+     * once. Restating them here makes the subtree resolve them again, including
+     * semantic tokens this theme did not override but a parent theme did.
+     */
+    --astryx-text-foreground: var(--astryx-color-text-primary);
+    --astryx-text-supporting-foreground: var(--astryx-color-text-secondary);
+    --astryx-heading-foreground: var(--astryx-color-text-primary);
+    --astryx-button-primary-background: var(--astryx-color-accent);
+    --astryx-button-primary-foreground: var(--astryx-color-on-accent);
+    --astryx-button-secondary-background: var(--astryx-color-neutral);
+    --astryx-button-secondary-foreground: var(--astryx-color-text-primary);
+    --astryx-button-ghost-foreground: var(--astryx-color-text-primary);
+    --astryx-button-focus: var(--astryx-color-accent);
+    --astryx-focus-outline-color: var(--astryx-color-accent);
+    --astryx-icon-primary-foreground: var(--astryx-color-icon-primary);
+  }
+}

package/styles/timer.css

@@ -0,0 +1,34 @@
+@layer astryx.reset, astryx.tokens, astryx.base, astryx.components, astryx.overrides;
+
+@layer astryx.components {
+  .astryx-timer {
+    display: inline;
+  }
+
+  .astryx-timer__time {
+    display: inline;
+    color: inherit;
+    font-family: inherit;
+    font-size: inherit;
+    font-style: normal;
+    font-variant-numeric: tabular-nums;
+    font-weight: inherit;
+    line-height: inherit;
+  }
+
+  .astryx-timer[data-color='primary'] {
+    color: var(--astryx-color-text-primary, light-dark(#171717, #fafafa));
+  }
+
+  .astryx-timer[data-color='secondary'] {
+    color: var(--astryx-color-text-secondary, light-dark(#525252, #a3a3a3));
+  }
+
+  .astryx-timer[data-color='accent'] {
+    color: var(--astryx-color-text-accent, #0074e2);
+  }
+
+  .astryx-timer[data-color='disabled'] {
+    color: var(--astryx-color-text-disabled, light-dark(#a3a3a3, #525252));
+  }
+}

package/styles/toast.css

@@ -155,6 +155,13 @@
     overflow-wrap: anywhere;
   }
 
+  .astryx-toast__end {
+    display: flex;
+    flex-shrink: 0;
+    align-items: center;
+    gap: var(--astryx-spacing-2, 8px);
+  }
+
   .astryx-toast__close {
     display: inline-flex;
     align-items: center;

package/styles/toolbar.css

@@ -47,6 +47,17 @@
     min-width: 0;
   }
 
+  /*
+   * The start slot is a row. A title stack inside it is another row whose
+   * column of text would otherwise shrink to its longest word (min-content)
+   * and stack one word per line. Give those stacks the slot's width instead.
+   */
+  .astryx-toolbar__slot--start > *,
+  .astryx-toolbar__slot--start .astryx-stack {
+    max-width: 100%;
+    min-width: 0;
+  }
+
   .astryx-toolbar__slot--center { justify-content: center; overflow: hidden; }
   .astryx-toolbar__slot--end { justify-content: flex-end; margin-inline-start: auto; }
   .astryx-toolbar--centered .astryx-toolbar__slot--end { margin-inline-start: 0; }

package/styles.css

@@ -13,6 +13,7 @@
 @import './styles/button.css';
 @import './styles/button-group.css';
 @import './styles/card.css';
+@import './styles/carousel.css';
 @import './styles/center.css';
 @import './styles/chat.css';
 @import './styles/checkbox-indicator.css';
@@ -41,9 +42,11 @@
 @import './styles/icon.css';
 @import './styles/kbd.css';
 @import './styles/layout.css';
+@import './styles/lightbox.css';
 @import './styles/link.css';
 @import './styles/list.css';
 @import './styles/markdown.css';
+@import './styles/media-theme.css';
 @import './styles/metadata-list.css';
 @import './styles/mobile-nav.css';
 @import './styles/more-menu.css';
@@ -51,6 +54,7 @@
 @import './styles/multi-selector.css';
 @import './styles/nav-item.css';
 @import './styles/nav-menu.css';
+@import './styles/outline.css';
 @import './styles/overflow-list.css';
 @import './styles/overlay.css';
 @import './styles/popover.css';
@@ -74,8 +78,10 @@
 @import './styles/text.css';
 @import './styles/text-area.css';
 @import './styles/text-input.css';
+@import './styles/theme.css';
 @import './styles/thumbnail.css';
 @import './styles/time-input.css';
+@import './styles/timer.css';
 @import './styles/timestamp.css';
 @import './styles/toast.css';
 @import './styles/toggle-button.css';

package/dist/Avatar-5s3HSrtN.js

@@ -1,136 +0,0 @@
-import { n as AvatarGroupContext, t as resolveSize } from "./utils-C9r3UD_y.js";
-import { computed, createCommentVNode, createElementBlock, createElementVNode, defineComponent, inject, mergeProps, normalizeStyle, openBlock, ref, renderSlot, toDisplayString, unref } from "vue";
-import "../styles/avatar.css";
-//#region src/Avatar/Avatar.vue
-const _hoisted_1$1 = { class: "astryx-avatar__content" };
-const _hoisted_2 = ["src"];
-const _hoisted_3 = ["src"];
-const _hoisted_4 = {
-	key: 0,
-	class: "astryx-avatar__status"
-};
-const INITIALS_FONT_SIZE_RATIO = 16 / 36;
-const DEFAULT_ICON_RATIO = .6;
-const _sfc_main$1 = /*@__PURE__*/ defineComponent({
-	__name: "Avatar",
-	props: {
-		alt: {},
-		fallbackSrc: {},
-		name: {},
-		size: { default: "md" },
-		shape: { default: "circle" },
-		src: {}
-	},
-	emits: ["error"],
-	setup(__props, { emit: __emit }) {
-		const props = __props;
-		const emit = __emit;
-		const erroredSrc = ref(void 0);
-		const erroredFallbackSrc = ref(void 0);
-		const avatarGroup = inject(AvatarGroupContext, void 0);
-		const resolvedSize = computed(() => avatarGroup?.size.value ?? props.size);
-		const resolvedShape = computed(() => avatarGroup?.shape.value ?? props.shape);
-		const numericSize = computed(() => resolveSize(resolvedSize.value));
-		const groupStyle = computed(() => {
-			if (!avatarGroup) return {};
-			return {
-				marginInlineStart: `${-avatarGroup.overlap.value}px`,
-				borderWidth: "2px"
-			};
-		});
-		const rootStyle = computed(() => ({
-			width: `${numericSize.value}px`,
-			height: `${numericSize.value}px`
-		}));
-		const showImage = computed(() => props.src && erroredSrc.value !== props.src);
-		const showFallbackImage = computed(() => !showImage.value && props.fallbackSrc && erroredFallbackSrc.value !== props.fallbackSrc);
-		const meaningfulName = computed(() => {
-			return typeof props.name === "string" && props.name.trim() !== "" ? props.name.trim() : void 0;
-		});
-		const meaningfulAlt = computed(() => {
-			return typeof props.alt === "string" && props.alt.trim() !== "" ? props.alt.trim() : void 0;
-		});
-		const initials = computed(() => {
-			if (!meaningfulName.value) return "";
-			const words = meaningfulName.value.split(/\s+/);
-			const first = words.at(0);
-			const last = words.length > 1 ? words.at(-1) : void 0;
-			const initial = (word) => {
-				if (!word) return "";
-				const match = word.match(/[\p{L}\p{N}]/u);
-				return match ? match[0].toUpperCase() : "";
-			};
-			return `${initial(first)}${initial(last)}`;
-		});
-		const showInitials = computed(() => !showImage.value && !showFallbackImage.value && initials.value !== "");
-		const showIcon = computed(() => !showImage.value && !showFallbackImage.value && initials.value === "");
-		const accessibleName = computed(() => {
-			return meaningfulAlt.value || meaningfulName.value;
-		});
-		const a11yProps = computed(() => {
-			if (accessibleName.value) return {
-				"role": "img",
-				"aria-label": accessibleName.value
-			};
-			return {
-				"role": "presentation",
-				"aria-hidden": "true"
-			};
-		});
-		function handleImageError(event) {
-			if (props.src) erroredSrc.value = props.src;
-			emit("error", event);
-		}
-		function handleFallbackError() {
-			if (props.fallbackSrc) erroredFallbackSrc.value = props.fallbackSrc;
-		}
-		return (_ctx, _cache) => {
-			return openBlock(), createElementBlock("span", mergeProps({
-				class: ["astryx-avatar", [`astryx-avatar--${resolvedShape.value}`, { "astryx-avatar--group-item": unref(avatarGroup) }]],
-				style: [rootStyle.value, groupStyle.value]
-			}, a11yProps.value), [createElementVNode("span", _hoisted_1$1, [showImage.value ? (openBlock(), createElementBlock("img", {
-				key: 0,
-				class: "astryx-avatar__image",
-				src: __props.src,
-				alt: "",
-				onError: handleImageError
-			}, null, 40, _hoisted_2)) : showFallbackImage.value ? (openBlock(), createElementBlock("img", {
-				key: 1,
-				class: "astryx-avatar__image",
-				src: __props.fallbackSrc,
-				alt: "",
-				onError: handleFallbackError
-			}, null, 40, _hoisted_3)) : showInitials.value ? (openBlock(), createElementBlock("span", {
-				key: 2,
-				class: "astryx-avatar__fallback astryx-avatar__fallback--initials",
-				style: normalizeStyle({ fontSize: `${numericSize.value * INITIALS_FONT_SIZE_RATIO}px` })
-			}, toDisplayString(initials.value), 5)) : showIcon.value ? (openBlock(), createElementBlock("span", {
-				key: 3,
-				class: "astryx-avatar__fallback astryx-avatar__fallback--icon",
-				style: normalizeStyle({ fontSize: `${numericSize.value * DEFAULT_ICON_RATIO}px` })
-			}, [renderSlot(_ctx.$slots, "default", {}, () => [_cache[0] || (_cache[0] = createElementVNode("svg", {
-				viewBox: "0 0 24 24",
-				fill: "currentColor",
-				"aria-hidden": "true"
-			}, [createElementVNode("path", { d: "M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z" })], -1))])], 4)) : createCommentVNode("v-if", true)]), _ctx.$slots.status ? (openBlock(), createElementBlock("span", _hoisted_4, [renderSlot(_ctx.$slots, "status")])) : createCommentVNode("v-if", true)], 16);
-		};
-	}
-});
-//#endregion
-//#region src/Avatar/AvatarStatusDot.vue
-const _hoisted_1 = ["data-variant"];
-const _sfc_main = /*@__PURE__*/ defineComponent({
-	__name: "AvatarStatusDot",
-	props: { variant: { default: "neutral" } },
-	setup(__props) {
-		return (_ctx, _cache) => {
-			return openBlock(), createElementBlock("span", {
-				class: "astryx-avatar-status-dot",
-				"data-variant": __props.variant,
-				"aria-hidden": "true"
-			}, null, 8, _hoisted_1);
-		};
-	}
-});
-//#endregion
-export { _sfc_main$1 as n, _sfc_main as t };

package/dist/Badge-Ba0EwsTj.js

@@ -1,19 +0,0 @@
-import { createElementBlock, defineComponent, openBlock, renderSlot } from "vue";
-import "../styles/badge.css";
-//#region src/Badge/Badge.vue
-const _hoisted_1 = ["data-variant"];
-const _sfc_main = /*@__PURE__*/ defineComponent({
-	name: "Badge",
-	__name: "Badge",
-	props: { variant: { default: "neutral" } },
-	setup(__props) {
-		return (_ctx, _cache) => {
-			return openBlock(), createElementBlock("span", {
-				class: "astryx-badge",
-				"data-variant": __props.variant
-			}, [renderSlot(_ctx.$slots, "icon"), renderSlot(_ctx.$slots, "default")], 8, _hoisted_1);
-		};
-	}
-});
-//#endregion
-export { _sfc_main as t };

package/dist/Calendar-CYhGDT6f.js

@@ -1,277 +0,0 @@
-import { t as useGridRovingFocus } from "./useGridRovingFocus-DQQAOYH5.js";
-import { a as useAstryxMessages, i as useAstryxLocale } from "./context-D6ECRdc5.js";
-import { n as weekdayNames, t as formatCalendarMonth } from "./locale-Cpk_nrLA.js";
-import { Fragment, computed, createElementBlock, createElementVNode, defineComponent, normalizeClass, openBlock, ref, renderList, renderSlot, toDisplayString, unref, useId, withKeys } from "vue";
-import { CalendarDate, getLocalTimeZone, today } from "@internationalized/date";
-import "../styles/calendar.css";
-//#region src/composables/useCalendar.ts
-function calendarDateToJSDate(date) {
-	return new Date(date.year, date.month - 1, date.day);
-}
-function jsDateToCalendarDate(date) {
-	return new CalendarDate(date.getFullYear(), date.getMonth() + 1, date.getDate());
-}
-/**
-* 日历逻辑：日期计算、月份导航、日期选择。
-*/
-function useCalendar(options) {
-	const { value, min, max, isDateDisabled, onChange } = options;
-	const timeZone = getLocalTimeZone();
-	const focusedDate = ref(value.value ? jsDateToCalendarDate(value.value) : today(timeZone));
-	const dates = computed(() => {
-		const year = focusedDate.value.year;
-		const month = focusedDate.value.month;
-		const firstDay = new CalendarDate(year, month, 1);
-		const firstDayOfWeek = firstDay.toDate(timeZone).getDay();
-		const startDate = firstDay.subtract({ days: firstDayOfWeek });
-		const weeks = [];
-		let currentDate = startDate;
-		for (let week = 0; week < 6; week++) {
-			const weekDates = [];
-			for (let day = 0; day < 7; day++) {
-				weekDates.push(currentDate);
-				currentDate = currentDate.add({ days: 1 });
-			}
-			weeks.push(weekDates);
-		}
-		return weeks;
-	});
-	function select(date) {
-		if (isDisabled(date)) return;
-		onChange(calendarDateToJSDate(date));
-	}
-	function previousMonth() {
-		focusedDate.value = focusedDate.value.subtract({ months: 1 });
-	}
-	function nextMonth() {
-		focusedDate.value = focusedDate.value.add({ months: 1 });
-	}
-	function isSelected(date) {
-		if (!value.value) return false;
-		const selected = jsDateToCalendarDate(value.value);
-		return date.compare(selected) === 0;
-	}
-	function isDisabled(date) {
-		const jsDate = calendarDateToJSDate(date);
-		if (min && jsDate < min) return true;
-		if (max && jsDate > max) return true;
-		if (isDateDisabled?.(jsDate)) return true;
-		return false;
-	}
-	function isInMonth(date) {
-		return date.month === focusedDate.value.month;
-	}
-	return {
-		focusedDate,
-		dates,
-		select,
-		previousMonth,
-		nextMonth,
-		isSelected,
-		isDisabled,
-		isInMonth
-	};
-}
-//#endregion
-//#region src/Calendar/Calendar.vue
-const _hoisted_1 = ["aria-label"];
-const _hoisted_2 = { class: "astryx-calendar-header" };
-const _hoisted_3 = ["disabled", "aria-label"];
-const _hoisted_4 = { class: "astryx-calendar-month-year" };
-const _hoisted_5 = ["disabled", "aria-label"];
-const _hoisted_6 = {
-	class: "astryx-calendar-weekdays",
-	role: "row"
-};
-const _hoisted_7 = ["aria-label"];
-const _hoisted_8 = ["aria-activedescendant"];
-const _hoisted_9 = [
-	"id",
-	"aria-selected",
-	"aria-disabled",
-	"aria-current",
-	"onClick",
-	"onKeydown"
-];
-const _hoisted_10 = { class: "astryx-calendar-day" };
-const _sfc_main = /*@__PURE__*/ defineComponent({
-	name: "AstryxCalendar",
-	__name: "Calendar",
-	props: {
-		modelValue: { default: null },
-		min: {},
-		max: {},
-		isDateDisabled: {},
-		label: {},
-		disabled: {
-			type: Boolean,
-			default: false
-		}
-	},
-	emits: ["update:modelValue", "change"],
-	setup(__props, { emit: __emit }) {
-		const props = __props;
-		const emit = __emit;
-		const calendarId = `astryx-calendar-${useId()}`;
-		const locale = useAstryxLocale();
-		const messages = useAstryxMessages();
-		const resolvedLabel = computed(() => props.label ?? messages.value.calendar.label);
-		const weekDays = computed(() => weekdayNames(locale.value, "narrow"));
-		const weekDayLabels = computed(() => weekdayNames(locale.value, "long"));
-		const modelValueRef = computed({
-			get: () => props.modelValue,
-			set: (value) => {
-				emit("update:modelValue", value);
-				emit("change", value);
-			}
-		});
-		const calendar = useCalendar({
-			value: modelValueRef,
-			min: props.min,
-			max: props.max,
-			isDateDisabled: props.isDateDisabled,
-			onChange: (value) => {
-				modelValueRef.value = value;
-			}
-		});
-		const timeZone = getLocalTimeZone();
-		const todayDate = today(timeZone);
-		const monthYear = computed(() => {
-			const date = calendar.focusedDate.value;
-			return formatCalendarMonth(date.year, date.month, locale.value);
-		});
-		const activeIndex = ref(0);
-		const isEnabled = computed(() => !props.disabled);
-		const grid = useGridRovingFocus({
-			rows: computed(() => 6),
-			columns: computed(() => 7),
-			activeIndex,
-			isEnabled,
-			isDisabled: (row, col) => {
-				const dateIndex = row * 7 + col;
-				const date = calendar.dates.value.flat()[dateIndex];
-				return date ? calendar.isDisabled(date) : true;
-			},
-			onChange: (index) => {
-				activeIndex.value = index;
-			}
-		});
-		function getCellId(rowIndex, colIndex) {
-			return `${calendarId}-cell-${rowIndex}-${colIndex}`;
-		}
-		function isToday(date) {
-			return date.compare(todayDate) === 0;
-		}
-		function onDateClick(date, rowIndex, colIndex) {
-			if (props.disabled || calendar.isDisabled(date)) return;
-			activeIndex.value = rowIndex * 7 + colIndex;
-			calendar.select(date);
-		}
-		function onKeyDown(event) {
-			if (props.disabled) return;
-			grid.onKeyDown(event);
-			if (event.key === "Enter" || event.key === " ") {
-				event.preventDefault();
-				const date = calendar.dates.value.flat()[activeIndex.value];
-				if (date && !calendar.isDisabled(date)) calendar.select(date);
-			}
-		}
-		return (_ctx, _cache) => {
-			return openBlock(), createElementBlock("div", {
-				id: calendarId,
-				class: normalizeClass(["astryx-calendar", { "is-disabled": props.disabled }]),
-				role: "application",
-				"aria-label": resolvedLabel.value
-			}, [
-				createElementVNode("div", _hoisted_2, [renderSlot(_ctx.$slots, "header", {}, () => [
-					createElementVNode("button", {
-						type: "button",
-						class: "astryx-calendar-nav-button",
-						disabled: props.disabled,
-						"aria-label": unref(messages).calendar.previousMonth,
-						onClick: _cache[0] || (_cache[0] = (...args) => unref(calendar).previousMonth && unref(calendar).previousMonth(...args))
-					}, [..._cache[2] || (_cache[2] = [createElementVNode("svg", {
-						width: "16",
-						height: "16",
-						viewBox: "0 0 16 16",
-						fill: "none"
-					}, [createElementVNode("path", {
-						d: "M10 12L6 8L10 4",
-						stroke: "currentColor",
-						"stroke-width": "1.5",
-						"stroke-linecap": "round",
-						"stroke-linejoin": "round"
-					})], -1)])], 8, _hoisted_3),
-					createElementVNode("span", _hoisted_4, toDisplayString(monthYear.value), 1),
-					createElementVNode("button", {
-						type: "button",
-						class: "astryx-calendar-nav-button",
-						disabled: props.disabled,
-						"aria-label": unref(messages).calendar.nextMonth,
-						onClick: _cache[1] || (_cache[1] = (...args) => unref(calendar).nextMonth && unref(calendar).nextMonth(...args))
-					}, [..._cache[3] || (_cache[3] = [createElementVNode("svg", {
-						width: "16",
-						height: "16",
-						viewBox: "0 0 16 16",
-						fill: "none"
-					}, [createElementVNode("path", {
-						d: "M6 4L10 8L6 12",
-						stroke: "currentColor",
-						"stroke-width": "1.5",
-						"stroke-linecap": "round",
-						"stroke-linejoin": "round"
-					})], -1)])], 8, _hoisted_5)
-				])]),
-				createElementVNode("div", _hoisted_6, [(openBlock(true), createElementBlock(Fragment, null, renderList(weekDays.value, (day, index) => {
-					return openBlock(), createElementBlock("div", {
-						key: index,
-						class: "astryx-calendar-weekday",
-						role: "columnheader",
-						"aria-label": weekDayLabels.value[index]
-					}, toDisplayString(day), 9, _hoisted_7);
-				}), 128))]),
-				createElementVNode("div", {
-					class: "astryx-calendar-grid",
-					role: "grid",
-					"aria-labelledby": calendarId,
-					"aria-activedescendant": getCellId(unref(grid).row.value, unref(grid).column.value),
-					tabindex: "0",
-					onKeydown: onKeyDown
-				}, [(openBlock(true), createElementBlock(Fragment, null, renderList(unref(calendar).dates.value, (week, rowIndex) => {
-					return openBlock(), createElementBlock("div", {
-						key: rowIndex,
-						class: "astryx-calendar-row",
-						role: "row"
-					}, [(openBlock(true), createElementBlock(Fragment, null, renderList(week, (date, colIndex) => {
-						return openBlock(), createElementBlock("div", {
-							id: getCellId(rowIndex, colIndex),
-							key: colIndex,
-							class: normalizeClass(["astryx-calendar-cell", {
-								"is-selected": unref(calendar).isSelected(date),
-								"is-disabled": unref(calendar).isDisabled(date),
-								"is-today": isToday(date),
-								"is-other-month": !unref(calendar).isInMonth(date),
-								"is-active": activeIndex.value === rowIndex * 7 + colIndex
-							}]),
-							role: "gridcell",
-							"aria-selected": unref(calendar).isSelected(date),
-							"aria-disabled": unref(calendar).isDisabled(date),
-							"aria-current": isToday(date) ? "date" : void 0,
-							tabindex: "-1",
-							onClick: ($event) => onDateClick(date, rowIndex, colIndex),
-							onKeydown: withKeys(($event) => onDateClick(date, rowIndex, colIndex), ["enter"])
-						}, [renderSlot(_ctx.$slots, "day", {
-							date,
-							isSelected: unref(calendar).isSelected(date),
-							isDisabled: unref(calendar).isDisabled(date),
-							isToday: isToday(date),
-							isInMonth: unref(calendar).isInMonth(date)
-						}, () => [createElementVNode("span", _hoisted_10, toDisplayString(date.day), 1)])], 42, _hoisted_9);
-					}), 128))]);
-				}), 128))], 40, _hoisted_8)
-			], 10, _hoisted_1);
-		};
-	}
-});
-//#endregion
-export { _sfc_main as t };