@refineui/utilities 0.0.1 → 0.0.3

package/README.md

@@ -0,0 +1,86 @@
+# @refineui/utilities
+
+Shared helpers behind [RefineUI](https://ui.pelagornis.com) components — token references, DOM attribute normalization, and React composition primitives.
+
+This package holds the logic that would otherwise be duplicated across components. It depends only on `@refineui/version`, never on `@refineui/tokens`, so token packages stay at the bottom of the dependency graph.
+
+## Install
+
+```bash
+npm install @refineui/utilities
+yarn add @refineui/utilities
+pnpm add @refineui/utilities
+bun add @refineui/utilities
+```
+
+React 18+ is a peer dependency, required only for the `react` entry point.
+
+## Entry points
+
+| Import | Contents |
+|--------|----------|
+| `@refineui/utilities` | animation + color + dom + react + typography |
+| `@refineui/utilities/color` | Color token refs, CSS var resolution, `hexToRgba`, `shadowWithColor` |
+| `@refineui/utilities/typography` | Semantic text and Foundation typography token refs |
+| `@refineui/utilities/animation` | Motion presets, transition/animation style builders, reduced-motion query |
+| `@refineui/utilities/react` | `useComposedRefs`, `composeRefs`, `acquireBodyScrollLock`, `getMergeableTriggerChild` |
+
+Subpath imports keep React out of the bundle when you only need token helpers.
+
+## Color tokens
+
+```ts
+import {
+  hexToRgba,
+  resolveColorTokenValue,
+  semanticColorToken,
+} from "@refineui/utilities/color";
+
+const surface = semanticColorToken("background-surface");
+resolveColorTokenValue(surface); // var(--refineui-color-alias-background-surface)
+hexToRgba("#1a1a1a", 0.6); // rgba(26, 26, 26, 0.6)
+```
+
+Raw strings pass through `resolveColorTokenValue` unchanged, so a token ref and a literal can share one prop type.
+
+## Motion
+
+```ts
+import { createTransitionStyle, getReducedMotionQuery } from "@refineui/utilities/animation";
+
+const style = createTransitionStyle({
+  properties: ["opacity", "transform"],
+  duration: "fast", // instant | fast | normal | slow | toast
+  easing: "standard", // standard | emphasized | linear
+});
+```
+
+Durations and easings resolve to token CSS variables, so motion stays in step with `@refineui/tokens`. Pass `reduceMotion: true` to collapse a transition to `instant`, and use `getReducedMotionQuery()` — which returns the `@media (prefers-reduced-motion: reduce)` at-rule — when emitting the same contract in a stylesheet.
+
+## React composition
+
+```tsx
+import { useComposedRefs, acquireBodyScrollLock } from "@refineui/utilities/react";
+
+const ref = useComposedRefs(localRef, forwardedRef);
+
+// Overlay surfaces lock the body once and release on the last unmount.
+useEffect(() => acquireBodyScrollLock(), []);
+```
+
+`acquireBodyScrollLock` is reference counted, so nested Dialog and Drawer instances do not fight over `overflow`.
+
+## DOM attributes
+
+```ts
+import { ariaAttr, dataAttr } from "@refineui/utilities";
+
+dataAttr(isSelected); // "" | undefined     → renders data-selected only when true
+ariaAttr(isDisabled); // "true" | undefined → omits aria-disabled when false
+```
+
+## Development
+
+```bash
+bun run build   # one tsup pass per entry point
+```

package/lib/index.cjs

@@ -30,6 +30,7 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/index.ts
 var index_exports = {};
 __export(index_exports, {
+  Slot: () => Slot,
   acquireBodyScrollLock: () => acquireBodyScrollLock,
   ariaAttr: () => ariaAttr,
   buttonProps: () => buttonProps,
@@ -297,6 +298,45 @@ function getMergeableTriggerChild(children) {
   return node;
 }
 
+// src/Slot.tsx
+var import_react2 = require("react");
+var import_jsx_runtime = require("react/jsx-runtime");
+function mergeProps(slotProps, childProps) {
+  const merged = { ...slotProps };
+  for (const key of Object.keys(childProps)) {
+    if (key === "ref" || key === "children") continue;
+    const slotValue = slotProps[key];
+    const childValue = childProps[key];
+    const isEvent = key.startsWith("on") && typeof slotValue === "function" && typeof childValue === "function";
+    if (key === "className" || key === "aria-describedby") {
+      merged[key] = [slotValue, childValue].filter(Boolean).join(" ");
+    } else if (key === "style") {
+      merged.style = { ...slotValue ?? {}, ...childValue ?? {} };
+    } else if (isEvent) {
+      merged[key] = (event) => {
+        childValue(event);
+        if (!event?.defaultPrevented) slotValue(event);
+      };
+    } else {
+      merged[key] = childValue;
+    }
+  }
+  return merged;
+}
+var Slot = (0, import_react2.forwardRef)(function Slot2({ children, ...slotProps }, forwardedRef) {
+  if (!(0, import_react2.isValidElement)(children)) {
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children });
+  }
+  const child = children;
+  const childProps = { ...child.props ?? {} };
+  const childRef = child.ref ?? childProps.ref;
+  delete childProps.ref;
+  delete childProps.children;
+  const merged = mergeProps(slotProps, childProps);
+  merged.ref = composeRefs(forwardedRef, childRef);
+  return (0, import_react2.cloneElement)(child, merged);
+});
+
 // src/typography.ts
 function semanticTextToken(name) {
   return { type: "semantic-text", name };
@@ -314,6 +354,7 @@ function isSemanticTextTokenRef(value) {
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
+  Slot,
   acquireBodyScrollLock,
   ariaAttr,
   buttonProps,

package/lib/index.d.cts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { CSSProperties, Ref, ReactNode, ReactElement } from 'react';
+import { CSSProperties, Ref, ReactNode, ReactElement, HTMLAttributes } from 'react';
 
 declare const motionDurations: {
     readonly instant: "var(--refineui-motion-duration-instant)";
@@ -115,6 +115,12 @@ declare const composeRef: typeof composeRefs;
  */
 declare function getMergeableTriggerChild(children: ReactNode): ReactElement | null;
 
+interface SlotProps extends Omit<HTMLAttributes<HTMLElement>, "children"> {
+    children?: any;
+}
+/** Merges its props onto the single child. Used for `asChild`. */
+declare const Slot: React.ForwardRefExoticComponent<SlotProps & React.RefAttributes<HTMLElement | null>>;
+
 type SemanticTextTokenRef<TName extends string = string> = Readonly<{
     type: "semantic-text";
     name: TName;
@@ -129,4 +135,4 @@ declare function foundationTypographyToken<TName extends string>(name: TName): F
 declare function foundationTypographyUtilityClass(foundationKey: string): string;
 declare function isSemanticTextTokenRef(value: unknown): value is SemanticTextTokenRef;
 
-export { type AnimationStyleOptions, type ColorTokenRef, type ColorTokenValue, type FoundationTypographyTokenRef, type MotionDuration, type MotionEasing, type MotionPresetName, type PaletteColorTokenRef, type SemanticColorTokenRef, type SemanticTextTokenRef, type TransitionStyleOptions, acquireBodyScrollLock, ariaAttr, buttonProps, composeRef, composeRefs, createAnimationStyle, createTransitionStyle, dataAttr, elementProps, foundationTypographyToken, foundationTypographyUtilityClass, getMergeableTriggerChild, getReducedMotionQuery, hexToRgba, imgProps, inputProps, isColorTokenRef, isSemanticTextTokenRef, labelProps, motionDurations, motionEasings, motionKeyframesCss, motionMsToNumber, motionPresets, paletteColorCssVar, paletteColorToken, resolveColorToken, resolveColorTokenValue, semanticColorCssVar, semanticColorToken, semanticTextToken, shadowWithColor, toKebab, useComposedRefs };
+export { type AnimationStyleOptions, type ColorTokenRef, type ColorTokenValue, type FoundationTypographyTokenRef, type MotionDuration, type MotionEasing, type MotionPresetName, type PaletteColorTokenRef, type SemanticColorTokenRef, type SemanticTextTokenRef, Slot, type SlotProps, type TransitionStyleOptions, acquireBodyScrollLock, ariaAttr, buttonProps, composeRef, composeRefs, createAnimationStyle, createTransitionStyle, dataAttr, elementProps, foundationTypographyToken, foundationTypographyUtilityClass, getMergeableTriggerChild, getReducedMotionQuery, hexToRgba, imgProps, inputProps, isColorTokenRef, isSemanticTextTokenRef, labelProps, motionDurations, motionEasings, motionKeyframesCss, motionMsToNumber, motionPresets, paletteColorCssVar, paletteColorToken, resolveColorToken, resolveColorTokenValue, semanticColorCssVar, semanticColorToken, semanticTextToken, shadowWithColor, toKebab, useComposedRefs };

package/lib/index.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { CSSProperties, Ref, ReactNode, ReactElement } from 'react';
+import { CSSProperties, Ref, ReactNode, ReactElement, HTMLAttributes } from 'react';
 
 declare const motionDurations: {
     readonly instant: "var(--refineui-motion-duration-instant)";
@@ -115,6 +115,12 @@ declare const composeRef: typeof composeRefs;
  */
 declare function getMergeableTriggerChild(children: ReactNode): ReactElement | null;
 
+interface SlotProps extends Omit<HTMLAttributes<HTMLElement>, "children"> {
+    children?: any;
+}
+/** Merges its props onto the single child. Used for `asChild`. */
+declare const Slot: React.ForwardRefExoticComponent<SlotProps & React.RefAttributes<HTMLElement | null>>;
+
 type SemanticTextTokenRef<TName extends string = string> = Readonly<{
     type: "semantic-text";
     name: TName;
@@ -129,4 +135,4 @@ declare function foundationTypographyToken<TName extends string>(name: TName): F
 declare function foundationTypographyUtilityClass(foundationKey: string): string;
 declare function isSemanticTextTokenRef(value: unknown): value is SemanticTextTokenRef;
 
-export { type AnimationStyleOptions, type ColorTokenRef, type ColorTokenValue, type FoundationTypographyTokenRef, type MotionDuration, type MotionEasing, type MotionPresetName, type PaletteColorTokenRef, type SemanticColorTokenRef, type SemanticTextTokenRef, type TransitionStyleOptions, acquireBodyScrollLock, ariaAttr, buttonProps, composeRef, composeRefs, createAnimationStyle, createTransitionStyle, dataAttr, elementProps, foundationTypographyToken, foundationTypographyUtilityClass, getMergeableTriggerChild, getReducedMotionQuery, hexToRgba, imgProps, inputProps, isColorTokenRef, isSemanticTextTokenRef, labelProps, motionDurations, motionEasings, motionKeyframesCss, motionMsToNumber, motionPresets, paletteColorCssVar, paletteColorToken, resolveColorToken, resolveColorTokenValue, semanticColorCssVar, semanticColorToken, semanticTextToken, shadowWithColor, toKebab, useComposedRefs };
+export { type AnimationStyleOptions, type ColorTokenRef, type ColorTokenValue, type FoundationTypographyTokenRef, type MotionDuration, type MotionEasing, type MotionPresetName, type PaletteColorTokenRef, type SemanticColorTokenRef, type SemanticTextTokenRef, Slot, type SlotProps, type TransitionStyleOptions, acquireBodyScrollLock, ariaAttr, buttonProps, composeRef, composeRefs, createAnimationStyle, createTransitionStyle, dataAttr, elementProps, foundationTypographyToken, foundationTypographyUtilityClass, getMergeableTriggerChild, getReducedMotionQuery, hexToRgba, imgProps, inputProps, isColorTokenRef, isSemanticTextTokenRef, labelProps, motionDurations, motionEasings, motionKeyframesCss, motionMsToNumber, motionPresets, paletteColorCssVar, paletteColorToken, resolveColorToken, resolveColorTokenValue, semanticColorCssVar, semanticColorToken, semanticTextToken, shadowWithColor, toKebab, useComposedRefs };

package/lib/index.js

@@ -228,6 +228,49 @@ function getMergeableTriggerChild(children) {
   return node;
 }
 
+// src/Slot.tsx
+import {
+  cloneElement,
+  forwardRef,
+  isValidElement as isValidElement2
+} from "react";
+import { Fragment as Fragment2, jsx } from "react/jsx-runtime";
+function mergeProps(slotProps, childProps) {
+  const merged = { ...slotProps };
+  for (const key of Object.keys(childProps)) {
+    if (key === "ref" || key === "children") continue;
+    const slotValue = slotProps[key];
+    const childValue = childProps[key];
+    const isEvent = key.startsWith("on") && typeof slotValue === "function" && typeof childValue === "function";
+    if (key === "className" || key === "aria-describedby") {
+      merged[key] = [slotValue, childValue].filter(Boolean).join(" ");
+    } else if (key === "style") {
+      merged.style = { ...slotValue ?? {}, ...childValue ?? {} };
+    } else if (isEvent) {
+      merged[key] = (event) => {
+        childValue(event);
+        if (!event?.defaultPrevented) slotValue(event);
+      };
+    } else {
+      merged[key] = childValue;
+    }
+  }
+  return merged;
+}
+var Slot = forwardRef(function Slot2({ children, ...slotProps }, forwardedRef) {
+  if (!isValidElement2(children)) {
+    return /* @__PURE__ */ jsx(Fragment2, { children });
+  }
+  const child = children;
+  const childProps = { ...child.props ?? {} };
+  const childRef = child.ref ?? childProps.ref;
+  delete childProps.ref;
+  delete childProps.children;
+  const merged = mergeProps(slotProps, childProps);
+  merged.ref = composeRefs(forwardedRef, childRef);
+  return cloneElement(child, merged);
+});
+
 // src/typography.ts
 function semanticTextToken(name) {
   return { type: "semantic-text", name };
@@ -244,6 +287,7 @@ function isSemanticTextTokenRef(value) {
   return candidate.type === "semantic-text" && typeof candidate.name === "string";
 }
 export {
+  Slot,
   acquireBodyScrollLock,
   ariaAttr,
   buttonProps,

package/lib/react.cjs

@@ -30,6 +30,7 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/react.ts
 var react_exports = {};
 __export(react_exports, {
+  Slot: () => Slot,
   acquireBodyScrollLock: () => acquireBodyScrollLock,
   composeRef: () => composeRef,
   composeRefs: () => composeRefs,
@@ -117,8 +118,48 @@ function getMergeableTriggerChild(children) {
   }
   return node;
 }
+
+// src/Slot.tsx
+var import_react2 = require("react");
+var import_jsx_runtime = require("react/jsx-runtime");
+function mergeProps(slotProps, childProps) {
+  const merged = { ...slotProps };
+  for (const key of Object.keys(childProps)) {
+    if (key === "ref" || key === "children") continue;
+    const slotValue = slotProps[key];
+    const childValue = childProps[key];
+    const isEvent = key.startsWith("on") && typeof slotValue === "function" && typeof childValue === "function";
+    if (key === "className" || key === "aria-describedby") {
+      merged[key] = [slotValue, childValue].filter(Boolean).join(" ");
+    } else if (key === "style") {
+      merged.style = { ...slotValue ?? {}, ...childValue ?? {} };
+    } else if (isEvent) {
+      merged[key] = (event) => {
+        childValue(event);
+        if (!event?.defaultPrevented) slotValue(event);
+      };
+    } else {
+      merged[key] = childValue;
+    }
+  }
+  return merged;
+}
+var Slot = (0, import_react2.forwardRef)(function Slot2({ children, ...slotProps }, forwardedRef) {
+  if (!(0, import_react2.isValidElement)(children)) {
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children });
+  }
+  const child = children;
+  const childProps = { ...child.props ?? {} };
+  const childRef = child.ref ?? childProps.ref;
+  delete childProps.ref;
+  delete childProps.children;
+  const merged = mergeProps(slotProps, childProps);
+  merged.ref = composeRefs(forwardedRef, childRef);
+  return (0, import_react2.cloneElement)(child, merged);
+});
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
+  Slot,
   acquireBodyScrollLock,
   composeRef,
   composeRefs,

package/lib/react.d.cts

@@ -1,4 +1,5 @@
-import { Ref, ReactNode, ReactElement } from 'react';
+import * as react from 'react';
+import { Ref, ReactNode, ReactElement, HTMLAttributes } from 'react';
 
 /**
  * Root document scroll lock with ref-counting for nested overlays.
@@ -24,4 +25,10 @@ declare const composeRef: typeof composeRefs;
  */
 declare function getMergeableTriggerChild(children: ReactNode): ReactElement | null;
 
-export { acquireBodyScrollLock, composeRef, composeRefs, getMergeableTriggerChild, useComposedRefs };
+interface SlotProps extends Omit<HTMLAttributes<HTMLElement>, "children"> {
+    children?: any;
+}
+/** Merges its props onto the single child. Used for `asChild`. */
+declare const Slot: react.ForwardRefExoticComponent<SlotProps & react.RefAttributes<HTMLElement | null>>;
+
+export { Slot, type SlotProps, acquireBodyScrollLock, composeRef, composeRefs, getMergeableTriggerChild, useComposedRefs };

package/lib/react.d.ts

@@ -1,4 +1,5 @@
-import { Ref, ReactNode, ReactElement } from 'react';
+import * as react from 'react';
+import { Ref, ReactNode, ReactElement, HTMLAttributes } from 'react';
 
 /**
  * Root document scroll lock with ref-counting for nested overlays.
@@ -24,4 +25,10 @@ declare const composeRef: typeof composeRefs;
  */
 declare function getMergeableTriggerChild(children: ReactNode): ReactElement | null;
 
-export { acquireBodyScrollLock, composeRef, composeRefs, getMergeableTriggerChild, useComposedRefs };
+interface SlotProps extends Omit<HTMLAttributes<HTMLElement>, "children"> {
+    children?: any;
+}
+/** Merges its props onto the single child. Used for `asChild`. */
+declare const Slot: react.ForwardRefExoticComponent<SlotProps & react.RefAttributes<HTMLElement | null>>;
+
+export { Slot, type SlotProps, acquireBodyScrollLock, composeRef, composeRefs, getMergeableTriggerChild, useComposedRefs };

package/lib/react.js

@@ -77,7 +77,51 @@ function getMergeableTriggerChild(children) {
   }
   return node;
 }
+
+// src/Slot.tsx
+import {
+  cloneElement,
+  forwardRef,
+  isValidElement as isValidElement2
+} from "react";
+import { Fragment as Fragment2, jsx } from "react/jsx-runtime";
+function mergeProps(slotProps, childProps) {
+  const merged = { ...slotProps };
+  for (const key of Object.keys(childProps)) {
+    if (key === "ref" || key === "children") continue;
+    const slotValue = slotProps[key];
+    const childValue = childProps[key];
+    const isEvent = key.startsWith("on") && typeof slotValue === "function" && typeof childValue === "function";
+    if (key === "className" || key === "aria-describedby") {
+      merged[key] = [slotValue, childValue].filter(Boolean).join(" ");
+    } else if (key === "style") {
+      merged.style = { ...slotValue ?? {}, ...childValue ?? {} };
+    } else if (isEvent) {
+      merged[key] = (event) => {
+        childValue(event);
+        if (!event?.defaultPrevented) slotValue(event);
+      };
+    } else {
+      merged[key] = childValue;
+    }
+  }
+  return merged;
+}
+var Slot = forwardRef(function Slot2({ children, ...slotProps }, forwardedRef) {
+  if (!isValidElement2(children)) {
+    return /* @__PURE__ */ jsx(Fragment2, { children });
+  }
+  const child = children;
+  const childProps = { ...child.props ?? {} };
+  const childRef = child.ref ?? childProps.ref;
+  delete childProps.ref;
+  delete childProps.children;
+  const merged = mergeProps(slotProps, childProps);
+  merged.ref = composeRefs(forwardedRef, childRef);
+  return cloneElement(child, merged);
+});
 export {
+  Slot,
   acquireBodyScrollLock,
   composeRef,
   composeRefs,

package/package.json

@@ -1,66 +1,68 @@
 {
   "name": "@refineui/utilities",
-  "version": "0.0.1",
+  "version": "0.0.3",
   "description": "RefineUI React utilities for building components",
   "sideEffects": false,
   "type": "module",
   "license": "MIT",
   "repository": {
-  "type": "git",
-  "url": "https://github.com/pelagornis/refineui",
-  "directory": "packages/utilities"
-},
-"scripts": {
-  "build": "tsup src/color.ts --format cjs,esm --dts --clean --out-dir lib --external react --external react-dom && tsup src/typography.ts --format cjs,esm --dts --out-dir lib --external react --external react-dom && tsup src/animation.ts --format cjs,esm --dts --out-dir lib --external react --external react-dom && tsup src/react.ts --format cjs,esm --dts --out-dir lib --external react --external react-dom && tsup src/index.ts --format cjs,esm --dts --out-dir lib --external react --external react-dom",
-  "build:color": "tsup src/color.ts --format cjs,esm --dts --clean --out-dir lib --external react --external react-dom",
-  "build:animation": "tsup src/animation.ts --format cjs,esm --dts --out-dir lib --external react --external react-dom",
-  "build:react": "tsup src/react.ts --format cjs,esm --dts --out-dir lib --external react --external react-dom",
-  "build:index": "tsup src/index.ts --format cjs,esm --dts --out-dir lib --external react --external react-dom"
-},
-"exports": {
-  ".": {
-  "types": "./lib/index.d.ts",
-  "import": "./lib/index.js",
-  "require": "./lib/index.cjs"
-},
-"./color": {
-"types": "./lib/color.d.ts",
-"import": "./lib/color.js",
-"require": "./lib/color.cjs"
-},
-"./typography": {
-"types": "./lib/typography.d.ts",
-"import": "./lib/typography.js",
-"require": "./lib/typography.cjs"
-},
-"./animation": {
-"types": "./lib/animation.d.ts",
-"import": "./lib/animation.js",
-"require": "./lib/animation.cjs"
-},
-"./react": {
-"types": "./lib/react.d.ts",
-"import": "./lib/react.js",
-"require": "./lib/react.cjs"
-}
-},
-"main": "./lib/index.cjs",
-"files": ["lib"],
-"dependencies": {
-"@refineui/version": "1.0.0"
-},
-"peerDependencies": {
-"react": ">=18.0.0",
-"react-dom": ">=18.0.0"
-},
-"devDependencies": {
-"@types/react": "^18.3.20",
-"react": "^18.3.1",
-"react-dom": "^18.3.1",
-"tsup": "^8.0.0",
-"typescript": "^5.0.0"
-},
-"publishConfig": {
-"access": "public"
-}
+    "type": "git",
+    "url": "https://github.com/pelagornis/refineui",
+    "directory": "packages/utilities"
+  },
+  "scripts": {
+    "build": "tsup src/color.ts --format cjs,esm --dts --clean --out-dir lib --external react --external react-dom && tsup src/typography.ts --format cjs,esm --dts --out-dir lib --external react --external react-dom && tsup src/animation.ts --format cjs,esm --dts --out-dir lib --external react --external react-dom && tsup src/react.ts --format cjs,esm --dts --out-dir lib --external react --external react-dom && tsup src/index.ts --format cjs,esm --dts --out-dir lib --external react --external react-dom",
+    "build:color": "tsup src/color.ts --format cjs,esm --dts --clean --out-dir lib --external react --external react-dom",
+    "build:animation": "tsup src/animation.ts --format cjs,esm --dts --out-dir lib --external react --external react-dom",
+    "build:react": "tsup src/react.ts --format cjs,esm --dts --out-dir lib --external react --external react-dom",
+    "build:index": "tsup src/index.ts --format cjs,esm --dts --out-dir lib --external react --external react-dom"
+  },
+  "exports": {
+    ".": {
+      "types": "./lib/index.d.ts",
+      "import": "./lib/index.js",
+      "require": "./lib/index.cjs"
+    },
+    "./color": {
+      "types": "./lib/color.d.ts",
+      "import": "./lib/color.js",
+      "require": "./lib/color.cjs"
+    },
+    "./typography": {
+      "types": "./lib/typography.d.ts",
+      "import": "./lib/typography.js",
+      "require": "./lib/typography.cjs"
+    },
+    "./animation": {
+      "types": "./lib/animation.d.ts",
+      "import": "./lib/animation.js",
+      "require": "./lib/animation.cjs"
+    },
+    "./react": {
+      "types": "./lib/react.d.ts",
+      "import": "./lib/react.js",
+      "require": "./lib/react.cjs"
+    }
+  },
+  "main": "./lib/index.cjs",
+  "files": [
+    "lib"
+  ],
+  "dependencies": {
+    "@refineui/version": "1.0.0"
+  },
+  "peerDependencies": {
+    "react": ">=18.0.0",
+    "react-dom": ">=18.0.0"
+  },
+  "devDependencies": {
+    "@types/react": "^18.3.20",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1",
+    "tsup": "^8.0.0",
+    "typescript": "^5.0.0"
+  },
+  "publishConfig": {
+    "access": "public"
+  }
 }