@mks2508/mks-ui 0.1.4 → 0.2.0

package/dist/react/primitives/AutoHeight/index.js

@@ -0,0 +1,52 @@
+'use client';
+
+import { Slot } from "../Slot/index.js";
+import { useAutoHeight } from "../../hooks/Animation/UseAutoHeight.js";
+import "../../../react";
+import { motion } from "motion/react";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/react/primitives/AutoHeight/index.tsx
+/**
+* AutoHeight primitive — animates height changes of dynamic content.
+* Uses ResizeObserver internally to track content height and Motion for animation.
+*
+* @param deps - Dependency list to trigger re-measurement
+* @param transition - Motion spring/tween transition config
+* @param asChild - Render as child element using Slot pattern
+*
+* @example
+* ```tsx
+* <AutoHeight deps={[content]}>
+*   <div>{content}</div>
+* </AutoHeight>
+* ```
+*/
+function AutoHeight({ children, deps = [], transition = {
+	type: "spring",
+	stiffness: 300,
+	damping: 30,
+	bounce: 0,
+	restDelta: .01
+}, style, animate, asChild = false, ...props }) {
+	const { ref, height } = useAutoHeight(deps);
+	return /* @__PURE__ */ jsx(asChild ? Slot : motion.div, {
+		style: {
+			overflow: "hidden",
+			...style
+		},
+		animate: {
+			height,
+			...animate
+		},
+		transition,
+		...props,
+		children: /* @__PURE__ */ jsx("div", {
+			ref,
+			children
+		})
+	});
+}
+
+//#endregion
+export { AutoHeight };

package/dist/react/primitives/CountingNumber/index.d.ts

@@ -0,0 +1,44 @@
+import * as React from '../../../react';
+import { type SpringOptions } from 'motion/react';
+import { type IUseIsInViewOptions } from '../../../react/hooks/DOM/UseIsInView';
+/** Props for the CountingNumber primitive. */
+type ICountingNumberProps = Omit<React.ComponentProps<'span'>, 'children'> & {
+    /** Target number to animate to. */
+    number: number;
+    /** Starting number (default: 0). */
+    fromNumber?: number;
+    /** Pad integer part with leading zeros. */
+    padStart?: boolean;
+    /** Decimal separator character. */
+    decimalSeparator?: string;
+    /** Number of decimal places to show. */
+    decimalPlaces?: number;
+    /** Spring transition options. */
+    transition?: SpringOptions;
+    /** Delay in ms before animation starts. */
+    delay?: number;
+    /** Start at target number instead of fromNumber. */
+    initiallyStable?: boolean;
+} & IUseIsInViewOptions;
+/**
+ * CountingNumber primitive — animates a number from one value to another
+ * using spring physics. Supports decimal places, padding, and in-view triggers.
+ *
+ * @param number - Target number to animate to
+ * @param fromNumber - Starting number (default: 0)
+ * @param transition - Spring physics options
+ * @param inView - Only animate when in viewport
+ *
+ * @example
+ * ```tsx
+ * <CountingNumber number={1234} transition={{ stiffness: 90, damping: 50 }} />
+ * ```
+ *
+ * @example
+ * ```tsx
+ * <CountingNumber number={99.99} decimalPlaces={2} decimalSeparator="," inView inViewOnce />
+ * ```
+ */
+declare function CountingNumber({ ref, number, fromNumber, padStart, inView, inViewMargin, inViewOnce, decimalSeparator, transition, decimalPlaces, delay, initiallyStable, ...props }: ICountingNumberProps): import("react/jsx-runtime").JSX.Element;
+export { CountingNumber, type ICountingNumberProps };
+//# sourceMappingURL=index.d.ts.map

package/dist/react/primitives/CountingNumber/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/react/primitives/CountingNumber/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAA6B,KAAK,aAAa,EAAE,MAAM,cAAc,CAAC;AAE7E,OAAO,EAEL,KAAK,mBAAmB,EACzB,MAAM,+BAA+B,CAAC;AAEvC,8CAA8C;AAC9C,KAAK,oBAAoB,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,EAAE,UAAU,CAAC,GAAG;IAC3E,mCAAmC;IACnC,MAAM,EAAE,MAAM,CAAC;IACf,oCAAoC;IACpC,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,2CAA2C;IAC3C,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,mCAAmC;IACnC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,wCAAwC;IACxC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,iCAAiC;IACjC,UAAU,CAAC,EAAE,aAAa,CAAC;IAC3B,2CAA2C;IAC3C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,oDAAoD;IACpD,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B,GAAG,mBAAmB,CAAC;AAExB;;;;;;;;;;;;;;;;;;GAkBG;AACH,iBAAS,cAAc,CAAC,EACtB,GAAG,EACH,MAAM,EACN,UAAc,EACd,QAAgB,EAChB,MAAc,EACd,YAAoB,EACpB,UAAiB,EACjB,gBAAsB,EACtB,UAA2C,EAC3C,aAAiB,EACjB,KAAS,EACT,eAAuB,EACvB,GAAG,KAAK,EACT,EAAE,oBAAoB,2CAiFtB;AAED,OAAO,EAAE,cAAc,EAAE,KAAK,oBAAoB,EAAE,CAAC"}

