feat: add primitives module primitive subpkg

Author: Ohh-889

primitives/primitive/package.json

@@ -0,0 +1,66 @@
+{
+  "name": "soybean-react-ui/primitive",
+  "version": "1.0.0",
+  "license": "MIT",
+  "homepage": "https://radix-ui.com/primitives",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/radix-ui/primitives.git"
+  },
+  "bugs": {
+    "url": "https://github.com/radix-ui/primitives/issues"
+  },
+  "publishConfig": {
+    "main": "./dist/index.js",
+    "module": "./dist/index.mjs",
+    "types": "./dist/index.d.ts",
+    "exports": {
+      ".": {
+        "import": {
+          "types": "./dist/index.d.mts",
+          "default": "./dist/index.mjs"
+        },
+        "require": {
+          "types": "./dist/index.d.ts",
+          "default": "./dist/index.js"
+        }
+      }
+    }
+  },
+  "sideEffects": false,
+  "main": "./src/index.ts",
+  "module": "./src/index.ts",
+  "files": ["dist", "README.md"],
+  "scripts": {
+    "build": "radix-build",
+    "clean": "rm -rf dist",
+    "lint": "eslint --max-warnings 0 src",
+    "typecheck": "tsc --noEmit"
+  },
+  "peerDependencies": {
+    "@types/react": "*",
+    "@types/react-dom": "*",
+    "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc",
+    "react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
+  },
+  "peerDependenciesMeta": {
+    "@types/react": {
+      "optional": true
+    },
+    "@types/react-dom": {
+      "optional": true
+    }
+  },
+  "dependencies": {
+    "soybean-react-ui/slot": "workspace:*"
+  },
+  "devDependencies": {
+    "@types/react": "19.0.7",
+    "@types/react-dom": "19.0.3",
+    "eslint": "9.18.0",
+    "react": "19.1.0",
+    "react-dom": "19.1.0",
+    "typescript": "5.7.3"
+  },
+  "source": "./src/index.ts"
+}

primitives/primitive/src/index.ts

@@ -0,0 +1,8 @@
+export {
+  Primitive,
+  //
+  Root
+} from './primitive';
+export type { NODES, PrimitivePropsWithRef } from './primitive';
+
+export { composeEventHandlers, dispatchDiscreteCustomEvent } from './util';

primitives/primitive/src/primitive.tsx

@@ -0,0 +1,65 @@
+import * as React from 'react';
+import { createSlot } from 'soybean-react-ui/slot';
+
+export const NODES = [
+  'a',
+  'button',
+  'div',
+  'form',
+  'h2',
+  'h3',
+  'img',
+  'input',
+  'label',
+  'li',
+  'nav',
+  'ol',
+  'p',
+  'select',
+  'span',
+  'svg',
+  'ul'
+] as const;
+
+type Primitives = { [E in (typeof NODES)[number]]: PrimitiveForwardRefComponent<E> };
+
+type PrimitivePropsWithRef<E extends React.ElementType> = React.ComponentPropsWithRef<E> & {
+  asChild?: boolean;
+};
+
+type PrimitiveForwardRefComponent<E extends React.ElementType> = React.ForwardRefExoticComponent<
+  PrimitivePropsWithRef<E>
+>;
+
+const Primitive = NODES.reduce((primitive, node) => {
+  const Slot = createSlot(`Primitive.${node}`);
+  const Node = React.forwardRef((props: PrimitivePropsWithRef<typeof node>, forwardedRef: any) => {
+    const { asChild, ...primitiveProps } = props;
+
+    const Comp: any = asChild ? Slot : node;
+
+    if (typeof window !== 'undefined') {
+      (window as any)[Symbol.for('soybean-ui')] = true;
+    }
+
+    return (
+      <Comp
+        {...primitiveProps}
+        ref={forwardedRef}
+      />
+    );
+  });
+
+  Node.displayName = `Primitive.${node}`;
+
+  return { ...primitive, [node]: Node };
+}, {} as Primitives);
+
+const Root = Primitive;
+
+export {
+  Primitive,
+  //
+  Root
+};
+export type { PrimitivePropsWithRef };

primitives/primitive/src/util.ts

@@ -0,0 +1,39 @@
+import { flushSync } from 'react-dom';
+
+export function dispatchDiscreteCustomEvent<E extends CustomEvent>(target: E['target'], event: E) {
+  if (target) flushSync(() => target.dispatchEvent(event));
+}
+
+/**
+ * 组合两个事件处理函数（用户的和内部的），并根据事件是否被 `preventDefault()` 决定是否执行第二个处理函数。
+ *
+ * Compose two event handlers (original and internal), with optional check for `event.defaultPrevented`.
+ * Useful in component libraries to merge user-provided event handlers with internal logic safely.
+ *
+ * @returns 一个新的事件处理函数 / A new composed event handler
+ *
+ * @example
+ * const handleClick = composeEventHandlers(
+ *   (e) => console.log('User clicked'),
+ *   (e) => console.log('Internal logic'),
+ * );
+ *
+ * <button onClick={handleClick}>Click me</button>
+ */
+export function composeEventHandlers<E extends { defaultPrevented: boolean }>(
+  originalEventHandler?: (event: E) => void,
+  ourEventHandler?: (event: E) => void,
+  { checkForDefaultPrevented = true } = {}
+) {
+  return function handleEvent(event: E) {
+    // 执行用户传入的处理函数 / Invoke user handler first
+    originalEventHandler?.(event);
+
+    // 如果没有被 preventDefault，则执行内部处理器 / Only run internal handler if event was not prevented
+    if (checkForDefaultPrevented === false || !event.defaultPrevented) {
+      return ourEventHandler?.(event);
+    }
+
+    return null;
+  };
+}

primitives/primitive/tsconfig.json

@@ -0,0 +1,8 @@
+{
+  "extends": "../../tsconfig.base.json",
+  "compilerOptions": {
+    "outDir": "dist"
+  },
+  "include": ["src"],
+  "exclude": ["node_modules", "dist"]
+}