antdv-next 0.0.0 → 1.0.0-alpha.1

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2025 Antdv Next
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/dist/_util/ActionButton.js

@@ -0,0 +1,129 @@
+import { convertLegacyProps } from "../button/Button.js";
+import button_default from "../button/index.js";
+import { createVNode, defineComponent, mergeProps, onBeforeUnmount, onMounted, shallowRef } from "vue";
+
+//#region src/_util/ActionButton.tsx
+function isThenable(value) {
+	return typeof value?.then === "function";
+}
+const ActionButton = /* @__PURE__ */ defineComponent((props, { slots }) => {
+	const clicked = shallowRef(false);
+	const loading = shallowRef(false);
+	const buttonRef = shallowRef();
+	let autoFocusTimeout = null;
+	const focusButton = () => {
+		const instance = buttonRef.value;
+		(instance?.$el ?? instance)?.focus?.({ preventScroll: true });
+	};
+	onMounted(() => {
+		if (props.autoFocus) autoFocusTimeout = setTimeout(() => {
+			focusButton();
+		});
+	});
+	onBeforeUnmount(() => {
+		if (autoFocusTimeout) {
+			clearTimeout(autoFocusTimeout);
+			autoFocusTimeout = null;
+		}
+	});
+	const onInternalClose = (...args) => {
+		props.close?.(...args);
+	};
+	const handlePromiseOnOk = (returnValue) => {
+		if (!isThenable(returnValue)) return;
+		loading.value = true;
+		returnValue.then((...args) => {
+			loading.value = false;
+			clicked.value = false;
+			onInternalClose(...args);
+		}, (error) => {
+			loading.value = false;
+			clicked.value = false;
+			if (props.isSilent?.()) return;
+			return Promise.reject(error);
+		});
+	};
+	const onClick = (e) => {
+		if (clicked.value) return;
+		clicked.value = true;
+		const { actionFn } = props;
+		if (!actionFn) {
+			onInternalClose();
+			return;
+		}
+		let returnValue;
+		if (props.emitEvent) {
+			returnValue = actionFn(e);
+			if (props.quitOnNullishReturnValue && !isThenable(returnValue)) {
+				clicked.value = false;
+				onInternalClose(e);
+				return;
+			}
+		} else if (actionFn.length) {
+			returnValue = actionFn(onInternalClose);
+			clicked.value = false;
+		} else {
+			returnValue = actionFn();
+			if (!isThenable(returnValue)) {
+				onInternalClose();
+				return;
+			}
+		}
+		handlePromiseOnOk(returnValue);
+	};
+	return () => {
+		const buttonAttrs = props.buttonProps ?? {};
+		return createVNode(button_default, mergeProps(convertLegacyProps(props.type), {
+			"prefixCls": props.prefixCls,
+			"loading": loading.value,
+			"ref": buttonRef,
+			"onClick": onClick
+		}, buttonAttrs), { default: () => [slots.default?.()] });
+	};
+}, {
+	props: {
+		type: {
+			type: String,
+			required: false
+		},
+		actionFn: {
+			type: Function,
+			required: false
+		},
+		close: {
+			type: Function,
+			required: false
+		},
+		autoFocus: {
+			type: Boolean,
+			required: false
+		},
+		prefixCls: {
+			type: String,
+			required: true
+		},
+		buttonProps: {
+			type: Object,
+			required: false
+		},
+		emitEvent: {
+			type: Boolean,
+			required: false
+		},
+		quitOnNullishReturnValue: {
+			type: Boolean,
+			required: false
+		},
+		children: { required: false },
+		isSilent: {
+			type: Function,
+			required: false
+		}
+	},
+	name: "AActionButton",
+	inheritAttrs: false
+});
+var ActionButton_default = ActionButton;
+
+//#endregion
+export { ActionButton_default as default };

package/dist/_util/ContextIsolator.js