package/dist/react/primitives/CountingNumber/index.js

@@ -0,0 +1,97 @@
+'use client';
+
+import { useIsInView } from "../../hooks/DOM/UseIsInView.js";
+import * as React from "../../../react";
+import { useMotionValue, useSpring } from "motion/react";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/react/primitives/CountingNumber/index.tsx
+/**
+* CountingNumber primitive — animates a number from one value to another
+* using spring physics. Supports decimal places, padding, and in-view triggers.
+*
+* @param number - Target number to animate to
+* @param fromNumber - Starting number (default: 0)
+* @param transition - Spring physics options
+* @param inView - Only animate when in viewport
+*
+* @example
+* ```tsx
+* <CountingNumber number={1234} transition={{ stiffness: 90, damping: 50 }} />
+* ```
+*
+* @example
+* ```tsx
+* <CountingNumber number={99.99} decimalPlaces={2} decimalSeparator="," inView inViewOnce />
+* ```
+*/
+function CountingNumber({ ref, number, fromNumber = 0, padStart = false, inView = false, inViewMargin = "0px", inViewOnce = true, decimalSeparator = ".", transition = {
+	stiffness: 90,
+	damping: 50
+}, decimalPlaces = 0, delay = 0, initiallyStable = false, ...props }) {
+	const { ref: localRef, isInView } = useIsInView(ref, {
+		inView,
+		inViewOnce,
+		inViewMargin
+	});
+	const numberStr = number.toString();
+	const decimals = typeof decimalPlaces === "number" ? decimalPlaces : numberStr.includes(".") ? numberStr.split(".")[1]?.length ?? 0 : 0;
+	const motionVal = useMotionValue(initiallyStable ? number : fromNumber);
+	const springVal = useSpring(motionVal, transition);
+	React.useEffect(() => {
+		const timeoutId = setTimeout(() => {
+			if (isInView) motionVal.set(number);
+		}, delay);
+		return () => clearTimeout(timeoutId);
+	}, [
+		isInView,
+		number,
+		motionVal,
+		delay
+	]);
+	React.useEffect(() => {
+		const unsubscribe = springVal.on("change", (latest) => {
+			if (localRef.current) {
+				let formatted = decimals > 0 ? latest.toFixed(decimals) : Math.round(latest).toString();
+				if (decimals > 0) formatted = formatted.replace(".", decimalSeparator);
+				if (padStart) {
+					const finalIntLength = Math.floor(Math.abs(number)).toString().length;
+					const [intPart, fracPart] = formatted.split(decimalSeparator);
+					const paddedInt = intPart?.padStart(finalIntLength, "0") ?? "";
+					formatted = fracPart ? `${paddedInt}${decimalSeparator}${fracPart}` : paddedInt;
+				}
+				localRef.current.textContent = formatted;
+			}
+		});
+		return () => unsubscribe();
+	}, [
+		springVal,
+		decimals,
+		padStart,
+		number,
+		decimalSeparator,
+		localRef
+	]);
+	const finalIntLength = Math.floor(Math.abs(number)).toString().length;
+	const formatValue = (val) => {
+		let out = decimals > 0 ? val.toFixed(decimals) : Math.round(val).toString();
+		if (decimals > 0) out = out.replace(".", decimalSeparator);
+		if (padStart) {
+			const [intPart, fracPart] = out.split(decimalSeparator);
+			const paddedInt = (intPart ?? "").padStart(finalIntLength, "0");
+			out = fracPart ? `${paddedInt}${decimalSeparator}${fracPart}` : paddedInt;
+		}
+		return out;
+	};
+	const zeroText = padStart ? "0".padStart(finalIntLength, "0") + (decimals > 0 ? decimalSeparator + "0".repeat(decimals) : "") : "0" + (decimals > 0 ? decimalSeparator + "0".repeat(decimals) : "");
+	const initialText = initiallyStable ? formatValue(number) : zeroText;
+	return /* @__PURE__ */ jsx("span", {
+		ref: localRef,
+		"data-slot": "counting-number",
+		...props,
+		children: initialText
+	});
+}
+
+//#endregion
+export { CountingNumber };

