@lumx/vue 4.17.1-alpha.2 → 4.17.1-alpha.3

package/_internal/packages/lumx-core/src/js/components/UserBlock/index.js

@@ -0,0 +1,88 @@
+import { Orientation, Size } from "../../constants/enums/index.js";
+import { bem } from "../../utils/classNames/bem/index.js";
+import { import_classnames } from "../../utils/classNames/index.js";
+import { createVNode, isVNode, mergeProps } from "vue";
+//#region ../lumx-core/src/js/components/UserBlock/index.tsx
+/**
+* User block sizes.
+*/
+/**
+* Props for the UserBlock component.
+*
+* UserBlock displays user information with an avatar, name, and optional fields.
+* Supports both horizontal and vertical orientations with customizable actions.
+*/
+function _isSlot(s) {
+	return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
+}
+/**
+* Component default class name and class prefix.
+*/
+var CLASSNAME = "lumx-user-block";
+var { block, element } = bem(CLASSNAME);
+/**
+* Component default props.
+*/
+var DEFAULT_PROPS = {
+	orientation: Orientation.horizontal,
+	size: Size.m
+};
+var isUserBlockClickeable = ({ linkAs, linkProps, handleClick }) => {
+	const isLink = Boolean(linkProps?.href || linkAs);
+	return !!handleClick || isLink;
+};
+/**
+* UserBlock component.
+*
+* @param  props Component props.
+* @param  ref   Component ref.
+* @return React element.
+*/
+var UserBlock = (props) => {
+	const { avatarProps, className, fields, linkProps, linkAs, ref, multipleActions, mouseEnterProp = "onMouseEnter", mouseLeaveProp = "onMouseLeave", name, nameProps, handleClick, handleMouseEnter, handleMouseLeave, orientation = DEFAULT_PROPS.orientation, simpleAction, size = DEFAULT_PROPS.size, theme, children, additionalFields, after, Text, Avatar, ...forwardedProps } = props;
+	let componentSize = size;
+	if (orientation === Orientation.vertical) componentSize = Size.l;
+	const shouldDisplayActions = orientation === Orientation.vertical;
+	const isClickable = isUserBlockClickeable({
+		handleClick,
+		linkAs,
+		linkProps
+	});
+	const shouldDisplayFields = componentSize !== Size.s && componentSize !== Size.xs;
+	const fieldsBlock = fields && shouldDisplayFields && createVNode("div", { "className": element("fields") }, [fields.map((field, idx) => createVNode(Text, {
+		"as": "span",
+		"key": idx,
+		"className": element("field")
+	}, _isSlot(field) ? field : { default: () => [field] }))]);
+	const eventHandlers = {
+		...handleMouseEnter && { [mouseEnterProp]: handleMouseEnter },
+		...handleMouseLeave && { [mouseLeaveProp]: handleMouseLeave }
+	};
+	return createVNode("div", mergeProps({ "ref": ref }, forwardedProps, eventHandlers, { "className": import_classnames.default(className, block({
+		[`orientation-${orientation}`]: Boolean(orientation),
+		[`size-${componentSize}`]: Boolean(componentSize),
+		[`theme-${theme}`]: Boolean(theme),
+		"is-clickable": isClickable
+	})) }), [
+		avatarProps && createVNode(Avatar, mergeProps({
+			"linkAs": linkAs,
+			"linkProps": linkProps,
+			"alt": ""
+		}, avatarProps, {
+			"className": import_classnames.default(element("avatar"), avatarProps.className),
+			"size": componentSize,
+			"onClick": handleClick,
+			"theme": theme
+		}), null),
+		(fields || name || children || additionalFields) && createVNode("div", { "className": element("wrapper") }, [
+			children,
+			fieldsBlock,
+			shouldDisplayFields ? additionalFields : null
+		]),
+		shouldDisplayActions && simpleAction && createVNode("div", { "className": element("action") }, [simpleAction]),
+		shouldDisplayActions && multipleActions && createVNode("div", { "className": element("actions") }, [multipleActions]),
+		after ? createVNode("div", { "className": element("after") }, [after]) : null
+	]);
+};
+//#endregion
+export { CLASSNAME, DEFAULT_PROPS, UserBlock, element, isUserBlockClickeable };

package/_internal/packages/lumx-core/src/js/constants/browser/index.js

