@vizejs/ui 0.387.0 → 0.388.0

package/dist/tabs-DSXIomI_.mjs

@@ -0,0 +1,595 @@
+import { a as useDeterministicId, n as deriveDeterministicId } from "./deterministic-id-yMq4HfmS.mjs";
+import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper-BOaGB7Aw.mjs";
+import { createContext } from "./context.mjs";
+import { t as createCollectionRegistry } from "./collection-Cncgrq4U.mjs";
+import { n as useCompositeNavigation } from "./composite-navigation-D6WKS_BY.mjs";
+import { useControllableState } from "./controllable-state.mjs";
+import { computed, createElementBlock, defineComponent, guardReactiveProps, nextTick, normalizeProps, onUnmounted, openBlock, renderSlot, unref, useTemplateRef, watch } from "vue";
+//#region src/families/navigation/tabs/tabs-context.ts
+const tabsContext = createContext("Tabs");
+//#endregion
+//#region src/families/navigation/tabs/tabs-value.ts
+const safeSegment = /^[A-Za-z0-9][A-Za-z0-9_-]*$/;
+/** Return whether two public Tabs values represent the same selected tab. */
+function tabsValueEquals(left, right) {
+	return Object.is(left, right);
+}
+/** Create a deterministic, DOM-id-safe segment for an arbitrary tab value. */
+function getTabsValueIdSegment(value) {
+	if (safeSegment.test(value)) return `value-${value}`;
+	return `value-${value.replaceAll(/[^A-Za-z0-9_-]+/g, "-").replaceAll(/^-+|-+$/g, "").slice(0, 32) || "empty"}-${hashTabsValue(value)}`;
+}
+function hashTabsValue(value) {
+	let hash = 2166136261;
+	for (let index = 0; index < value.length; index++) {
+		hash ^= value.charCodeAt(index);
+		hash = Math.imul(hash, 16777619) >>> 0;
+	}
+	return hash.toString(36);
+}
+//#endregion
+//#region src/families/navigation/tabs/tabs-root.vue?vue&type=script&setup=true&lang.ts
+const _hoisted_1$3 = [
+	"id",
+	"dir",
+	"data-state",
+	"data-disabled",
+	"data-orientation",
+	"data-activation-mode",
+	"data-dir",
+	"data-value"
+];
+//#endregion
+//#region src/families/navigation/tabs/tabs-root.vue
+var tabs_root_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineComponent({
+	__name: "tabs-root",
+	props: {
+		id: {
+			type: [String, null],
+			required: false,
+			default: () => void 0
+		},
+		modelValue: {
+			type: [String, null],
+			required: false,
+			default: () => void 0
+		},
+		defaultValue: {
+			type: [String, null],
+			required: false,
+			default: () => void 0
+		},
+		disabled: {
+			type: Boolean,
+			required: false,
+			default: false
+		},
+		activationMode: {
+			type: String,
+			required: false,
+			default: "automatic"
+		},
+		orientation: {
+			type: String,
+			required: false,
+			default: "horizontal"
+		},
+		dir: {
+			type: String,
+			required: false,
+			default: "ltr"
+		},
+		loop: {
+			type: Boolean,
+			required: false,
+			default: true
+		}
+	},
+	emits: ["update:modelValue", "change"],
+	setup(__props, { expose: __expose, emit: __emit }) {
+		const emit = __emit;
+		const element = useTemplateRef("element");
+		const baseId = useDeterministicId({
+			id: () => __props.id,
+			hint: "tabs"
+		});
+		const listId = computed(() => deriveDeterministicId(baseId.value, "list"));
+		const disabledState = computed(() => __props.disabled);
+		const activationModeState = computed(() => __props.activationMode);
+		const orientationState = computed(() => __props.orientation);
+		const dirState = computed(() => __props.dir);
+		const registry = createCollectionRegistry({ disabledBehavior: "skip" });
+		const firstEnabledValue = computed(() => registry.navigableItems.value[0]?.key ?? null);
+		const valueState = useControllableState({
+			value: () => __props.modelValue,
+			defaultValue: () => __props.defaultValue,
+			equals: Object.is
+		});
+		const selectedValue = computed(() => {
+			const configured = valueState.value.value;
+			if (valueState.controlled.value) return configured ?? null;
+			return configured === void 0 ? firstEnabledValue.value : configured;
+		});
+		const state = computed(() => {
+			if (disabledState.value) return "disabled";
+			return selectedValue.value === null ? "empty" : "selected";
+		});
+		const slotState = computed(() => ({
+			activationMode: activationModeState.value,
+			dir: dirState.value,
+			disabled: disabledState.value,
+			orientation: orientationState.value,
+			state: state.value,
+			value: selectedValue.value
+		}));
+		function getSelectedValue() {
+			return selectedValue.value;
+		}
+		function getTriggerId(value) {
+			return deriveDeterministicId(baseId.value, `trigger-${getTabsValueIdSegment(value)}`);
+		}
+		function getContentId(value) {
+			return deriveDeterministicId(baseId.value, `content-${getTabsValueIdSegment(value)}`);
+		}
+		function setValue(value, nativeEvent = null) {
+			const previous = getSelectedValue();
+			if (tabsValueEquals(previous, value)) return false;
+			valueState.set(value);
+			if (value !== null && registry.getItem(value)?.disabled === false) registry.setActiveKey(value);
+			emit("update:modelValue", value);
+			emit("change", value, previous, nativeEvent);
+			return true;
+		}
+		function reset() {
+			return setValue(__props.defaultValue === void 0 ? firstEnabledValue.value : __props.defaultValue, null);
+		}
+		function syncActiveValue() {
+			if (disabledState.value) {
+				if (registry.activeKey.value !== null) registry.setActiveKey(null);
+				return;
+			}
+			const selected = getSelectedValue();
+			const selectedItem = selected === null ? void 0 : registry.getItem(selected);
+			const target = selectedItem !== void 0 && !selectedItem.disabled ? selected : firstEnabledValue.value;
+			if (target !== registry.activeKey.value) registry.setActiveKey(target);
+		}
+		function focus(options) {
+			syncActiveValue();
+			const target = registry.activeKey.value ?? firstEnabledValue.value;
+			const item = target === null ? void 0 : registry.getItem(target);
+			if (item?.element instanceof HTMLElement) item.element.focus(options);
+		}
+		function getTriggerState(value, triggerDisabled) {
+			if (triggerDisabled) return "disabled";
+			return selectedValue.value === value ? "active" : "inactive";
+		}
+		function registerTrigger(input) {
+			const registration = registry.register({
+				key: input.value,
+				value: input.value,
+				element: input.element,
+				disabled: input.disabled,
+				textValue: input.textValue,
+				order: input.order
+			});
+			syncActiveValue();
+			nextTick(syncActiveValue);
+			return registration;
+		}
+		const navigation = useCompositeNavigation({
+			registry,
+			focusStrategy: "roving",
+			getItemId: ({ key }) => getTriggerId(key),
+			orientation: orientationState,
+			direction: dirState,
+			loop: () => __props.loop,
+			isDisabled: disabledState,
+			onNavigate(change) {
+				if (activationModeState.value === "automatic" && change.intent !== "pointer") setValue(change.key, change.originalEvent);
+			}
+		});
+		watch([
+			disabledState,
+			selectedValue,
+			registry.navigableItems
+		], () => syncActiveValue(), {
+			flush: "post",
+			immediate: true
+		});
+		watch(registry.items, (items, previousItems) => {
+			const selected = getSelectedValue();
+			if (valueState.controlled.value || selected === null) return;
+			const hadSelected = previousItems.some((item) => item.key === selected);
+			const hasSelected = items.some((item) => item.key === selected);
+			if (hadSelected && !hasSelected) setValue(firstEnabledValue.value, null);
+		}, { flush: "post" });
+		__expose({
+			activationMode: activationModeState,
+			dir: dirState,
+			disabled: disabledState,
+			element,
+			focus: tabsContext.provide({
+				activationMode: activationModeState,
+				dir: dirState,
+				disabled: disabledState,
+				focus,
+				getContentId,
+				getTriggerId,
+				getTriggerState,
+				id: baseId,
+				isSelected: (value) => selectedValue.value === value,
+				listId,
+				navigation,
+				orientation: orientationState,
+				registerTrigger,
+				registry,
+				selectValue: (value, nativeEvent = null) => setValue(value, nativeEvent),
+				setValue,
+				state,
+				syncActiveValue,
+				value: selectedValue
+			}).focus,
+			id: baseId,
+			listId,
+			orientation: orientationState,
+			reset,
+			setValue,
+			state,
+			value: selectedValue
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", {
+				id: unref(baseId),
+				ref_key: "element",
+				ref: element,
+				dir: dirState.value,
+				"data-vize-ui": "tabs-root",
+				part: "root",
+				"data-state": state.value,
+				"data-disabled": disabledState.value ? "true" : void 0,
+				"data-orientation": orientationState.value,
+				"data-activation-mode": activationModeState.value,
+				"data-dir": dirState.value,
+				"data-value": selectedValue.value ?? void 0
+			}, [renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps(slotState.value)), void 0, true)], 8, _hoisted_1$3);
+		};
+	}
+}), [["__scopeId", "data-v-ba7f2547"]]);
+//#endregion
+//#region src/families/navigation/tabs/tabs-content.vue?vue&type=script&setup=true&lang.ts
+const _hoisted_1$2 = [
+	"id",
+	"hidden",
+	"tabindex",
+	"aria-label",
+	"aria-labelledby",
+	"aria-describedby",
+	"data-state",
+	"data-selected",
+	"data-disabled",
+	"data-orientation",
+	"data-value"
+];
+//#endregion
+//#region src/families/navigation/tabs/tabs-content.vue
+var tabs_content_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineComponent({
+	__name: "tabs-content",
+	props: {
+		value: {
+			type: String,
+			required: true
+		},
+		ariaLabel: {
+			type: String,
+			required: false,
+			default: () => void 0
+		},
+		ariaLabelledby: {
+			type: [String, null],
+			required: false,
+			default: () => void 0
+		},
+		ariaDescribedby: {
+			type: String,
+			required: false,
+			default: () => void 0
+		}
+	},
+	setup(__props, { expose: __expose }) {
+		const context = tabsContext.use();
+		const element = useTemplateRef("element");
+		const contentId = computed(() => context.getContentId(__props.value));
+		const selected = computed(() => context.isSelected(__props.value));
+		const contentState = computed(() => selected.value ? "active" : "inactive");
+		const labelledBy = computed(() => {
+			if (__props.ariaLabel !== void 0) return void 0;
+			return __props.ariaLabelledby ?? context.getTriggerId(__props.value);
+		});
+		const slotState = computed(() => ({
+			disabled: context.disabled.value,
+			orientation: context.orientation.value,
+			selected: selected.value,
+			state: contentState.value,
+			value: __props.value
+		}));
+		function focusContent(options) {
+			if (selected.value) element.value?.focus(options);
+		}
+		__expose({
+			disabled: context.disabled,
+			element,
+			focusContent,
+			id: contentId,
+			orientation: context.orientation,
+			selected,
+			state: contentState,
+			value: __props.value
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", {
+				id: contentId.value,
+				ref_key: "element",
+				ref: element,
+				role: "tabpanel",
+				hidden: selected.value ? void 0 : true,
+				tabindex: selected.value ? 0 : void 0,
+				"aria-label": __props.ariaLabel,
+				"aria-labelledby": labelledBy.value,
+				"aria-describedby": __props.ariaDescribedby,
+				"data-vize-ui": "tabs-content",
+				part: "content",
+				"data-state": contentState.value,
+				"data-selected": selected.value ? "true" : "false",
+				"data-disabled": unref(context).disabled.value ? "true" : void 0,
+				"data-orientation": unref(context).orientation.value,
+				"data-value": __props.value
+			}, [renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps(slotState.value)), void 0, true)], 8, _hoisted_1$2);
+		};
+	}
+}), [["__scopeId", "data-v-e730e068"]]);
+//#endregion
+//#region src/families/navigation/tabs/tabs-list.vue?vue&type=script&setup=true&lang.ts
+const _hoisted_1$1 = [
+	"id",
+	"aria-label",
+	"aria-labelledby",
+	"aria-describedby",
+	"aria-orientation",
+	"data-state",
+	"data-disabled",
+	"data-orientation",
+	"data-activation-mode",
+	"data-value"
+];
+//#endregion
+//#region src/families/navigation/tabs/tabs-list.vue
+var tabs_list_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineComponent({
+	__name: "tabs-list",
+	props: {
+		ariaLabel: {
+			type: String,
+			required: false,
+			default: () => void 0
+		},
+		ariaLabelledby: {
+			type: String,
+			required: false,
+			default: () => void 0
+		},
+		ariaDescribedby: {
+			type: String,
+			required: false,
+			default: () => void 0
+		}
+	},
+	setup(__props, { expose: __expose }) {
+		const context = tabsContext.use();
+		const element = useTemplateRef("element");
+		const slotState = computed(() => ({
+			activationMode: context.activationMode.value,
+			dir: context.dir.value,
+			disabled: context.disabled.value,
+			listId: context.listId.value,
+			orientation: context.orientation.value,
+			state: context.state.value,
+			value: context.value.value
+		}));
+		__expose({
+			activationMode: context.activationMode,
+			dir: context.dir,
+			disabled: context.disabled,
+			element,
+			focus: context.focus,
+			listId: context.listId,
+			orientation: context.orientation,
+			state: context.state,
+			value: context.value
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", {
+				id: unref(context).listId.value,
+				ref_key: "element",
+				ref: element,
+				role: "tablist",
+				"aria-label": __props.ariaLabel,
+				"aria-labelledby": __props.ariaLabelledby,
+				"aria-describedby": __props.ariaDescribedby,
+				"aria-orientation": unref(context).orientation.value,
+				"data-vize-ui": "tabs-list",
+				part: "list",
+				"data-state": unref(context).state.value,
+				"data-disabled": unref(context).disabled.value ? "true" : void 0,
+				"data-orientation": unref(context).orientation.value,
+				"data-activation-mode": unref(context).activationMode.value,
+				"data-value": unref(context).value.value ?? void 0
+			}, [renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps(slotState.value)), void 0, true)], 8, _hoisted_1$1);
+		};
+	}
+}), [["__scopeId", "data-v-403c4233"]]);
+//#endregion
+//#region src/families/navigation/tabs/tabs-trigger.vue?vue&type=script&setup=true&lang.ts
+const _hoisted_1 = [
+	"id",
+	"type",
+	"disabled",
+	"tabindex",
+	"aria-label",
+	"aria-labelledby",
+	"aria-describedby",
+	"aria-selected",
+	"aria-controls",
+	"data-state",
+	"data-selected",
+	"data-disabled",
+	"data-orientation",
+	"data-value"
+];
+//#endregion
+//#region src/families/navigation/tabs/tabs-trigger.vue
+var tabs_trigger_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineComponent({
+	__name: "tabs-trigger",
+	props: {
+		value: {
+			type: String,
+			required: true
+		},
+		type: {
+			type: String,
+			required: false,
+			default: "button"
+		},
+		disabled: {
+			type: Boolean,
+			required: false,
+			default: false
+		},
+		textValue: {
+			type: [String, null],
+			required: false,
+			default: () => void 0
+		},
+		order: {
+			type: Number,
+			required: false,
+			default: () => void 0
+		},
+		ariaLabel: {
+			type: String,
+			required: false,
+			default: () => void 0
+		},
+		ariaLabelledby: {
+			type: String,
+			required: false,
+			default: () => void 0
+		},
+		ariaDescribedby: {
+			type: String,
+			required: false,
+			default: () => void 0
+		}
+	},
+	emits: ["click"],
+	setup(__props, { expose: __expose, emit: __emit }) {
+		const emit = __emit;
+		const context = tabsContext.use();
+		const element = useTemplateRef("element");
+		const triggerId = computed(() => context.getTriggerId(__props.value));
+		const contentId = computed(() => context.getContentId(__props.value));
+		const selected = computed(() => context.isSelected(__props.value));
+		const triggerDisabled = computed(() => context.disabled.value || __props.disabled);
+		const triggerState = computed(() => context.getTriggerState(__props.value, triggerDisabled.value));
+		const navigationProps = computed(() => context.navigation.getItemProps(__props.value));
+		const tabIndex = computed(() => triggerDisabled.value ? void 0 : navigationProps.value.tabindex);
+		const slotState = computed(() => ({
+			activationMode: context.activationMode.value,
+			disabled: triggerDisabled.value,
+			orientation: context.orientation.value,
+			selected: selected.value,
+			state: triggerState.value,
+			value: __props.value
+		}));
+		let registration = null;
+		function register() {
+			registration?.unregister();
+			registration = context.registerTrigger({
+				disabled: triggerDisabled,
+				element,
+				order: () => __props.order,
+				textValue: () => __props.textValue,
+				value: __props.value
+			});
+		}
+		watch(() => __props.value, register, {
+			flush: "sync",
+			immediate: true
+		});
+		watch([triggerDisabled, () => __props.order], () => context.syncActiveValue(), { flush: "post" });
+		onUnmounted(() => {
+			registration?.unregister();
+			registration = null;
+			nextTick(context.syncActiveValue);
+		});
+		function onPointerdown(event) {
+			if (!triggerDisabled.value) navigationProps.value.onPointerdown(event);
+		}
+		function onFocus(event) {
+			if (!triggerDisabled.value) navigationProps.value.onFocus(event);
+		}
+		function onKeydown(event) {
+			if (!triggerDisabled.value) context.navigation.getContainerProps().onKeydown(event);
+		}
+		function onClick(event) {
+			if (triggerDisabled.value) {
+				event.preventDefault();
+				event.stopImmediatePropagation();
+				return;
+			}
+			emit("click", event);
+			if (!event.defaultPrevented) context.selectValue(__props.value, event);
+		}
+		function focus(options) {
+			element.value?.focus(options);
+		}
+		__expose({
+			activationMode: context.activationMode,
+			disabled: triggerDisabled,
+			element,
+			focus,
+			id: triggerId,
+			orientation: context.orientation,
+			selected,
+			state: triggerState,
+			value: __props.value
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("button", {
+				id: triggerId.value,
+				ref_key: "element",
+				ref: element,
+				type: __props.type,
+				role: "tab",
+				disabled: triggerDisabled.value,
+				tabindex: tabIndex.value,
+				"aria-label": __props.ariaLabel,
+				"aria-labelledby": __props.ariaLabelledby,
+				"aria-describedby": __props.ariaDescribedby,
+				"aria-selected": selected.value ? "true" : "false",
+				"aria-controls": contentId.value,
+				"data-vize-ui": "tabs-trigger",
+				part: "trigger",
+				"data-state": triggerState.value,
+				"data-selected": selected.value ? "true" : "false",
+				"data-disabled": triggerDisabled.value ? "true" : void 0,
+				"data-orientation": unref(context).orientation.value,
+				"data-value": __props.value,
+				onPointerdown,
+				onFocus,
+				onKeydown,
+				onClick
+			}, [renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps(slotState.value)), void 0, true), renderSlot(_ctx.$slots, "indicator", normalizeProps(guardReactiveProps(slotState.value)), void 0, true)], 40, _hoisted_1);
+		};
+	}
+}), [["__scopeId", "data-v-f46f89a8"]]);
+//#endregion
+export { tabs_root_default as i, tabs_list_default as n, tabs_content_default as r, tabs_trigger_default as t };

