{"id":22059221,"url":"https://github.com/opentable/ot-oc-template-react-email","last_synced_at":"2025-07-24T00:31:42.194Z","repository":{"id":57316723,"uuid":"131135270","full_name":"opentable/ot-oc-template-react-email","owner":"opentable","description":"⚛️ 👉 ✉️ Module for handling React to write emails with OC","archived":true,"fork":false,"pushed_at":"2018-06-07T15:21:34.000Z","size":125,"stargazers_count":3,"open_issues_count":0,"forks_count":1,"subscribers_count":26,"default_branch":"master","last_synced_at":"2025-06-27T23:17:48.940Z","etag":null,"topics":["email","oc","opencomponents","react"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/opentable.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2018-04-26T09:50:06.000Z","updated_at":"2025-04-14T08:43:29.000Z","dependencies_parsed_at":"2022-09-18T20:51:49.307Z","dependency_job_id":null,"html_url":"https://github.com/opentable/ot-oc-template-react-email","commit_stats":null,"previous_names":[],"tags_count":8,"template":false,"template_full_name":null,"purl":"pkg:github/opentable/ot-oc-template-react-email","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/opentable%2Fot-oc-template-react-email","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/opentable%2Fot-oc-template-react-email/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/opentable%2Fot-oc-template-react-email/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/opentable%2Fot-oc-template-react-email/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/opentable","download_url":"https://codeload.github.com/opentable/ot-oc-template-react-email/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/opentable%2Fot-oc-template-react-email/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":266774717,"owners_count":23982246,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-07-23T02:00:09.312Z","response_time":66,"last_error":null,"robots_txt_status":null,"robots_txt_updated_at":null,"robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["email","oc","opencomponents","react"],"created_at":"2024-11-30T17:27:35.561Z","updated_at":"2025-07-24T00:31:41.773Z","avatar_url":"https://github.com/opentable.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"ot-oc-template-react-email\n==========================\n\ntemplates \u0026 utilties for handling emails at OpenTable with the [OpenComponents](https://github.com/opentable/oc) template system\n\n***\n\n[![codecov](https://codecov.io/gh/opentable/ot-oc-template-react-email/branch/master/graph/badge.svg)](https://codecov.io/gh/opentable/ot-oc-template-react-email)\n[![npm version](https://badge.fury.io/js/ot-oc-template-react-email.svg)](http://badge.fury.io/js/ot-oc-template-react-email)\n[![Build Status](https://travis-ci.org/opentable/ot-oc-template-react-email.svg?branch=master)](https://travis-ci.org/opentable/ot-oc-template-react-email)\n\n## Packages included in this repo\n\n| Name | Version |\n|--------|-------|\n| [`ot-oc-template-react-email`](/packages/ot-oc-template-react-email) | [![npm version](https://badge.fury.io/js/ot-oc-template-react-email.svg)](http://badge.fury.io/js/ot-oc-template-react-email) |\n| [`ot-oc-template-react-email-compiler`](/packages/ot-oc-template-react-email-compiler) | [![npm version](https://badge.fury.io/js/ot-oc-template-react-email-compiler.svg)](http://badge.fury.io/js/ot-oc-template-react-email-compiler) \n\n\n## Usage:\n\nInitialize a component with the ot-oc-template-react-email and follow the CLI instructions\n\n```\n$ oc init \u003cyour-component-name\u003e ot-oc-template-react-email\n```\n\n## Extra info:\n### package.json requirements\n- `template.src` - the react Component entry point -  should export a react component as `default`\n- `template.type` -  `ot-oc-template-react-email`\n- required in `devDependencies` -  `ot-oc-template-react-email-compiler`\n### conventions\n- `props = server()` - the viewModel generated by the server is automatically passed to the react application as props\n- The oc-client-browser is extended and will now expose all the available react-component at `oc.reactComponents[bundleHash]`. Although email are server-side-rendered, the client-side-rendering support is intended for dev purpose.\n\n### externals\nExternals are not bundled when packaging and publishing the component, for better size taking advantage of externals caching. OC will make sure to provide them at Server-Side \u0026 Client-Side rendering time for you.\n- React\n- ReactDOM\n- PropTypes\n \n### features\n- `Server Side Rendering` = server side rendering should work as for any other OpenComponent. Differently from the 'oc-template-react' template this template rely on [`renderToStaticMarkup()`](https://reactjs.org/docs/react-dom-server.html#rendertostaticmarkup) for SSR as no hidration is needed.\n- `css` is supported by converting any css imported into [Style Objects](https://www.w3schools.com/jsref/dom_obj_style.asp). This object is compatible with React Inline Styles.\n- `Whitelist dependencies` to be inlcuded in the build process done by the compiler. To whitelist dependencies installed in the node_modules folder, add in the package.json of the component a `buildIncludes` list:\n  ```json\n    ...\n    oc : {\n      files: {\n        template: {\n          ...\n          buildIncludes: ['npm-dependency-to-build']\n        }\n      }\n    }\n  ```\n\n\n\n## Utils\n\nThe compiler exposes some utilities that could be used by your React application:\n\n### HOCs\n\n#### withSettingProvider\n\nAn Higher order component that will make a `getSetting` function available via props.\n\n##### Usage:\n\n```javascript\nimport { withSettingProvider } from 'oc-template-react-compiler/utils';\n\nconst yourApp = props =\u003e {\n  // you can use props.getSetting here\n};\n\nyourEnhancedApp = withSettingProvider(yourApp);\n```\n\n`getSetting` accept one argument: `settingName =\u003e settingValue`. It will return the value for the requested setting.\n\nSettings available at the moment:\n- `getSetting('name')` : return the name of the OC component\n- `getSetting('version')` : return the version of the OC component\n- `getSetting('baseUrl')` : return the [baseUrl of the oc-registry](https://github.com/opentable/oc/wiki/The-server.js#context-properties)\n- `getSetting('staticPath')` : return the path to the [static assets](https://github.com/opentable/oc/wiki/The-server.js#add-static-resource-to-the-component) of the OC component\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fopentable%2Fot-oc-template-react-email","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fopentable%2Fot-oc-template-react-email","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fopentable%2Fot-oc-template-react-email/lists"}