@envive-ai/react-toolkit 0.2.13 → 0.2.14

package/dist/{Typography-Csg-nd_w.cjs → components/Typography/typographyVariantClasses.js}

@@ -1,9 +1,3 @@
-const require_chunk = require('./chunk-CbDLau6x.cjs');
-let react = require("react");
-react = require_chunk.__toESM(react);
-let classnames = require("classnames");
-classnames = require_chunk.__toESM(classnames);
-
 //#region src/components/Typography/typographyVariantClasses.ts
 const TypographyDomVariantMap = {
 	["h1"]: {
@@ -99,78 +93,4 @@ const getVariantPlaceholderClassNames = (classes) => Object.keys(classes).reduce
 }, {});
 
 //#endregion
-//#region src/components/Typography/util.ts
-const getElementTypeFromVariant = (variant, isHeadline) => {
-	if (isHeadline) return (TypographyDomVariantMap[variant] ? variant : null) || "h3";
-	return "span";
-};
-
-//#endregion
-//#region src/components/Typography/Typography.tsx
-const Typography = ({ children, className, style, noOfLines, testId, elementType, variant = "body3", id }) => {
-	const variantClassNames = variant ? TypographyVariantMap[variant] : {};
-	const isHeadline = (0, react.useCallback)(() => [
-		"t1",
-		"t2",
-		"t3",
-		"h1",
-		"h2",
-		"h3",
-		"h4"
-	].includes(variant), [variant]);
-	const renderedElementType = (0, react.useMemo)(() => {
-		if (elementType) return elementType;
-		if (!elementType) {
-			if (isHeadline()) return getElementTypeFromVariant(variant, isHeadline());
-		}
-		return "span";
-	}, [
-		isHeadline,
-		variant,
-		elementType
-	]);
-	const textClassNames = (0, classnames.default)(className, variantClassNames, {
-		"spiffy-tw-font-[Poppins,sans-serif]": isHeadline(),
-		"spiffy-tw-font-[\"Inter Variable,sans-serif\"]": !isHeadline(),
-		"spiffy-tw-line-clamp-1": noOfLines === 1,
-		"spiffy-tw-line-clamp-2": noOfLines === 2,
-		"spiffy-tw-line-clamp-3": noOfLines === 3,
-		"spiffy-tw-line-clamp-4": noOfLines === 4,
-		"spiffy-tw-line-clamp-5": noOfLines === 5,
-		"spiffy-tw-line-clamp-6": noOfLines === 6,
-		"spiffy-tw-line-clamp-7": noOfLines === 7
-	});
-	const renderElement = (elementTypeToRender) => react.default.createElement(elementTypeToRender, {
-		"data-testid": testId,
-		className: textClassNames,
-		style,
-		id
-	}, children);
-	return renderElement(renderedElementType);
-};
-
-//#endregion
-Object.defineProperty(exports, 'Typography', {
-  enumerable: true,
-  get: function () {
-    return Typography;
-  }
-});
-Object.defineProperty(exports, 'TypographyDomVariantMap', {
-  enumerable: true,
-  get: function () {
-    return TypographyDomVariantMap;
-  }
-});
-Object.defineProperty(exports, 'TypographyVariantMap', {
-  enumerable: true,
-  get: function () {
-    return TypographyVariantMap;
-  }
-});
-Object.defineProperty(exports, 'getVariantPlaceholderClassNames', {
-  enumerable: true,
-  get: function () {
-    return getVariantPlaceholderClassNames;
-  }
-});
+export { TypographyDomVariantMap, TypographyVariantMap, getVariantPlaceholderClassNames };

package/dist/components/Typography/util.cjs

@@ -0,0 +1,10 @@
+const require_typographyVariantClasses = require('./typographyVariantClasses.cjs');
+
+//#region src/components/Typography/util.ts
+const getElementTypeFromVariant = (variant, isHeadline) => {
+	if (isHeadline) return (require_typographyVariantClasses.TypographyDomVariantMap[variant] ? variant : null) || "h3";
+	return "span";
+};
+
+//#endregion
+exports.getElementTypeFromVariant = getElementTypeFromVariant;

package/dist/components/Typography/util.js