@@ -0,0 +1,36 @@
+import { NoCompactStyle } from "../space/Compact.js";
+import { createVNode, defineComponent, isVNode } from "vue";
+import { filterEmpty } from "@v-c/util/dist/props-util";
+
+//#region src/_util/ContextIsolator.tsx
+function _isSlot(s) {
+	return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
+}
+const ContextIsolator = /* @__PURE__ */ defineComponent((props, { slots }) => {
+	return () => {
+		const { space, form } = props;
+		const children = filterEmpty(slots?.default?.());
+		if (children.length === 0) return null;
+		let result = children;
+		if (form) {}
+		if (space) {
+			const _result = function() {
+				return result;
+			}();
+			result = createVNode(NoCompactStyle, null, _isSlot(result) ? result : { default: () => [_result] });
+		}
+		return result;
+	};
+}, { props: {
+	space: {
+		type: Boolean,
+		required: false
+	},
+	form: {
+		type: Boolean,
+		required: false
+	}
+} });
+
+//#endregion
+export { ContextIsolator };

package/dist/_util/capitalize.js

@@ -0,0 +1,8 @@
+//#region src/_util/capitalize.ts
+function capitalize(str) {
+	if (typeof str !== "string") return str;
+	return str.charAt(0).toUpperCase() + str.slice(1);
+}
+
+//#endregion
+export { capitalize as default };

package/dist/_util/colors.d.ts

@@ -0,0 +1,10 @@
+import { PresetColorKey } from "../theme/interface/presetColors.js";
+import "../theme/interface/index.js";
+
+//#region src/_util/colors.d.ts
+type InverseColor = `${PresetColorKey}-inverse`;
+declare const PresetStatusColorTypes: readonly ["success", "processing", "error", "default", "warning"];
+type PresetColorType = PresetColorKey | InverseColor;
+type PresetStatusColorType = (typeof PresetStatusColorTypes)[number];
+//#endregion
+export { PresetColorType, PresetStatusColorType };

package/dist/_util/colors.js

@@ -0,0 +1,26 @@
+import { PresetColors } from "../theme/interface/presetColors.js";
+
+//#region src/_util/colors.ts
+const inverseColors = PresetColors.map((color) => `${color}-inverse`);
+const PresetStatusColorTypes = [
+	"success",
+	"processing",
+	"error",
+	"default",
+	"warning"
+];
+/**
+* determine if the color keyword belongs to the `Ant Design` {@link PresetColors}.
+* @param color color to be judged
+* @param includeInverse whether to include reversed colors
+*/
+function isPresetColor(color, includeInverse = true) {
+	if (includeInverse) return [...inverseColors, ...PresetColors].includes(color);
+	return PresetColors.includes(color);
+}
+function isPresetStatusColor(color) {
+	return PresetStatusColorTypes.includes(color);
+}
+
+//#endregion
+export { isPresetColor, isPresetStatusColor };

package/dist/_util/convertToTooltipProps.js

@@ -0,0 +1,11 @@
+import { isVNode } from "vue";
+
+//#region src/_util/convertToTooltipProps.ts
+function convertToTooltipProps(tooltip) {
+	if (tooltip === void 0 || tooltip === null) return null;
+	if (typeof tooltip === "object" && !Array.isArray(tooltip) && !isVNode(tooltip)) return tooltip;
+	return { title: tooltip };
+}
+
+//#endregion
+export { convertToTooltipProps as default };

package/dist/_util/copy.js

@@ -0,0 +1,49 @@
+import warning_default from "./warning.js";
+
+//#region src/_util/copy.ts
+function execCopy(text, isHtmlFormat) {
+	let copySuccess = false;
+	const onCopy = (event) => {
+		event.stopPropagation();
+		event.preventDefault();
+		event.clipboardData?.clearData();
+		event.clipboardData?.setData("text/plain", text);
+		if (isHtmlFormat) event.clipboardData?.setData("text/html", text);
+		copySuccess = true;
+	};
+	try {
+		document.addEventListener("copy", onCopy, { capture: true });
+		document.execCommand("copy");
+		return copySuccess;
+	} catch {
+		return false;
+	} finally {
+		document.removeEventListener("copy", onCopy, { capture: true });
+	}
+}
+async function asyncCopy(text, isHtmlFormat) {
+	try {
+		if (isHtmlFormat) await navigator.clipboard.write([new ClipboardItem({
+			"text/html": new Blob([text], { type: "text/html" }),
+			"text/plain": new Blob([text], { type: "text/plain" })
+		})]);
+		else await navigator.clipboard.writeText(text);
+		return true;
+	} catch {
+		return false;
+	}
+}
+async function copy(text, config) {
+	if (typeof text !== "string") {
+		warning_default(false, "clipboard", "The clipboard content must be of string type");
+		return false;
+	}
+	const isHtmlFormat = config?.format === "text/html";
+	if (await asyncCopy(text, isHtmlFormat)) return true;
+	if (execCopy(text, isHtmlFormat)) return true;
+	return false;
+}
+var copy_default = copy;
+
+//#endregion
+export { copy_default as default };

