@fastenhealth/fasten-stitch-element-resact) 互联网档案馆的存檔,存档日期2013-12-21
反应 SDK 用于 紧接连接 将健康数据连接纳入任何反应应用程序.
渲染一个启动按钮,打开一个模式对话框,其中包含一个iframe中的快取连接部件。 处理您的应用程序和部件之间的通讯 postMessage。 。 。 .
安装
将软件包添加到您的项目及其反应依赖性 :
npm install @fastenhealth/fasten-stitch-element-react
# or
yarn add @fastenhealth/fasten-stitch-element-react
反应 18+ 需要作为同伴依赖.
使用量
import { FastenStitchElement } from '@fastenhealth/fasten-stitch-element-react';
const CUSTOMER_PUBLIC_ID = 'public_test_...';
function App() {
return (
<FastenStitchElement
publicId={CUSTOMER_PUBLIC_ID}
externalId="user-123"
email="[email protected]"
brandingTheme="dark"
brandingAccentColor="#E04E3C"
brandingCompanyName="your brand"
brandingLogoUrl="https://your-brand.com/assets/logo.svg"
onEventBus={(event) => {
console.log('Fasten event:', event.data);
}}
/>
);
}
道具
组件接受以下选项(匹配 Stitch.js 部件配置):
| Prop | 类型 | 默认 | 说明 |
|---|---|---|---|
publicId | string | —— 说 | (必须) 您的 Fasten 连接公共ID . |
externalId | string | —— 说 | 患者/用户的外部标识符. |
email | string | —— 说 | 患者电子邮件用于预先流行支持的表格和签名流. |
reconnectOrgConnectionId | string | —— 说 | 已存在的 org- 连接- id 用于重接流量 . |
brandId | string | —— 说 | 预选特定品牌. |
portalId | string | —— 说 | 预选特定门户. |
endpointId | string | —— 说 | 预选特定终点 . |
searchQuery | string | —— 说 | 预填搜索输入. |
searchSortBy | string | —— 说 | 将搜索结果排序为 . |
searchSortByOpts | string | —— 说 | 排序选项的 JSON 字符串( Base64URL- 自动编码) . |
searchOnly | boolean | true | 只允许搜索( 无签名) . |
showSplash | boolean | false | 在搜索前显示溅射屏幕 . |
tefcaMode | boolean | false | 启用TEFCA模式(身份验证+记录定位). |
tefcaCspPromptForce | boolean | false | 以TEFCA模式强制CSP选择提示. |
brandingTheme | string | —— 说 | 部件主题, 例如 . "dark"发送为 branding-theme。 。 。 . |
brandingAccentColor | string | —— 说 | 部件口音颜色,例如:. "#E04E3C"发送为 branding-accent-color。 。 。 . |
brandingCompanyName | string | —— 说 | 部件中显示的公司名称 。 发送为 branding-company-name。 。 。 . |
brandingLogoUrl | string | —— 说 | 公司标志 URL. 发送为 branding-logo-url。 。 。 . |
eventTypes | string | —— 说 | 要订阅的逗号分隔事件类型 . |
onEventBus | (event: MessageEvent) => void | —— 说 | 回调部件后消息事件 . |
staticBackdrop | boolean | false | 防止背景点击关闭 . |
buttonLabel | string | "Share Records" | 默认按钮文字( 当 children 页:1. |
buttonClassName | string | —— 说 | 启动按钮的CSS类. |
buttonStyle | CSSProperties | —— 说 | 触发按钮的内置样式. |
dialogClassName | string | —— 说 | 用于 <dialog> 键. |
dialogStyle | CSSProperties | —— 说 | 内嵌样式 <dialog>。 。 。 . |
iframeClassName | string | —— 说 | 用于 <iframe> 键. |
iframeStyle | CSSProperties | —— 说 | 内嵌样式 <iframe>。 。 。 . |
environment | string | "production" | "production", (中文(简体) ), "development", (中文(简体) ), "local",或者一个完整的 URL. |
children | ReactNode | —— 说 | 自定义触发元素( 替换默认按钮) . |
反馈
请打开任何错误或请求的问题 。 你的反馈会帮助我们稳定公共SDK接口.