@@ -0,0 +1,10 @@
+import { TypographyDomVariantMap } from "./typographyVariantClasses.js";
+
+//#region src/components/Typography/util.ts
+const getElementTypeFromVariant = (variant, isHeadline) => {
+	if (isHeadline) return (TypographyDomVariantMap[variant] ? variant : null) || "h3";
+	return "span";
+};
+
+//#endregion
+export { getElementTypeFromVariant };

package/dist/logging/logger.cjs

@@ -0,0 +1,20 @@
+
+//#region src/logging/logger.ts
+var Logger = class {
+	static logInfo(message, ...args) {
+		console.info(`INFO: ${message}`, ...args);
+	}
+	static logDebug(message, ...args) {
+		console.debug(`DEBUG: ${message}`, ...args);
+	}
+	static logError(message, error, ...args) {
+		console.error(`ERROR: ${message} error=${error}`, args);
+	}
+	static logWarn(message, error, ...args) {
+		console.warn(`WARN: ${message} error=${error}`, args);
+	}
+};
+var logger_default = Logger;
+
+//#endregion
+exports.default = logger_default;

package/dist/logging/logger.js

@@ -0,0 +1,19 @@
+//#region src/logging/logger.ts
+var Logger = class {
+	static logInfo(message, ...args) {
+		console.info(`INFO: ${message}`, ...args);
+	}
+	static logDebug(message, ...args) {
+		console.debug(`DEBUG: ${message}`, ...args);
+	}
+	static logError(message, error, ...args) {
+		console.error(`ERROR: ${message} error=${error}`, args);
+	}
+	static logWarn(message, error, ...args) {
+		console.warn(`WARN: ${message} error=${error}`, args);
+	}
+};
+var logger_default = Logger;
+
+//#endregion
+export { logger_default as default };

package/dist/{colorsConfig-D-MZuBvt.cjs → models/colorsConfig.cjs}