package/dist/_util/easings.js

@@ -0,0 +1,10 @@
+//#region src/_util/easings.ts
+function easeInOutCubic(t, b, c, d) {
+	const cc = c - b;
+	t /= d / 2;
+	if (t < 1) return cc / 2 * t * t * t + b;
+	return cc / 2 * ((t -= 2) * t * t + 2) + b;
+}
+
+//#endregion
+export { easeInOutCubic };

package/dist/_util/extendsObject.js

@@ -0,0 +1,14 @@
+//#region src/_util/extendsObject.ts
+function mergeProps(...items) {
+	const ret = {};
+	items.forEach((item) => {
+		if (item) Object.keys(item).forEach((key) => {
+			if (item[key] !== void 0) ret[key] = item[key];
+		});
+	});
+	return ret;
+}
+var extendsObject_default = mergeProps;
+
+//#endregion
+export { extendsObject_default as default };

package/dist/_util/gapSize.js

@@ -0,0 +1,15 @@
+//#region src/_util/gapSize.ts
+function isPresetSize(size) {
+	return [
+		"small",
+		"middle",
+		"large"
+	].includes(size);
+}
+function isValidGapNumber(size) {
+	if (!size) return false;
+	return typeof size === "number" && !Number.isNaN(size);
+}
+
+//#endregion
+export { isPresetSize, isValidGapNumber };

package/dist/_util/getAllowClear.js

@@ -0,0 +1,14 @@
+import { createVNode } from "vue";
+import { CloseCircleFilled } from "@antdv-next/icons";
+
+//#region src/_util/getAllowClear.tsx
+function getAllowClear(allowClear) {
+	let mergedAllowClear;
+	if (typeof allowClear === "object" && allowClear?.clearIcon) mergedAllowClear = allowClear;
+	else if (allowClear) mergedAllowClear = { clearIcon: createVNode(CloseCircleFilled, null, null) };
+	return mergedAllowClear;
+}
+var getAllowClear_default = getAllowClear;
+
+//#endregion
+export { getAllowClear_default as default };

package/dist/_util/getScroll.js

@@ -0,0 +1,20 @@
+//#region src/_util/getScroll.ts
+function isWindow(obj) {
+	return obj !== null && obj !== void 0 && obj === obj.window;
+}
+function getScroll(target) {
+	if (typeof window === "undefined")
+ /* istanbul ignore next */
+	return 0;
+	let result = 0;
+	if (isWindow(target)) result = target.pageYOffset;
+	else if (target instanceof Document) result = target.documentElement.scrollTop;
+	else if (target instanceof HTMLElement) result = target.scrollTop;
+	else if (target) result = target["scrollTop"];
+	if (target && !isWindow(target) && typeof result !== "number") result = (target.ownerDocument ?? target).documentElement?.scrollTop;
+	return result;
+}
+var getScroll_default = getScroll;
+
+//#endregion
+export { getScroll_default as default, isWindow };

package/dist/_util/hooks/index.d.ts

@@ -0,0 +1,4 @@
+import { MaskConfig, MaskType } from "./useMergedMask.js";
+import { Resolvable, SemanticClassNames, SemanticClassNamesType, SemanticStyles, SemanticStylesType } from "./useMergeSemantic.js";
+import { Orientation } from "./useOrientation.js";
+import "./useZIndex.js";

