{"id":19363,"library":"babel-runtime-jsx-plus","title":"babel-runtime-jsx-plus","description":"Babel runtime helpers for jsx-plus, a JSX extension for condition, list, memo, slot, and classname directives. Version 0.1.5, pre-release status. Provides runtime functions like createCondition, createList, createJSXMemo, classnames, and $slot. Essential for projects using the jsx-plus Babel plugin. Differentiator: enables declarative directives in JSX with minimal runtime overhead.","status":"active","version":"0.1.5","language":"javascript","source_language":"en","source_url":"https://github.com/jsx-plus/babel-runtime-jsx-plus","tags":["javascript","babel","runtime","jsxplus"],"install":[{"cmd":"npm install babel-runtime-jsx-plus","lang":"bash","label":"npm"},{"cmd":"yarn add babel-runtime-jsx-plus","lang":"bash","label":"yarn"},{"cmd":"pnpm add babel-runtime-jsx-plus","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"The classnames runtime helper delegates to the 'classnames' package for combining class names.","package":"classnames","optional":false}],"imports":[{"note":"Package is ESM-first; named import from single entry.","wrong":"const createCondition = require('babel-runtime-jsx-plus').createCondition","symbol":"createCondition","correct":"import { createCondition } from 'babel-runtime-jsx-plus'"},{"note":"Functions are named exports, not default.","wrong":"import createList from 'babel-runtime-jsx-plus'","symbol":"createList","correct":"import { createList } from 'babel-runtime-jsx-plus'"},{"note":"Re-exports the 'classnames' package; prefer importing directly from 'classnames' if only using that.","wrong":"import classnames from 'babel-runtime-jsx-plus'","symbol":"classnames","correct":"import { classnames } from 'babel-runtime-jsx-plus'"},{"note":"The slot helper is a function, not a component, and named with dollar sign.","wrong":"import { Slot } from 'babel-runtime-jsx-plus'","symbol":"$slot","correct":"import { $slot } from 'babel-runtime-jsx-plus'"}],"quickstart":{"code":"import { createCondition, createList, createJSXMemo, classnames, $slot } from 'babel-runtime-jsx-plus';\n\n// Condition\nconst condition = createCondition(true, 'shown', 'hidden');\nconsole.log(condition); // 'shown'\n\n// List\nconst list = createList(['a', 'b', 'c'], (item, index) => ({ key: index, text: item }));\nconsole.log(list); // [{ key: 0, text: 'a' }, { key: 1, text: 'b' }, { key: 2, text: 'c' }]\n\n// Memo\nconst memo = createJSXMemo();\nconst key = 'item-1';\nif (!memo.has(key)) { memo.set(key, { data: 'cached' }); }\nconsole.log(memo.get(key)); // { data: 'cached' }\n\n// classnames\nconsole.log(classnames('foo', { bar: true }, ['baz'])); // 'foo bar baz'\n\n// $slot (simplified usage)\nconst slotContent = $slot('default', { text: 'Hello' });\nconsole.log(slotContent); // Typically used in JSX; returns children.\n","lang":"typescript","description":"Demonstrates importing and using all runtime helpers: createCondition, createList, createJSXMemo, classnames, and $slot."},"warnings":[{"fix":"Pin to exact version and test upgrades.","message":"Package is pre-release (v0.1.5) and API may change without notice.","severity":"gotcha","affected_versions":"<1.0.0"},{"fix":"Import 'classnames' from its own package instead: import classnames from 'classnames'.","message":"The classnames helper is a re-export of the 'classnames' package. Direct use of 'classnames' is preferred for clarity.","severity":"deprecated","affected_versions":">=0.1.0"},{"fix":"Call $slot(...) as a function, typically within JSX expressions like { $slot('default', props) }.","message":"$slot is a function, not a React component. Using it as <$slot>...</$slot> will fail.","severity":"gotcha","affected_versions":">=0.1.0"},{"fix":"Use only documented methods: has, get, set, clear.","message":"createJSXMemo returns a Map-like object, but its API is not specified. Relying on Map methods may break if implementation changes.","severity":"gotcha","affected_versions":">=0.1.0"}],"env_vars":null,"last_verified":"2026-04-25T00:00:00.000Z","next_check":"2026-07-24T00:00:00.000Z","problems":[{"fix":"Run 'npm install babel-runtime-jsx-plus' or 'yarn add babel-runtime-jsx-plus'.","cause":"Package not installed or not located in node_modules.","error":"Cannot find module 'babel-runtime-jsx-plus'"},{"fix":"Verify the export names: createCondition, createList, createJSXMemo, classnames, $slot.","cause":"Mistyped export name or importing from wrong package version.","error":"export 'createCondition' was not found in 'babel-runtime-jsx-plus'"},{"fix":"Use named import: import { createCondition } from 'babel-runtime-jsx-plus'.","cause":"Import syntax error (e.g., default import instead of named import).","error":"createCondition is not a function"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}