@@ -0,0 +1,7 @@
+//#region ../lumx-core/src/js/constants/browser/index.ts
+/**
+* Check if we are running in a true browser (not SSR and not jsdom test environment).
+*/
+var IS_BROWSER = typeof window !== "undefined" && !window.navigator.userAgent.includes("jsdom");
+//#endregion
+export { IS_BROWSER };

package/_internal/packages/lumx-core/src/js/constants/components/index.js

@@ -0,0 +1,19 @@
+//#region ../lumx-core/src/js/constants/components/index.ts
+/**
+* Delay on hover after which we open or close the tooltip.
+* Only applies to devices supporting pointer hover.
+*/
+var TOOLTIP_HOVER_DELAY = {
+	open: 500,
+	close: 500
+};
+/**
+* Delay on long press after which we open or close the tooltip.
+* Only applies to devices not supporting pointer hover.
+*/
+var TOOLTIP_LONG_PRESS_DELAY = {
+	open: 250,
+	close: 3e3
+};
+//#endregion
+export { TOOLTIP_HOVER_DELAY, TOOLTIP_LONG_PRESS_DELAY };

package/_internal/packages/lumx-core/src/js/constants/enums/index.d.ts

@@ -0,0 +1,184 @@
+import { ValueOf } from "@lumx/core/js/types";
+
+//#region ../lumx-core/src/js/constants/enums/index.d.ts
+/**
+ * Alignments.
+ */
+declare const Alignment: {
+  readonly bottom: "bottom";
+  readonly center: "center";
+  readonly end: "end";
+  readonly left: "left";
+  readonly right: "right";
+  readonly spaceAround: "space-around";
+  readonly spaceBetween: "space-between";
+  readonly spaceEvenly: "space-evenly";
+  readonly start: "start";
+  readonly top: "top";
+};
+type Alignment = ValueOf<typeof Alignment>;
+type VerticalAlignment = Extract<Alignment, 'top' | 'center' | 'bottom'>;
+type HorizontalAlignment = Extract<Alignment, 'right' | 'center' | 'left'>;
+declare const Theme: {
+  readonly light: "light";
+  readonly dark: "dark";
+};
+type Theme = ValueOf<typeof Theme>;
+declare const Size: {
+  readonly xxs: "xxs";
+  readonly xs: "xs";
+  readonly s: "s";
+  readonly m: "m";
+  readonly l: "l";
+  readonly xl: "xl";
+  readonly xxl: "xxl";
+  readonly tiny: "tiny";
+  readonly regular: "regular";
+  readonly medium: "medium";
+  readonly big: "big";
+  readonly huge: "huge";
+};
+type Size = ValueOf<typeof Size>;
+type GlobalSize = Extract<Size, 'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl' | 'xxl'>;
+declare const Orientation: {
+  readonly horizontal: "horizontal";
+  readonly vertical: "vertical";
+};
+type Orientation = ValueOf<typeof Orientation>;
+declare const Emphasis: {
+  readonly low: "low";
+  readonly medium: "medium";
+  readonly high: "high";
+};
+type Emphasis = ValueOf<typeof Emphasis>;
+/**
+ * List of typographies that can't be customized.
+ */
+declare const TypographyInterface: {
+  readonly overline: "overline";
+  readonly caption: "caption";
+  readonly body1: "body1";
+  readonly body2: "body2";
+  readonly subtitle1: "subtitle1";
+  readonly subtitle2: "subtitle2";
+  readonly title: "title";
+  readonly headline: "headline";
+  readonly display1: "display1";
+};
+type TypographyInterface = ValueOf<typeof TypographyInterface>;
+/**
+ * List of typographies that can be customized (via CSS variables).
+ */
+declare const TypographyCustom: {
+  readonly intro: "custom-intro";
+  readonly 'body-large': "custom-body-large";
+  readonly body: "custom-body";
+  readonly quote: "custom-quote";
+  readonly 'publish-info': "custom-publish-info";
+  readonly button: "custom-button";
+  readonly title1: "custom-title1";
+  readonly title2: "custom-title2";
+  readonly title3: "custom-title3";
+  readonly title4: "custom-title4";
+  readonly title5: "custom-title5";
+  readonly title6: "custom-title6";
+};
+type TypographyCustom = ValueOf<typeof TypographyCustom>;
+/**
+ * List of all typographies.
+ */
+declare const Typography: {
+  readonly custom: {
+    readonly intro: "custom-intro";
+    readonly 'body-large': "custom-body-large";
+    readonly body: "custom-body";
+    readonly quote: "custom-quote";
+    readonly 'publish-info': "custom-publish-info";
+    readonly button: "custom-button";
+    readonly title1: "custom-title1";
+    readonly title2: "custom-title2";
+    readonly title3: "custom-title3";
+    readonly title4: "custom-title4";
+    readonly title5: "custom-title5";
+    readonly title6: "custom-title6";
+  };
+  readonly overline: "overline";
+  readonly caption: "caption";
+  readonly body1: "body1";
+  readonly body2: "body2";
+  readonly subtitle1: "subtitle1";
+  readonly subtitle2: "subtitle2";
+  readonly title: "title";
+  readonly headline: "headline";
+  readonly display1: "display1";
+};
+type Typography = TypographyInterface | TypographyCustom;
+/**
+ * All available aspect ratios.
+ */
+declare const AspectRatio: {
+  /** Intrinsic content ratio. */readonly original: "original"; /** Ratio 3:1 */
+  readonly panoramic: "panoramic"; /** Ratio 16:9 */
+  readonly wide: "wide"; /** Ratio 3:2 */
+  readonly horizontal: "horizontal"; /** Ratio 3:2 */
+  readonly vertical: "vertical"; /** Ratio 1:1 */
+  readonly square: "square"; /** Ratio constrained by the parent. */
+  readonly free: "free";
+};
+type AspectRatio = ValueOf<typeof AspectRatio>;
+/**
+ * Semantic info about the purpose of the component
+ */
+declare const Kind: {
+  readonly info: "info";
+  readonly success: "success";
+  readonly warning: "warning";
+  readonly error: "error";
+};
+type Kind = ValueOf<typeof Kind>;
+/**
+ * All available white-space values
+ * */
+declare const WhiteSpace: {
+  normal: string;
+  nowrap: string;
+  pre: string;
+  'pre-wrap': string;
+  'pre-line': string;
+  'break-spaces': string;
+};
+type WhiteSpace = ValueOf<typeof WhiteSpace>;
+/**
+ * See SCSS variable $lumx-color-palette
+ */
+declare const ColorPalette: {
+  readonly primary: "primary";
+  readonly secondary: "secondary";
+  readonly blue: "blue";
+  readonly dark: "dark";
+  readonly green: "green";
+  readonly yellow: "yellow";
+  readonly red: "red";
+  readonly light: "light";
+  readonly grey: "grey";
+};
+type ColorPalette = ValueOf<typeof ColorPalette>;
+/**
+ * See SCSS variable $lumx-color-variants
+ */
+declare const ColorVariant: {
+  readonly D1: "D1";
+  readonly D2: "D2";
+  readonly L1: "L1";
+  readonly L2: "L2";
+  readonly L3: "L3";
+  readonly L4: "L4";
+  readonly L5: "L5";
+  readonly L6: "L6";
+  readonly N: "N";
+};
+type ColorVariant = ValueOf<typeof ColorVariant>;
+/** ColorPalette with all possible color variant combination */
+type ColorWithVariants = ColorPalette | Exclude<`${ColorPalette}-${ColorVariant}`, `light-D${number}` | `dark-D${number}`>;
+//#endregion
+export { Alignment, AspectRatio, ColorPalette, ColorVariant, ColorWithVariants, Emphasis, GlobalSize, HorizontalAlignment, Kind, Orientation, Size, Theme, Typography, TypographyCustom, TypographyInterface, VerticalAlignment, WhiteSpace };

