@rulecms/source-components-react-native

Default RuleCMS React Native components — the React Native counterpart of @rulecms/source-components-react and rulecms_source_components.

Provides the same default-library type ids. Register as the default library on @rulecms/widget-react-native:

libraries: { default: rulecmsSourceComponentsLibrary }

| Type id | View | |---|---| | r-text | Text, {n\|label} links, enclosing-tag-3-resolutions | | cloudinary-advanced-image | Image via Cloudinary URL builder | | r-video | Poster + play via Cloudinary delivery URLs | | r-icon | Lucide icon resolved by name (lucide-react-native) | | r-button | Preset + optional link, icon, disabled, host onClick | | r-divider | Horizontal rule (solid / dashed / dotted) | | r-embed | Allowlisted YouTube, Vimeo, Google Maps, Calendly (react-native-webview when installed) | | r-list | Flat bulleted or numbered list with shared links | | r-accordion | Summary / detail disclosure | | r-mount | Slot for a host-app component registered on RuleCMSWidget mounts by name |

The package also exports the library contract that @rulecms/widget-react-native consumes:

• manifest, components, editor
• getSourceComponentsPlugin(), getComponentMetadataForEditing(), getPreviewComponents()
• link helpers (isSafeHref, resolveLinkAttributes, parseInlineLinkMarkers)
• button presets, list/embed/accordion allowlists
• icon registry (resolveIconName, searchIconNames, resolveIconComponent)

Host onClick and nested children

r-button reads onClick from SourceComponentBuildContext.widgetInstanceProps. Address the instance on RuleCMSWidget.componentProps by column id:

<RuleCMSWidget
  publishedKey={publishedKey}
  componentProps={{
    [ctaColumnId]: { onClick: handleCta },
  }}
/>

r-accordion renders children after the authored detail when the renderer supplies a nested subtree (that composition path is still unshipped on both platforms).

Install

npm install @rulecms/widget-react-native @rulecms/source-components-react-native lucide-react-native react-native-svg
# optional, for in-app embeds:
npm install react-native-webview

Develop locally

cd source-components-react-native
npm install
npm test
npm run lint
npm run typecheck
npm run build

Publishing

Follow __docs__/RUNBOOK_version-bump-and-release.md.

Increment version

# Patch version (0.1.0 -> 0.1.1)
npm run version:patch

# Minor version (0.1.0 -> 0.2.0)
npm run version:minor

# Major version (0.1.0 -> 1.0.0)
npm run version:major

Publish to npm

Push the version tag. GitHub Actions publishes via trusted publishing (.github/workflows/publish.yml). Do not run npm run release or npm publish locally except for the first-ever version of a new package (npm cannot attach a trusted publisher until the package exists).

git push && git push --tags
npm view @rulecms/source-components-react-native version

License

Proprietary — RuleCMS, LLC