package/dist/react/primitives/Highlight/Highlight.types.d.ts

@@ -0,0 +1,113 @@
+import type { Transition } from 'motion/react';
+/** Mode for highlight tracking. */
+export type HighlightMode = 'children' | 'parent';
+/** Bounding rectangle offsets. */
+export type Bounds = {
+    top: number;
+    left: number;
+    width: number;
+    height: number;
+};
+/** Internal context type for Highlight state. */
+export type HighlightContextType<T extends string> = {
+    as?: keyof HTMLElementTagNameMap;
+    mode: HighlightMode;
+    activeValue: T | null;
+    setActiveValue: (value: T | null) => void;
+    setBounds: (bounds: DOMRect) => void;
+    clearBounds: () => void;
+    id: string;
+    hover: boolean;
+    click: boolean;
+    className?: string;
+    style?: React.CSSProperties;
+    activeClassName?: string;
+    setActiveClassName: (className: string) => void;
+    transition?: Transition;
+    disabled?: boolean;
+    enabled?: boolean;
+    exitDelay?: number;
+    forceUpdateBounds?: boolean;
+};
+/** Base props shared by all Highlight variants. */
+export type BaseHighlightProps<T extends React.ElementType = 'div'> = {
+    as?: T;
+    ref?: React.Ref<HTMLDivElement>;
+    mode?: HighlightMode;
+    value?: string | null;
+    defaultValue?: string | null;
+    onValueChange?: (value: string | null) => void;
+    className?: string;
+    style?: React.CSSProperties;
+    transition?: Transition;
+    hover?: boolean;
+    click?: boolean;
+    disabled?: boolean;
+    enabled?: boolean;
+    exitDelay?: number;
+};
+/** Props specific to parent mode. */
+export type ParentModeHighlightProps = {
+    boundsOffset?: Partial<Bounds>;
+    containerClassName?: string;
+    forceUpdateBounds?: boolean;
+};
+/** Controlled parent mode highlight props. */
+export type ControlledParentModeHighlightProps<T extends React.ElementType = 'div'> = BaseHighlightProps<T> & ParentModeHighlightProps & {
+    mode: 'parent';
+    controlledItems: true;
+    children: React.ReactNode;
+};
+/** Controlled children mode highlight props. */
+export type ControlledChildrenModeHighlightProps<T extends React.ElementType = 'div'> = BaseHighlightProps<T> & {
+    mode?: 'children' | undefined;
+    controlledItems: true;
+    children: React.ReactNode;
+};
+/** Uncontrolled parent mode highlight props. */
+export type UncontrolledParentModeHighlightProps<T extends React.ElementType = 'div'> = BaseHighlightProps<T> & ParentModeHighlightProps & {
+    mode: 'parent';
+    controlledItems?: false;
+    itemsClassName?: string;
+    children: React.ReactElement | React.ReactElement[];
+};
+/** Uncontrolled children mode highlight props. */
+export type UncontrolledChildrenModeHighlightProps<T extends React.ElementType = 'div'> = BaseHighlightProps<T> & {
+    mode?: 'children';
+    controlledItems?: false;
+    itemsClassName?: string;
+    children: React.ReactElement | React.ReactElement[];
+};
+/**
+ * Props for the Highlight component.
+ * Discriminated union supporting controlled/uncontrolled + children/parent modes.
+ */
+export type IHighlightProps<T extends React.ElementType = 'div'> = ControlledParentModeHighlightProps<T> | ControlledChildrenModeHighlightProps<T> | UncontrolledParentModeHighlightProps<T> | UncontrolledChildrenModeHighlightProps<T>;
+/** Extended child props used internally by HighlightItem. */
+export type ExtendedChildProps = React.ComponentProps<'div'> & {
+    id?: string;
+    ref?: React.Ref<HTMLElement>;
+    'data-active'?: string;
+    'data-value'?: string;
+    'data-disabled'?: boolean;
+    'data-highlight'?: boolean;
+    'data-slot'?: string;
+};
+/**
+ * Props for a HighlightItem within a Highlight container.
+ */
+export type IHighlightItemProps<T extends React.ElementType = 'div'> = React.ComponentProps<T> & {
+    as?: T;
+    children: React.ReactElement;
+    id?: string;
+    value?: string;
+    className?: string;
+    style?: React.CSSProperties;
+    transition?: Transition;
+    activeClassName?: string;
+    disabled?: boolean;
+    exitDelay?: number;
+    asChild?: boolean;
+    forceUpdateBounds?: boolean;
+};
+//# sourceMappingURL=Highlight.types.d.ts.map