package/_internal/packages/lumx-core/src/js/constants/enums/index.js

@@ -0,0 +1,140 @@
+//#region ../lumx-core/src/js/constants/enums/index.ts
+/**
+* Alignments.
+*/
+var Alignment = {
+	bottom: "bottom",
+	center: "center",
+	end: "end",
+	left: "left",
+	right: "right",
+	spaceAround: "space-around",
+	spaceBetween: "space-between",
+	spaceEvenly: "space-evenly",
+	start: "start",
+	top: "top"
+};
+var Theme = {
+	light: "light",
+	dark: "dark"
+};
+var Size = {
+	xxs: "xxs",
+	xs: "xs",
+	s: "s",
+	m: "m",
+	l: "l",
+	xl: "xl",
+	xxl: "xxl",
+	tiny: "tiny",
+	regular: "regular",
+	medium: "medium",
+	big: "big",
+	huge: "huge"
+};
+var Orientation = {
+	horizontal: "horizontal",
+	vertical: "vertical"
+};
+var Emphasis = {
+	low: "low",
+	medium: "medium",
+	high: "high"
+};
+/**
+* List of typographies that can't be customized.
+*/
+var TypographyInterface = {
+	overline: "overline",
+	caption: "caption",
+	body1: "body1",
+	body2: "body2",
+	subtitle1: "subtitle1",
+	subtitle2: "subtitle2",
+	title: "title",
+	headline: "headline",
+	display1: "display1"
+};
+/**
+* List of typographies that can be customized (via CSS variables).
+*/
+var TypographyCustom = {
+	title1: "custom-title1",
+	title2: "custom-title2",
+	title3: "custom-title3",
+	title4: "custom-title4",
+	title5: "custom-title5",
+	title6: "custom-title6",
+	intro: "custom-intro",
+	"body-large": "custom-body-large",
+	body: "custom-body",
+	quote: "custom-quote",
+	"publish-info": "custom-publish-info",
+	button: "custom-button"
+};
+/**
+* List of all typographies.
+*/
+var Typography = {
+	...TypographyInterface,
+	custom: TypographyCustom
+};
+/**
+* All available aspect ratios.
+*/
+var AspectRatio = {
+	/** Intrinsic content ratio. */
+	original: "original",
+	/** Ratio 3:1 */
+	panoramic: "panoramic",
+	/** Ratio 16:9 */
+	wide: "wide",
+	/** Ratio 3:2 */
+	horizontal: "horizontal",
+	/** Ratio 3:2 */
+	vertical: "vertical",
+	/** Ratio 1:1 */
+	square: "square",
+	/** Ratio constrained by the parent. */
+	free: "free"
+};
+/**
+* Semantic info about the purpose of the component
+*/
+var Kind = {
+	info: "info",
+	success: "success",
+	warning: "warning",
+	error: "error"
+};
+/**
+* See SCSS variable $lumx-color-palette
+*/
+var ColorPalette = {
+	primary: "primary",
+	secondary: "secondary",
+	blue: "blue",
+	dark: "dark",
+	green: "green",
+	yellow: "yellow",
+	red: "red",
+	light: "light",
+	grey: "grey"
+};
+/**
+* See SCSS variable $lumx-color-variants
+*/
+var ColorVariant = {
+	D1: "D1",
+	D2: "D2",
+	L1: "L1",
+	L2: "L2",
+	L3: "L3",
+	L4: "L4",
+	L5: "L5",
+	L6: "L6",
+	N: "N"
+};
+Size.xxs, Size.xs, Size.s, Size.m, Size.l, Size.xl, Size.xxl;
+//#endregion
+export { Alignment, AspectRatio, ColorPalette, ColorVariant, Emphasis, Kind, Orientation, Size, Theme, Typography };