package/dist/tabs.d.mts

@@ -0,0 +1,2 @@
+import { Cc as TabsSlotState, Dc as TabsTriggerState, Ec as TabsTriggerSlotState, Oc as TabsValue, Sc as TabsRootExpose, Tc as TabsTriggerExpose, _c as TabsContentState, bc as TabsListSlotState, dc as _default$2, fc as _default$1, gc as TabsContentSlotState, hc as TabsContentExpose, mc as TabsActivationMode, pc as _default, uc as _default$3, vc as TabsDirection, wc as TabsState, xc as TabsOrientation, yc as TabsListExpose } from "./announcer-DGr2Iz0i.mjs";
+export { _default as Tabs, _default as TabsRoot, type TabsActivationMode, _default$1 as TabsContent, type TabsContentExpose, type TabsContentSlotState, type TabsContentState, type TabsDirection, _default$2 as TabsList, type TabsListExpose, type TabsListSlotState, type TabsOrientation, type TabsRootExpose, type TabsSlotState, type TabsState, _default$3 as TabsTrigger, type TabsTriggerExpose, type TabsTriggerSlotState, type TabsTriggerState, type TabsValue };

package/dist/tabs.mjs

@@ -0,0 +1,2 @@
+import { i as tabs_root_default, n as tabs_list_default, r as tabs_content_default, t as tabs_trigger_default } from "./tabs-DSXIomI_.mjs";
+export { tabs_root_default as Tabs, tabs_root_default as TabsRoot, tabs_content_default as TabsContent, tabs_list_default as TabsList, tabs_trigger_default as TabsTrigger };