package/dist/_util/hooks/index.js

@@ -0,0 +1,7 @@
+import { useMergedMask } from "./useMergedMask.js";
+import { getAttrStyleAndClass, mergeClassNames, mergeStyles, pureAttrs, resolveStyleOrClass, useMergeSemantic, useMergeSemanticNoRef, useToArr, useToProps } from "./useMergeSemantic.js";
+import { useMultipleSelect } from "./useMultipleSelect.js";
+import { useOrientation } from "./useOrientation.js";
+import { CONTAINER_MAX_OFFSET, consumerBaseZIndexOffset, containerBaseZIndexOffset, useZIndex } from "./useZIndex.js";
+
+export {  };

package/dist/_util/hooks/useChildLoadEvents.js

@@ -0,0 +1,57 @@
+import { onBeforeUnmount, shallowRef } from "vue";
+
+//#region src/_util/hooks/useChildLoadEvents.ts
+/**
+* 监听某个容器内所有“可能触发 load/error 的元素”，
+* 并把事件统一交给回调处理。
+*/
+function useChildLoadEvents(options = {}) {
+	const { triggerForAlreadyLoaded = true } = options;
+	const cleanupRef = shallowRef(null);
+	const clear = () => {
+		if (cleanupRef.value) {
+			cleanupRef.value();
+			cleanupRef.value = null;
+		}
+	};
+	const bindEvent = (root, callback) => {
+		clear();
+		if (!root) return;
+		const elements = Array.from(root.querySelectorAll("img, iframe, video, audio, script, link[rel=\"stylesheet\"], source, embed, object"));
+		const cleanups = [];
+		for (const el of elements) {
+			const handleLoad = (ev) => {
+				callback("load", el, ev);
+			};
+			const handleError = (ev) => {
+				callback("error", el, ev);
+			};
+			el.addEventListener("load", handleLoad, { once: true });
+			el.addEventListener("error", handleError, { once: true });
+			cleanups.push(() => {
+				el.removeEventListener("load", handleLoad);
+				el.removeEventListener("error", handleError);
+			});
+			if (triggerForAlreadyLoaded) {
+				if (el instanceof HTMLImageElement) {
+					if (el.complete) callback("load", el, null);
+				} else if (el instanceof HTMLVideoElement || el instanceof HTMLAudioElement) {
+					if (el.readyState >= 1) callback("load", el, null);
+				} else if (el instanceof HTMLLinkElement) {
+					if (el.rel === "stylesheet" && el.sheet) callback("load", el, null);
+				}
+			}
+		}
+		cleanupRef.value = () => {
+			cleanups.forEach((fn) => fn());
+		};
+	};
+	onBeforeUnmount(clear);
+	return {
+		bindEvent,
+		clear
+	};
+}
+
+//#endregion
+export { useChildLoadEvents };

package/dist/_util/hooks/useClosable.d.ts

@@ -0,0 +1,11 @@
+import { VueNode } from "../type.js";
+import { AriaAttributes, Ref, VNodeChild } from "vue";
+
+//#region src/_util/hooks/useClosable.d.ts
+
+type ClosableType = boolean | ({
+  closeIcon?: VueNode;
+  disabled?: boolean;
+} & AriaAttributes);
+//#endregion
+export { ClosableType };

package/dist/_util/hooks/useClosable.js