package/_internal/packages/lumx-core/src/js/constants/index.d.ts

@@ -0,0 +1 @@
+import { Alignment, AspectRatio, ColorPalette, ColorVariant, ColorWithVariants, Emphasis, GlobalSize, HorizontalAlignment, Kind, Orientation, Size, Theme, Typography, TypographyCustom, TypographyInterface, VerticalAlignment, WhiteSpace } from "./enums/index.js";

package/_internal/packages/lumx-core/src/js/types/AriaAttributes.d.ts

@@ -0,0 +1,32 @@
+//#region ../lumx-core/src/js/types/AriaAttributes.d.ts
+/**
+ * ARIA attributes type for components.
+ * All attributes are optional.
+ *
+ * This is a custom interface containing only the ARIA attributes
+ * actually used in the @lumx/core components, avoiding dependency on React types.
+ */
+interface AriaAttributes {
+  /** Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed. */
+  'aria-expanded'?: boolean | 'true' | 'false';
+  /** Indicates the availability and type of interactive popup element that can be triggered by the element. */
+  'aria-haspopup'?: boolean | 'false' | 'true' | 'menu' | 'listbox' | 'tree' | 'grid' | 'dialog';
+  /** Indicates the current "pressed" state of toggle buttons. */
+  'aria-pressed'?: boolean | 'false' | 'mixed' | 'true';
+  /** Defines a string value that labels the current element. */
+  'aria-label'?: string;
+  /** Identifies the element (or elements) that labels the current element. */
+  'aria-labelledby'?: string;
+  /** Identifies the element (or elements) that describes the object. */
+  'aria-describedby'?: string;
+  /** Indicates whether the element is exposed to an accessibility API. */
+  'aria-hidden'?: boolean | 'true' | 'false';
+  /** Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable. */
+  'aria-disabled'?: boolean | 'true' | 'false';
+  /** Indicates the current "checked" state of checkboxes, radio buttons, and other widgets. */
+  'aria-checked'?: boolean | 'false' | 'mixed' | 'true';
+  /** Indicates whether items in a table or grid are sorted in ascending or descending order. */
+  'aria-sort'?: 'none' | 'ascending' | 'descending' | 'other';
+}
+//#endregion
+export { AriaAttributes };

