@lumx/core 4.17.1-alpha.1 → 4.17.1-alpha.3

package/README.md

@@ -0,0 +1,19 @@
+# LumApps Design System (LumX)
+
+The framework-agnostic foundation of LumX. Provides design tokens, SCSS styles, shared TypeScript types, and component definitions consumed by `@lumx/react` and `@lumx/vue`.
+
+## What's included
+
+-   **Design tokens** — CSS custom properties (`--lumx-*`) and SCSS variables for color, typography, spacing, and more
+-   **SCSS** — BEM component styles, mixins, and base styles (typography, elevation, etc.)
+-   **TypeScript types** — Shared interfaces (`GenericProps`, `HasTheme`, `HasDisabled`, etc.)
+-   **Component definitions** — Framework-agnostic JSX component shapes that React/Vue wrappers consume
+-   **Utilities** — Class name helpers, focus management, portal, and more
+
+## Documentation
+
+You can find an online version of the demo and documentation site at https://design.lumapps.com.
+
+## Copyright and license
+
+Code and documentation copyright 2019 LumApps. Code released under the [MIT license](LICENSE.md).

package/_internal/_virtual/_rolldown/runtime.js

@@ -0,0 +1,13 @@
+//#region \0rolldown/runtime.js
+var __defProp = Object.defineProperty;
+var __exportAll = (all, no_symbols) => {
+	let target = {};
+	for (var name in all) __defProp(target, name, {
+		get: all[name],
+		enumerable: true
+	});
+	if (!no_symbols) __defProp(target, Symbol.toStringTag, { value: "Module" });
+	return target;
+};
+//#endregion
+export { __exportAll };

package/{js → _internal/js}/constants/browser/index.d.ts

@@ -1,12 +1,15 @@
+//#region src/js/constants/browser/index.d.ts
 /**
  * Check if we are running in a true browser (not SSR and not jsdom test environment).
  */
-export declare const IS_BROWSER: boolean;
+declare const IS_BROWSER: boolean;
 /**
  * Optional global `window` instance (not defined when running SSR).
  */
-export declare const WINDOW: (Window & typeof globalThis) | undefined;
+declare const WINDOW: (Window & typeof globalThis) | undefined;
 /**
  * Optional global `document` instance (not defined when running SSR).
  */
-export declare const DOCUMENT: Document | undefined;
+declare const DOCUMENT: Document | undefined;
+//#endregion
+export { DOCUMENT, IS_BROWSER, WINDOW };

package/_internal/js/constants/browser/index.js

@@ -0,0 +1,15 @@
+//#region 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");
+/**
+* Optional global `window` instance (not defined when running SSR).
+*/
+var WINDOW = typeof window !== "undefined" ? window : void 0;
+/**
+* Optional global `document` instance (not defined when running SSR).
+*/
+var DOCUMENT = typeof document !== "undefined" ? document : void 0;
+//#endregion
+export { DOCUMENT, IS_BROWSER, WINDOW };

package/_internal/js/constants/className/index.d.ts

@@ -0,0 +1,7 @@
+//#region src/js/constants/className/index.d.ts
+/**
+ * Visually hidden a11y utility class name
+ */
+declare const VISUALLY_HIDDEN = "visually-hidden";
+//#endregion
+export { VISUALLY_HIDDEN };

package/_internal/js/constants/className/index.js

@@ -0,0 +1,7 @@
+//#region src/js/constants/className/index.ts
+/**
+* Visually hidden a11y utility class name
+*/
+var VISUALLY_HIDDEN = "visually-hidden";
+//#endregion
+export { VISUALLY_HIDDEN };

package/{js/constants/components/index.js → _internal/js/constants/components/index.d.ts}

@@ -1,26 +1,27 @@
+//#region src/js/constants/components/index.d.ts
 /**
  * Animation duration constants. Take into consideration that if you change one of these variables,
  * you need to update their scss counterpart as well
  */
-const DIALOG_TRANSITION_DURATION = 400;
-const EXPANSION_PANEL_TRANSITION_DURATION = 400;
-const NOTIFICATION_TRANSITION_DURATION = 200;
-const SLIDESHOW_TRANSITION_DURATION = 5000;
+declare const DIALOG_TRANSITION_DURATION = 400;
+declare const EXPANSION_PANEL_TRANSITION_DURATION = 400;
+declare const NOTIFICATION_TRANSITION_DURATION = 200;
+declare const SLIDESHOW_TRANSITION_DURATION = 5000;
 /**
  * Delay on hover after which we open or close the tooltip.
  * Only applies to devices supporting pointer hover.
  */