package/dist/text-BVeNKPiv.mjs

@@ -0,0 +1,76 @@
+import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper-BOaGB7Aw.mjs";
+import { computed, createBlock, defineComponent, guardReactiveProps, normalizeProps, openBlock, renderSlot, resolveDynamicComponent, useTemplateRef, withCtx } from "vue";
+//#endregion
+//#region src/families/typography/text/text.vue
+var text_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineComponent({
+	__name: "text",
+	props: {
+		as: {
+			type: null,
+			required: false,
+			default: "span"
+		},
+		size: {
+			type: String,
+			required: false,
+			default: "md"
+		},
+		weight: {
+			type: String,
+			required: false,
+			default: "regular"
+		},
+		tone: {
+			type: String,
+			required: false,
+			default: "neutral"
+		},
+		truncate: {
+			type: Boolean,
+			required: false,
+			default: false
+		}
+	},
+	setup(__props, { expose: __expose }) {
+		const element = useTemplateRef("element");
+		const sizeState = computed(() => __props.size);
+		const weightState = computed(() => __props.weight);
+		const toneState = computed(() => __props.tone);
+		const truncateState = computed(() => __props.truncate);
+		const slotState = computed(() => ({
+			size: sizeState.value,
+			tone: toneState.value,
+			truncate: truncateState.value,
+			weight: weightState.value
+		}));
+		__expose({
+			element,
+			size: sizeState,
+			tone: toneState,
+			truncate: truncateState,
+			weight: weightState
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(resolveDynamicComponent(__props.as), {
+				ref_key: "element",
+				ref: element,
+				part: "root",
+				"data-vize-ui": "text",
+				"data-size": sizeState.value,
+				"data-weight": weightState.value,
+				"data-tone": toneState.value,
+				"data-truncate": truncateState.value ? "true" : "false"
+			}, {
+				default: withCtx(() => [renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps(slotState.value)), void 0, true)]),
+				_: 3
+			}, 8, [
+				"data-size",
+				"data-weight",
+				"data-tone",
+				"data-truncate"
+			]);
+		};
+	}
+}), [["__scopeId", "data-v-c59b1258"]]);
+//#endregion
+export { text_default as t };

package/dist/text.d.mts

@@ -0,0 +1,2 @@
+import { At as TextSize, Dt as _default, Mt as TextTone, Nt as TextWeight, Ot as TextElement, jt as TextSlotState, kt as TextExpose } from "./announcer-DGr2Iz0i.mjs";
+export { _default as Text, type TextElement, type TextExpose, type TextSize, type TextSlotState, type TextTone, type TextWeight };

package/dist/text.mjs

@@ -0,0 +1,2 @@
+import { t as text_default } from "./text-BVeNKPiv.mjs";
+export { text_default as Text };