package/_internal/packages/lumx-core/src/js/types/Booleanish.d.ts

@@ -0,0 +1,4 @@
+//#region ../lumx-core/src/js/types/Booleanish.d.ts
+type Booleanish = boolean | 'true' | 'false';
+//#endregion
+export { Booleanish };

package/_internal/packages/lumx-core/src/js/types/CommonRef.d.ts

@@ -0,0 +1,4 @@
+//#region ../lumx-core/src/js/types/CommonRef.d.ts
+type CommonRef = any;
+//#endregion
+export { CommonRef };

package/_internal/packages/lumx-core/src/js/types/GenericProps.d.ts

@@ -0,0 +1,14 @@
+import { HasClassName } from "./HasClassName.js";
+
+//#region ../lumx-core/src/js/types/GenericProps.d.ts
+/**
+ * Define a generic props types.
+ */
+interface GenericProps extends HasClassName {
+  /**
+   * Any prop (particularly any supported prop for a HTML element).
+   */
+  [propName: string]: any;
+}
+//#endregion
+export { GenericProps };

package/_internal/packages/lumx-core/src/js/types/HasAriaDisabled.d.ts

@@ -0,0 +1,9 @@
+import { Booleanish } from "./Booleanish.js";
+
+//#region ../lumx-core/src/js/types/HasAriaDisabled.d.ts
+interface HasAriaDisabled {
+  /** Similar to `disabled` but does not block pointer events or focus */
+  'aria-disabled'?: Booleanish;
+}
+//#endregion
+export { HasAriaDisabled };

package/_internal/packages/lumx-core/src/js/types/HasAriaLabelOrLabelledBy.d.ts

@@ -0,0 +1,19 @@
+//#region ../lumx-core/src/js/types/HasAriaLabelOrLabelledBy.d.ts
+/**
+ * Require either `aria-label` or `arial-labelledby` prop.
+ * If none are set, the order will prioritize `aria-labelledby` over `aria-label` as it
+ * needs a visible element.
+ */
+type HasAriaLabelOrLabelledBy<T = string | undefined> = T extends string ? {
+  /**
+   * The id of the element to use as title of the dialog. Can be within or out of the dialog.
+   * Although it is not recommended, aria-label can be used instead if no visible element is available.
+   */
+  'aria-labelledby': T; /** The label of the dialog. */
+  'aria-label'?: undefined;
+} : {
+  'aria-label': string;
+  'aria-labelledby'?: undefined;
+};
+//#endregion
+export { HasAriaLabelOrLabelledBy };

package/_internal/packages/lumx-core/src/js/types/HasChecked.d.ts

@@ -0,0 +1,9 @@
+//#region ../lumx-core/src/js/types/HasChecked.d.ts
+interface HasChecked<C = boolean> {
+  /** Component checked state. */
+  isChecked?: C;
+  /** @alias isChecked */
+  checked?: boolean;
+}
+//#endregion
+export { HasChecked };

package/_internal/packages/lumx-core/src/js/types/HasClassName.d.ts

@@ -0,0 +1,9 @@
+//#region ../lumx-core/src/js/types/HasClassName.d.ts
+interface HasClassName {
+  /**
+   * Class name forwarded to the root element of the component.
+   */
+  className?: string;
+}
+//#endregion
+export { HasClassName };

package/_internal/packages/lumx-core/src/js/types/HasCloseMode.d.ts