@@ -24,15 +24,5 @@ var ColorNames = /* @__PURE__ */ function(ColorNames$1) {
 const colorVar = (color) => `var(--spiffy-colors-${color})`;
 
 //#endregion
-Object.defineProperty(exports, 'ColorNames', {
-  enumerable: true,
-  get: function () {
-    return ColorNames;
-  }
-});
-Object.defineProperty(exports, 'colorVar', {
-  enumerable: true,
-  get: function () {
-    return colorVar;
-  }
-});
+exports.ColorNames = ColorNames;
+exports.colorVar = colorVar;

package/dist/{colorsConfig-BjdoRtRK.js → models/colorsConfig.js}

@@ -23,4 +23,4 @@ var ColorNames = /* @__PURE__ */ function(ColorNames$1) {
 const colorVar = (color) => `var(--spiffy-colors-${color})`;
 
 //#endregion
-export { colorVar as n, ColorNames as t };
+export { ColorNames, colorVar };

package/dist/util/camelCase.d.cts

@@ -0,0 +1,69 @@
+import { SplitWords } from "./splitWords.cjs";
+
+//#region src/util/camelCase.d.ts
+
+/**
+ * CamelCase options.
+ *
+ * @see {@link CamelCase}
+ */
+type CamelCaseOptions = {
+  /**
+   * Whether to preserved consecutive uppercase letter.
+   *
+   * @default true
+   */
+  preserveConsecutiveUppercase?: boolean;
+};
+/**
+ * Convert an array of words to camel-case.
+ */
+type CamelCaseFromArray<Words extends string[], Options extends CamelCaseOptions, OutputString extends string = ''> = Words extends [infer FirstWord extends string, ...infer RemainingWords extends string[]] ? Options['preserveConsecutiveUppercase'] extends true ? `${Capitalize<FirstWord>}${CamelCaseFromArray<RemainingWords, Options>}` : `${Capitalize<Lowercase<FirstWord>>}${CamelCaseFromArray<RemainingWords, Options>}` : OutputString;
+/**
+ * Convert a string literal to camel-case.
+ *
+ * This can be useful when, for example, converting some kebab-cased command-line flags or a snake-cased database result.
+ *
+ * By default, consecutive uppercase letter are preserved. See {@link CamelCaseOptions.preserveConsecutiveUppercase preserveConsecutiveUppercase} option to change this behaviour.
+ *
+ * @example
+ * ```
+ * import type {CamelCase} from 'type-fest';
+ *
+ * // Simple
+ *
+ * const someVariable: CamelCase<'foo-bar'> = 'fooBar';
+ *
+ * // Advanced
+ *
+ * type CamelCasedProperties<T> = {
+ * 	[K in keyof T as CamelCase<K>]: T[K]
+ * };
+ *
+ * interface RawOptions {
+ * 	'dry-run': boolean;
+ * 	'full_family_name': string;
+ * 	foo: number;
+ * 	BAR: string;
+ * 	QUZ_QUX: number;
+ * 	'OTHER-FIELD': boolean;
+ * }
+ *
+ * const dbResult: CamelCasedProperties<RawOptions> = {
+ * 	dryRun: true,
+ * 	fullFamilyName: 'bar.js',
+ * 	foo: 123,
+ * 	bar: 'foo',
+ * 	quzQux: 6,
+ * 	otherField: false
+ * };
+ * ```
+ *
+ * @category Change case
+ * @category Template literal
+ */
+type CamelCase<Type, Options extends CamelCaseOptions = {
+  preserveConsecutiveUppercase: true;
+}> = Type extends string ? string extends Type ? Type : Uncapitalize<CamelCaseFromArray<SplitWords<Type extends Uppercase<Type> ? Lowercase<Type> : Type>, Options>> : Type;
+//#endregion
+export { CamelCase, CamelCaseOptions };

package/dist/util/camelCase.d.ts

@@ -0,0 +1,69 @@
+import { SplitWords } from "./splitWords.js";
+
+//#region src/util/camelCase.d.ts
+
+/**
+ * CamelCase options.
+ *
+ * @see {@link CamelCase}
+ */
+type CamelCaseOptions = {
+  /**
+   * Whether to preserved consecutive uppercase letter.
+   *
+   * @default true
+   */
+  preserveConsecutiveUppercase?: boolean;
+};
+/**
+ * Convert an array of words to camel-case.
+ */
+type CamelCaseFromArray<Words extends string[], Options extends CamelCaseOptions, OutputString extends string = ''> = Words extends [infer FirstWord extends string, ...infer RemainingWords extends string[]] ? Options['preserveConsecutiveUppercase'] extends true ? `${Capitalize<FirstWord>}${CamelCaseFromArray<RemainingWords, Options>}` : `${Capitalize<Lowercase<FirstWord>>}${CamelCaseFromArray<RemainingWords, Options>}` : OutputString;
+/**
+ * Convert a string literal to camel-case.
+ *
+ * This can be useful when, for example, converting some kebab-cased command-line flags or a snake-cased database result.
+ *
+ * By default, consecutive uppercase letter are preserved. See {@link CamelCaseOptions.preserveConsecutiveUppercase preserveConsecutiveUppercase} option to change this behaviour.
+ *
+ * @example
+ * ```
+ * import type {CamelCase} from 'type-fest';
+ *
+ * // Simple
+ *
+ * const someVariable: CamelCase<'foo-bar'> = 'fooBar';
+ *
+ * // Advanced
+ *
+ * type CamelCasedProperties<T> = {
+ * 	[K in keyof T as CamelCase<K>]: T[K]
+ * };
+ *
+ * interface RawOptions {
+ * 	'dry-run': boolean;
+ * 	'full_family_name': string;
+ * 	foo: number;
+ * 	BAR: string;
+ * 	QUZ_QUX: number;
+ * 	'OTHER-FIELD': boolean;
+ * }
+ *
+ * const dbResult: CamelCasedProperties<RawOptions> = {
+ * 	dryRun: true,
+ * 	fullFamilyName: 'bar.js',
+ * 	foo: 123,
+ * 	bar: 'foo',
+ * 	quzQux: 6,
+ * 	otherField: false
+ * };
+ * ```
+ *
+ * @category Change case
+ * @category Template literal
+ */
+type CamelCase<Type, Options extends CamelCaseOptions = {
+  preserveConsecutiveUppercase: true;
+}> = Type extends string ? string extends Type ? Type : Uncapitalize<CamelCaseFromArray<SplitWords<Type extends Uppercase<Type> ? Lowercase<Type> : Type>, Options>> : Type;
+//#endregion
+export { CamelCase, CamelCaseOptions };

package/dist/util/camelCasedPropertiesDeep.d.cts

@@ -0,0 +1,55 @@
+import { CamelCase, CamelCaseOptions } from "./camelCase.cjs";
+import { UnknownArray } from "./unknownArray.cjs";
+
+//#region src/util/camelCasedPropertiesDeep.d.ts
+
+/**
+ * Convert object properties to camel case recursively.
+ *
+ * This can be useful when, for example, converting some API types from a different style.
+ *
+ * @see CamelCasedProperties
+ * @see CamelCase
+ *
+ * @example
+ * ```
+ * import type {CamelCasedPropertiesDeep} from 'type-fest';
+ *
+ * interface User {
+ * 	UserId: number;
+ * 	UserName: string;
+ * }
+ *
+ * interface UserWithFriends {
+ * 	UserInfo: User;
+ * 	UserFriends: User[];
+ * }
+ *
+ * const result: CamelCasedPropertiesDeep<UserWithFriends> = {
+ * 	userInfo: {
+ * 		userId: 1,
+ * 		userName: 'Tom',
+ * 	},
+ * 	userFriends: [
+ * 		{
+ * 			userId: 2,
+ * 			userName: 'Jerry',
+ * 		},
+ * 		{
+ * 			userId: 3,
+ * 			userName: 'Spike',
+ * 		},
+ * 	],
+ * };
+ * ```
+ *
+ * @category Change case
+ * @category Template literal
+ * @category Object
+ */
+type CamelCasedPropertiesDeep<Value, Options extends CamelCaseOptions = {
+  preserveConsecutiveUppercase: true;
+}> = Value extends Function ? Value : Value extends UnknownArray ? CamelCasedPropertiesArrayDeep<Value> : Value extends Set<infer U> ? Set<CamelCasedPropertiesDeep<U, Options>> : { [K in keyof Value as CamelCase<K, Options>]: CamelCasedPropertiesDeep<Value[K], Options> };
+type CamelCasedPropertiesArrayDeep<Value extends UnknownArray> = Value extends [] ? [] : Value extends [infer U, ...infer V] ? [CamelCasedPropertiesDeep<U>, ...CamelCasedPropertiesDeep<V>] : Value extends readonly [infer U, ...infer V] ? readonly [CamelCasedPropertiesDeep<U>, ...CamelCasedPropertiesDeep<V>] : Value extends readonly [...infer U, infer V] ? [...CamelCasedPropertiesDeep<U>, CamelCasedPropertiesDeep<V>] : Value extends readonly [...infer U, infer V] ? readonly [...CamelCasedPropertiesDeep<U>, CamelCasedPropertiesDeep<V>] : Value extends Array<infer U> ? Array<CamelCasedPropertiesDeep<U>> : Value extends ReadonlyArray<infer U> ? ReadonlyArray<CamelCasedPropertiesDeep<U>> : never;
+//#endregion
+export { CamelCasedPropertiesDeep };

package/dist/util/camelCasedPropertiesDeep.d.ts

@@ -0,0 +1,55 @@
+import { CamelCase, CamelCaseOptions } from "./camelCase.js";
+import { UnknownArray } from "./unknownArray.js";
+
+//#region src/util/camelCasedPropertiesDeep.d.ts
+
+/**
+ * Convert object properties to camel case recursively.
+ *
+ * This can be useful when, for example, converting some API types from a different style.
+ *
+ * @see CamelCasedProperties
+ * @see CamelCase
+ *
+ * @example
+ * ```
+ * import type {CamelCasedPropertiesDeep} from 'type-fest';
+ *
+ * interface User {
+ * 	UserId: number;
+ * 	UserName: string;
+ * }
+ *
+ * interface UserWithFriends {
+ * 	UserInfo: User;
+ * 	UserFriends: User[];
+ * }
+ *
+ * const result: CamelCasedPropertiesDeep<UserWithFriends> = {
+ * 	userInfo: {
+ * 		userId: 1,
+ * 		userName: 'Tom',
+ * 	},
+ * 	userFriends: [
+ * 		{
+ * 			userId: 2,
+ * 			userName: 'Jerry',
+ * 		},
+ * 		{
+ * 			userId: 3,
+ * 			userName: 'Spike',
+ * 		},
+ * 	],
+ * };
+ * ```
+ *
+ * @category Change case
+ * @category Template literal
+ * @category Object
+ */
+type CamelCasedPropertiesDeep<Value, Options extends CamelCaseOptions = {
+  preserveConsecutiveUppercase: true;
+}> = Value extends Function ? Value : Value extends UnknownArray ? CamelCasedPropertiesArrayDeep<Value> : Value extends Set<infer U> ? Set<CamelCasedPropertiesDeep<U, Options>> : { [K in keyof Value as CamelCase<K, Options>]: CamelCasedPropertiesDeep<Value[K], Options> };
+type CamelCasedPropertiesArrayDeep<Value extends UnknownArray> = Value extends [] ? [] : Value extends [infer U, ...infer V] ? [CamelCasedPropertiesDeep<U>, ...CamelCasedPropertiesDeep<V>] : Value extends readonly [infer U, ...infer V] ? readonly [CamelCasedPropertiesDeep<U>, ...CamelCasedPropertiesDeep<V>] : Value extends readonly [...infer U, infer V] ? [...CamelCasedPropertiesDeep<U>, CamelCasedPropertiesDeep<V>] : Value extends readonly [...infer U, infer V] ? readonly [...CamelCasedPropertiesDeep<U>, CamelCasedPropertiesDeep<V>] : Value extends Array<infer U> ? Array<CamelCasedPropertiesDeep<U>> : Value extends ReadonlyArray<infer U> ? ReadonlyArray<CamelCasedPropertiesDeep<U>> : never;
+//#endregion
+export { CamelCasedPropertiesDeep };

package/dist/util/colorVar.cjs

@@ -0,0 +1,6 @@
+
+//#region src/util/colorVar.ts
+const colorVar = (color) => `var(--spiffy-colors-${color})`;
+
+//#endregion
+exports.colorVar = colorVar;

package/dist/util/colorVar.d.cts

@@ -0,0 +1,6 @@
+import { ColorNames } from "@envive-ai/react-hooks/contexts/types";
+
+//#region src/util/colorVar.d.ts
+declare const colorVar: (color: ColorNames) => string;
+//#endregion
+export { colorVar };

package/dist/util/colorVar.d.ts

@@ -0,0 +1,6 @@
+import { ColorNames } from "@envive-ai/react-hooks/contexts/types";
+
+//#region src/util/colorVar.d.ts
+declare const colorVar: (color: ColorNames) => string;
+//#endregion
+export { colorVar };

package/dist/util/colorVar.js

@@ -0,0 +1,5 @@
+//#region src/util/colorVar.ts
+const colorVar = (color) => `var(--spiffy-colors-${color})`;
+
+//#endregion
+export { colorVar };

package/dist/{formatPrice-CyfkjZ3R.cjs → util/formatPrice.cjs}

@@ -11,9 +11,4 @@ const formatPrice = (price, currency = "$") => {
 };
 
 //#endregion
-Object.defineProperty(exports, 'formatPrice', {
-  enumerable: true,
-  get: function () {
-    return formatPrice;
-  }
-});
+exports.formatPrice = formatPrice;

package/dist/util/formatPrice.d.cts

@@ -0,0 +1,4 @@
+//#region src/util/formatPrice.d.ts
+declare const formatPrice: (price?: number, currency?: string) => string;
+//#endregion
+export { formatPrice };

package/dist/util/formatPrice.d.ts

@@ -0,0 +1,4 @@
+//#region src/util/formatPrice.d.ts
+declare const formatPrice: (price?: number, currency?: string) => string;
+//#endregion
+export { formatPrice };

package/dist/{formatPrice-DexQu2aZ.js → util/formatPrice.js}

@@ -10,4 +10,4 @@ const formatPrice = (price, currency = "$") => {
 };
 
 //#endregion
-export { formatPrice as t };
+export { formatPrice };

package/dist/util/index.cjs

@@ -1,80 +1,9 @@
-const require_chunk = require('../chunk-CbDLau6x.cjs');
-const require_formatPrice = require('../formatPrice-CyfkjZ3R.cjs');
-let react = require("react");
+const require_formatPrice = require('./formatPrice.cjs');
+const require_useScrollDirection = require('./useScrollDirection.cjs');
+const require_useStickyVisibility = require('./useStickyVisibility.cjs');
+const require_colorVar = require('./colorVar.cjs');
 
-//#region src/util/useScrollDirection.ts
-const useScrollDirection = (scrollContainerRef) => {
-	const [scrollDirection, setScrollDirection] = (0, react.useState)(null);
-	const touchStartY = (0, react.useRef)(0);
-	(0, react.useEffect)(() => {
-		const container = scrollContainerRef?.current || window;
-		const touchTarget = scrollContainerRef?.current || document;
-		const handleWheel = (e) => {
-			if (e.deltaY > 0) setScrollDirection("down");
-			else setScrollDirection("up");
-		};
-		const handleTouchStart = (e) => {
-			touchStartY.current = e.touches[0].clientY;
-		};
-		const handleTouchMove = (e) => {
-			const currentTouchY = e.touches[0].clientY;
-			const deltaY = touchStartY.current - currentTouchY;
-			if (Math.abs(deltaY) < 10) return;
-			if (deltaY > 0) setScrollDirection("down");
-			else setScrollDirection("up");
-			touchStartY.current = currentTouchY;
-		};
-		container.addEventListener("wheel", handleWheel, { passive: true });
-		touchTarget.addEventListener("touchstart", handleTouchStart, { passive: true });
-		touchTarget.addEventListener("touchmove", handleTouchMove, { passive: true });
-		return () => {
-			container.removeEventListener("wheel", handleWheel);
-			touchTarget.removeEventListener("touchstart", handleTouchStart);
-			touchTarget.removeEventListener("touchmove", handleTouchMove);
-		};
-	}, [scrollContainerRef]);
-	return scrollDirection;
-};
-
-//#endregion
-//#region src/util/useStickyVisibility.ts
-const useStickyVisibility = () => {
-	const [isVisible, setIsVisible] = (0, react.useState)(true);
-	const toolbarRef = (0, react.useRef)(null);
-	const [toolbarHeight, setToolbarHeight] = (0, react.useState)(0);
-	const [scrollY, setScrollY] = (0, react.useState)(0);
-	const scrollDirection = useScrollDirection();
-	(0, react.useEffect)(() => {
-		const handleScroll = () => {
-			setScrollY(window.scrollY);
-		};
-		window.addEventListener("scroll", handleScroll, { passive: true });
-		return () => window.removeEventListener("scroll", handleScroll);
-	}, []);
-	(0, react.useEffect)(() => {
-		if (toolbarRef.current) setToolbarHeight(toolbarRef.current.offsetHeight);
-	}, []);
-	(0, react.useEffect)(() => {
-		if (scrollDirection === "down" && scrollY > toolbarHeight && toolbarHeight > 0) setIsVisible(false);
-		else setIsVisible(true);
-	}, [
-		scrollDirection,
-		toolbarHeight,
-		scrollY
-	]);
-	return {
-		toolbarRef,
-		isVisible,
-		toolbarHeight
-	};
-};
-
-//#endregion
-//#region src/util/colorVar.ts
-const colorVar = (color) => `var(--spiffy-colors-${color})`;
-
-//#endregion
-exports.colorVar = colorVar;
+exports.colorVar = require_colorVar.colorVar;
 exports.formatPrice = require_formatPrice.formatPrice;
-exports.useScrollDirection = useScrollDirection;
-exports.useStickyVisibility = useStickyVisibility;
+exports.useScrollDirection = require_useScrollDirection.useScrollDirection;
+exports.useStickyVisibility = require_useStickyVisibility.useStickyVisibility;

package/dist/util/index.d.cts

@@ -0,0 +1,5 @@
+import { formatPrice } from "./formatPrice.cjs";
+import { ScrollDirection, useScrollDirection } from "./useScrollDirection.cjs";
+import { useStickyVisibility } from "./useStickyVisibility.cjs";
+import { colorVar } from "./colorVar.cjs";
+export { ScrollDirection, colorVar, formatPrice, useScrollDirection, useStickyVisibility };

package/dist/util/index.d.ts

@@ -0,0 +1,5 @@
+import { formatPrice } from "./formatPrice.js";
+import { ScrollDirection, useScrollDirection } from "./useScrollDirection.js";
+import { useStickyVisibility } from "./useStickyVisibility.js";
+import { colorVar } from "./colorVar.js";
+export { ScrollDirection, colorVar, formatPrice, useScrollDirection, useStickyVisibility };

package/dist/util/index.js

@@ -1,76 +1,6 @@
-import { t as formatPrice } from "../formatPrice-DexQu2aZ.js";
-import { useEffect, useRef, useState } from "react";
+import { formatPrice } from "./formatPrice.js";
+import { useScrollDirection } from "./useScrollDirection.js";
+import { useStickyVisibility } from "./useStickyVisibility.js";
+import { colorVar } from "./colorVar.js";
 
-//#region src/util/useScrollDirection.ts
-const useScrollDirection = (scrollContainerRef) => {
-	const [scrollDirection, setScrollDirection] = useState(null);
-	const touchStartY = useRef(0);
-	useEffect(() => {
-		const container = scrollContainerRef?.current || window;
-		const touchTarget = scrollContainerRef?.current || document;
-		const handleWheel = (e) => {
-			if (e.deltaY > 0) setScrollDirection("down");
-			else setScrollDirection("up");
-		};
-		const handleTouchStart = (e) => {
-			touchStartY.current = e.touches[0].clientY;
-		};
-		const handleTouchMove = (e) => {
-			const currentTouchY = e.touches[0].clientY;
-			const deltaY = touchStartY.current - currentTouchY;
-			if (Math.abs(deltaY) < 10) return;
-			if (deltaY > 0) setScrollDirection("down");
-			else setScrollDirection("up");
-			touchStartY.current = currentTouchY;
-		};
-		container.addEventListener("wheel", handleWheel, { passive: true });
-		touchTarget.addEventListener("touchstart", handleTouchStart, { passive: true });
-		touchTarget.addEventListener("touchmove", handleTouchMove, { passive: true });
-		return () => {
-			container.removeEventListener("wheel", handleWheel);
-			touchTarget.removeEventListener("touchstart", handleTouchStart);
-			touchTarget.removeEventListener("touchmove", handleTouchMove);
-		};
-	}, [scrollContainerRef]);
-	return scrollDirection;
-};
-
-//#endregion
-//#region src/util/useStickyVisibility.ts
-const useStickyVisibility = () => {
-	const [isVisible, setIsVisible] = useState(true);
-	const toolbarRef = useRef(null);
-	const [toolbarHeight, setToolbarHeight] = useState(0);
-	const [scrollY, setScrollY] = useState(0);
-	const scrollDirection = useScrollDirection();
-	useEffect(() => {
-		const handleScroll = () => {
-			setScrollY(window.scrollY);
-		};
-		window.addEventListener("scroll", handleScroll, { passive: true });
-		return () => window.removeEventListener("scroll", handleScroll);
-	}, []);
-	useEffect(() => {
-		if (toolbarRef.current) setToolbarHeight(toolbarRef.current.offsetHeight);
-	}, []);
-	useEffect(() => {
-		if (scrollDirection === "down" && scrollY > toolbarHeight && toolbarHeight > 0) setIsVisible(false);
-		else setIsVisible(true);
-	}, [
-		scrollDirection,
-		toolbarHeight,
-		scrollY
-	]);
-	return {
-		toolbarRef,
-		isVisible,
-		toolbarHeight
-	};
-};
-
-//#endregion
-//#region src/util/colorVar.ts
-const colorVar = (color) => `var(--spiffy-colors-${color})`;
-
-//#endregion
 export { colorVar, formatPrice, useScrollDirection, useStickyVisibility };