@@ -0,0 +1,147 @@
+import { getSlotPropsFnRun } from "../tools.js";
+import { getVNode } from "../vueNode.js";
+import en_US_default from "../../locale/en_US.js";
+import useLocale_default from "../../locale/useLocale.js";
+import extendsObject_default from "../extendsObject.js";
+import isNonNullable_default from "../isNonNullable.js";
+import { computed, createVNode, isVNode, mergeProps, ref, unref } from "vue";
+import { filterEmpty } from "@v-c/util/dist/props-util";
+import { CloseOutlined } from "@antdv-next/icons";
+import pickAttrs from "@v-c/util/dist/pickAttrs";
+
+//#region src/_util/hooks/useClosable.tsx
+function pickClosable(context) {
+	return computed(() => {
+		if (!context.value) return;
+		const { closable, closeIcon } = context.value;
+		return {
+			closable,
+			closeIcon
+		};
+	});
+}
+/** Collection contains the all the props related with closable. e.g. `closable`, `closeIcon` */
+/** Convert `closable` and `closeIcon` to config object */
+function useClosableConfig(closableCollection) {
+	return computed(() => {
+		const { closable, closeIcon } = closableCollection?.value ?? {};
+		if (!closable && (closable === false || closeIcon === false || closeIcon === null)) return false;
+		if (closable === void 0 && closeIcon === void 0) return null;
+		let closableConfig = { closeIcon: typeof closeIcon !== "boolean" && closeIcon !== null ? closeIcon : void 0 };
+		if (closable && typeof closable === "object") closableConfig = {
+			...closableConfig,
+			...closable
+		};
+		return closableConfig;
+	});
+}
+/** Use same object to support `useMemo` optimization */
+const EmptyFallbackCloseCollection = {};
+function useClosable(propCloseCollection, contextCloseCollection, fallbackCloseCollection = ref(EmptyFallbackCloseCollection)) {
+	const propCloseConfig = useClosableConfig(propCloseCollection);
+	const contextCloseConfig = useClosableConfig(contextCloseCollection);
+	const [contextLocale] = useLocale_default("global", en_US_default.global);
+	const closeBtnIsDisabled = computed(() => {
+		return typeof propCloseConfig.value !== "boolean" ? !!propCloseConfig.value?.disabled : false;
+	});
+	const mergedFallbackCloseCollection = computed(() => {
+		return {
+			closeIcon: createVNode(CloseOutlined, null, null),
+			...fallbackCloseCollection.value
+		};
+	});
+	const mergedClosableConfig = computed(() => {
+		if (propCloseConfig.value === false) return false;
+		if (propCloseConfig.value) return extendsObject_default(mergedFallbackCloseCollection.value, contextCloseConfig.value, propCloseConfig.value);
+		if (contextCloseConfig.value === false) return false;
+		if (contextCloseConfig.value) return extendsObject_default(mergedFallbackCloseCollection.value, contextCloseConfig.value);
+		return !mergedFallbackCloseCollection.value.closable ? false : mergedFallbackCloseCollection.value;
+	});
+	return computed(() => {
+		if (mergedClosableConfig.value === false) return [
+			false,
+			null,
+			closeBtnIsDisabled.value,
+			{}
+		];
+		const { closeIconRender } = mergedFallbackCloseCollection.value;
+		const { closeIcon } = mergedClosableConfig.value;
+		let mergedCloseIcon = getVNode(closeIcon);
+		const ariaOrDataProps = pickAttrs(mergedClosableConfig.value, true);
+		if (mergedCloseIcon !== null && mergedCloseIcon !== void 0) {
+			if (closeIconRender) {
+				mergedCloseIcon = closeIconRender(mergedCloseIcon);
+				if (Array.isArray(mergedCloseIcon)) mergedCloseIcon = filterEmpty(mergedCloseIcon)?.[0];
+				else mergedCloseIcon = filterEmpty([mergedCloseIcon])?.[0];
+			}
+			mergedCloseIcon = isVNode(mergedCloseIcon) ? createVNode(mergedCloseIcon, {
+				...mergedCloseIcon.props,
+				"aria-label": mergedCloseIcon.props?.["aria-label"] ?? contextLocale?.value?.close,
+				...ariaOrDataProps
+			}) : createVNode("span", mergeProps({ "aria-label": contextLocale?.value?.close }, ariaOrDataProps), [mergedCloseIcon]);
+			return [
+				true,
+				mergedCloseIcon,
+				closeBtnIsDisabled.value,
+				ariaOrDataProps
+			];
+		}
+	});
+}
+function computeClosableConfig(closable, closeIcon) {
+	if (!closable && (closable === false || closeIcon === false || closeIcon === null)) return false;
+	if (closable === void 0 && closeIcon === void 0) return null;
+	let closableConfig = { closeIcon: typeof closeIcon !== "boolean" && closeIcon !== null ? closeIcon : void 0 };
+	if (closable && typeof closable === "object") closableConfig = {
+		...closableConfig,
+		...closable
+	};
+	return closableConfig;
+}
+function computeCloseIcon(mergedConfig, fallbackCloseCollection, closeLabel) {
+	const { closeIconRender } = fallbackCloseCollection;
+	const { closeIcon,...restConfig } = mergedConfig;
+	let finalCloseIcon = getSlotPropsFnRun({}, { closeIcon }, "closeIcon");
+	const ariaOrDataProps = pickAttrs(restConfig, true);
+	if (isNonNullable_default(finalCloseIcon)) {
+		if (closeIconRender) finalCloseIcon = closeIconRender(finalCloseIcon);
+		finalCloseIcon = isVNode(finalCloseIcon) ? createVNode(finalCloseIcon, {
+			"aria-label": closeLabel,
+			...ariaOrDataProps
+		}) : createVNode("span", mergeProps({ "aria-label": closeLabel }, ariaOrDataProps), [finalCloseIcon]);
+	}
+	return [finalCloseIcon, ariaOrDataProps];
+}
+function mergeClosableConfigs(propConfig, contextConfig, fallbackConfig) {
+	if (propConfig === false) return false;
+	if (propConfig) return extendsObject_default(fallbackConfig, contextConfig, propConfig);
+	if (contextConfig === false) return false;
+	if (contextConfig) return extendsObject_default(fallbackConfig, contextConfig);
+	return fallbackConfig.closable ? fallbackConfig : false;
+}
+function computeClosable(propCloseCollection, contextCloseCollection, fallbackCloseCollection = ref(EmptyFallbackCloseCollection), closeLabel = "Close") {
+	const propConfig = computeClosableConfig(unref(propCloseCollection)?.closable, unref(propCloseCollection)?.closeIcon);
+	const contextConfig = computeClosableConfig(unref(contextCloseCollection)?.closable, unref(contextCloseCollection)?.closeIcon);
+	const mergedFallback = {
+		closeIcon: createVNode(CloseOutlined, null, null),
+		...fallbackCloseCollection.value
+	};
+	const mergedConfig = mergeClosableConfigs(propConfig, contextConfig, mergedFallback);
+	const closeBtnIsDisabled = typeof mergedConfig !== "boolean" ? !!mergedConfig?.disabled : false;
+	if (mergedConfig === false) return [
+		false,
+		null,
+		closeBtnIsDisabled,
+		{}
+	];
+	const [closeIcon, ariaProps] = computeCloseIcon(mergedConfig, mergedFallback, closeLabel);
+	return [
+		true,
+		closeIcon,
+		closeBtnIsDisabled,
+		ariaProps
+	];
+}
+
+//#endregion
+export { computeClosable, useClosable as default, pickClosable };

package/dist/_util/hooks/useMergeSemantic.d.ts

@@ -0,0 +1,14 @@
+import { AnyObject, EmptyObject } from "../type.js";
+import { CSSProperties, Ref } from "vue";
+
+//#region src/_util/hooks/useMergeSemantic.d.ts
+
+type SemanticClassNames<Name extends string> = Partial<Record<Name, string>>;
+type SemanticStyles<Name extends string> = Partial<Record<Name, CSSProperties>>;
+type Resolvable<T, P extends AnyObject> = T | ((info: {
+  props: P;
+}) => T);
+type SemanticClassNamesType<Props extends AnyObject, SemanticName extends string, NestedStructure extends EmptyObject = EmptyObject> = Resolvable<Readonly<SemanticClassNames<SemanticName>>, Props> & NestedStructure;
+type SemanticStylesType<Props extends AnyObject, SemanticName extends string, NestedStructure extends EmptyObject = EmptyObject> = Resolvable<Readonly<SemanticStyles<SemanticName>>, Props> & NestedStructure;
+//#endregion
+export { Resolvable, SemanticClassNames, SemanticClassNamesType, SemanticStyles, SemanticStylesType };