package/dist/react/primitives/Highlight/Highlight.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Highlight.types.d.ts","sourceRoot":"","sources":["../../../../src/react/primitives/Highlight/Highlight.types.ts"],"names":[],"mappings":"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"}

package/dist/react/primitives/Highlight/index.d.ts

@@ -0,0 +1,48 @@
+import * as React from '../../../react';
+import type { HighlightContextType, IHighlightProps, IHighlightItemProps } from './Highlight.types';
+/**
+ * Hook to access the Highlight context.
+ * Must be used within a Highlight provider.
+ *
+ * @returns The current highlight context
+ */
+declare function useHighlight<T extends string>(): HighlightContextType<T>;
+/**
+ * Highlight primitive — animated background indicator that follows the active item.
+ * Supports two modes: "children" (layoutId-based per item) and "parent" (absolute positioned).
+ *
+ * This is an internal primitive used by Tabs, Menu, and similar components.
+ *
+ * @param mode - Tracking mode: 'children' or 'parent'
+ * @param hover - Activate on hover instead of click
+ * @param click - Activate on click (default: true)
+ * @param transition - Motion transition config
+ *
+ * @example
+ * ```tsx
+ * <Highlight hover>
+ *   <HighlightItem><button>Tab 1</button></HighlightItem>
+ *   <HighlightItem><button>Tab 2</button></HighlightItem>
+ * </Highlight>
+ * ```
+ */
+declare function Highlight<T extends React.ElementType = 'div'>({ ref, ...props }: IHighlightProps<T>): import("react/jsx-runtime").JSX.Element;
+/**
+ * HighlightItem — a single item within a Highlight container.
+ * Tracks its own position and renders the animated highlight indicator.
+ *
+ * @param value - Unique identifier for this item
+ * @param activeClassName - Additional class when this item is active
+ * @param asChild - Use the child element directly instead of wrapping
+ *
+ * @example
+ * ```tsx
+ * <HighlightItem value="tab-1">
+ *   <button>Tab 1</button>
+ * </HighlightItem>
+ * ```
+ */
+declare function HighlightItem<T extends React.ElementType>({ ref, as, children, id, value, className, style, transition, disabled, activeClassName, exitDelay, asChild, forceUpdateBounds, ...props }: IHighlightItemProps<T>): any;
+export { Highlight, HighlightItem, useHighlight, };
+export type { IHighlightProps, IHighlightItemProps, Bounds, HighlightMode, HighlightContextType, } from './Highlight.types';
+//# sourceMappingURL=index.d.ts.map

package/dist/react/primitives/Highlight/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/react/primitives/Highlight/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,KAAK,EAEV,oBAAoB,EACpB,eAAe,EACf,mBAAmB,EAGpB,MAAM,mBAAmB,CAAC;AAc3B;;;;;GAKG;AACH,iBAAS,YAAY,CAAC,CAAC,SAAS,MAAM,KAAK,oBAAoB,CAAC,CAAC,CAAC,CAMjE;AAED;;;;;;;;;;;;;;;;;;GAkBG;AACH,iBAAS,SAAS,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,KAAK,EAAE,EACtD,GAAG,EACH,GAAG,KAAK,EACT,EAAE,eAAe,CAAC,CAAC,CAAC,2CAwNpB;AAiBD;;;;;;;;;;;;;;GAcG;AACH,iBAAS,aAAa,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,EAAE,EAClD,GAAG,EACH,EAAE,EACF,QAAQ,EACR,EAAE,EACF,KAAK,EACL,SAAS,EACT,KAAK,EACL,UAAU,EACV,QAAgB,EAChB,eAAe,EACf,SAAS,EACT,OAAe,EACf,iBAAiB,EACjB,GAAG,KAAK,EACT,EAAE,mBAAmB,CAAC,CAAC,CAAC,OA2OxB;AAED,OAAO,EACL,SAAS,EACT,aAAa,EACb,YAAY,GACb,CAAC;AAGF,YAAY,EACV,eAAe,EACf,mBAAmB,EACnB,MAAM,EACN,aAAa,EACb,oBAAoB,GACrB,MAAM,mBAAmB,CAAC"}