@@ -0,0 +1,10 @@
+//#region ../lumx-core/src/js/types/HasCloseMode.d.ts
+interface HasCloseMode {
+  /**
+   * Choose how the children are hidden when closed
+   * ('hide' keeps the children in DOM but hide them, 'unmount' remove the children from the DOM).
+   */
+  closeMode?: 'hide' | 'unmount';
+}
+//#endregion
+export { HasCloseMode };

package/_internal/packages/lumx-core/src/js/types/HasDisabled.d.ts

@@ -0,0 +1,9 @@
+//#region ../lumx-core/src/js/types/HasDisabled.d.ts
+interface HasDisabled {
+  /** Whether the component is disabled or not. */
+  isDisabled?: boolean;
+  /** @alias isDisabled */
+  disabled?: boolean;
+}
+//#endregion
+export { HasDisabled };

package/_internal/packages/lumx-core/src/js/types/HasPolymorphicAs.d.ts

@@ -0,0 +1,12 @@
+import { ElementType } from "./JSXElement.js";
+import React from "react";
+
+//#region ../lumx-core/src/js/types/HasPolymorphicAs.d.ts
+type HasPolymorphicAs<E extends ElementType> = React.ComponentPropsWithoutRef<E> & {
+  /**
+   * Customize the rendered component.
+   */
+  as?: E;
+};
+//#endregion
+export { HasPolymorphicAs };

package/_internal/packages/lumx-core/src/js/types/HasRequiredLinkHref.d.ts

@@ -0,0 +1,6 @@
+//#region ../lumx-core/src/js/types/HasRequiredLinkHref.d.ts
+type HasRequiredLinkHref<E> = E extends 'a' ? {
+  href: string;
+} : Record<string, unknown>;
+//#endregion
+export { HasRequiredLinkHref };

package/_internal/packages/lumx-core/src/js/types/HasTheme.d.ts

@@ -0,0 +1,10 @@
+import { Theme } from "../constants/enums/index.js";
+//#region ../lumx-core/src/js/types/HasTheme.d.ts
+interface HasTheme {
+  /**
+   * Theme adapting the component to light or dark background.
+   */
+  theme?: Theme;
+}
+//#endregion
+export { HasTheme };

package/_internal/packages/lumx-core/src/js/types/HeadingElement.d.ts

@@ -0,0 +1,5 @@
+//#region ../lumx-core/src/js/types/HeadingElement.d.ts
+/** Union type of all heading elements */
+type HeadingElement = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
+//#endregion
+export { HeadingElement };

package/_internal/packages/lumx-core/src/js/types/JSXElement.d.ts

@@ -0,0 +1,13 @@
+import React from "react";
+
+//#region ../lumx-core/src/js/types/JSXElement.d.ts
+/**
+ * Framework-agnostic type for renderable content.
+ * Vue components should cast VNode[] from slots to this type.
+ *
+ * Note: Uses type-only import to avoid runtime dependencies.
+ */
+type JSXElement = React.ReactNode;
+type ElementType = React.ElementType;
+//#endregion
+export { ElementType, JSXElement };

package/_internal/packages/lumx-core/src/js/types/Selector.d.ts

@@ -0,0 +1,11 @@
+//#region ../lumx-core/src/js/types/Selector.d.ts
+type FunctionSelector<TObject, TValue> = (o: TObject) => TValue;
+type FieldSelector<TObject, TValue> = keyof { [TKey in keyof TObject as TObject[TKey] extends TValue ? TKey : never]: TObject[TKey] };
+/**
+ * Value selector on an object
+ * - either via an object key
+ * - or a selector function
+ */
+type Selector<TObject, TValue = string> = FieldSelector<TObject, TValue> | FunctionSelector<TObject, TValue>;
+//#endregion
+export { Selector };

package/_internal/packages/lumx-core/src/js/types/TextElement.d.ts

@@ -0,0 +1,7 @@
+import { HeadingElement } from "./HeadingElement.js";
+
+//#region ../lumx-core/src/js/types/TextElement.d.ts
+/** Union type of all text elements */
+type TextElement = 'span' | 'p' | HeadingElement;
+//#endregion
+export { TextElement };

package/_internal/packages/lumx-core/src/js/types/ValueOf.d.ts

@@ -0,0 +1,5 @@
+//#region ../lumx-core/src/js/types/ValueOf.d.ts
+/** Get types of the values of a record. */
+type ValueOf<T extends Record<any, any>> = T[keyof T];
+//#endregion
+export { ValueOf };