-const TOOLTIP_HOVER_DELAY = {
-    open: 500,
-    close: 500,
+declare const TOOLTIP_HOVER_DELAY: {
+  open: number;
+  close: number;
 };
 /**
  * Delay on long press after which we open or close the tooltip.
  * Only applies to devices not supporting pointer hover.
  */
-const TOOLTIP_LONG_PRESS_DELAY = {
-    open: 250,
-    close: 3000,
+declare const TOOLTIP_LONG_PRESS_DELAY: {
+  open: number;
+  close: number;
 };
-
-export { DIALOG_TRANSITION_DURATION, EXPANSION_PANEL_TRANSITION_DURATION, NOTIFICATION_TRANSITION_DURATION, SLIDESHOW_TRANSITION_DURATION, TOOLTIP_HOVER_DELAY, TOOLTIP_LONG_PRESS_DELAY };
+//#endregion
+export { DIALOG_TRANSITION_DURATION, EXPANSION_PANEL_TRANSITION_DURATION, NOTIFICATION_TRANSITION_DURATION, SLIDESHOW_TRANSITION_DURATION, TOOLTIP_HOVER_DELAY, TOOLTIP_LONG_PRESS_DELAY };

package/_internal/js/constants/components/index.js

@@ -0,0 +1,27 @@
+//#region src/js/constants/components/index.ts
+/**
+* Animation duration constants. Take into consideration that if you change one of these variables,
+* you need to update their scss counterpart as well
+*/
+var DIALOG_TRANSITION_DURATION = 400;
+var EXPANSION_PANEL_TRANSITION_DURATION = 400;
+var NOTIFICATION_TRANSITION_DURATION = 200;
+var SLIDESHOW_TRANSITION_DURATION = 5e3;
+/**
+* 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 { DIALOG_TRANSITION_DURATION, EXPANSION_PANEL_TRANSITION_DURATION, NOTIFICATION_TRANSITION_DURATION, SLIDESHOW_TRANSITION_DURATION, TOOLTIP_HOVER_DELAY, TOOLTIP_LONG_PRESS_DELAY };

package/_internal/js/constants/enums/index.d.ts

@@ -0,0 +1,207 @@
+import { ValueOf } from "../../types/ValueOf.js";
+
+//#region 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'>;
+type AbstractSize = Extract<Size, 'tiny' | 'regular' | 'medium' | 'big' | 'huge'>;
+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 title typographies that can be customized (via CSS variables).
+ */
+declare const TypographyTitleCustom: {
+  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 TypographyTitleCustom = ValueOf<typeof TypographyTitleCustom>;
+/**
+ * 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>;
+type Color = ColorPalette | string;
+/**
+ * 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}`>;
+declare const REAL_SIZE_FOR_LUMX_SIZE: {
+  xxs: number;
+  xs: number;
+  s: number;
+  m: number;
+  l: number;
+  xl: number;
+  xxl: number;
+};
+//#endregion
+export { AbstractSize, Alignment, AspectRatio, Color, ColorPalette, ColorVariant, ColorWithVariants, Emphasis, GlobalSize, HorizontalAlignment, Kind, Orientation, REAL_SIZE_FOR_LUMX_SIZE, Size, Theme, Typography, TypographyCustom, TypographyInterface, TypographyTitleCustom, VerticalAlignment, WhiteSpace };

package/_internal/js/constants/enums/index.js

@@ -0,0 +1,165 @@
+//#region 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 title typographies that can be customized (via CSS variables).
+*/
+var TypographyTitleCustom = {
+	title1: "custom-title1",
+	title2: "custom-title2",
+	title3: "custom-title3",
+	title4: "custom-title4",
+	title5: "custom-title5",
+	title6: "custom-title6"
+};
+/**
+* List of typographies that can be customized (via CSS variables).
+*/
+var TypographyCustom = {
+	...TypographyTitleCustom,
+	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"
+};
+/**
+* All available white-space values
+* */
+var WhiteSpace = {
+	normal: "normal",
+	nowrap: "nowrap",
+	pre: "pre",
+	"pre-wrap": "pre-wrap",
+	"pre-line": "pre-line",
+	"break-spaces": "break-spaces"
+};
+/**
+* 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"
+};
+var REAL_SIZE_FOR_LUMX_SIZE = {
+	[Size.xxs]: 14,
+	[Size.xs]: 20,
+	[Size.s]: 24,
+	[Size.m]: 36,
+	[Size.l]: 64,
+	[Size.xl]: 128,
+	[Size.xxl]: 256
+};
+//#endregion
+export { Alignment, AspectRatio, ColorPalette, ColorVariant, Emphasis, Kind, Orientation, REAL_SIZE_FOR_LUMX_SIZE, Size, Theme, Typography, TypographyCustom, TypographyInterface, TypographyTitleCustom, WhiteSpace };

package/{js/constants/keycodes/index.js → _internal/js/constants/keycodes/index.d.ts}

@@ -1,38 +1,39 @@
+//#region src/js/constants/keycodes/index.d.ts
 /**
  * The down key code.
  */
-const DOWN_KEY_CODE = 40;
+declare const DOWN_KEY_CODE = 40;
 /**
  * The enter/return key code.
  */
-const ENTER_KEY_CODE = 13;
+declare const ENTER_KEY_CODE = 13;
 /**
  * The space key code.
  */
-const SPACE_KEY_CODE = 32;
+declare const SPACE_KEY_CODE = 32;
 /**
  * The escape key code.
  */
-const ESCAPE_KEY_CODE = 27;
+declare const ESCAPE_KEY_CODE = 27;
 /**
  * The left key code.
  */
-const LEFT_KEY_CODE = 37;
+declare const LEFT_KEY_CODE = 37;
 /**
  * The right key code.
  */
-const RIGHT_KEY_CODE = 39;
+declare const RIGHT_KEY_CODE = 39;
 /**
  * The tab key code.
  */
-const TAB_KEY_CODE = 9;
+declare const TAB_KEY_CODE = 9;
 /**
  * The up key code.
  */
-const UP_KEY_CODE = 38;
+declare const UP_KEY_CODE = 38;
 /**
  * The up key code.
  */
-const BACKSPACE_KEY_CODE = 8;
-
-export { BACKSPACE_KEY_CODE, DOWN_KEY_CODE, ENTER_KEY_CODE, ESCAPE_KEY_CODE, LEFT_KEY_CODE, RIGHT_KEY_CODE, SPACE_KEY_CODE, TAB_KEY_CODE, UP_KEY_CODE };
+declare const BACKSPACE_KEY_CODE = 8;
+//#endregion
+export { BACKSPACE_KEY_CODE, DOWN_KEY_CODE, ENTER_KEY_CODE, ESCAPE_KEY_CODE, LEFT_KEY_CODE, RIGHT_KEY_CODE, SPACE_KEY_CODE, TAB_KEY_CODE, UP_KEY_CODE };

package/_internal/js/constants/keycodes/index.js

@@ -0,0 +1,39 @@
+//#region src/js/constants/keycodes/index.ts
+/**
+* The down key code.
+*/
+var DOWN_KEY_CODE = 40;
+/**
+* The enter/return key code.
+*/
+var ENTER_KEY_CODE = 13;
+/**
+* The space key code.
+*/
+var SPACE_KEY_CODE = 32;
+/**
+* The escape key code.
+*/
+var ESCAPE_KEY_CODE = 27;
+/**
+* The left key code.
+*/
+var LEFT_KEY_CODE = 37;
+/**
+* The right key code.
+*/
+var RIGHT_KEY_CODE = 39;
+/**
+* The tab key code.
+*/
+var TAB_KEY_CODE = 9;
+/**
+* The up key code.
+*/
+var UP_KEY_CODE = 38;
+/**
+* The up key code.
+*/
+var BACKSPACE_KEY_CODE = 8;
+//#endregion
+export { BACKSPACE_KEY_CODE, DOWN_KEY_CODE, ENTER_KEY_CODE, ESCAPE_KEY_CODE, LEFT_KEY_CODE, RIGHT_KEY_CODE, SPACE_KEY_CODE, TAB_KEY_CODE, UP_KEY_CODE };

package/_internal/js/types/AriaAttributes.d.ts

@@ -0,0 +1,32 @@
+//#region 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/js/types/Booleanish.d.ts

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

package/_internal/js/types/Callback.d.ts

@@ -0,0 +1,7 @@
+//#region src/js/types/Callback.d.ts
+/**
+ * Callback function type alias (use for readability)
+ */
+type Callback = () => void;
+//#endregion
+export { Callback };

package/_internal/js/types/CommonRef.d.ts

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

package/_internal/js/types/Direction.d.ts

@@ -0,0 +1,4 @@
+//#region src/js/types/Direction.d.ts
+type Direction = 'top' | 'right' | 'bottom' | 'left' | 'vertical' | 'horizontal' | 'all';
+//#endregion
+export { Direction };