From 45ee69010f92f57d9b8f46ecc8592bc7da2be163 Mon Sep 17 00:00:00 2001 From: Yuki Hattori Date: Thu, 25 Feb 2021 16:17:55 +0900 Subject: [PATCH] Rename package name to jsx-slack --- CHANGELOG.md | 297 ++++++++++++++-------------- LICENSE | 2 +- README.md | 106 +++++----- demo/examples/basic.js | 8 +- demo/index.html | 22 +-- docs/about-escape-and-exact-mode.md | 4 +- docs/block-containers.md | 8 +- docs/block-elements.md | 48 ++--- docs/highlight/v2.md | 10 +- docs/how-to-setup-jsx-transpiler.md | 28 +-- docs/html-like-formatting.md | 2 +- docs/jsx.png | Bin 67365 -> 39738 bytes docs/layout-blocks.md | 27 ++- docs/slack-notification.png | Bin 29245 -> 30770 bytes jest.config.js | 2 +- src/block-kit/layout/Section.ts | 6 +- src/mrkdwn/jsx.ts | 2 +- test/babel/automatic.jsx | 2 +- test/babel/production.jsx | 2 +- 19 files changed, 287 insertions(+), 289 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index ac8ebf8e..45d55ab3 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -2,103 +2,112 @@ ## [Unreleased] +### Breaking + +The package name has renamed from `@speee-js/jsx-slack` to `jsx-slack`. + ### Added -- JSX automatic runtime support for TypeScript 4.1 ([#214](https://github.com/speee/jsx-slack/pull/214), [#194](https://github.com/speee/jsx-slack/issues/194)) +- JSX automatic runtime support for TypeScript 4.1 ([#214](https://github.com/yhatt/jsx-slack/pull/214), [#194](https://github.com/yhatt/jsx-slack/issues/194)) + +### Changed + +- Rename package from `@speee-js/jsx-slack` to `jsx-slack` ([#213](https://github.com/yhatt/jsx-slack/issues/213)) +- GitHub repository has transferred to [yhatt/jsx-slack](https://github.com/yhatt/jsx-slack) ([#213](https://github.com/yhatt/jsx-slack/issues/213)) ## v2.6.0 - 2020-10-20 ### Added -- [Configurable `dispatchAction` prop](https://github.com/speee/jsx-slack/blob/master/docs/block-elements.md#input) for `` and `` (equivalent to [`dispatch_action_config` for the plain-text input](https://api.slack.com/reference/block-kit/block-elements#input)) ([#204](https://github.com/speee/jsx-slack/issues/204), [#205](https://github.com/speee/jsx-slack/pull/205)) -- [``](https://github.com/speee/jsx-slack/blob/master/docs/block-elements.md#bypass-html-like-formatting) to bypass HTML-like formatting and auto-escaping ([#161](https://github.com/speee/jsx-slack/issues/161), [#207](https://github.com/speee/jsx-slack/pull/207)) +- [Configurable `dispatchAction` prop](https://github.com/yhatt/jsx-slack/blob/master/docs/block-elements.md#input) for `` and `` (equivalent to [`dispatch_action_config` for the plain-text input](https://api.slack.com/reference/block-kit/block-elements#input)) ([#204](https://github.com/yhatt/jsx-slack/issues/204), [#205](https://github.com/yhatt/jsx-slack/pull/205)) +- [``](https://github.com/yhatt/jsx-slack/blob/master/docs/block-elements.md#bypass-html-like-formatting) to bypass HTML-like formatting and auto-escaping ([#161](https://github.com/yhatt/jsx-slack/issues/161), [#207](https://github.com/yhatt/jsx-slack/pull/207)) ### Fixed -- Escaped underscores within Korean emoji shorthand have broken ([#203](https://github.com/speee/jsx-slack/issues/203), [#206](https://github.com/speee/jsx-slack/pull/206)) +- Escaped underscores within Korean emoji shorthand have broken ([#203](https://github.com/yhatt/jsx-slack/issues/203), [#206](https://github.com/yhatt/jsx-slack/pull/206)) ### Changed -- Upgrade dependent packages to the latest version ([#208](https://github.com/speee/jsx-slack/pull/208)) +- Upgrade dependent packages to the latest version ([#208](https://github.com/yhatt/jsx-slack/pull/208)) ## v2.5.1 - 2020-10-08 ### Added -- [`` interactive component](https://github.com/speee/jsx-slack/blob/master/docs/block-elements.md#time-picker) ([#199](https://github.com/speee/jsx-slack/issues/199), [#202](https://github.com/speee/jsx-slack/pull/202)) +- [`` interactive component](https://github.com/yhatt/jsx-slack/blob/master/docs/block-elements.md#time-picker) ([#199](https://github.com/yhatt/jsx-slack/issues/199), [#202](https://github.com/yhatt/jsx-slack/pull/202)) ### Fixed -- Update demo schema for `dispatchAction` prop ([#201](https://github.com/speee/jsx-slack/pull/201)) +- Update demo schema for `dispatchAction` prop ([#201](https://github.com/yhatt/jsx-slack/pull/201)) ## v2.5.0 - 2020-10-07 ### Changed -- `` and input components are available in home tab container `` ([#195](https://github.com/speee/jsx-slack/issues/195), [#200](https://github.com/speee/jsx-slack/pull/200)) -- Allow using `` and `` in message container `` ([#196](https://github.com/speee/jsx-slack/issues/196), [#197](https://github.com/speee/jsx-slack/pull/197)) -- Upgrade dependent packages to the latest version ([#191](https://github.com/speee/jsx-slack/pull/191), [#198](https://github.com/speee/jsx-slack/pull/198)) +- `` and input components are available in home tab container `` ([#195](https://github.com/yhatt/jsx-slack/issues/195), [#200](https://github.com/yhatt/jsx-slack/pull/200)) +- Allow using `` and `` in message container `` ([#196](https://github.com/yhatt/jsx-slack/issues/196), [#197](https://github.com/yhatt/jsx-slack/pull/197)) +- Upgrade dependent packages to the latest version ([#191](https://github.com/yhatt/jsx-slack/pull/191), [#198](https://github.com/yhatt/jsx-slack/pull/198)) ### Added -- `dispatchAction` prop for `` layout block and input components ([#200](https://github.com/speee/jsx-slack/pull/200)) -- Docs: [`jsxFragmentFactory` compiler option for TypeScript v4](https://github.com/speee/jsx-slack/blob/master/docs/how-to-setup-jsx-transpiler.md#typescript) ([#173](https://github.com/speee/jsx-slack/issues/173), [#191](https://github.com/speee/jsx-slack/pull/191)) +- `dispatchAction` prop for `` layout block and input components ([#200](https://github.com/yhatt/jsx-slack/pull/200)) +- Docs: [`jsxFragmentFactory` compiler option for TypeScript v4](https://github.com/yhatt/jsx-slack/blob/master/docs/how-to-setup-jsx-transpiler.md#typescript) ([#173](https://github.com/yhatt/jsx-slack/issues/173), [#191](https://github.com/yhatt/jsx-slack/pull/191)) ## v2.4.0 - 2020-07-30 ### Added -- [`` component](https://github.com/speee/jsx-slack/blob/master/docs/layout-blocks.md#header) for layout block ([#184](https://github.com/speee/jsx-slack/issues/184), [#185](https://github.com/speee/jsx-slack/pull/185)) +- [`` component](https://github.com/yhatt/jsx-slack/blob/master/docs/layout-blocks.md#header) for layout block ([#184](https://github.com/yhatt/jsx-slack/issues/184), [#185](https://github.com/yhatt/jsx-slack/pull/185)) ### Fixed -- Fix typos in `how-to-setup-jsx-transpiler.md` ([#183](https://github.com/speee/jsx-slack/pull/183) by [@mashabow](https://github.com/mashabow)) +- Fix typos in `how-to-setup-jsx-transpiler.md` ([#183](https://github.com/yhatt/jsx-slack/pull/183) by [@mashabow](https://github.com/mashabow)) ## v2.3.0 - 2020-07-22 ### Added -- `type` prop and [`workflow_step` type](https://api.slack.com/reference/workflows/configuration-view) for `` ([#176](https://github.com/speee/jsx-slack/issues/176), [#177](https://github.com/speee/jsx-slack/pull/177)) -- React-compatible camelCased `dateTime` prop for `` ([#179](https://github.com/speee/jsx-slack/issues/179), [#182](https://github.com/speee/jsx-slack/pull/182)) -- Test against Node 14 ([#181](https://github.com/speee/jsx-slack/pull/181)) +- `type` prop and [`workflow_step` type](https://api.slack.com/reference/workflows/configuration-view) for `` ([#176](https://github.com/yhatt/jsx-slack/issues/176), [#177](https://github.com/yhatt/jsx-slack/pull/177)) +- React-compatible camelCased `dateTime` prop for `` ([#179](https://github.com/yhatt/jsx-slack/issues/179), [#182](https://github.com/yhatt/jsx-slack/pull/182)) +- Test against Node 14 ([#181](https://github.com/yhatt/jsx-slack/pull/181)) ### Changed -- `datetime` prop for `` is now aliasing into added camelCased prop ([#179](https://github.com/speee/jsx-slack/issues/179), [#182](https://github.com/speee/jsx-slack/pull/182)) -- Upgrade dependent packages to the latest version ([#178](https://github.com/speee/jsx-slack/pull/178)) +- `datetime` prop for `` is now aliasing into added camelCased prop ([#179](https://github.com/yhatt/jsx-slack/issues/179), [#182](https://github.com/yhatt/jsx-slack/pull/182)) +- Upgrade dependent packages to the latest version ([#178](https://github.com/yhatt/jsx-slack/pull/178)) ## v2.2.1 - 2020-07-17 ### Fixed -- Fix wrong extension for the path of type definition: `.js` -> `.d.ts` ([#171](https://github.com/speee/jsx-slack/pull/171)) -- Update how to generate Block Kit Builder URL in demo page ([#168](https://github.com/speee/jsx-slack/issues/168), [#172](https://github.com/speee/jsx-slack/pull/172)) +- Fix wrong extension for the path of type definition: `.js` -> `.d.ts` ([#171](https://github.com/yhatt/jsx-slack/pull/171)) +- Update how to generate Block Kit Builder URL in demo page ([#168](https://github.com/yhatt/jsx-slack/issues/168), [#172](https://github.com/yhatt/jsx-slack/pull/172)) ### Changed -- Upgrade Node and dependent packages to the latest version ([#175](https://github.com/speee/jsx-slack/pull/175)) +- Upgrade Node and dependent packages to the latest version ([#175](https://github.com/yhatt/jsx-slack/pull/175)) ## v2.2.0 - 2020-05-21 ### Added -- [`` layout block component](https://github.com/speee/jsx-slack/blob/master/docs/layout-blocks.md#call) to show a card of registered call ([#164](https://github.com/speee/jsx-slack/issues/164), [#165](https://github.com/speee/jsx-slack/pull/165)) +- [`` layout block component](https://github.com/yhatt/jsx-slack/blob/master/docs/layout-blocks.md#call) to show a card of registered call ([#164](https://github.com/yhatt/jsx-slack/issues/164), [#165](https://github.com/yhatt/jsx-slack/pull/165)) ### Changed -- Upgrade dependent packages to the latest version ([#166](https://github.com/speee/jsx-slack/pull/166)) +- Upgrade dependent packages to the latest version ([#166](https://github.com/yhatt/jsx-slack/pull/166)) ## v2.1.0 - 2020-05-01 ### Added -- Accept [special initial conversation `current`](https://github.com/speee/jsx-slack/blob/master/docs/block-elements.md#special-initial-conversation-current) in `` ([#154](https://github.com/speee/jsx-slack/issues/154), [#155](https://github.com/speee/jsx-slack/pull/155)) +- Accept [special initial conversation `current`](https://github.com/yhatt/jsx-slack/blob/master/docs/block-elements.md#special-initial-conversation-current) in `` ([#154](https://github.com/yhatt/jsx-slack/issues/154), [#155](https://github.com/yhatt/jsx-slack/pull/155)) ### Changed -- Upgrade Node and dependent packages to the latest version ([#158](https://github.com/speee/jsx-slack/pull/158)) -- Refactor special link detection ([#159](https://github.com/speee/jsx-slack/pull/159)) -- Update demo REPL ([#157](https://github.com/speee/jsx-slack/pull/157)) +- Upgrade Node and dependent packages to the latest version ([#158](https://github.com/yhatt/jsx-slack/pull/158)) +- Refactor special link detection ([#159](https://github.com/yhatt/jsx-slack/pull/159)) +- Update demo REPL ([#157](https://github.com/yhatt/jsx-slack/pull/157)) - Move template examples on README into REPL demo - Use Web fonts to get better rendering - Disable preview button if Slack may return 414 error due to too long URL @@ -111,27 +120,27 @@ jsx-slack v2 has improved JSX structure and built-in components to output the _real_ JSON from JSX! -**[▶︎ See highlight of v2 updates](https://github.com/speee/jsx-slack/blob/master/docs/highlight/v2.md)** +**[▶︎ See highlight of v2 updates](https://github.com/yhatt/jsx-slack/blob/master/docs/highlight/v2.md)** -### [Breaking](https://github.com/speee/jsx-slack/blob/master/docs/highlight/v2.md#breaking-change) +### [Breaking](https://github.com/yhatt/jsx-slack/blob/master/docs/highlight/v2.md#breaking-change) - Checked states defined in `` and `` do no longer merge -* [Breaking for TypeScript](https://github.com/speee/jsx-slack/blob/master/docs/highlight/v2.md#changes-for-TypeScript) +* [Breaking for TypeScript](https://github.com/yhatt/jsx-slack/blob/master/docs/highlight/v2.md#changes-for-TypeScript) - Require TypeScript >= 3.7 when using jsx-slack through TypeScript - Container components have strict type checking for its children - Exported type `JSXSlack.Child` and `JSXSlack.Children` have been renamed into `JSXSlack.ChildElement` and `JSXSlack.ChildElements` and no longer provided generics ### Changed -- Fully rewrote JSX structure to render from JSX to JSON directly ([#128](https://github.com/speee/jsx-slack/issues/128)) +- Fully rewrote JSX structure to render from JSX to JSON directly ([#128](https://github.com/yhatt/jsx-slack/issues/128)) - All built-in components can render the partial JSON of Block Kit - `` container now accepts `` and custom transformer to store private metadata - `value` prop for `` has made optional to follow HTML specification - `confirm` prop for interactive block elements accepts the raw confirm composition object - `` tag renders short syntax for hyperlink if possible -- Throws error with more helpful message and stacktrace when there is invalid JSX structure ([#143](https://github.com/speee/jsx-slack/pull/143)) -- Bundle modules through rollup ([#144](https://github.com/speee/jsx-slack/pull/144)) +- Throws error with more helpful message and stacktrace when there is invalid JSX structure ([#143](https://github.com/yhatt/jsx-slack/pull/143)) +- Bundle modules through rollup ([#144](https://github.com/yhatt/jsx-slack/pull/144)) ### Added @@ -139,15 +148,15 @@ jsx-slack v2 has improved JSX structure and built-in components to output the _r - HTML-compatible `` and `` - `value` prop as an alias into `initialXXX` prop in some interactive components - Added JSDoc to many public APIs and components -- Support new JSX transpile via `automatic` runtime in Babel >= 7.9 _(experimental)_ ([#142](https://github.com/speee/jsx-slack/pull/142)) -- REPL demo now generates the permalink to specific JSX ([#149](https://github.com/speee/jsx-slack/pull/149)) -- Dark mode for REPL demo ([#150](https://github.com/speee/jsx-slack/pull/150)) -- New logo and logo type ([#152](https://github.com/speee/jsx-slack/pull/152)) +- Support new JSX transpile via `automatic` runtime in Babel >= 7.9 _(experimental)_ ([#142](https://github.com/yhatt/jsx-slack/pull/142)) +- REPL demo now generates the permalink to specific JSX ([#149](https://github.com/yhatt/jsx-slack/pull/149)) +- Dark mode for REPL demo ([#150](https://github.com/yhatt/jsx-slack/pull/150)) +- New logo and logo type ([#152](https://github.com/yhatt/jsx-slack/pull/152)) ### Fixed -- Suggest string literals on IDE when typing the kind of conversation in `` ([#145](https://github.com/speee/jsx-slack/pull/145)) -- Fix typo in `README.md` ([#146](https://github.com/speee/jsx-slack/pull/146) by [@BLNCinema](https://github.com/BLNCinema)) +- Suggest string literals on IDE when typing the kind of conversation in `` ([#145](https://github.com/yhatt/jsx-slack/pull/145)) +- Fix typo in `README.md` ([#146](https://github.com/yhatt/jsx-slack/pull/146) by [@BLNCinema](https://github.com/BLNCinema)) ### Removed @@ -161,373 +170,373 @@ jsx-slack v2 has improved JSX structure and built-in components to output the _r ### Added -- `style` prop for `` composition object component ([#114](https://github.com/speee/jsx-slack/issues/114), [#139](https://github.com/speee/jsx-slack/pull/139)) -- `` inherits its style to assigned confirm composition object if `` has not defined style ([#139](https://github.com/speee/jsx-slack/pull/139)) +- `style` prop for `` composition object component ([#114](https://github.com/yhatt/jsx-slack/issues/114), [#139](https://github.com/yhatt/jsx-slack/pull/139)) +- `` inherits its style to assigned confirm composition object if `` has not defined style ([#139](https://github.com/yhatt/jsx-slack/pull/139)) ### Changed -- All props of `` component have made optional ([#138](https://github.com/speee/jsx-slack/issues/138), [#139](https://github.com/speee/jsx-slack/pull/139)) -- Upgrade dependent packages to the latest version ([#137](https://github.com/speee/jsx-slack/pull/137), [#140](https://github.com/speee/jsx-slack/pull/140)) +- All props of `` component have made optional ([#138](https://github.com/yhatt/jsx-slack/issues/138), [#139](https://github.com/yhatt/jsx-slack/pull/139)) +- Upgrade dependent packages to the latest version ([#137](https://github.com/yhatt/jsx-slack/pull/137), [#140](https://github.com/yhatt/jsx-slack/pull/140)) ## v1.6.0 - 2020-03-20 ### Added -- `responseUrlEnabled` property for modal's input component to `` and `` ([#134](https://github.com/speee/jsx-slack/issues/134), [#135](https://github.com/speee/jsx-slack/pull/135)) -- Experimental filter properties to ``: `include`, `excludeExternalSharedChannels`, and `excludeBotUsers` ([#133](https://github.com/speee/jsx-slack/issues/133), [#136](https://github.com/speee/jsx-slack/pull/136)) +- `responseUrlEnabled` property for modal's input component to `` and `` ([#134](https://github.com/yhatt/jsx-slack/issues/134), [#135](https://github.com/yhatt/jsx-slack/pull/135)) +- Experimental filter properties to ``: `include`, `excludeExternalSharedChannels`, and `excludeBotUsers` ([#133](https://github.com/yhatt/jsx-slack/issues/133), [#136](https://github.com/yhatt/jsx-slack/pull/136)) ## v1.5.1 - 2020-03-16 ### Added -- `value` attribute for `` element ([#130](https://github.com/speee/jsx-slack/pull/130)) +- `value` attribute for `` element ([#130](https://github.com/yhatt/jsx-slack/pull/130)) ### Fixed -- Fix mention detection to match to longer Slack ID ([#129](https://github.com/speee/jsx-slack/pull/129)) +- Fix mention detection to match to longer Slack ID ([#129](https://github.com/yhatt/jsx-slack/pull/129)) ### Changed -- Upgrade deep dependencies ([#131](https://github.com/speee/jsx-slack/pull/131)) +- Upgrade deep dependencies ([#131](https://github.com/yhatt/jsx-slack/pull/131)) ## v1.5.0 - 2020-03-12 ### Changed -- Improve escaping special characters to keep original character as possible ([#124](https://github.com/speee/jsx-slack/issues/124), [#125](https://github.com/speee/jsx-slack/pull/125)) -- Make JSX element for passing to Slack API serializable to JSON directly ([#126](https://github.com/speee/jsx-slack/pull/126)) -- `jsxslack` template literal tag now returns raw JSX element, or JSON if serializable ([#127](https://github.com/speee/jsx-slack/pull/127)) +- Improve escaping special characters to keep original character as possible ([#124](https://github.com/yhatt/jsx-slack/issues/124), [#125](https://github.com/yhatt/jsx-slack/pull/125)) +- Make JSX element for passing to Slack API serializable to JSON directly ([#126](https://github.com/yhatt/jsx-slack/pull/126)) +- `jsxslack` template literal tag now returns raw JSX element, or JSON if serializable ([#127](https://github.com/yhatt/jsx-slack/pull/127)) ### Added -- `jsxslack.raw` template literal tag to generate JSX element always ([#127](https://github.com/speee/jsx-slack/pull/127)) +- `jsxslack.raw` template literal tag to generate JSX element always ([#127](https://github.com/yhatt/jsx-slack/pull/127)) ### Deprecated -- Confusable `jsxslack.fragment` template literal tag has deprecated (Use `jsxslack` or `jsxslack.raw` instead) ([#127](https://github.com/speee/jsx-slack/pull/127)) +- Confusable `jsxslack.fragment` template literal tag has deprecated (Use `jsxslack` or `jsxslack.raw` instead) ([#127](https://github.com/yhatt/jsx-slack/pull/127)) ## v1.4.0 - 2020-03-06 ### Added -- Support `type` attribute for `` element ([#117](https://github.com/speee/jsx-slack/pull/117)) +- Support `type` attribute for `` element ([#117](https://github.com/yhatt/jsx-slack/pull/117)) ### Changed -- Allow text formatting through mrkdwn and HTML-like elements in `` ([#119](https://github.com/speee/jsx-slack/issues/119), [#122](https://github.com/speee/jsx-slack/pull/122)) -- Change spaces for indenting lists into unicode spaces that were based on measured width in Slack's font ([#117](https://github.com/speee/jsx-slack/pull/117)) -- Upgrade development Node and dependent packages to the latest version ([#123](https://github.com/speee/jsx-slack/pull/123)) +- Allow text formatting through mrkdwn and HTML-like elements in `` ([#119](https://github.com/yhatt/jsx-slack/issues/119), [#122](https://github.com/yhatt/jsx-slack/pull/122)) +- Change spaces for indenting lists into unicode spaces that were based on measured width in Slack's font ([#117](https://github.com/yhatt/jsx-slack/pull/117)) +- Upgrade development Node and dependent packages to the latest version ([#123](https://github.com/yhatt/jsx-slack/pull/123)) ### Fixed -- Prevent over-escaping for link and time formatting ([#118](https://github.com/speee/jsx-slack/issues/118), [#120](https://github.com/speee/jsx-slack/pull/120)) +- Prevent over-escaping for link and time formatting ([#118](https://github.com/yhatt/jsx-slack/issues/118), [#120](https://github.com/yhatt/jsx-slack/pull/120)) ### Deprecated -- Mark the legacy parser as deprecated ([#121](https://github.com/speee/jsx-slack/pull/121)) +- Mark the legacy parser as deprecated ([#121](https://github.com/yhatt/jsx-slack/pull/121)) ## v1.3.1 - 2020-02-14 ### Fixed -- Fix regression about not rendered special spaces around the content ([#113](https://github.com/speee/jsx-slack/pull/113)) +- Fix regression about not rendered special spaces around the content ([#113](https://github.com/yhatt/jsx-slack/pull/113)) ## v1.3.0 - 2020-02-14 ### Changed -- [Fully-rewrite HTML parser](https://github.com/speee/jsx-slack/blob/master/docs/html-like-formatting.md#about-parser) to reduce bundle size drastically (x43 smaller) ([#112](https://github.com/speee/jsx-slack/pull/112)) +- [Fully-rewrite HTML parser](https://github.com/yhatt/jsx-slack/blob/master/docs/html-like-formatting.md#about-parser) to reduce bundle size drastically (x43 smaller) ([#112](https://github.com/yhatt/jsx-slack/pull/112)) ### Added -- [`legacyParser()`](https://github.com/speee/jsx-slack/blob/master/docs/html-like-formatting.md#legacy-parser) for switching into legacy parser ([#112](https://github.com/speee/jsx-slack/pull/112)) +- [`legacyParser()`](https://github.com/yhatt/jsx-slack/blob/master/docs/html-like-formatting.md#legacy-parser) for switching into legacy parser ([#112](https://github.com/yhatt/jsx-slack/pull/112)) ## v1.2.0 - 2020-02-10 ### Added -- [``](https://github.com/speee/jsx-slack/blob/master/docs/block-elements.md#checkbox-group) and [``](https://github.com/speee/jsx-slack/blob/master/docs/block-elements.md#checkbox) interactive component ([#108](https://github.com/speee/jsx-slack/issues/108), [#109](https://github.com/speee/jsx-slack/pull/109)) -- [Redirect the content of `` element into `description`](https://github.com/speee/jsx-slack/blob/master/docs/block-elements.md#redirect-small-into-description) in `` and `` ([#109](https://github.com/speee/jsx-slack/pull/109)) -- Add the build for ES modules to make tree-shakable ([#110](https://github.com/speee/jsx-slack/pull/110)) +- [``](https://github.com/yhatt/jsx-slack/blob/master/docs/block-elements.md#checkbox-group) and [``](https://github.com/yhatt/jsx-slack/blob/master/docs/block-elements.md#checkbox) interactive component ([#108](https://github.com/yhatt/jsx-slack/issues/108), [#109](https://github.com/yhatt/jsx-slack/pull/109)) +- [Redirect the content of `` element into `description`](https://github.com/yhatt/jsx-slack/blob/master/docs/block-elements.md#redirect-small-into-description) in `` and `` ([#109](https://github.com/yhatt/jsx-slack/pull/109)) +- Add the build for ES modules to make tree-shakable ([#110](https://github.com/yhatt/jsx-slack/pull/110)) ### Changed -- Upgrade dependent packages to the latest version ([#107](https://github.com/speee/jsx-slack/pull/107)) +- Upgrade dependent packages to the latest version ([#107](https://github.com/yhatt/jsx-slack/pull/107)) - Upgrade development Node to 12.15.0 ## v1.1.0 - 2020-01-20 ### Added -- [Custom transformer](https://github.com/speee/jsx-slack/blob/master/docs/block-elements.md#custom-transformer) for modal's private metadata ([#106](https://github.com/speee/jsx-slack/pull/106)) +- [Custom transformer](https://github.com/yhatt/jsx-slack/blob/master/docs/block-elements.md#custom-transformer) for modal's private metadata ([#106](https://github.com/yhatt/jsx-slack/pull/106)) ### Changed -- Mark `` container as stable ([#105](https://github.com/speee/jsx-slack/pull/105)) +- Mark `` container as stable ([#105](https://github.com/yhatt/jsx-slack/pull/105)) ## v1.0.0 - 2020-01-10 ### Breaking -- Components for [the outdated dialog](https://api.slack.com/dialogs) provided in `@speee-js/jsx-slack/dialog` can no longer use ([#84](https://github.com/speee/jsx-slack/pull/84)) -- Drop Node 8 support ([#100](https://github.com/speee/jsx-slack/pull/100)) +- Components for [the outdated dialog](https://api.slack.com/dialogs) provided in `jsx-slack/dialog` can no longer use ([#84](https://github.com/yhatt/jsx-slack/pull/84)) +- Drop Node 8 support ([#100](https://github.com/yhatt/jsx-slack/pull/100)) ### Added -- `` text composition component ([#73](https://github.com/speee/jsx-slack/issues/73), [#97](https://github.com/speee/jsx-slack/pull/97) by [@javaPhil](https://github.com/javaPhil), [#103](https://github.com/speee/jsx-slack/pull/103)) +- `` text composition component ([#73](https://github.com/yhatt/jsx-slack/issues/73), [#97](https://github.com/yhatt/jsx-slack/pull/97) by [@javaPhil](https://github.com/javaPhil), [#103](https://github.com/yhatt/jsx-slack/pull/103)) ### Fixed -- Prevent over-escaping in valid emoji shorthand ([#98](https://github.com/speee/jsx-slack/issues/98), [#101](https://github.com/speee/jsx-slack/pull/101)) +- Prevent over-escaping in valid emoji shorthand ([#98](https://github.com/yhatt/jsx-slack/issues/98), [#101](https://github.com/yhatt/jsx-slack/pull/101)) ### Changed -- Upgrade dependent packages to the latest version ([#92](https://github.com/speee/jsx-slack/pull/92), [#104](https://github.com/speee/jsx-slack/pull/104)) -- Upgrade development Node to 12.14.1 ([#104](https://github.com/speee/jsx-slack/pull/104)) +- Upgrade dependent packages to the latest version ([#92](https://github.com/yhatt/jsx-slack/pull/92), [#104](https://github.com/yhatt/jsx-slack/pull/104)) +- Upgrade development Node to 12.14.1 ([#104](https://github.com/yhatt/jsx-slack/pull/104)) ### Removed -- Remove deprecated dialog support ([#84](https://github.com/speee/jsx-slack/pull/84), [#99](https://github.com/speee/jsx-slack/pull/99)) -- Get rid of `lodash.flattendeep` dependency ([#102](https://github.com/speee/jsx-slack/pull/102)) +- Remove deprecated dialog support ([#84](https://github.com/yhatt/jsx-slack/pull/84), [#99](https://github.com/yhatt/jsx-slack/pull/99)) +- Get rid of `lodash.flattendeep` dependency ([#102](https://github.com/yhatt/jsx-slack/pull/102)) ## v0.12.0 - 2019-11-22 ### Added -- Radio buttons for modal ([#88](https://github.com/speee/jsx-slack/issues/88), [#91](https://github.com/speee/jsx-slack/pull/91)) +- Radio buttons for modal ([#88](https://github.com/yhatt/jsx-slack/issues/88), [#91](https://github.com/yhatt/jsx-slack/pull/91)) - `` now can use in `` container and acts as input component for modal ### Changed -- Upgrade dependent packages to the latest version ([#90](https://github.com/speee/jsx-slack/pull/90)) +- Upgrade dependent packages to the latest version ([#90](https://github.com/yhatt/jsx-slack/pull/90)) ## v0.11.1 - 2019-11-13 ### Fixed -- Don't throw error even if `` has only one `` ([#85](https://github.com/speee/jsx-slack/issues/85), [#86](https://github.com/speee/jsx-slack/pull/86)) -- Fix 413 error from Block Kit Builder when translated huge JSON on REPL demo ([#82](https://github.com/speee/jsx-slack/pull/82)) -- Improve internal type definitions for overloaded props ([#83](https://github.com/speee/jsx-slack/pull/83)) +- Don't throw error even if `` has only one `` ([#85](https://github.com/yhatt/jsx-slack/issues/85), [#86](https://github.com/yhatt/jsx-slack/pull/86)) +- Fix 413 error from Block Kit Builder when translated huge JSON on REPL demo ([#82](https://github.com/yhatt/jsx-slack/pull/82)) +- Improve internal type definitions for overloaded props ([#83](https://github.com/yhatt/jsx-slack/pull/83)) ### Changed -- Upgrade dependent packages to the latest version ([#87](https://github.com/speee/jsx-slack/pull/87)) +- Upgrade dependent packages to the latest version ([#87](https://github.com/yhatt/jsx-slack/pull/87)) ## v0.11.0 - 2019-10-24 ### Added -- Add (an experimental) `` container component for home tab ([#75](https://github.com/speee/jsx-slack/issues/75), [#78](https://github.com/speee/jsx-slack/pull/78)) -- [``](https://github.com/speee/jsx-slack/blob/master/docs/block-elements.md#radio-button-group) and [``](https://github.com/speee/jsx-slack/blob/master/docs/block-elements.md#radio-button) interactive component for home tab ([#74](https://github.com/speee/jsx-slack/issues/74), [#80](https://github.com/speee/jsx-slack/pull/80)) -- "Copy to clipboard" button on REPL demo ([#77](https://github.com/speee/jsx-slack/pull/77)) +- Add (an experimental) `` container component for home tab ([#75](https://github.com/yhatt/jsx-slack/issues/75), [#78](https://github.com/yhatt/jsx-slack/pull/78)) +- [``](https://github.com/yhatt/jsx-slack/blob/master/docs/block-elements.md#radio-button-group) and [``](https://github.com/yhatt/jsx-slack/blob/master/docs/block-elements.md#radio-button) interactive component for home tab ([#74](https://github.com/yhatt/jsx-slack/issues/74), [#80](https://github.com/yhatt/jsx-slack/pull/80)) +- "Copy to clipboard" button on REPL demo ([#77](https://github.com/yhatt/jsx-slack/pull/77)) ### Changed -- Upgrade Node for development to v12 LTS ([#79](https://github.com/speee/jsx-slack/pull/79)) +- Upgrade Node for development to v12 LTS ([#79](https://github.com/yhatt/jsx-slack/pull/79)) ### Fixed -- Throw an error when using `` in `` ([#76](https://github.com/speee/jsx-slack/pull/76)) -- REPL demo can transfer the complete modal JSON to Block Kit Builder ([#77](https://github.com/speee/jsx-slack/pull/77)) +- Throw an error when using `` in `` ([#76](https://github.com/yhatt/jsx-slack/pull/76)) +- REPL demo can transfer the complete modal JSON to Block Kit Builder ([#77](https://github.com/yhatt/jsx-slack/pull/77)) ### Deprecated -- Output warning about deprecated dialog components ([#72](https://github.com/speee/jsx-slack/pull/72)) +- Output warning about deprecated dialog components ([#72](https://github.com/yhatt/jsx-slack/pull/72)) ## v0.10.2 - 2019-10-11 ### Fixed -- Make interpolated fragments in template literal work correctly ([#71](https://github.com/speee/jsx-slack/pull/71)) +- Make interpolated fragments in template literal work correctly ([#71](https://github.com/yhatt/jsx-slack/pull/71)) ## v0.10.1 - 2019-10-10 ### Fixed -- Fix invalid array children in template literal ([#69](https://github.com/speee/jsx-slack/pull/69)) +- Fix invalid array children in template literal ([#69](https://github.com/yhatt/jsx-slack/pull/69)) ### Changed -- Upgrade Node and dependent packages to the latest version ([#70](https://github.com/speee/jsx-slack/pull/70)) +- Upgrade Node and dependent packages to the latest version ([#70](https://github.com/yhatt/jsx-slack/pull/70)) ## v0.10.0 - 2019-10-02 ### Added -- [Multi-select menus](https://api.slack.com/reference/block-kit/block-elements#multi_select) ([#56](https://github.com/speee/jsx-slack/issues/56), [#58](https://github.com/speee/jsx-slack/pull/58)) -- [Modals support](https://api.slack.com/block-kit/surfaces/modals) ([#57](https://github.com/speee/jsx-slack/issues/57)) - - `` container component ([#60](https://github.com/speee/jsx-slack/pull/60)) - - `` layout block and component ([#61](https://github.com/speee/jsx-slack/pull/61)) - - `` component ([#62](https://github.com/speee/jsx-slack/pull/62)) - - Input-compatible props to select-like elements and `` ([#63](https://github.com/speee/jsx-slack/pull/63)) - - Intrinsic HTML elements of input components ([#65](https://github.com/speee/jsx-slack/pull/65)) - - Add extra types for `` component ([#66](https://github.com/speee/jsx-slack/pull/66)) - - Update REPL demo to support Modals ([#68](https://github.com/speee/jsx-slack/pull/68)) +- [Multi-select menus](https://api.slack.com/reference/block-kit/block-elements#multi_select) ([#56](https://github.com/yhatt/jsx-slack/issues/56), [#58](https://github.com/yhatt/jsx-slack/pull/58)) +- [Modals support](https://api.slack.com/block-kit/surfaces/modals) ([#57](https://github.com/yhatt/jsx-slack/issues/57)) + - `` container component ([#60](https://github.com/yhatt/jsx-slack/pull/60)) + - `` layout block and component ([#61](https://github.com/yhatt/jsx-slack/pull/61)) + - `` component ([#62](https://github.com/yhatt/jsx-slack/pull/62)) + - Input-compatible props to select-like elements and `` ([#63](https://github.com/yhatt/jsx-slack/pull/63)) + - Intrinsic HTML elements of input components ([#65](https://github.com/yhatt/jsx-slack/pull/65)) + - Add extra types for `` component ([#66](https://github.com/yhatt/jsx-slack/pull/66)) + - Update REPL demo to support Modals ([#68](https://github.com/yhatt/jsx-slack/pull/68)) ### Changed -- Bump dependent packages to the latest version ([#59](https://github.com/speee/jsx-slack/pull/59)) -- Check invalid elements in `` and `` strictly ([#64](https://github.com/speee/jsx-slack/pull/64)) -- Split test cases for Block Kit components into multiple files ([#66](https://github.com/speee/jsx-slack/pull/66)) -- Organize documentation ([#20](https://github.com/speee/jsx-slack/issues/20), [#67](https://github.com/speee/jsx-slack/pull/67)) +- Bump dependent packages to the latest version ([#59](https://github.com/yhatt/jsx-slack/pull/59)) +- Check invalid elements in `` and `` strictly ([#64](https://github.com/yhatt/jsx-slack/pull/64)) +- Split test cases for Block Kit components into multiple files ([#66](https://github.com/yhatt/jsx-slack/pull/66)) +- Organize documentation ([#20](https://github.com/yhatt/jsx-slack/issues/20), [#67](https://github.com/yhatt/jsx-slack/pull/67)) ### Deprecated -- Mark `` as soft-deprecated in favor of Slack Modals ([#60](https://github.com/speee/jsx-slack/pull/60)) +- Mark `` as soft-deprecated in favor of Slack Modals ([#60](https://github.com/yhatt/jsx-slack/pull/60)) ## v0.9.2 - 2019-08-29 ### Fixed -- Nested fragments fail ([#53](https://github.com/speee/jsx-slack/issues/53), [#54](https://github.com/speee/jsx-slack/pull/54)) +- Nested fragments fail ([#53](https://github.com/yhatt/jsx-slack/issues/53), [#54](https://github.com/yhatt/jsx-slack/pull/54)) ### Changed -- Update dependent packages to the latest version ([#52](https://github.com/speee/jsx-slack/pull/52)) +- Update dependent packages to the latest version ([#52](https://github.com/yhatt/jsx-slack/pull/52)) ## v0.9.1 - 2019-08-15 ### Fixed -- Fix regression of not preserved `` whitespaces ([#48](https://github.com/speee/jsx-slack/issues/48), [#49](https://github.com/speee/jsx-slack/pull/49)) +- Fix regression of not preserved `` whitespaces ([#48](https://github.com/yhatt/jsx-slack/issues/48), [#49](https://github.com/yhatt/jsx-slack/pull/49)) ### Changed -- Update dependent packages to the latest version ([#50](https://github.com/speee/jsx-slack/pull/50)) +- Update dependent packages to the latest version ([#50](https://github.com/yhatt/jsx-slack/pull/50)) ## v0.9.0 - 2019-08-15 ### Breaking -- Disabled heuristic detection for HTML entities (Escaping works [just as same as React JSX](https://reactjs.org/docs/jsx-in-depth.html#string-literals)) ([#33](https://github.com/speee/jsx-slack/pull/33)) -- Some raw characters for mrkdwn link, `<`, `>`, and `&` will always escape to entities ([#45](https://github.com/speee/jsx-slack/issues/45)) +- Disabled heuristic detection for HTML entities (Escaping works [just as same as React JSX](https://reactjs.org/docs/jsx-in-depth.html#string-literals)) ([#33](https://github.com/yhatt/jsx-slack/pull/33)) +- Some raw characters for mrkdwn link, `<`, `>`, and `&` will always escape to entities ([#45](https://github.com/yhatt/jsx-slack/issues/45)) ### Changed -- Improve html entity decoding in JSX and template literal tag ([#33](https://github.com/speee/jsx-slack/pull/33), [#45](https://github.com/speee/jsx-slack/issues/45), [#47](https://github.com/speee/jsx-slack/pull/47)) -- Allow links in the inside of `` and `` element ([#16](https://github.com/speee/jsx-slack/pull/16), [#46](https://github.com/speee/jsx-slack/pull/46)) +- Improve html entity decoding in JSX and template literal tag ([#33](https://github.com/yhatt/jsx-slack/pull/33), [#45](https://github.com/yhatt/jsx-slack/issues/45), [#47](https://github.com/yhatt/jsx-slack/pull/47)) +- Allow links in the inside of `` and `` element ([#16](https://github.com/yhatt/jsx-slack/pull/16), [#46](https://github.com/yhatt/jsx-slack/pull/46)) ## v0.8.1 - 2019-08-07 ### Added -- Better dialog support for `jsxslack` template literal ([#42](https://github.com/speee/jsx-slack/issues/42), [#43](https://github.com/speee/jsx-slack/pull/43)) -- Update REPL demo to add dialog example ([#43](https://github.com/speee/jsx-slack/pull/43)) +- Better dialog support for `jsxslack` template literal ([#42](https://github.com/yhatt/jsx-slack/issues/42), [#43](https://github.com/yhatt/jsx-slack/pull/43)) +- Update REPL demo to add dialog example ([#43](https://github.com/yhatt/jsx-slack/pull/43)) ### Fixed -- Coerce number-expected prop to integer ([#44](https://github.com/speee/jsx-slack/pull/44)) +- Coerce number-expected prop to integer ([#44](https://github.com/yhatt/jsx-slack/pull/44)) ## v0.8.0 - 2019-08-06 ### Added -- Dialog support ([#19](https://github.com/speee/jsx-slack/issues/19), [#39](https://github.com/speee/jsx-slack/pull/39)) +- Dialog support ([#19](https://github.com/yhatt/jsx-slack/issues/19), [#39](https://github.com/yhatt/jsx-slack/pull/39)) ### Fixed -- Don't prevent generating `` with no options ([#41](https://github.com/speee/jsx-slack/pull/41)) +- Don't prevent generating `` with no options ([#41](https://github.com/yhatt/jsx-slack/pull/41)) ### Changed -- Update `htm` to [v2.2.0](https://github.com/developit/htm/releases/tag/2.2.0) ([#38](https://github.com/speee/jsx-slack/pull/38)) +- Update `htm` to [v2.2.0](https://github.com/developit/htm/releases/tag/2.2.0) ([#38](https://github.com/yhatt/jsx-slack/pull/38)) ## v0.7.0 - 2019-07-29 ### Added -- `` block component ([#34](https://github.com/speee/jsx-slack/issues/34), [#35](https://github.com/speee/jsx-slack/pull/35)) -- `jsxslack.fragment` template literal tag ([#32](https://github.com/speee/jsx-slack/pull/32)) -- Codecov integration and coverage badge ([#36](https://github.com/speee/jsx-slack/pull/36)) +- `` block component ([#34](https://github.com/yhatt/jsx-slack/issues/34), [#35](https://github.com/yhatt/jsx-slack/pull/35)) +- `jsxslack.fragment` template literal tag ([#32](https://github.com/yhatt/jsx-slack/pull/32)) +- Codecov integration and coverage badge ([#36](https://github.com/yhatt/jsx-slack/pull/36)) ### Changed -- Update dependent packages to the latest version ([#37](https://github.com/speee/jsx-slack/pull/37)) +- Update dependent packages to the latest version ([#37](https://github.com/yhatt/jsx-slack/pull/37)) ## v0.6.0 - 2019-07-20 ### Added -- Convert `` in `` into mrkdwn element ([#26](https://github.com/speee/jsx-slack/issues/26), [#31](https://github.com/speee/jsx-slack/pull/31)) -- `` built-in component ([#29](https://github.com/speee/jsx-slack/pull/29)) +- Convert `` in `` into mrkdwn element ([#26](https://github.com/yhatt/jsx-slack/issues/26), [#31](https://github.com/yhatt/jsx-slack/pull/31)) +- `` built-in component ([#29](https://github.com/yhatt/jsx-slack/pull/29)) ## v0.5.1 - 2019-07-14 ### Added -- Support mention to global user ID for Enterprise Grid ([#25](https://github.com/speee/jsx-slack/pull/25)) +- Support mention to global user ID for Enterprise Grid ([#25](https://github.com/yhatt/jsx-slack/pull/25)) ### Changed -- Update dependent packages to the latest version ([#28](https://github.com/speee/jsx-slack/pull/28)) +- Update dependent packages to the latest version ([#28](https://github.com/yhatt/jsx-slack/pull/28)) ## v0.5.0 - 2019-06-28 ### Added -- Support Node.js 12 ([#23](https://github.com/speee/jsx-slack/pull/23)) +- Support Node.js 12 ([#23](https://github.com/yhatt/jsx-slack/pull/23)) ### Changed -- Make interchangeable with `` component and intrinsic `` tag ([#21](https://github.com/speee/jsx-slack/pull/21)) -- Upgrade dependent packages to the latest version ([#24](https://github.com/speee/jsx-slack/pull/24)) +- Make interchangeable with `` component and intrinsic `` tag ([#21](https://github.com/yhatt/jsx-slack/pull/21)) +- Upgrade dependent packages to the latest version ([#24](https://github.com/yhatt/jsx-slack/pull/24)) ### Removed -- Remove deprecated `` component ([#22](https://github.com/speee/jsx-slack/pull/22)) +- Remove deprecated `` component ([#22](https://github.com/yhatt/jsx-slack/pull/22)) ## v0.4.3 - 2019-05-15 ### Fixed -- Fix vanishing styled channel links and mentions ([#15](https://github.com/speee/jsx-slack/issues/15), [#17](https://github.com/speee/jsx-slack/pull/17)) +- Fix vanishing styled channel links and mentions ([#15](https://github.com/yhatt/jsx-slack/issues/15), [#17](https://github.com/yhatt/jsx-slack/pull/17)) ### Changed -- Upgrade dependent packages to the latest version ([#18](https://github.com/speee/jsx-slack/pull/18)) +- Upgrade dependent packages to the latest version ([#18](https://github.com/yhatt/jsx-slack/pull/18)) ## v0.4.2 - 2019-04-13 ### Added -- Add `style` prop for `` component ([#13](https://github.com/speee/jsx-slack/issues/13), [#14](https://github.com/speee/jsx-slack/pull/14)) +- Add `style` prop for `` component ([#13](https://github.com/yhatt/jsx-slack/issues/13), [#14](https://github.com/yhatt/jsx-slack/pull/14)) ## v0.4.1 - 2019-03-13 ### Added -- `` container component ([#12](https://github.com/speee/jsx-slack/pull/12)) +- `` container component ([#12](https://github.com/yhatt/jsx-slack/pull/12)) ### Deprecated -- Mark a confusable `` fragment component as deprecated in favor of added `` ([#11](https://github.com/speee/jsx-slack/issues/11), [#12](https://github.com/speee/jsx-slack/pull/12)) +- Mark a confusable `` fragment component as deprecated in favor of added `` ([#11](https://github.com/yhatt/jsx-slack/issues/11), [#12](https://github.com/yhatt/jsx-slack/pull/12)) ## v0.4.0 - 2019-03-12 ### Added -- Support nested list ([#10](https://github.com/speee/jsx-slack/pull/10)) +- Support nested list ([#10](https://github.com/yhatt/jsx-slack/pull/10)) ## v0.3.0 - 2019-03-11 ### Added -- Add `` component ([#9](https://github.com/speee/jsx-slack/pull/9)) +- Add `` component ([#9](https://github.com/yhatt/jsx-slack/pull/9)) ### Changed -- Right-aligned number in ordered list ([#8](https://github.com/speee/jsx-slack/pull/8)) +- Right-aligned number in ordered list ([#8](https://github.com/yhatt/jsx-slack/pull/8)) ## v0.2.0 - 2019-03-07 ### Added -- `jsxslack` template literal tag for using jsx-slack without transpiler, powered by [htm](https://github.com/developit/htm) ([#6](https://github.com/speee/jsx-slack/issues/6), [#7](https://github.com/speee/jsx-slack/pull/7)) +- `jsxslack` template literal tag for using jsx-slack without transpiler, powered by [htm](https://github.com/developit/htm) ([#6](https://github.com/yhatt/jsx-slack/issues/6), [#7](https://github.com/yhatt/jsx-slack/pull/7)) ### Fixed -- Improve `README.md` with some minor fixes ([#4](https://github.com/speee/jsx-slack/pull/4)) -- Revert ignored audit ([#5](https://github.com/speee/jsx-slack/pull/5)) +- Improve `README.md` with some minor fixes ([#4](https://github.com/yhatt/jsx-slack/pull/4)) +- Revert ignored audit ([#5](https://github.com/yhatt/jsx-slack/pull/5)) ## v0.1.0 - 2019-03-01 diff --git a/LICENSE b/LICENSE index 30d59f4c..87a0a91d 100644 --- a/LICENSE +++ b/LICENSE @@ -1,6 +1,6 @@ MIT License -Copyright (c) 2019- Yuki Hattori (yuki.hattori@speee.jp) and Speee, Inc. +Copyright (c) 2019- Yuki Hattori (yukihattori1116@gmail.com). Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal diff --git a/README.md b/README.md index 7b5e5a29..2bb6a253 100644 --- a/README.md +++ b/README.md @@ -1,23 +1,21 @@ - - - + + + jsx-slack -[![CircleCI](https://img.shields.io/circleci/project/github/speee/jsx-slack/master.svg?logo=circleci)][circleci] -[![Codecov](https://img.shields.io/codecov/c/github/speee/jsx-slack/master.svg?logo=codecov)](https://codecov.io/gh/speee/jsx-slack) -[![npm](https://img.shields.io/npm/v/@speee-js/jsx-slack.svg?logo=npm)][npm] -[![LICENSE](https://img.shields.io/github/license/speee/jsx-slack.svg)][license] +[![CircleCI](https://img.shields.io/circleci/project/github/yhatt/jsx-slack/master.svg?logo=circleci)][circleci] +[![Codecov](https://img.shields.io/codecov/c/github/yhatt/jsx-slack/master.svg?logo=codecov)](https://codecov.io/gh/yhatt/jsx-slack) +[![npm](https://img.shields.io/npm/v/jsx-slack.svg?logo=npm)][npm] +[![LICENSE](https://img.shields.io/github/license/yhatt/jsx-slack.svg)][license] -[circleci]: https://circleci.com/gh/speee/jsx-slack/ -[npm]: https://npm.im/@speee-js/jsx-slack +[circleci]: https://circleci.com/gh/yhatt/jsx-slack/ +[npm]: https://npm.im/jsx-slack [license]: ./LICENSE Build JSON object for [Slack][slack] [block kit] surfaces from [JSX]. -> :sparkles: **We have sparkling jsx-slack v2!** :sparkles: **[▶︎ See highlight of v2](docs/highlight/v2.md)** - [slack]: https://slack.com [jsx]: https://reactjs.org/docs/introducing-jsx.html [react]: https://reactjs.org/ @@ -25,16 +23,16 @@ Build JSON object for [Slack][slack] [block kit] surfaces from [JSX]. [block kit builder]: https://api.slack.com/tools/block-kit-builder - - + + - - + + -:point_right: **[Try our REPL demo](https://speee-jsx-slack.netlify.app/)** in https://speee-jsx-slack.netlify.app/. +:point_right: **[Try our REPL demo](https://jsx-slack.netlify.app/)** in https://jsx-slack.netlify.app/. ### Features @@ -61,12 +59,12 @@ We require Node.js >= 10. If you are using TypeScript, we also require TS >= 3.7 ```bash # npm -npm install --save @speee-js/jsx-slack +npm install --save jsx-slack ``` ```bash # yarn -yarn add @speee-js/jsx-slack +yarn add jsx-slack ``` ## Usage @@ -80,7 +78,7 @@ It allows the template syntax almost same as JSX, powered by [HTM (Hyperscript T This is a simple example of the template function just to say hello to someone. ```javascript -import { jsxslack } from '@speee-js/jsx-slack' +import { jsxslack } from 'jsx-slack' export const exampleBlock = ({ name }) => jsxslack` @@ -97,7 +95,7 @@ When you want to use jsx-slack with JSX transpiler, you have to set up to use im ```jsx /** @jsx JSXSlack.h */ -import { JSXSlack, Blocks, Section } from '@speee-js/jsx-slack' +import { JSXSlack, Blocks, Section } from 'jsx-slack' export const exampleBlock = ({ name }) => ( @@ -135,7 +133,7 @@ It would post a simple Slack message like this: [][block-kit-builder-example] -[block-kit-builder-example]: https://speee-jsx-slack.netlify.app/#bkb:jsx:eJyzccrJT84utuNSULAJTk0uyczPA7EVFDxSc3LydRRskuwiS7MzFTwSS0ryizJt9JPsFEFq9eGKbfShRgAAVeQWug== +[block-kit-builder-example]: https://jsx-slack.netlify.app/#bkb:jsx:eJyzccrJT84utuNSULAJTk0uyczPA7EVFDxSc3LydRRskuwiS7MzFTwSS0ryizJt9JPsFEFq9eGKbfShRgAAVeQWug== ## Block Kit as components @@ -143,7 +141,7 @@ Slack has recommended to use **[Block Kit]** for building tempting messages and By using jsx-slack, you can build a template with piling up Block Kit blocks by JSX. It is feeling like using components in React or Vue. -### [For messaging](https://speee-jsx-slack.netlify.app/) +### [For messaging](https://jsx-slack.netlify.app/) ```jsx @@ -151,12 +149,12 @@ By using jsx-slack, you can build a template with piling up Block Kit blocks by Enjoy building blocks! - @speee-js/jsx-slack + jsx-slack Build JSON for Slack Block Kit from JSX - + Maintained by Yuki Hattori @@ -164,13 +162,13 @@ By using jsx-slack, you can build a template with piling up Block Kit blocks by - GitHub - npm + GitHub + npm ``` -### [For modal](https://speee-jsx-slack.netlify.app/#modal) +### [For modal](https://jsx-slack.netlify.app/#modal) ```jsx @@ -199,7 +197,7 @@ By using jsx-slack, you can build a template with piling up Block Kit blocks by ``` -### [For home tab](https://speee-jsx-slack.netlify.app/#home) +### [For home tab](https://jsx-slack.netlify.app/#home) ```jsx @@ -249,37 +247,39 @@ By using jsx-slack, you can build a template with piling up Block Kit blocks by * **[HTML-like formatting](docs/html-like-formatting.md)** * **[About escape and exact mode](docs/about-escape-and-exact-mode.md)** +- **[Highlight of v2](docs/highlight/v2.md)** + ### Examples by use cases Ported from templates for [Block Kit Builder]. #### [Message](https://api.slack.com/tools/block-kit-builder?mode=message&template=1) -- [Approval (New device request)](https://speee-jsx-slack.netlify.app/#messagingApprovalNewDevice) -- [Approval (Time Off request)](https://speee-jsx-slack.netlify.app/#messagingApprovalTimeOff) -- [Notification](https://speee-jsx-slack.netlify.app/#messagingNotification) -- [Onboarding (Taskbot)](https://speee-jsx-slack.netlify.app/#messagingOnboardingTaskbot) -- [Onboarding (Onboarding App)](https://speee-jsx-slack.netlify.app/#messagingOnboardingApp) -- [Poll](https://speee-jsx-slack.netlify.app/#messagingPoll) -- [Search Results (TripAgent)](https://speee-jsx-slack.netlify.app/#messagingSearchResultsTripAgent) -- [Search Results (FileCard Agent)](https://speee-jsx-slack.netlify.app/#messagingSearchResultsFileCard) -- [Newsletter](https://speee-jsx-slack.netlify.app/#messagingNewsletter) +- [Approval (New device request)](https://jsx-slack.netlify.app/#messagingApprovalNewDevice) +- [Approval (Time Off request)](https://jsx-slack.netlify.app/#messagingApprovalTimeOff) +- [Notification](https://jsx-slack.netlify.app/#messagingNotification) +- [Onboarding (Taskbot)](https://jsx-slack.netlify.app/#messagingOnboardingTaskbot) +- [Onboarding (Onboarding App)](https://jsx-slack.netlify.app/#messagingOnboardingApp) +- [Poll](https://jsx-slack.netlify.app/#messagingPoll) +- [Search Results (TripAgent)](https://jsx-slack.netlify.app/#messagingSearchResultsTripAgent) +- [Search Results (FileCard Agent)](https://jsx-slack.netlify.app/#messagingSearchResultsFileCard) +- [Newsletter](https://jsx-slack.netlify.app/#messagingNewsletter) #### [Modal](https://api.slack.com/tools/block-kit-builder?mode=modal&template=1) -- [Poll](https://speee-jsx-slack.netlify.app/#modalPoll) -- [Search Results](https://speee-jsx-slack.netlify.app/#modalSearchResults) -- [Settings (App menu)](https://speee-jsx-slack.netlify.app/#modalSettingsAppMenu) -- [Settings (Notification settings)](https://speee-jsx-slack.netlify.app/#modalSettingsNotification) -- [List of information (Your itinerary)](https://speee-jsx-slack.netlify.app/#modalListOfInformationYourItinerary) -- [List of information (Ticket app)](https://speee-jsx-slack.netlify.app/#modalListOfInformationTicketApp) +- [Poll](https://jsx-slack.netlify.app/#modalPoll) +- [Search Results](https://jsx-slack.netlify.app/#modalSearchResults) +- [Settings (App menu)](https://jsx-slack.netlify.app/#modalSettingsAppMenu) +- [Settings (Notification settings)](https://jsx-slack.netlify.app/#modalSettingsNotification) +- [List of information (Your itinerary)](https://jsx-slack.netlify.app/#modalListOfInformationYourItinerary) +- [List of information (Ticket app)](https://jsx-slack.netlify.app/#modalListOfInformationTicketApp) #### [App Home](https://api.slack.com/tools/block-kit-builder?mode=appHome&template=1) -- [Project Tracker](https://speee-jsx-slack.netlify.app/#appHomeProjectTracker) -- [Calendar](https://speee-jsx-slack.netlify.app/#appHomeCalendar) -- [Expense App](https://speee-jsx-slack.netlify.app/#appHomeExpenseApp) -- [Todo App](https://speee-jsx-slack.netlify.app/#appHomeTodoApp) +- [Project Tracker](https://jsx-slack.netlify.app/#appHomeProjectTracker) +- [Calendar](https://jsx-slack.netlify.app/#appHomeCalendar) +- [Expense App](https://jsx-slack.netlify.app/#appHomeExpenseApp) +- [Todo App](https://jsx-slack.netlify.app/#appHomeTodoApp) ## Fragments @@ -291,7 +291,7 @@ Let's say about defining `` custom block that is consisted by ` ( @@ -318,7 +318,7 @@ Now the defined block can use in `` as like as the other blocks: [][custom-header-block] -[custom-header-block]: https://speee-jsx-slack.netlify.app/#bkb:jsx:eJxVjrEOgzAQQ3e-4jYmejs6Zag6duMLSIjQlZRIOEHt3xcaBphsD8-23EN0E0xFJJ13SeO8-y3ZoptT88KnQejdRC4jxTfZnRJWQy3yPIYe8GgLyH9S-FQnD1118AvxZejpUw2yWcNA35iXUns7ocLHvx9tITN_ +[custom-header-block]: https://jsx-slack.netlify.app/#bkb:jsx:eJxVjrEOgzAQQ3e-4jYmejs6Zag6duMLSIjQlZRIOEHt3xcaBphsD8-23EN0E0xFJJ13SeO8-y3ZoptT88KnQejdRC4jxTfZnRJWQy3yPIYe8GgLyH9S-FQnD1118AvxZejpUw2yWcNA35iXUns7ocLHvx9tITN_ ### Short syntax for fragments @@ -327,7 +327,7 @@ Babel transpiler and TypeScript 4 can use [the short syntax `<>>` for fragment ```javascript /** @jsx JSXSlack.h */ /** @jsxFrag JSXSlack.Fragment */ -import { JSXSlack } from '@speee-js/jsx-slack' +import { JSXSlack } from 'jsx-slack' const Header = ({ children }) => ( <> @@ -345,7 +345,7 @@ const Header = ({ children }) => ( ```javascript // Header.js -import { jsxslack } from '@speee-js/jsx-slack' +import { jsxslack } from 'jsx-slack' export const Header = ({ children }) => jsxslack` @@ -358,7 +358,7 @@ export const Header = ({ children }) => jsxslack` A defined component may use in `jsxslack` tag as below: ```javascript -import { jsxslack } from '@speee-js/jsx-slack' +import { jsxslack } from 'jsx-slack' import { Header } from './Header' console.log(jsxslack` @@ -405,8 +405,6 @@ FYI there are some projects based on React ([react-reconciler](https://github.co ## Author -Managed by [ Speee, Inc.](https://speee.jp) ([@speee](https://github.com/speee)) - - Yuki Hattori ([@yhatt](https://github.com/yhatt)) - Maintainer ## License diff --git a/demo/examples/basic.js b/demo/examples/basic.js index 446c4a04..45e488cd 100644 --- a/demo/examples/basic.js +++ b/demo/examples/basic.js @@ -6,12 +6,12 @@ export const message = `
` whitespaces ([#48](https://github.com/speee/jsx-slack/issues/48), [#49](https://github.com/speee/jsx-slack/pull/49)) +- Fix regression of not preserved `` whitespaces ([#48](https://github.com/yhatt/jsx-slack/issues/48), [#49](https://github.com/yhatt/jsx-slack/pull/49)) ### Changed -- Update dependent packages to the latest version ([#50](https://github.com/speee/jsx-slack/pull/50)) +- Update dependent packages to the latest version ([#50](https://github.com/yhatt/jsx-slack/pull/50)) ## v0.9.0 - 2019-08-15 ### Breaking -- Disabled heuristic detection for HTML entities (Escaping works [just as same as React JSX](https://reactjs.org/docs/jsx-in-depth.html#string-literals)) ([#33](https://github.com/speee/jsx-slack/pull/33)) -- Some raw characters for mrkdwn link, `<`, `>`, and `&` will always escape to entities ([#45](https://github.com/speee/jsx-slack/issues/45)) +- Disabled heuristic detection for HTML entities (Escaping works [just as same as React JSX](https://reactjs.org/docs/jsx-in-depth.html#string-literals)) ([#33](https://github.com/yhatt/jsx-slack/pull/33)) +- Some raw characters for mrkdwn link, `<`, `>`, and `&` will always escape to entities ([#45](https://github.com/yhatt/jsx-slack/issues/45)) ### Changed -- Improve html entity decoding in JSX and template literal tag ([#33](https://github.com/speee/jsx-slack/pull/33), [#45](https://github.com/speee/jsx-slack/issues/45), [#47](https://github.com/speee/jsx-slack/pull/47)) -- Allow links in the inside of `` and `` element ([#16](https://github.com/speee/jsx-slack/pull/16), [#46](https://github.com/speee/jsx-slack/pull/46)) +- Improve html entity decoding in JSX and template literal tag ([#33](https://github.com/yhatt/jsx-slack/pull/33), [#45](https://github.com/yhatt/jsx-slack/issues/45), [#47](https://github.com/yhatt/jsx-slack/pull/47)) +- Allow links in the inside of `` and `` element ([#16](https://github.com/yhatt/jsx-slack/pull/16), [#46](https://github.com/yhatt/jsx-slack/pull/46)) ## v0.8.1 - 2019-08-07 ### Added -- Better dialog support for `jsxslack` template literal ([#42](https://github.com/speee/jsx-slack/issues/42), [#43](https://github.com/speee/jsx-slack/pull/43)) -- Update REPL demo to add dialog example ([#43](https://github.com/speee/jsx-slack/pull/43)) +- Better dialog support for `jsxslack` template literal ([#42](https://github.com/yhatt/jsx-slack/issues/42), [#43](https://github.com/yhatt/jsx-slack/pull/43)) +- Update REPL demo to add dialog example ([#43](https://github.com/yhatt/jsx-slack/pull/43)) ### Fixed -- Coerce number-expected prop to integer ([#44](https://github.com/speee/jsx-slack/pull/44)) +- Coerce number-expected prop to integer ([#44](https://github.com/yhatt/jsx-slack/pull/44)) ## v0.8.0 - 2019-08-06 ### Added -- Dialog support ([#19](https://github.com/speee/jsx-slack/issues/19), [#39](https://github.com/speee/jsx-slack/pull/39)) +- Dialog support ([#19](https://github.com/yhatt/jsx-slack/issues/19), [#39](https://github.com/yhatt/jsx-slack/pull/39)) ### Fixed -- Don't prevent generating `` with no options ([#41](https://github.com/speee/jsx-slack/pull/41)) +- Don't prevent generating `` with no options ([#41](https://github.com/yhatt/jsx-slack/pull/41)) ### Changed -- Update `htm` to [v2.2.0](https://github.com/developit/htm/releases/tag/2.2.0) ([#38](https://github.com/speee/jsx-slack/pull/38)) +- Update `htm` to [v2.2.0](https://github.com/developit/htm/releases/tag/2.2.0) ([#38](https://github.com/yhatt/jsx-slack/pull/38)) ## v0.7.0 - 2019-07-29 ### Added -- `` block component ([#34](https://github.com/speee/jsx-slack/issues/34), [#35](https://github.com/speee/jsx-slack/pull/35)) -- `jsxslack.fragment` template literal tag ([#32](https://github.com/speee/jsx-slack/pull/32)) -- Codecov integration and coverage badge ([#36](https://github.com/speee/jsx-slack/pull/36)) +- `` block component ([#34](https://github.com/yhatt/jsx-slack/issues/34), [#35](https://github.com/yhatt/jsx-slack/pull/35)) +- `jsxslack.fragment` template literal tag ([#32](https://github.com/yhatt/jsx-slack/pull/32)) +- Codecov integration and coverage badge ([#36](https://github.com/yhatt/jsx-slack/pull/36)) ### Changed -- Update dependent packages to the latest version ([#37](https://github.com/speee/jsx-slack/pull/37)) +- Update dependent packages to the latest version ([#37](https://github.com/yhatt/jsx-slack/pull/37)) ## v0.6.0 - 2019-07-20 ### Added -- Convert `` in `` into mrkdwn element ([#26](https://github.com/speee/jsx-slack/issues/26), [#31](https://github.com/speee/jsx-slack/pull/31)) -- `` built-in component ([#29](https://github.com/speee/jsx-slack/pull/29)) +- Convert `` in `` into mrkdwn element ([#26](https://github.com/yhatt/jsx-slack/issues/26), [#31](https://github.com/yhatt/jsx-slack/pull/31)) +- `` built-in component ([#29](https://github.com/yhatt/jsx-slack/pull/29)) ## v0.5.1 - 2019-07-14 ### Added -- Support mention to global user ID for Enterprise Grid ([#25](https://github.com/speee/jsx-slack/pull/25)) +- Support mention to global user ID for Enterprise Grid ([#25](https://github.com/yhatt/jsx-slack/pull/25)) ### Changed -- Update dependent packages to the latest version ([#28](https://github.com/speee/jsx-slack/pull/28)) +- Update dependent packages to the latest version ([#28](https://github.com/yhatt/jsx-slack/pull/28)) ## v0.5.0 - 2019-06-28 ### Added -- Support Node.js 12 ([#23](https://github.com/speee/jsx-slack/pull/23)) +- Support Node.js 12 ([#23](https://github.com/yhatt/jsx-slack/pull/23)) ### Changed -- Make interchangeable with `` component and intrinsic `` tag ([#21](https://github.com/speee/jsx-slack/pull/21)) -- Upgrade dependent packages to the latest version ([#24](https://github.com/speee/jsx-slack/pull/24)) +- Make interchangeable with `` component and intrinsic `` tag ([#21](https://github.com/yhatt/jsx-slack/pull/21)) +- Upgrade dependent packages to the latest version ([#24](https://github.com/yhatt/jsx-slack/pull/24)) ### Removed -- Remove deprecated `` component ([#22](https://github.com/speee/jsx-slack/pull/22)) +- Remove deprecated `` component ([#22](https://github.com/yhatt/jsx-slack/pull/22)) ## v0.4.3 - 2019-05-15 ### Fixed -- Fix vanishing styled channel links and mentions ([#15](https://github.com/speee/jsx-slack/issues/15), [#17](https://github.com/speee/jsx-slack/pull/17)) +- Fix vanishing styled channel links and mentions ([#15](https://github.com/yhatt/jsx-slack/issues/15), [#17](https://github.com/yhatt/jsx-slack/pull/17)) ### Changed -- Upgrade dependent packages to the latest version ([#18](https://github.com/speee/jsx-slack/pull/18)) +- Upgrade dependent packages to the latest version ([#18](https://github.com/yhatt/jsx-slack/pull/18)) ## v0.4.2 - 2019-04-13 ### Added -- Add `style` prop for `` component ([#13](https://github.com/speee/jsx-slack/issues/13), [#14](https://github.com/speee/jsx-slack/pull/14)) +- Add `style` prop for `` component ([#13](https://github.com/yhatt/jsx-slack/issues/13), [#14](https://github.com/yhatt/jsx-slack/pull/14)) ## v0.4.1 - 2019-03-13 ### Added -- `` container component ([#12](https://github.com/speee/jsx-slack/pull/12)) +- `` container component ([#12](https://github.com/yhatt/jsx-slack/pull/12)) ### Deprecated -- Mark a confusable `` fragment component as deprecated in favor of added `` ([#11](https://github.com/speee/jsx-slack/issues/11), [#12](https://github.com/speee/jsx-slack/pull/12)) +- Mark a confusable `` fragment component as deprecated in favor of added `` ([#11](https://github.com/yhatt/jsx-slack/issues/11), [#12](https://github.com/yhatt/jsx-slack/pull/12)) ## v0.4.0 - 2019-03-12 ### Added -- Support nested list ([#10](https://github.com/speee/jsx-slack/pull/10)) +- Support nested list ([#10](https://github.com/yhatt/jsx-slack/pull/10)) ## v0.3.0 - 2019-03-11 ### Added -- Add `` component ([#9](https://github.com/speee/jsx-slack/pull/9)) +- Add `` component ([#9](https://github.com/yhatt/jsx-slack/pull/9)) ### Changed -- Right-aligned number in ordered list ([#8](https://github.com/speee/jsx-slack/pull/8)) +- Right-aligned number in ordered list ([#8](https://github.com/yhatt/jsx-slack/pull/8)) ## v0.2.0 - 2019-03-07 ### Added -- `jsxslack` template literal tag for using jsx-slack without transpiler, powered by [htm](https://github.com/developit/htm) ([#6](https://github.com/speee/jsx-slack/issues/6), [#7](https://github.com/speee/jsx-slack/pull/7)) +- `jsxslack` template literal tag for using jsx-slack without transpiler, powered by [htm](https://github.com/developit/htm) ([#6](https://github.com/yhatt/jsx-slack/issues/6), [#7](https://github.com/yhatt/jsx-slack/pull/7)) ### Fixed -- Improve `README.md` with some minor fixes ([#4](https://github.com/speee/jsx-slack/pull/4)) -- Revert ignored audit ([#5](https://github.com/speee/jsx-slack/pull/5)) +- Improve `README.md` with some minor fixes ([#4](https://github.com/yhatt/jsx-slack/pull/4)) +- Revert ignored audit ([#5](https://github.com/yhatt/jsx-slack/pull/5)) ## v0.1.0 - 2019-03-01 diff --git a/LICENSE b/LICENSE index 30d59f4c..87a0a91d 100644 --- a/LICENSE +++ b/LICENSE @@ -1,6 +1,6 @@ MIT License -Copyright (c) 2019- Yuki Hattori (yuki.hattori@speee.jp) and Speee, Inc. +Copyright (c) 2019- Yuki Hattori (yukihattori1116@gmail.com). Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal diff --git a/README.md b/README.md index 7b5e5a29..2bb6a253 100644 --- a/README.md +++ b/README.md @@ -1,23 +1,21 @@ - - - + + + jsx-slack -[![CircleCI](https://img.shields.io/circleci/project/github/speee/jsx-slack/master.svg?logo=circleci)][circleci] -[![Codecov](https://img.shields.io/codecov/c/github/speee/jsx-slack/master.svg?logo=codecov)](https://codecov.io/gh/speee/jsx-slack) -[![npm](https://img.shields.io/npm/v/@speee-js/jsx-slack.svg?logo=npm)][npm] -[![LICENSE](https://img.shields.io/github/license/speee/jsx-slack.svg)][license] +[![CircleCI](https://img.shields.io/circleci/project/github/yhatt/jsx-slack/master.svg?logo=circleci)][circleci] +[![Codecov](https://img.shields.io/codecov/c/github/yhatt/jsx-slack/master.svg?logo=codecov)](https://codecov.io/gh/yhatt/jsx-slack) +[![npm](https://img.shields.io/npm/v/jsx-slack.svg?logo=npm)][npm] +[![LICENSE](https://img.shields.io/github/license/yhatt/jsx-slack.svg)][license] -[circleci]: https://circleci.com/gh/speee/jsx-slack/ -[npm]: https://npm.im/@speee-js/jsx-slack +[circleci]: https://circleci.com/gh/yhatt/jsx-slack/ +[npm]: https://npm.im/jsx-slack [license]: ./LICENSE Build JSON object for [Slack][slack] [block kit] surfaces from [JSX]. -> :sparkles: **We have sparkling jsx-slack v2!** :sparkles: **[▶︎ See highlight of v2](docs/highlight/v2.md)** - [slack]: https://slack.com [jsx]: https://reactjs.org/docs/introducing-jsx.html [react]: https://reactjs.org/ @@ -25,16 +23,16 @@ Build JSON object for [Slack][slack] [block kit] surfaces from [JSX]. [block kit builder]: https://api.slack.com/tools/block-kit-builder - - + + - - + + -:point_right: **[Try our REPL demo](https://speee-jsx-slack.netlify.app/)** in https://speee-jsx-slack.netlify.app/. +:point_right: **[Try our REPL demo](https://jsx-slack.netlify.app/)** in https://jsx-slack.netlify.app/. ### Features @@ -61,12 +59,12 @@ We require Node.js >= 10. If you are using TypeScript, we also require TS >= 3.7 ```bash # npm -npm install --save @speee-js/jsx-slack +npm install --save jsx-slack ``` ```bash # yarn -yarn add @speee-js/jsx-slack +yarn add jsx-slack ``` ## Usage @@ -80,7 +78,7 @@ It allows the template syntax almost same as JSX, powered by [HTM (Hyperscript T This is a simple example of the template function just to say hello to someone. ```javascript -import { jsxslack } from '@speee-js/jsx-slack' +import { jsxslack } from 'jsx-slack' export const exampleBlock = ({ name }) => jsxslack` @@ -97,7 +95,7 @@ When you want to use jsx-slack with JSX transpiler, you have to set up to use im ```jsx /** @jsx JSXSlack.h */ -import { JSXSlack, Blocks, Section } from '@speee-js/jsx-slack' +import { JSXSlack, Blocks, Section } from 'jsx-slack' export const exampleBlock = ({ name }) => ( @@ -135,7 +133,7 @@ It would post a simple Slack message like this: [][block-kit-builder-example] -[block-kit-builder-example]: https://speee-jsx-slack.netlify.app/#bkb:jsx:eJyzccrJT84utuNSULAJTk0uyczPA7EVFDxSc3LydRRskuwiS7MzFTwSS0ryizJt9JPsFEFq9eGKbfShRgAAVeQWug== +[block-kit-builder-example]: https://jsx-slack.netlify.app/#bkb:jsx:eJyzccrJT84utuNSULAJTk0uyczPA7EVFDxSc3LydRRskuwiS7MzFTwSS0ryizJt9JPsFEFq9eGKbfShRgAAVeQWug== ## Block Kit as components @@ -143,7 +141,7 @@ Slack has recommended to use **[Block Kit]** for building tempting messages and By using jsx-slack, you can build a template with piling up Block Kit blocks by JSX. It is feeling like using components in React or Vue. -### [For messaging](https://speee-jsx-slack.netlify.app/) +### [For messaging](https://jsx-slack.netlify.app/) ```jsx @@ -151,12 +149,12 @@ By using jsx-slack, you can build a template with piling up Block Kit blocks by Enjoy building blocks! - @speee-js/jsx-slack + jsx-slack Build JSON for Slack Block Kit from JSX - + Maintained by Yuki Hattori @@ -164,13 +162,13 @@ By using jsx-slack, you can build a template with piling up Block Kit blocks by - GitHub - npm + GitHub + npm ``` -### [For modal](https://speee-jsx-slack.netlify.app/#modal) +### [For modal](https://jsx-slack.netlify.app/#modal) ```jsx @@ -199,7 +197,7 @@ By using jsx-slack, you can build a template with piling up Block Kit blocks by ``` -### [For home tab](https://speee-jsx-slack.netlify.app/#home) +### [For home tab](https://jsx-slack.netlify.app/#home) ```jsx @@ -249,37 +247,39 @@ By using jsx-slack, you can build a template with piling up Block Kit blocks by * **[HTML-like formatting](docs/html-like-formatting.md)** * **[About escape and exact mode](docs/about-escape-and-exact-mode.md)** +- **[Highlight of v2](docs/highlight/v2.md)** + ### Examples by use cases Ported from templates for [Block Kit Builder]. #### [Message](https://api.slack.com/tools/block-kit-builder?mode=message&template=1) -- [Approval (New device request)](https://speee-jsx-slack.netlify.app/#messagingApprovalNewDevice) -- [Approval (Time Off request)](https://speee-jsx-slack.netlify.app/#messagingApprovalTimeOff) -- [Notification](https://speee-jsx-slack.netlify.app/#messagingNotification) -- [Onboarding (Taskbot)](https://speee-jsx-slack.netlify.app/#messagingOnboardingTaskbot) -- [Onboarding (Onboarding App)](https://speee-jsx-slack.netlify.app/#messagingOnboardingApp) -- [Poll](https://speee-jsx-slack.netlify.app/#messagingPoll) -- [Search Results (TripAgent)](https://speee-jsx-slack.netlify.app/#messagingSearchResultsTripAgent) -- [Search Results (FileCard Agent)](https://speee-jsx-slack.netlify.app/#messagingSearchResultsFileCard) -- [Newsletter](https://speee-jsx-slack.netlify.app/#messagingNewsletter) +- [Approval (New device request)](https://jsx-slack.netlify.app/#messagingApprovalNewDevice) +- [Approval (Time Off request)](https://jsx-slack.netlify.app/#messagingApprovalTimeOff) +- [Notification](https://jsx-slack.netlify.app/#messagingNotification) +- [Onboarding (Taskbot)](https://jsx-slack.netlify.app/#messagingOnboardingTaskbot) +- [Onboarding (Onboarding App)](https://jsx-slack.netlify.app/#messagingOnboardingApp) +- [Poll](https://jsx-slack.netlify.app/#messagingPoll) +- [Search Results (TripAgent)](https://jsx-slack.netlify.app/#messagingSearchResultsTripAgent) +- [Search Results (FileCard Agent)](https://jsx-slack.netlify.app/#messagingSearchResultsFileCard) +- [Newsletter](https://jsx-slack.netlify.app/#messagingNewsletter) #### [Modal](https://api.slack.com/tools/block-kit-builder?mode=modal&template=1) -- [Poll](https://speee-jsx-slack.netlify.app/#modalPoll) -- [Search Results](https://speee-jsx-slack.netlify.app/#modalSearchResults) -- [Settings (App menu)](https://speee-jsx-slack.netlify.app/#modalSettingsAppMenu) -- [Settings (Notification settings)](https://speee-jsx-slack.netlify.app/#modalSettingsNotification) -- [List of information (Your itinerary)](https://speee-jsx-slack.netlify.app/#modalListOfInformationYourItinerary) -- [List of information (Ticket app)](https://speee-jsx-slack.netlify.app/#modalListOfInformationTicketApp) +- [Poll](https://jsx-slack.netlify.app/#modalPoll) +- [Search Results](https://jsx-slack.netlify.app/#modalSearchResults) +- [Settings (App menu)](https://jsx-slack.netlify.app/#modalSettingsAppMenu) +- [Settings (Notification settings)](https://jsx-slack.netlify.app/#modalSettingsNotification) +- [List of information (Your itinerary)](https://jsx-slack.netlify.app/#modalListOfInformationYourItinerary) +- [List of information (Ticket app)](https://jsx-slack.netlify.app/#modalListOfInformationTicketApp) #### [App Home](https://api.slack.com/tools/block-kit-builder?mode=appHome&template=1) -- [Project Tracker](https://speee-jsx-slack.netlify.app/#appHomeProjectTracker) -- [Calendar](https://speee-jsx-slack.netlify.app/#appHomeCalendar) -- [Expense App](https://speee-jsx-slack.netlify.app/#appHomeExpenseApp) -- [Todo App](https://speee-jsx-slack.netlify.app/#appHomeTodoApp) +- [Project Tracker](https://jsx-slack.netlify.app/#appHomeProjectTracker) +- [Calendar](https://jsx-slack.netlify.app/#appHomeCalendar) +- [Expense App](https://jsx-slack.netlify.app/#appHomeExpenseApp) +- [Todo App](https://jsx-slack.netlify.app/#appHomeTodoApp) ## Fragments @@ -291,7 +291,7 @@ Let's say about defining `` custom block that is consisted by ` ( @@ -318,7 +318,7 @@ Now the defined block can use in `` as like as the other blocks: [][custom-header-block] -[custom-header-block]: https://speee-jsx-slack.netlify.app/#bkb:jsx:eJxVjrEOgzAQQ3e-4jYmejs6Zag6duMLSIjQlZRIOEHt3xcaBphsD8-23EN0E0xFJJ13SeO8-y3ZoptT88KnQejdRC4jxTfZnRJWQy3yPIYe8GgLyH9S-FQnD1118AvxZejpUw2yWcNA35iXUns7ocLHvx9tITN_ +[custom-header-block]: https://jsx-slack.netlify.app/#bkb:jsx:eJxVjrEOgzAQQ3e-4jYmejs6Zag6duMLSIjQlZRIOEHt3xcaBphsD8-23EN0E0xFJJ13SeO8-y3ZoptT88KnQejdRC4jxTfZnRJWQy3yPIYe8GgLyH9S-FQnD1118AvxZejpUw2yWcNA35iXUns7ocLHvx9tITN_ ### Short syntax for fragments @@ -327,7 +327,7 @@ Babel transpiler and TypeScript 4 can use [the short syntax `<>>` for fragment ```javascript /** @jsx JSXSlack.h */ /** @jsxFrag JSXSlack.Fragment */ -import { JSXSlack } from '@speee-js/jsx-slack' +import { JSXSlack } from 'jsx-slack' const Header = ({ children }) => ( <> @@ -345,7 +345,7 @@ const Header = ({ children }) => ( ```javascript // Header.js -import { jsxslack } from '@speee-js/jsx-slack' +import { jsxslack } from 'jsx-slack' export const Header = ({ children }) => jsxslack` @@ -358,7 +358,7 @@ export const Header = ({ children }) => jsxslack` A defined component may use in `jsxslack` tag as below: ```javascript -import { jsxslack } from '@speee-js/jsx-slack' +import { jsxslack } from 'jsx-slack' import { Header } from './Header' console.log(jsxslack` @@ -405,8 +405,6 @@ FYI there are some projects based on React ([react-reconciler](https://github.co ## Author -Managed by [ Speee, Inc.](https://speee.jp) ([@speee](https://github.com/speee)) - - Yuki Hattori ([@yhatt](https://github.com/yhatt)) - Maintainer ## License diff --git a/demo/examples/basic.js b/demo/examples/basic.js index 446c4a04..45e488cd 100644 --- a/demo/examples/basic.js +++ b/demo/examples/basic.js @@ -6,12 +6,12 @@ export const message = `
` whitespaces ([#48](https://github.com/yhatt/jsx-slack/issues/48), [#49](https://github.com/yhatt/jsx-slack/pull/49)) ### Changed -- Update dependent packages to the latest version ([#50](https://github.com/speee/jsx-slack/pull/50)) +- Update dependent packages to the latest version ([#50](https://github.com/yhatt/jsx-slack/pull/50)) ## v0.9.0 - 2019-08-15 ### Breaking -- Disabled heuristic detection for HTML entities (Escaping works [just as same as React JSX](https://reactjs.org/docs/jsx-in-depth.html#string-literals)) ([#33](https://github.com/speee/jsx-slack/pull/33)) -- Some raw characters for mrkdwn link, `<`, `>`, and `&` will always escape to entities ([#45](https://github.com/speee/jsx-slack/issues/45)) +- Disabled heuristic detection for HTML entities (Escaping works [just as same as React JSX](https://reactjs.org/docs/jsx-in-depth.html#string-literals)) ([#33](https://github.com/yhatt/jsx-slack/pull/33)) +- Some raw characters for mrkdwn link, `<`, `>`, and `&` will always escape to entities ([#45](https://github.com/yhatt/jsx-slack/issues/45)) ### Changed -- Improve html entity decoding in JSX and template literal tag ([#33](https://github.com/speee/jsx-slack/pull/33), [#45](https://github.com/speee/jsx-slack/issues/45), [#47](https://github.com/speee/jsx-slack/pull/47)) -- Allow links in the inside of `` and `` element ([#16](https://github.com/speee/jsx-slack/pull/16), [#46](https://github.com/speee/jsx-slack/pull/46)) +- Improve html entity decoding in JSX and template literal tag ([#33](https://github.com/yhatt/jsx-slack/pull/33), [#45](https://github.com/yhatt/jsx-slack/issues/45), [#47](https://github.com/yhatt/jsx-slack/pull/47)) +- Allow links in the inside of `` and `` element ([#16](https://github.com/yhatt/jsx-slack/pull/16), [#46](https://github.com/yhatt/jsx-slack/pull/46)) ## v0.8.1 - 2019-08-07 ### Added -- Better dialog support for `jsxslack` template literal ([#42](https://github.com/speee/jsx-slack/issues/42), [#43](https://github.com/speee/jsx-slack/pull/43)) -- Update REPL demo to add dialog example ([#43](https://github.com/speee/jsx-slack/pull/43)) +- Better dialog support for `jsxslack` template literal ([#42](https://github.com/yhatt/jsx-slack/issues/42), [#43](https://github.com/yhatt/jsx-slack/pull/43)) +- Update REPL demo to add dialog example ([#43](https://github.com/yhatt/jsx-slack/pull/43)) ### Fixed -- Coerce number-expected prop to integer ([#44](https://github.com/speee/jsx-slack/pull/44)) +- Coerce number-expected prop to integer ([#44](https://github.com/yhatt/jsx-slack/pull/44)) ## v0.8.0 - 2019-08-06 ### Added -- Dialog support ([#19](https://github.com/speee/jsx-slack/issues/19), [#39](https://github.com/speee/jsx-slack/pull/39)) +- Dialog support ([#19](https://github.com/yhatt/jsx-slack/issues/19), [#39](https://github.com/yhatt/jsx-slack/pull/39)) ### Fixed -- Don't prevent generating `` with no options ([#41](https://github.com/speee/jsx-slack/pull/41)) +- Don't prevent generating `` with no options ([#41](https://github.com/yhatt/jsx-slack/pull/41)) ### Changed -- Update `htm` to [v2.2.0](https://github.com/developit/htm/releases/tag/2.2.0) ([#38](https://github.com/speee/jsx-slack/pull/38)) +- Update `htm` to [v2.2.0](https://github.com/developit/htm/releases/tag/2.2.0) ([#38](https://github.com/yhatt/jsx-slack/pull/38)) ## v0.7.0 - 2019-07-29 ### Added -- `` block component ([#34](https://github.com/speee/jsx-slack/issues/34), [#35](https://github.com/speee/jsx-slack/pull/35)) -- `jsxslack.fragment` template literal tag ([#32](https://github.com/speee/jsx-slack/pull/32)) -- Codecov integration and coverage badge ([#36](https://github.com/speee/jsx-slack/pull/36)) +- `` block component ([#34](https://github.com/yhatt/jsx-slack/issues/34), [#35](https://github.com/yhatt/jsx-slack/pull/35)) +- `jsxslack.fragment` template literal tag ([#32](https://github.com/yhatt/jsx-slack/pull/32)) +- Codecov integration and coverage badge ([#36](https://github.com/yhatt/jsx-slack/pull/36)) ### Changed -- Update dependent packages to the latest version ([#37](https://github.com/speee/jsx-slack/pull/37)) +- Update dependent packages to the latest version ([#37](https://github.com/yhatt/jsx-slack/pull/37)) ## v0.6.0 - 2019-07-20 ### Added -- Convert `` in `` into mrkdwn element ([#26](https://github.com/speee/jsx-slack/issues/26), [#31](https://github.com/speee/jsx-slack/pull/31)) -- `` built-in component ([#29](https://github.com/speee/jsx-slack/pull/29)) +- Convert `` in `` into mrkdwn element ([#26](https://github.com/yhatt/jsx-slack/issues/26), [#31](https://github.com/yhatt/jsx-slack/pull/31)) +- `` built-in component ([#29](https://github.com/yhatt/jsx-slack/pull/29)) ## v0.5.1 - 2019-07-14 ### Added -- Support mention to global user ID for Enterprise Grid ([#25](https://github.com/speee/jsx-slack/pull/25)) +- Support mention to global user ID for Enterprise Grid ([#25](https://github.com/yhatt/jsx-slack/pull/25)) ### Changed -- Update dependent packages to the latest version ([#28](https://github.com/speee/jsx-slack/pull/28)) +- Update dependent packages to the latest version ([#28](https://github.com/yhatt/jsx-slack/pull/28)) ## v0.5.0 - 2019-06-28 ### Added -- Support Node.js 12 ([#23](https://github.com/speee/jsx-slack/pull/23)) +- Support Node.js 12 ([#23](https://github.com/yhatt/jsx-slack/pull/23)) ### Changed -- Make interchangeable with `` component and intrinsic `` tag ([#21](https://github.com/speee/jsx-slack/pull/21)) -- Upgrade dependent packages to the latest version ([#24](https://github.com/speee/jsx-slack/pull/24)) +- Make interchangeable with `` component and intrinsic `` tag ([#21](https://github.com/yhatt/jsx-slack/pull/21)) +- Upgrade dependent packages to the latest version ([#24](https://github.com/yhatt/jsx-slack/pull/24)) ### Removed -- Remove deprecated `` component ([#22](https://github.com/speee/jsx-slack/pull/22)) +- Remove deprecated `` component ([#22](https://github.com/yhatt/jsx-slack/pull/22)) ## v0.4.3 - 2019-05-15 ### Fixed -- Fix vanishing styled channel links and mentions ([#15](https://github.com/speee/jsx-slack/issues/15), [#17](https://github.com/speee/jsx-slack/pull/17)) +- Fix vanishing styled channel links and mentions ([#15](https://github.com/yhatt/jsx-slack/issues/15), [#17](https://github.com/yhatt/jsx-slack/pull/17)) ### Changed -- Upgrade dependent packages to the latest version ([#18](https://github.com/speee/jsx-slack/pull/18)) +- Upgrade dependent packages to the latest version ([#18](https://github.com/yhatt/jsx-slack/pull/18)) ## v0.4.2 - 2019-04-13 ### Added -- Add `style` prop for `` component ([#13](https://github.com/speee/jsx-slack/issues/13), [#14](https://github.com/speee/jsx-slack/pull/14)) +- Add `style` prop for `` component ([#13](https://github.com/yhatt/jsx-slack/issues/13), [#14](https://github.com/yhatt/jsx-slack/pull/14)) ## v0.4.1 - 2019-03-13 ### Added -- `` container component ([#12](https://github.com/speee/jsx-slack/pull/12)) +- `` container component ([#12](https://github.com/yhatt/jsx-slack/pull/12)) ### Deprecated -- Mark a confusable `` fragment component as deprecated in favor of added `` ([#11](https://github.com/speee/jsx-slack/issues/11), [#12](https://github.com/speee/jsx-slack/pull/12)) +- Mark a confusable `` fragment component as deprecated in favor of added `` ([#11](https://github.com/yhatt/jsx-slack/issues/11), [#12](https://github.com/yhatt/jsx-slack/pull/12)) ## v0.4.0 - 2019-03-12 ### Added -- Support nested list ([#10](https://github.com/speee/jsx-slack/pull/10)) +- Support nested list ([#10](https://github.com/yhatt/jsx-slack/pull/10)) ## v0.3.0 - 2019-03-11 ### Added -- Add `` component ([#9](https://github.com/speee/jsx-slack/pull/9)) +- Add `` component ([#9](https://github.com/yhatt/jsx-slack/pull/9)) ### Changed -- Right-aligned number in ordered list ([#8](https://github.com/speee/jsx-slack/pull/8)) +- Right-aligned number in ordered list ([#8](https://github.com/yhatt/jsx-slack/pull/8)) ## v0.2.0 - 2019-03-07 ### Added -- `jsxslack` template literal tag for using jsx-slack without transpiler, powered by [htm](https://github.com/developit/htm) ([#6](https://github.com/speee/jsx-slack/issues/6), [#7](https://github.com/speee/jsx-slack/pull/7)) +- `jsxslack` template literal tag for using jsx-slack without transpiler, powered by [htm](https://github.com/developit/htm) ([#6](https://github.com/yhatt/jsx-slack/issues/6), [#7](https://github.com/yhatt/jsx-slack/pull/7)) ### Fixed -- Improve `README.md` with some minor fixes ([#4](https://github.com/speee/jsx-slack/pull/4)) -- Revert ignored audit ([#5](https://github.com/speee/jsx-slack/pull/5)) +- Improve `README.md` with some minor fixes ([#4](https://github.com/yhatt/jsx-slack/pull/4)) +- Revert ignored audit ([#5](https://github.com/yhatt/jsx-slack/pull/5)) ## v0.1.0 - 2019-03-01 diff --git a/LICENSE b/LICENSE index 30d59f4c..87a0a91d 100644 --- a/LICENSE +++ b/LICENSE @@ -1,6 +1,6 @@ MIT License -Copyright (c) 2019- Yuki Hattori (yuki.hattori@speee.jp) and Speee, Inc. +Copyright (c) 2019- Yuki Hattori (yukihattori1116@gmail.com). Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal diff --git a/README.md b/README.md index 7b5e5a29..2bb6a253 100644 --- a/README.md +++ b/README.md @@ -1,23 +1,21 @@ - - - + + + jsx-slack -[![CircleCI](https://img.shields.io/circleci/project/github/speee/jsx-slack/master.svg?logo=circleci)][circleci] -[![Codecov](https://img.shields.io/codecov/c/github/speee/jsx-slack/master.svg?logo=codecov)](https://codecov.io/gh/speee/jsx-slack) -[![npm](https://img.shields.io/npm/v/@speee-js/jsx-slack.svg?logo=npm)][npm] -[![LICENSE](https://img.shields.io/github/license/speee/jsx-slack.svg)][license] +[![CircleCI](https://img.shields.io/circleci/project/github/yhatt/jsx-slack/master.svg?logo=circleci)][circleci] +[![Codecov](https://img.shields.io/codecov/c/github/yhatt/jsx-slack/master.svg?logo=codecov)](https://codecov.io/gh/yhatt/jsx-slack) +[![npm](https://img.shields.io/npm/v/jsx-slack.svg?logo=npm)][npm] +[![LICENSE](https://img.shields.io/github/license/yhatt/jsx-slack.svg)][license] -[circleci]: https://circleci.com/gh/speee/jsx-slack/ -[npm]: https://npm.im/@speee-js/jsx-slack +[circleci]: https://circleci.com/gh/yhatt/jsx-slack/ +[npm]: https://npm.im/jsx-slack [license]: ./LICENSE Build JSON object for [Slack][slack] [block kit] surfaces from [JSX]. -> :sparkles: **We have sparkling jsx-slack v2!** :sparkles: **[▶︎ See highlight of v2](docs/highlight/v2.md)** - [slack]: https://slack.com [jsx]: https://reactjs.org/docs/introducing-jsx.html [react]: https://reactjs.org/ @@ -25,16 +23,16 @@ Build JSON object for [Slack][slack] [block kit] surfaces from [JSX]. [block kit builder]: https://api.slack.com/tools/block-kit-builder - - + + - - + + -:point_right: **[Try our REPL demo](https://speee-jsx-slack.netlify.app/)** in https://speee-jsx-slack.netlify.app/. +:point_right: **[Try our REPL demo](https://jsx-slack.netlify.app/)** in https://jsx-slack.netlify.app/. ### Features @@ -61,12 +59,12 @@ We require Node.js >= 10. If you are using TypeScript, we also require TS >= 3.7 ```bash # npm -npm install --save @speee-js/jsx-slack +npm install --save jsx-slack ``` ```bash # yarn -yarn add @speee-js/jsx-slack +yarn add jsx-slack ``` ## Usage @@ -80,7 +78,7 @@ It allows the template syntax almost same as JSX, powered by [HTM (Hyperscript T This is a simple example of the template function just to say hello to someone. ```javascript -import { jsxslack } from '@speee-js/jsx-slack' +import { jsxslack } from 'jsx-slack' export const exampleBlock = ({ name }) => jsxslack` @@ -97,7 +95,7 @@ When you want to use jsx-slack with JSX transpiler, you have to set up to use im ```jsx /** @jsx JSXSlack.h */ -import { JSXSlack, Blocks, Section } from '@speee-js/jsx-slack' +import { JSXSlack, Blocks, Section } from 'jsx-slack' export const exampleBlock = ({ name }) => ( @@ -135,7 +133,7 @@ It would post a simple Slack message like this: [][block-kit-builder-example] -[block-kit-builder-example]: https://speee-jsx-slack.netlify.app/#bkb:jsx:eJyzccrJT84utuNSULAJTk0uyczPA7EVFDxSc3LydRRskuwiS7MzFTwSS0ryizJt9JPsFEFq9eGKbfShRgAAVeQWug== +[block-kit-builder-example]: https://jsx-slack.netlify.app/#bkb:jsx:eJyzccrJT84utuNSULAJTk0uyczPA7EVFDxSc3LydRRskuwiS7MzFTwSS0ryizJt9JPsFEFq9eGKbfShRgAAVeQWug== ## Block Kit as components @@ -143,7 +141,7 @@ Slack has recommended to use **[Block Kit]** for building tempting messages and By using jsx-slack, you can build a template with piling up Block Kit blocks by JSX. It is feeling like using components in React or Vue. -### [For messaging](https://speee-jsx-slack.netlify.app/) +### [For messaging](https://jsx-slack.netlify.app/) ```jsx @@ -151,12 +149,12 @@ By using jsx-slack, you can build a template with piling up Block Kit blocks by Enjoy building blocks! - @speee-js/jsx-slack + jsx-slack Build JSON for Slack Block Kit from JSX - + Maintained by Yuki Hattori @@ -164,13 +162,13 @@ By using jsx-slack, you can build a template with piling up Block Kit blocks by - GitHub - npm + GitHub + npm ``` -### [For modal](https://speee-jsx-slack.netlify.app/#modal) +### [For modal](https://jsx-slack.netlify.app/#modal) ```jsx @@ -199,7 +197,7 @@ By using jsx-slack, you can build a template with piling up Block Kit blocks by ``` -### [For home tab](https://speee-jsx-slack.netlify.app/#home) +### [For home tab](https://jsx-slack.netlify.app/#home) ```jsx @@ -249,37 +247,39 @@ By using jsx-slack, you can build a template with piling up Block Kit blocks by * **[HTML-like formatting](docs/html-like-formatting.md)** * **[About escape and exact mode](docs/about-escape-and-exact-mode.md)** +- **[Highlight of v2](docs/highlight/v2.md)** + ### Examples by use cases Ported from templates for [Block Kit Builder]. #### [Message](https://api.slack.com/tools/block-kit-builder?mode=message&template=1) -- [Approval (New device request)](https://speee-jsx-slack.netlify.app/#messagingApprovalNewDevice) -- [Approval (Time Off request)](https://speee-jsx-slack.netlify.app/#messagingApprovalTimeOff) -- [Notification](https://speee-jsx-slack.netlify.app/#messagingNotification) -- [Onboarding (Taskbot)](https://speee-jsx-slack.netlify.app/#messagingOnboardingTaskbot) -- [Onboarding (Onboarding App)](https://speee-jsx-slack.netlify.app/#messagingOnboardingApp) -- [Poll](https://speee-jsx-slack.netlify.app/#messagingPoll) -- [Search Results (TripAgent)](https://speee-jsx-slack.netlify.app/#messagingSearchResultsTripAgent) -- [Search Results (FileCard Agent)](https://speee-jsx-slack.netlify.app/#messagingSearchResultsFileCard) -- [Newsletter](https://speee-jsx-slack.netlify.app/#messagingNewsletter) +- [Approval (New device request)](https://jsx-slack.netlify.app/#messagingApprovalNewDevice) +- [Approval (Time Off request)](https://jsx-slack.netlify.app/#messagingApprovalTimeOff) +- [Notification](https://jsx-slack.netlify.app/#messagingNotification) +- [Onboarding (Taskbot)](https://jsx-slack.netlify.app/#messagingOnboardingTaskbot) +- [Onboarding (Onboarding App)](https://jsx-slack.netlify.app/#messagingOnboardingApp) +- [Poll](https://jsx-slack.netlify.app/#messagingPoll) +- [Search Results (TripAgent)](https://jsx-slack.netlify.app/#messagingSearchResultsTripAgent) +- [Search Results (FileCard Agent)](https://jsx-slack.netlify.app/#messagingSearchResultsFileCard) +- [Newsletter](https://jsx-slack.netlify.app/#messagingNewsletter) #### [Modal](https://api.slack.com/tools/block-kit-builder?mode=modal&template=1) -- [Poll](https://speee-jsx-slack.netlify.app/#modalPoll) -- [Search Results](https://speee-jsx-slack.netlify.app/#modalSearchResults) -- [Settings (App menu)](https://speee-jsx-slack.netlify.app/#modalSettingsAppMenu) -- [Settings (Notification settings)](https://speee-jsx-slack.netlify.app/#modalSettingsNotification) -- [List of information (Your itinerary)](https://speee-jsx-slack.netlify.app/#modalListOfInformationYourItinerary) -- [List of information (Ticket app)](https://speee-jsx-slack.netlify.app/#modalListOfInformationTicketApp) +- [Poll](https://jsx-slack.netlify.app/#modalPoll) +- [Search Results](https://jsx-slack.netlify.app/#modalSearchResults) +- [Settings (App menu)](https://jsx-slack.netlify.app/#modalSettingsAppMenu) +- [Settings (Notification settings)](https://jsx-slack.netlify.app/#modalSettingsNotification) +- [List of information (Your itinerary)](https://jsx-slack.netlify.app/#modalListOfInformationYourItinerary) +- [List of information (Ticket app)](https://jsx-slack.netlify.app/#modalListOfInformationTicketApp) #### [App Home](https://api.slack.com/tools/block-kit-builder?mode=appHome&template=1) -- [Project Tracker](https://speee-jsx-slack.netlify.app/#appHomeProjectTracker) -- [Calendar](https://speee-jsx-slack.netlify.app/#appHomeCalendar) -- [Expense App](https://speee-jsx-slack.netlify.app/#appHomeExpenseApp) -- [Todo App](https://speee-jsx-slack.netlify.app/#appHomeTodoApp) +- [Project Tracker](https://jsx-slack.netlify.app/#appHomeProjectTracker) +- [Calendar](https://jsx-slack.netlify.app/#appHomeCalendar) +- [Expense App](https://jsx-slack.netlify.app/#appHomeExpenseApp) +- [Todo App](https://jsx-slack.netlify.app/#appHomeTodoApp) ## Fragments @@ -291,7 +291,7 @@ Let's say about defining `` custom block that is consisted by ` ( @@ -318,7 +318,7 @@ Now the defined block can use in `` as like as the other blocks: [][custom-header-block] -[custom-header-block]: https://speee-jsx-slack.netlify.app/#bkb:jsx:eJxVjrEOgzAQQ3e-4jYmejs6Zag6duMLSIjQlZRIOEHt3xcaBphsD8-23EN0E0xFJJ13SeO8-y3ZoptT88KnQejdRC4jxTfZnRJWQy3yPIYe8GgLyH9S-FQnD1118AvxZejpUw2yWcNA35iXUns7ocLHvx9tITN_ +[custom-header-block]: https://jsx-slack.netlify.app/#bkb:jsx:eJxVjrEOgzAQQ3e-4jYmejs6Zag6duMLSIjQlZRIOEHt3xcaBphsD8-23EN0E0xFJJ13SeO8-y3ZoptT88KnQejdRC4jxTfZnRJWQy3yPIYe8GgLyH9S-FQnD1118AvxZejpUw2yWcNA35iXUns7ocLHvx9tITN_ ### Short syntax for fragments @@ -327,7 +327,7 @@ Babel transpiler and TypeScript 4 can use [the short syntax `<>>` for fragment ```javascript /** @jsx JSXSlack.h */ /** @jsxFrag JSXSlack.Fragment */ -import { JSXSlack } from '@speee-js/jsx-slack' +import { JSXSlack } from 'jsx-slack' const Header = ({ children }) => ( <> @@ -345,7 +345,7 @@ const Header = ({ children }) => ( ```javascript // Header.js -import { jsxslack } from '@speee-js/jsx-slack' +import { jsxslack } from 'jsx-slack' export const Header = ({ children }) => jsxslack` @@ -358,7 +358,7 @@ export const Header = ({ children }) => jsxslack` A defined component may use in `jsxslack` tag as below: ```javascript -import { jsxslack } from '@speee-js/jsx-slack' +import { jsxslack } from 'jsx-slack' import { Header } from './Header' console.log(jsxslack` @@ -405,8 +405,6 @@ FYI there are some projects based on React ([react-reconciler](https://github.co ## Author -Managed by [ Speee, Inc.](https://speee.jp) ([@speee](https://github.com/speee)) - - Yuki Hattori ([@yhatt](https://github.com/yhatt)) - Maintainer ## License diff --git a/demo/examples/basic.js b/demo/examples/basic.js index 446c4a04..45e488cd 100644 --- a/demo/examples/basic.js +++ b/demo/examples/basic.js @@ -6,12 +6,12 @@ export const message = `
` and `` element ([#16](https://github.com/speee/jsx-slack/pull/16), [#46](https://github.com/speee/jsx-slack/pull/46)) +- Improve html entity decoding in JSX and template literal tag ([#33](https://github.com/yhatt/jsx-slack/pull/33), [#45](https://github.com/yhatt/jsx-slack/issues/45), [#47](https://github.com/yhatt/jsx-slack/pull/47)) +- Allow links in the inside of `` and `` element ([#16](https://github.com/yhatt/jsx-slack/pull/16), [#46](https://github.com/yhatt/jsx-slack/pull/46)) ## v0.8.1 - 2019-08-07 ### Added -- Better dialog support for `jsxslack` template literal ([#42](https://github.com/speee/jsx-slack/issues/42), [#43](https://github.com/speee/jsx-slack/pull/43)) -- Update REPL demo to add dialog example ([#43](https://github.com/speee/jsx-slack/pull/43)) +- Better dialog support for `jsxslack` template literal ([#42](https://github.com/yhatt/jsx-slack/issues/42), [#43](https://github.com/yhatt/jsx-slack/pull/43)) +- Update REPL demo to add dialog example ([#43](https://github.com/yhatt/jsx-slack/pull/43)) ### Fixed -- Coerce number-expected prop to integer ([#44](https://github.com/speee/jsx-slack/pull/44)) +- Coerce number-expected prop to integer ([#44](https://github.com/yhatt/jsx-slack/pull/44)) ## v0.8.0 - 2019-08-06 ### Added -- Dialog support ([#19](https://github.com/speee/jsx-slack/issues/19), [#39](https://github.com/speee/jsx-slack/pull/39)) +- Dialog support ([#19](https://github.com/yhatt/jsx-slack/issues/19), [#39](https://github.com/yhatt/jsx-slack/pull/39)) ### Fixed -- Don't prevent generating `` with no options ([#41](https://github.com/speee/jsx-slack/pull/41)) +- Don't prevent generating `` with no options ([#41](https://github.com/yhatt/jsx-slack/pull/41)) ### Changed -- Update `htm` to [v2.2.0](https://github.com/developit/htm/releases/tag/2.2.0) ([#38](https://github.com/speee/jsx-slack/pull/38)) +- Update `htm` to [v2.2.0](https://github.com/developit/htm/releases/tag/2.2.0) ([#38](https://github.com/yhatt/jsx-slack/pull/38)) ## v0.7.0 - 2019-07-29 ### Added -- `` block component ([#34](https://github.com/speee/jsx-slack/issues/34), [#35](https://github.com/speee/jsx-slack/pull/35)) -- `jsxslack.fragment` template literal tag ([#32](https://github.com/speee/jsx-slack/pull/32)) -- Codecov integration and coverage badge ([#36](https://github.com/speee/jsx-slack/pull/36)) +- `` block component ([#34](https://github.com/yhatt/jsx-slack/issues/34), [#35](https://github.com/yhatt/jsx-slack/pull/35)) +- `jsxslack.fragment` template literal tag ([#32](https://github.com/yhatt/jsx-slack/pull/32)) +- Codecov integration and coverage badge ([#36](https://github.com/yhatt/jsx-slack/pull/36)) ### Changed -- Update dependent packages to the latest version ([#37](https://github.com/speee/jsx-slack/pull/37)) +- Update dependent packages to the latest version ([#37](https://github.com/yhatt/jsx-slack/pull/37)) ## v0.6.0 - 2019-07-20 ### Added -- Convert `` in `` into mrkdwn element ([#26](https://github.com/speee/jsx-slack/issues/26), [#31](https://github.com/speee/jsx-slack/pull/31)) -- `` built-in component ([#29](https://github.com/speee/jsx-slack/pull/29)) +- Convert `` in `` into mrkdwn element ([#26](https://github.com/yhatt/jsx-slack/issues/26), [#31](https://github.com/yhatt/jsx-slack/pull/31)) +- `` built-in component ([#29](https://github.com/yhatt/jsx-slack/pull/29)) ## v0.5.1 - 2019-07-14 ### Added -- Support mention to global user ID for Enterprise Grid ([#25](https://github.com/speee/jsx-slack/pull/25)) +- Support mention to global user ID for Enterprise Grid ([#25](https://github.com/yhatt/jsx-slack/pull/25)) ### Changed -- Update dependent packages to the latest version ([#28](https://github.com/speee/jsx-slack/pull/28)) +- Update dependent packages to the latest version ([#28](https://github.com/yhatt/jsx-slack/pull/28)) ## v0.5.0 - 2019-06-28 ### Added -- Support Node.js 12 ([#23](https://github.com/speee/jsx-slack/pull/23)) +- Support Node.js 12 ([#23](https://github.com/yhatt/jsx-slack/pull/23)) ### Changed -- Make interchangeable with `` component and intrinsic `` tag ([#21](https://github.com/speee/jsx-slack/pull/21)) -- Upgrade dependent packages to the latest version ([#24](https://github.com/speee/jsx-slack/pull/24)) +- Make interchangeable with `` component and intrinsic `` tag ([#21](https://github.com/yhatt/jsx-slack/pull/21)) +- Upgrade dependent packages to the latest version ([#24](https://github.com/yhatt/jsx-slack/pull/24)) ### Removed -- Remove deprecated `` component ([#22](https://github.com/speee/jsx-slack/pull/22)) +- Remove deprecated `` component ([#22](https://github.com/yhatt/jsx-slack/pull/22)) ## v0.4.3 - 2019-05-15 ### Fixed -- Fix vanishing styled channel links and mentions ([#15](https://github.com/speee/jsx-slack/issues/15), [#17](https://github.com/speee/jsx-slack/pull/17)) +- Fix vanishing styled channel links and mentions ([#15](https://github.com/yhatt/jsx-slack/issues/15), [#17](https://github.com/yhatt/jsx-slack/pull/17)) ### Changed -- Upgrade dependent packages to the latest version ([#18](https://github.com/speee/jsx-slack/pull/18)) +- Upgrade dependent packages to the latest version ([#18](https://github.com/yhatt/jsx-slack/pull/18)) ## v0.4.2 - 2019-04-13 ### Added -- Add `style` prop for `` component ([#13](https://github.com/speee/jsx-slack/issues/13), [#14](https://github.com/speee/jsx-slack/pull/14)) +- Add `style` prop for `` component ([#13](https://github.com/yhatt/jsx-slack/issues/13), [#14](https://github.com/yhatt/jsx-slack/pull/14)) ## v0.4.1 - 2019-03-13 ### Added -- `` container component ([#12](https://github.com/speee/jsx-slack/pull/12)) +- `` container component ([#12](https://github.com/yhatt/jsx-slack/pull/12)) ### Deprecated -- Mark a confusable `` fragment component as deprecated in favor of added `` ([#11](https://github.com/speee/jsx-slack/issues/11), [#12](https://github.com/speee/jsx-slack/pull/12)) +- Mark a confusable `` fragment component as deprecated in favor of added `` ([#11](https://github.com/yhatt/jsx-slack/issues/11), [#12](https://github.com/yhatt/jsx-slack/pull/12)) ## v0.4.0 - 2019-03-12 ### Added -- Support nested list ([#10](https://github.com/speee/jsx-slack/pull/10)) +- Support nested list ([#10](https://github.com/yhatt/jsx-slack/pull/10)) ## v0.3.0 - 2019-03-11 ### Added -- Add `` component ([#9](https://github.com/speee/jsx-slack/pull/9)) +- Add `` component ([#9](https://github.com/yhatt/jsx-slack/pull/9)) ### Changed -- Right-aligned number in ordered list ([#8](https://github.com/speee/jsx-slack/pull/8)) +- Right-aligned number in ordered list ([#8](https://github.com/yhatt/jsx-slack/pull/8)) ## v0.2.0 - 2019-03-07 ### Added -- `jsxslack` template literal tag for using jsx-slack without transpiler, powered by [htm](https://github.com/developit/htm) ([#6](https://github.com/speee/jsx-slack/issues/6), [#7](https://github.com/speee/jsx-slack/pull/7)) +- `jsxslack` template literal tag for using jsx-slack without transpiler, powered by [htm](https://github.com/developit/htm) ([#6](https://github.com/yhatt/jsx-slack/issues/6), [#7](https://github.com/yhatt/jsx-slack/pull/7)) ### Fixed -- Improve `README.md` with some minor fixes ([#4](https://github.com/speee/jsx-slack/pull/4)) -- Revert ignored audit ([#5](https://github.com/speee/jsx-slack/pull/5)) +- Improve `README.md` with some minor fixes ([#4](https://github.com/yhatt/jsx-slack/pull/4)) +- Revert ignored audit ([#5](https://github.com/yhatt/jsx-slack/pull/5)) ## v0.1.0 - 2019-03-01 diff --git a/LICENSE b/LICENSE index 30d59f4c..87a0a91d 100644 --- a/LICENSE +++ b/LICENSE @@ -1,6 +1,6 @@ MIT License -Copyright (c) 2019- Yuki Hattori (yuki.hattori@speee.jp) and Speee, Inc. +Copyright (c) 2019- Yuki Hattori (yukihattori1116@gmail.com). Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal diff --git a/README.md b/README.md index 7b5e5a29..2bb6a253 100644 --- a/README.md +++ b/README.md @@ -1,23 +1,21 @@ - - - + + + jsx-slack -[![CircleCI](https://img.shields.io/circleci/project/github/speee/jsx-slack/master.svg?logo=circleci)][circleci] -[![Codecov](https://img.shields.io/codecov/c/github/speee/jsx-slack/master.svg?logo=codecov)](https://codecov.io/gh/speee/jsx-slack) -[![npm](https://img.shields.io/npm/v/@speee-js/jsx-slack.svg?logo=npm)][npm] -[![LICENSE](https://img.shields.io/github/license/speee/jsx-slack.svg)][license] +[![CircleCI](https://img.shields.io/circleci/project/github/yhatt/jsx-slack/master.svg?logo=circleci)][circleci] +[![Codecov](https://img.shields.io/codecov/c/github/yhatt/jsx-slack/master.svg?logo=codecov)](https://codecov.io/gh/yhatt/jsx-slack) +[![npm](https://img.shields.io/npm/v/jsx-slack.svg?logo=npm)][npm] +[![LICENSE](https://img.shields.io/github/license/yhatt/jsx-slack.svg)][license] -[circleci]: https://circleci.com/gh/speee/jsx-slack/ -[npm]: https://npm.im/@speee-js/jsx-slack +[circleci]: https://circleci.com/gh/yhatt/jsx-slack/ +[npm]: https://npm.im/jsx-slack [license]: ./LICENSE Build JSON object for [Slack][slack] [block kit] surfaces from [JSX]. -> :sparkles: **We have sparkling jsx-slack v2!** :sparkles: **[▶︎ See highlight of v2](docs/highlight/v2.md)** - [slack]: https://slack.com [jsx]: https://reactjs.org/docs/introducing-jsx.html [react]: https://reactjs.org/ @@ -25,16 +23,16 @@ Build JSON object for [Slack][slack] [block kit] surfaces from [JSX]. [block kit builder]: https://api.slack.com/tools/block-kit-builder - - + + - - + + -:point_right: **[Try our REPL demo](https://speee-jsx-slack.netlify.app/)** in https://speee-jsx-slack.netlify.app/. +:point_right: **[Try our REPL demo](https://jsx-slack.netlify.app/)** in https://jsx-slack.netlify.app/. ### Features @@ -61,12 +59,12 @@ We require Node.js >= 10. If you are using TypeScript, we also require TS >= 3.7 ```bash # npm -npm install --save @speee-js/jsx-slack +npm install --save jsx-slack ``` ```bash # yarn -yarn add @speee-js/jsx-slack +yarn add jsx-slack ``` ## Usage @@ -80,7 +78,7 @@ It allows the template syntax almost same as JSX, powered by [HTM (Hyperscript T This is a simple example of the template function just to say hello to someone. ```javascript -import { jsxslack } from '@speee-js/jsx-slack' +import { jsxslack } from 'jsx-slack' export const exampleBlock = ({ name }) => jsxslack` @@ -97,7 +95,7 @@ When you want to use jsx-slack with JSX transpiler, you have to set up to use im ```jsx /** @jsx JSXSlack.h */ -import { JSXSlack, Blocks, Section } from '@speee-js/jsx-slack' +import { JSXSlack, Blocks, Section } from 'jsx-slack' export const exampleBlock = ({ name }) => ( @@ -135,7 +133,7 @@ It would post a simple Slack message like this: [][block-kit-builder-example] -[block-kit-builder-example]: https://speee-jsx-slack.netlify.app/#bkb:jsx:eJyzccrJT84utuNSULAJTk0uyczPA7EVFDxSc3LydRRskuwiS7MzFTwSS0ryizJt9JPsFEFq9eGKbfShRgAAVeQWug== +[block-kit-builder-example]: https://jsx-slack.netlify.app/#bkb:jsx:eJyzccrJT84utuNSULAJTk0uyczPA7EVFDxSc3LydRRskuwiS7MzFTwSS0ryizJt9JPsFEFq9eGKbfShRgAAVeQWug== ## Block Kit as components @@ -143,7 +141,7 @@ Slack has recommended to use **[Block Kit]** for building tempting messages and By using jsx-slack, you can build a template with piling up Block Kit blocks by JSX. It is feeling like using components in React or Vue. -### [For messaging](https://speee-jsx-slack.netlify.app/) +### [For messaging](https://jsx-slack.netlify.app/) ```jsx @@ -151,12 +149,12 @@ By using jsx-slack, you can build a template with piling up Block Kit blocks by Enjoy building blocks! - @speee-js/jsx-slack + jsx-slack Build JSON for Slack Block Kit from JSX - + Maintained by Yuki Hattori @@ -164,13 +162,13 @@ By using jsx-slack, you can build a template with piling up Block Kit blocks by - GitHub - npm + GitHub + npm ``` -### [For modal](https://speee-jsx-slack.netlify.app/#modal) +### [For modal](https://jsx-slack.netlify.app/#modal) ```jsx @@ -199,7 +197,7 @@ By using jsx-slack, you can build a template with piling up Block Kit blocks by ``` -### [For home tab](https://speee-jsx-slack.netlify.app/#home) +### [For home tab](https://jsx-slack.netlify.app/#home) ```jsx @@ -249,37 +247,39 @@ By using jsx-slack, you can build a template with piling up Block Kit blocks by * **[HTML-like formatting](docs/html-like-formatting.md)** * **[About escape and exact mode](docs/about-escape-and-exact-mode.md)** +- **[Highlight of v2](docs/highlight/v2.md)** + ### Examples by use cases Ported from templates for [Block Kit Builder]. #### [Message](https://api.slack.com/tools/block-kit-builder?mode=message&template=1) -- [Approval (New device request)](https://speee-jsx-slack.netlify.app/#messagingApprovalNewDevice) -- [Approval (Time Off request)](https://speee-jsx-slack.netlify.app/#messagingApprovalTimeOff) -- [Notification](https://speee-jsx-slack.netlify.app/#messagingNotification) -- [Onboarding (Taskbot)](https://speee-jsx-slack.netlify.app/#messagingOnboardingTaskbot) -- [Onboarding (Onboarding App)](https://speee-jsx-slack.netlify.app/#messagingOnboardingApp) -- [Poll](https://speee-jsx-slack.netlify.app/#messagingPoll) -- [Search Results (TripAgent)](https://speee-jsx-slack.netlify.app/#messagingSearchResultsTripAgent) -- [Search Results (FileCard Agent)](https://speee-jsx-slack.netlify.app/#messagingSearchResultsFileCard) -- [Newsletter](https://speee-jsx-slack.netlify.app/#messagingNewsletter) +- [Approval (New device request)](https://jsx-slack.netlify.app/#messagingApprovalNewDevice) +- [Approval (Time Off request)](https://jsx-slack.netlify.app/#messagingApprovalTimeOff) +- [Notification](https://jsx-slack.netlify.app/#messagingNotification) +- [Onboarding (Taskbot)](https://jsx-slack.netlify.app/#messagingOnboardingTaskbot) +- [Onboarding (Onboarding App)](https://jsx-slack.netlify.app/#messagingOnboardingApp) +- [Poll](https://jsx-slack.netlify.app/#messagingPoll) +- [Search Results (TripAgent)](https://jsx-slack.netlify.app/#messagingSearchResultsTripAgent) +- [Search Results (FileCard Agent)](https://jsx-slack.netlify.app/#messagingSearchResultsFileCard) +- [Newsletter](https://jsx-slack.netlify.app/#messagingNewsletter) #### [Modal](https://api.slack.com/tools/block-kit-builder?mode=modal&template=1) -- [Poll](https://speee-jsx-slack.netlify.app/#modalPoll) -- [Search Results](https://speee-jsx-slack.netlify.app/#modalSearchResults) -- [Settings (App menu)](https://speee-jsx-slack.netlify.app/#modalSettingsAppMenu) -- [Settings (Notification settings)](https://speee-jsx-slack.netlify.app/#modalSettingsNotification) -- [List of information (Your itinerary)](https://speee-jsx-slack.netlify.app/#modalListOfInformationYourItinerary) -- [List of information (Ticket app)](https://speee-jsx-slack.netlify.app/#modalListOfInformationTicketApp) +- [Poll](https://jsx-slack.netlify.app/#modalPoll) +- [Search Results](https://jsx-slack.netlify.app/#modalSearchResults) +- [Settings (App menu)](https://jsx-slack.netlify.app/#modalSettingsAppMenu) +- [Settings (Notification settings)](https://jsx-slack.netlify.app/#modalSettingsNotification) +- [List of information (Your itinerary)](https://jsx-slack.netlify.app/#modalListOfInformationYourItinerary) +- [List of information (Ticket app)](https://jsx-slack.netlify.app/#modalListOfInformationTicketApp) #### [App Home](https://api.slack.com/tools/block-kit-builder?mode=appHome&template=1) -- [Project Tracker](https://speee-jsx-slack.netlify.app/#appHomeProjectTracker) -- [Calendar](https://speee-jsx-slack.netlify.app/#appHomeCalendar) -- [Expense App](https://speee-jsx-slack.netlify.app/#appHomeExpenseApp) -- [Todo App](https://speee-jsx-slack.netlify.app/#appHomeTodoApp) +- [Project Tracker](https://jsx-slack.netlify.app/#appHomeProjectTracker) +- [Calendar](https://jsx-slack.netlify.app/#appHomeCalendar) +- [Expense App](https://jsx-slack.netlify.app/#appHomeExpenseApp) +- [Todo App](https://jsx-slack.netlify.app/#appHomeTodoApp) ## Fragments @@ -291,7 +291,7 @@ Let's say about defining `` custom block that is consisted by ` ( @@ -318,7 +318,7 @@ Now the defined block can use in `` as like as the other blocks: [][custom-header-block] -[custom-header-block]: https://speee-jsx-slack.netlify.app/#bkb:jsx:eJxVjrEOgzAQQ3e-4jYmejs6Zag6duMLSIjQlZRIOEHt3xcaBphsD8-23EN0E0xFJJ13SeO8-y3ZoptT88KnQejdRC4jxTfZnRJWQy3yPIYe8GgLyH9S-FQnD1118AvxZejpUw2yWcNA35iXUns7ocLHvx9tITN_ +[custom-header-block]: https://jsx-slack.netlify.app/#bkb:jsx:eJxVjrEOgzAQQ3e-4jYmejs6Zag6duMLSIjQlZRIOEHt3xcaBphsD8-23EN0E0xFJJ13SeO8-y3ZoptT88KnQejdRC4jxTfZnRJWQy3yPIYe8GgLyH9S-FQnD1118AvxZejpUw2yWcNA35iXUns7ocLHvx9tITN_ ### Short syntax for fragments @@ -327,7 +327,7 @@ Babel transpiler and TypeScript 4 can use [the short syntax `<>>` for fragment ```javascript /** @jsx JSXSlack.h */ /** @jsxFrag JSXSlack.Fragment */ -import { JSXSlack } from '@speee-js/jsx-slack' +import { JSXSlack } from 'jsx-slack' const Header = ({ children }) => ( <> @@ -345,7 +345,7 @@ const Header = ({ children }) => ( ```javascript // Header.js -import { jsxslack } from '@speee-js/jsx-slack' +import { jsxslack } from 'jsx-slack' export const Header = ({ children }) => jsxslack` @@ -358,7 +358,7 @@ export const Header = ({ children }) => jsxslack` A defined component may use in `jsxslack` tag as below: ```javascript -import { jsxslack } from '@speee-js/jsx-slack' +import { jsxslack } from 'jsx-slack' import { Header } from './Header' console.log(jsxslack` @@ -405,8 +405,6 @@ FYI there are some projects based on React ([react-reconciler](https://github.co ## Author -Managed by [ Speee, Inc.](https://speee.jp) ([@speee](https://github.com/speee)) - - Yuki Hattori ([@yhatt](https://github.com/yhatt)) - Maintainer ## License diff --git a/demo/examples/basic.js b/demo/examples/basic.js index 446c4a04..45e488cd 100644 --- a/demo/examples/basic.js +++ b/demo/examples/basic.js @@ -6,12 +6,12 @@ export const message = `
` element ([#16](https://github.com/speee/jsx-slack/pull/16), [#46](https://github.com/speee/jsx-slack/pull/46)) +- Improve html entity decoding in JSX and template literal tag ([#33](https://github.com/yhatt/jsx-slack/pull/33), [#45](https://github.com/yhatt/jsx-slack/issues/45), [#47](https://github.com/yhatt/jsx-slack/pull/47)) +- Allow links in the inside of `` and `` element ([#16](https://github.com/yhatt/jsx-slack/pull/16), [#46](https://github.com/yhatt/jsx-slack/pull/46)) ## v0.8.1 - 2019-08-07 ### Added -- Better dialog support for `jsxslack` template literal ([#42](https://github.com/speee/jsx-slack/issues/42), [#43](https://github.com/speee/jsx-slack/pull/43)) -- Update REPL demo to add dialog example ([#43](https://github.com/speee/jsx-slack/pull/43)) +- Better dialog support for `jsxslack` template literal ([#42](https://github.com/yhatt/jsx-slack/issues/42), [#43](https://github.com/yhatt/jsx-slack/pull/43)) +- Update REPL demo to add dialog example ([#43](https://github.com/yhatt/jsx-slack/pull/43)) ### Fixed -- Coerce number-expected prop to integer ([#44](https://github.com/speee/jsx-slack/pull/44)) +- Coerce number-expected prop to integer ([#44](https://github.com/yhatt/jsx-slack/pull/44)) ## v0.8.0 - 2019-08-06 ### Added -- Dialog support ([#19](https://github.com/speee/jsx-slack/issues/19), [#39](https://github.com/speee/jsx-slack/pull/39)) +- Dialog support ([#19](https://github.com/yhatt/jsx-slack/issues/19), [#39](https://github.com/yhatt/jsx-slack/pull/39)) ### Fixed -- Don't prevent generating `` with no options ([#41](https://github.com/speee/jsx-slack/pull/41)) +- Don't prevent generating `` with no options ([#41](https://github.com/yhatt/jsx-slack/pull/41)) ### Changed -- Update `htm` to [v2.2.0](https://github.com/developit/htm/releases/tag/2.2.0) ([#38](https://github.com/speee/jsx-slack/pull/38)) +- Update `htm` to [v2.2.0](https://github.com/developit/htm/releases/tag/2.2.0) ([#38](https://github.com/yhatt/jsx-slack/pull/38)) ## v0.7.0 - 2019-07-29 ### Added -- `` block component ([#34](https://github.com/speee/jsx-slack/issues/34), [#35](https://github.com/speee/jsx-slack/pull/35)) -- `jsxslack.fragment` template literal tag ([#32](https://github.com/speee/jsx-slack/pull/32)) -- Codecov integration and coverage badge ([#36](https://github.com/speee/jsx-slack/pull/36)) +- `` block component ([#34](https://github.com/yhatt/jsx-slack/issues/34), [#35](https://github.com/yhatt/jsx-slack/pull/35)) +- `jsxslack.fragment` template literal tag ([#32](https://github.com/yhatt/jsx-slack/pull/32)) +- Codecov integration and coverage badge ([#36](https://github.com/yhatt/jsx-slack/pull/36)) ### Changed -- Update dependent packages to the latest version ([#37](https://github.com/speee/jsx-slack/pull/37)) +- Update dependent packages to the latest version ([#37](https://github.com/yhatt/jsx-slack/pull/37)) ## v0.6.0 - 2019-07-20 ### Added -- Convert `` in `` into mrkdwn element ([#26](https://github.com/speee/jsx-slack/issues/26), [#31](https://github.com/speee/jsx-slack/pull/31)) -- `` built-in component ([#29](https://github.com/speee/jsx-slack/pull/29)) +- Convert `` in `` into mrkdwn element ([#26](https://github.com/yhatt/jsx-slack/issues/26), [#31](https://github.com/yhatt/jsx-slack/pull/31)) +- `` built-in component ([#29](https://github.com/yhatt/jsx-slack/pull/29)) ## v0.5.1 - 2019-07-14 ### Added -- Support mention to global user ID for Enterprise Grid ([#25](https://github.com/speee/jsx-slack/pull/25)) +- Support mention to global user ID for Enterprise Grid ([#25](https://github.com/yhatt/jsx-slack/pull/25)) ### Changed -- Update dependent packages to the latest version ([#28](https://github.com/speee/jsx-slack/pull/28)) +- Update dependent packages to the latest version ([#28](https://github.com/yhatt/jsx-slack/pull/28)) ## v0.5.0 - 2019-06-28 ### Added -- Support Node.js 12 ([#23](https://github.com/speee/jsx-slack/pull/23)) +- Support Node.js 12 ([#23](https://github.com/yhatt/jsx-slack/pull/23)) ### Changed -- Make interchangeable with `` component and intrinsic `` tag ([#21](https://github.com/speee/jsx-slack/pull/21)) -- Upgrade dependent packages to the latest version ([#24](https://github.com/speee/jsx-slack/pull/24)) +- Make interchangeable with `` component and intrinsic `` tag ([#21](https://github.com/yhatt/jsx-slack/pull/21)) +- Upgrade dependent packages to the latest version ([#24](https://github.com/yhatt/jsx-slack/pull/24)) ### Removed -- Remove deprecated `` component ([#22](https://github.com/speee/jsx-slack/pull/22)) +- Remove deprecated `` component ([#22](https://github.com/yhatt/jsx-slack/pull/22)) ## v0.4.3 - 2019-05-15 ### Fixed -- Fix vanishing styled channel links and mentions ([#15](https://github.com/speee/jsx-slack/issues/15), [#17](https://github.com/speee/jsx-slack/pull/17)) +- Fix vanishing styled channel links and mentions ([#15](https://github.com/yhatt/jsx-slack/issues/15), [#17](https://github.com/yhatt/jsx-slack/pull/17)) ### Changed -- Upgrade dependent packages to the latest version ([#18](https://github.com/speee/jsx-slack/pull/18)) +- Upgrade dependent packages to the latest version ([#18](https://github.com/yhatt/jsx-slack/pull/18)) ## v0.4.2 - 2019-04-13 ### Added -- Add `style` prop for `` component ([#13](https://github.com/speee/jsx-slack/issues/13), [#14](https://github.com/speee/jsx-slack/pull/14)) +- Add `style` prop for `` component ([#13](https://github.com/yhatt/jsx-slack/issues/13), [#14](https://github.com/yhatt/jsx-slack/pull/14)) ## v0.4.1 - 2019-03-13 ### Added -- `` container component ([#12](https://github.com/speee/jsx-slack/pull/12)) +- `` container component ([#12](https://github.com/yhatt/jsx-slack/pull/12)) ### Deprecated -- Mark a confusable `` fragment component as deprecated in favor of added `` ([#11](https://github.com/speee/jsx-slack/issues/11), [#12](https://github.com/speee/jsx-slack/pull/12)) +- Mark a confusable `` fragment component as deprecated in favor of added `` ([#11](https://github.com/yhatt/jsx-slack/issues/11), [#12](https://github.com/yhatt/jsx-slack/pull/12)) ## v0.4.0 - 2019-03-12 ### Added -- Support nested list ([#10](https://github.com/speee/jsx-slack/pull/10)) +- Support nested list ([#10](https://github.com/yhatt/jsx-slack/pull/10)) ## v0.3.0 - 2019-03-11 ### Added -- Add `` component ([#9](https://github.com/speee/jsx-slack/pull/9)) +- Add `` component ([#9](https://github.com/yhatt/jsx-slack/pull/9)) ### Changed -- Right-aligned number in ordered list ([#8](https://github.com/speee/jsx-slack/pull/8)) +- Right-aligned number in ordered list ([#8](https://github.com/yhatt/jsx-slack/pull/8)) ## v0.2.0 - 2019-03-07 ### Added -- `jsxslack` template literal tag for using jsx-slack without transpiler, powered by [htm](https://github.com/developit/htm) ([#6](https://github.com/speee/jsx-slack/issues/6), [#7](https://github.com/speee/jsx-slack/pull/7)) +- `jsxslack` template literal tag for using jsx-slack without transpiler, powered by [htm](https://github.com/developit/htm) ([#6](https://github.com/yhatt/jsx-slack/issues/6), [#7](https://github.com/yhatt/jsx-slack/pull/7)) ### Fixed -- Improve `README.md` with some minor fixes ([#4](https://github.com/speee/jsx-slack/pull/4)) -- Revert ignored audit ([#5](https://github.com/speee/jsx-slack/pull/5)) +- Improve `README.md` with some minor fixes ([#4](https://github.com/yhatt/jsx-slack/pull/4)) +- Revert ignored audit ([#5](https://github.com/yhatt/jsx-slack/pull/5)) ## v0.1.0 - 2019-03-01 diff --git a/LICENSE b/LICENSE index 30d59f4c..87a0a91d 100644 --- a/LICENSE +++ b/LICENSE @@ -1,6 +1,6 @@ MIT License -Copyright (c) 2019- Yuki Hattori (yuki.hattori@speee.jp) and Speee, Inc. +Copyright (c) 2019- Yuki Hattori (yukihattori1116@gmail.com). Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal diff --git a/README.md b/README.md index 7b5e5a29..2bb6a253 100644 --- a/README.md +++ b/README.md @@ -1,23 +1,21 @@ - - - + + + jsx-slack -[![CircleCI](https://img.shields.io/circleci/project/github/speee/jsx-slack/master.svg?logo=circleci)][circleci] -[![Codecov](https://img.shields.io/codecov/c/github/speee/jsx-slack/master.svg?logo=codecov)](https://codecov.io/gh/speee/jsx-slack) -[![npm](https://img.shields.io/npm/v/@speee-js/jsx-slack.svg?logo=npm)][npm] -[![LICENSE](https://img.shields.io/github/license/speee/jsx-slack.svg)][license] +[![CircleCI](https://img.shields.io/circleci/project/github/yhatt/jsx-slack/master.svg?logo=circleci)][circleci] +[![Codecov](https://img.shields.io/codecov/c/github/yhatt/jsx-slack/master.svg?logo=codecov)](https://codecov.io/gh/yhatt/jsx-slack) +[![npm](https://img.shields.io/npm/v/jsx-slack.svg?logo=npm)][npm] +[![LICENSE](https://img.shields.io/github/license/yhatt/jsx-slack.svg)][license] -[circleci]: https://circleci.com/gh/speee/jsx-slack/ -[npm]: https://npm.im/@speee-js/jsx-slack +[circleci]: https://circleci.com/gh/yhatt/jsx-slack/ +[npm]: https://npm.im/jsx-slack [license]: ./LICENSE Build JSON object for [Slack][slack] [block kit] surfaces from [JSX]. -> :sparkles: **We have sparkling jsx-slack v2!** :sparkles: **[▶︎ See highlight of v2](docs/highlight/v2.md)** - [slack]: https://slack.com [jsx]: https://reactjs.org/docs/introducing-jsx.html [react]: https://reactjs.org/ @@ -25,16 +23,16 @@ Build JSON object for [Slack][slack] [block kit] surfaces from [JSX]. [block kit builder]: https://api.slack.com/tools/block-kit-builder - - + + - - + + -:point_right: **[Try our REPL demo](https://speee-jsx-slack.netlify.app/)** in https://speee-jsx-slack.netlify.app/. +:point_right: **[Try our REPL demo](https://jsx-slack.netlify.app/)** in https://jsx-slack.netlify.app/. ### Features @@ -61,12 +59,12 @@ We require Node.js >= 10. If you are using TypeScript, we also require TS >= 3.7 ```bash # npm -npm install --save @speee-js/jsx-slack +npm install --save jsx-slack ``` ```bash # yarn -yarn add @speee-js/jsx-slack +yarn add jsx-slack ``` ## Usage @@ -80,7 +78,7 @@ It allows the template syntax almost same as JSX, powered by [HTM (Hyperscript T This is a simple example of the template function just to say hello to someone. ```javascript -import { jsxslack } from '@speee-js/jsx-slack' +import { jsxslack } from 'jsx-slack' export const exampleBlock = ({ name }) => jsxslack` @@ -97,7 +95,7 @@ When you want to use jsx-slack with JSX transpiler, you have to set up to use im ```jsx /** @jsx JSXSlack.h */ -import { JSXSlack, Blocks, Section } from '@speee-js/jsx-slack' +import { JSXSlack, Blocks, Section } from 'jsx-slack' export const exampleBlock = ({ name }) => ( @@ -135,7 +133,7 @@ It would post a simple Slack message like this: [][block-kit-builder-example] -[block-kit-builder-example]: https://speee-jsx-slack.netlify.app/#bkb:jsx:eJyzccrJT84utuNSULAJTk0uyczPA7EVFDxSc3LydRRskuwiS7MzFTwSS0ryizJt9JPsFEFq9eGKbfShRgAAVeQWug== +[block-kit-builder-example]: https://jsx-slack.netlify.app/#bkb:jsx:eJyzccrJT84utuNSULAJTk0uyczPA7EVFDxSc3LydRRskuwiS7MzFTwSS0ryizJt9JPsFEFq9eGKbfShRgAAVeQWug== ## Block Kit as components @@ -143,7 +141,7 @@ Slack has recommended to use **[Block Kit]** for building tempting messages and By using jsx-slack, you can build a template with piling up Block Kit blocks by JSX. It is feeling like using components in React or Vue. -### [For messaging](https://speee-jsx-slack.netlify.app/) +### [For messaging](https://jsx-slack.netlify.app/) ```jsx @@ -151,12 +149,12 @@ By using jsx-slack, you can build a template with piling up Block Kit blocks by Enjoy building blocks! - @speee-js/jsx-slack + jsx-slack Build JSON for Slack Block Kit from JSX - + Maintained by Yuki Hattori @@ -164,13 +162,13 @@ By using jsx-slack, you can build a template with piling up Block Kit blocks by - GitHub - npm + GitHub + npm ``` -### [For modal](https://speee-jsx-slack.netlify.app/#modal) +### [For modal](https://jsx-slack.netlify.app/#modal) ```jsx @@ -199,7 +197,7 @@ By using jsx-slack, you can build a template with piling up Block Kit blocks by ``` -### [For home tab](https://speee-jsx-slack.netlify.app/#home) +### [For home tab](https://jsx-slack.netlify.app/#home) ```jsx @@ -249,37 +247,39 @@ By using jsx-slack, you can build a template with piling up Block Kit blocks by * **[HTML-like formatting](docs/html-like-formatting.md)** * **[About escape and exact mode](docs/about-escape-and-exact-mode.md)** +- **[Highlight of v2](docs/highlight/v2.md)** + ### Examples by use cases Ported from templates for [Block Kit Builder]. #### [Message](https://api.slack.com/tools/block-kit-builder?mode=message&template=1) -- [Approval (New device request)](https://speee-jsx-slack.netlify.app/#messagingApprovalNewDevice) -- [Approval (Time Off request)](https://speee-jsx-slack.netlify.app/#messagingApprovalTimeOff) -- [Notification](https://speee-jsx-slack.netlify.app/#messagingNotification) -- [Onboarding (Taskbot)](https://speee-jsx-slack.netlify.app/#messagingOnboardingTaskbot) -- [Onboarding (Onboarding App)](https://speee-jsx-slack.netlify.app/#messagingOnboardingApp) -- [Poll](https://speee-jsx-slack.netlify.app/#messagingPoll) -- [Search Results (TripAgent)](https://speee-jsx-slack.netlify.app/#messagingSearchResultsTripAgent) -- [Search Results (FileCard Agent)](https://speee-jsx-slack.netlify.app/#messagingSearchResultsFileCard) -- [Newsletter](https://speee-jsx-slack.netlify.app/#messagingNewsletter) +- [Approval (New device request)](https://jsx-slack.netlify.app/#messagingApprovalNewDevice) +- [Approval (Time Off request)](https://jsx-slack.netlify.app/#messagingApprovalTimeOff) +- [Notification](https://jsx-slack.netlify.app/#messagingNotification) +- [Onboarding (Taskbot)](https://jsx-slack.netlify.app/#messagingOnboardingTaskbot) +- [Onboarding (Onboarding App)](https://jsx-slack.netlify.app/#messagingOnboardingApp) +- [Poll](https://jsx-slack.netlify.app/#messagingPoll) +- [Search Results (TripAgent)](https://jsx-slack.netlify.app/#messagingSearchResultsTripAgent) +- [Search Results (FileCard Agent)](https://jsx-slack.netlify.app/#messagingSearchResultsFileCard) +- [Newsletter](https://jsx-slack.netlify.app/#messagingNewsletter) #### [Modal](https://api.slack.com/tools/block-kit-builder?mode=modal&template=1) -- [Poll](https://speee-jsx-slack.netlify.app/#modalPoll) -- [Search Results](https://speee-jsx-slack.netlify.app/#modalSearchResults) -- [Settings (App menu)](https://speee-jsx-slack.netlify.app/#modalSettingsAppMenu) -- [Settings (Notification settings)](https://speee-jsx-slack.netlify.app/#modalSettingsNotification) -- [List of information (Your itinerary)](https://speee-jsx-slack.netlify.app/#modalListOfInformationYourItinerary) -- [List of information (Ticket app)](https://speee-jsx-slack.netlify.app/#modalListOfInformationTicketApp) +- [Poll](https://jsx-slack.netlify.app/#modalPoll) +- [Search Results](https://jsx-slack.netlify.app/#modalSearchResults) +- [Settings (App menu)](https://jsx-slack.netlify.app/#modalSettingsAppMenu) +- [Settings (Notification settings)](https://jsx-slack.netlify.app/#modalSettingsNotification) +- [List of information (Your itinerary)](https://jsx-slack.netlify.app/#modalListOfInformationYourItinerary) +- [List of information (Ticket app)](https://jsx-slack.netlify.app/#modalListOfInformationTicketApp) #### [App Home](https://api.slack.com/tools/block-kit-builder?mode=appHome&template=1) -- [Project Tracker](https://speee-jsx-slack.netlify.app/#appHomeProjectTracker) -- [Calendar](https://speee-jsx-slack.netlify.app/#appHomeCalendar) -- [Expense App](https://speee-jsx-slack.netlify.app/#appHomeExpenseApp) -- [Todo App](https://speee-jsx-slack.netlify.app/#appHomeTodoApp) +- [Project Tracker](https://jsx-slack.netlify.app/#appHomeProjectTracker) +- [Calendar](https://jsx-slack.netlify.app/#appHomeCalendar) +- [Expense App](https://jsx-slack.netlify.app/#appHomeExpenseApp) +- [Todo App](https://jsx-slack.netlify.app/#appHomeTodoApp) ## Fragments @@ -291,7 +291,7 @@ Let's say about defining `` custom block that is consisted by ` ( @@ -318,7 +318,7 @@ Now the defined block can use in `` as like as the other blocks: [][custom-header-block] -[custom-header-block]: https://speee-jsx-slack.netlify.app/#bkb:jsx:eJxVjrEOgzAQQ3e-4jYmejs6Zag6duMLSIjQlZRIOEHt3xcaBphsD8-23EN0E0xFJJ13SeO8-y3ZoptT88KnQejdRC4jxTfZnRJWQy3yPIYe8GgLyH9S-FQnD1118AvxZejpUw2yWcNA35iXUns7ocLHvx9tITN_ +[custom-header-block]: https://jsx-slack.netlify.app/#bkb:jsx:eJxVjrEOgzAQQ3e-4jYmejs6Zag6duMLSIjQlZRIOEHt3xcaBphsD8-23EN0E0xFJJ13SeO8-y3ZoptT88KnQejdRC4jxTfZnRJWQy3yPIYe8GgLyH9S-FQnD1118AvxZejpUw2yWcNA35iXUns7ocLHvx9tITN_ ### Short syntax for fragments @@ -327,7 +327,7 @@ Babel transpiler and TypeScript 4 can use [the short syntax `<>>` for fragment ```javascript /** @jsx JSXSlack.h */ /** @jsxFrag JSXSlack.Fragment */ -import { JSXSlack } from '@speee-js/jsx-slack' +import { JSXSlack } from 'jsx-slack' const Header = ({ children }) => ( <> @@ -345,7 +345,7 @@ const Header = ({ children }) => ( ```javascript // Header.js -import { jsxslack } from '@speee-js/jsx-slack' +import { jsxslack } from 'jsx-slack' export const Header = ({ children }) => jsxslack` @@ -358,7 +358,7 @@ export const Header = ({ children }) => jsxslack` A defined component may use in `jsxslack` tag as below: ```javascript -import { jsxslack } from '@speee-js/jsx-slack' +import { jsxslack } from 'jsx-slack' import { Header } from './Header' console.log(jsxslack` @@ -405,8 +405,6 @@ FYI there are some projects based on React ([react-reconciler](https://github.co ## Author -Managed by [ Speee, Inc.](https://speee.jp) ([@speee](https://github.com/speee)) - - Yuki Hattori ([@yhatt](https://github.com/yhatt)) - Maintainer ## License diff --git a/demo/examples/basic.js b/demo/examples/basic.js index 446c4a04..45e488cd 100644 --- a/demo/examples/basic.js +++ b/demo/examples/basic.js @@ -6,12 +6,12 @@ export const message = `
` and `` element ([#16](https://github.com/yhatt/jsx-slack/pull/16), [#46](https://github.com/yhatt/jsx-slack/pull/46)) ## v0.8.1 - 2019-08-07 ### Added -- Better dialog support for `jsxslack` template literal ([#42](https://github.com/speee/jsx-slack/issues/42), [#43](https://github.com/speee/jsx-slack/pull/43)) -- Update REPL demo to add dialog example ([#43](https://github.com/speee/jsx-slack/pull/43)) +- Better dialog support for `jsxslack` template literal ([#42](https://github.com/yhatt/jsx-slack/issues/42), [#43](https://github.com/yhatt/jsx-slack/pull/43)) +- Update REPL demo to add dialog example ([#43](https://github.com/yhatt/jsx-slack/pull/43)) ### Fixed -- Coerce number-expected prop to integer ([#44](https://github.com/speee/jsx-slack/pull/44)) +- Coerce number-expected prop to integer ([#44](https://github.com/yhatt/jsx-slack/pull/44)) ## v0.8.0 - 2019-08-06 ### Added -- Dialog support ([#19](https://github.com/speee/jsx-slack/issues/19), [#39](https://github.com/speee/jsx-slack/pull/39)) +- Dialog support ([#19](https://github.com/yhatt/jsx-slack/issues/19), [#39](https://github.com/yhatt/jsx-slack/pull/39)) ### Fixed -- Don't prevent generating `` with no options ([#41](https://github.com/speee/jsx-slack/pull/41)) +- Don't prevent generating `` with no options ([#41](https://github.com/yhatt/jsx-slack/pull/41)) ### Changed -- Update `htm` to [v2.2.0](https://github.com/developit/htm/releases/tag/2.2.0) ([#38](https://github.com/speee/jsx-slack/pull/38)) +- Update `htm` to [v2.2.0](https://github.com/developit/htm/releases/tag/2.2.0) ([#38](https://github.com/yhatt/jsx-slack/pull/38)) ## v0.7.0 - 2019-07-29 ### Added -- `` block component ([#34](https://github.com/speee/jsx-slack/issues/34), [#35](https://github.com/speee/jsx-slack/pull/35)) -- `jsxslack.fragment` template literal tag ([#32](https://github.com/speee/jsx-slack/pull/32)) -- Codecov integration and coverage badge ([#36](https://github.com/speee/jsx-slack/pull/36)) +- `` block component ([#34](https://github.com/yhatt/jsx-slack/issues/34), [#35](https://github.com/yhatt/jsx-slack/pull/35)) +- `jsxslack.fragment` template literal tag ([#32](https://github.com/yhatt/jsx-slack/pull/32)) +- Codecov integration and coverage badge ([#36](https://github.com/yhatt/jsx-slack/pull/36)) ### Changed -- Update dependent packages to the latest version ([#37](https://github.com/speee/jsx-slack/pull/37)) +- Update dependent packages to the latest version ([#37](https://github.com/yhatt/jsx-slack/pull/37)) ## v0.6.0 - 2019-07-20 ### Added -- Convert `` in `` into mrkdwn element ([#26](https://github.com/speee/jsx-slack/issues/26), [#31](https://github.com/speee/jsx-slack/pull/31)) -- `` built-in component ([#29](https://github.com/speee/jsx-slack/pull/29)) +- Convert `` in `` into mrkdwn element ([#26](https://github.com/yhatt/jsx-slack/issues/26), [#31](https://github.com/yhatt/jsx-slack/pull/31)) +- `` built-in component ([#29](https://github.com/yhatt/jsx-slack/pull/29)) ## v0.5.1 - 2019-07-14 ### Added -- Support mention to global user ID for Enterprise Grid ([#25](https://github.com/speee/jsx-slack/pull/25)) +- Support mention to global user ID for Enterprise Grid ([#25](https://github.com/yhatt/jsx-slack/pull/25)) ### Changed -- Update dependent packages to the latest version ([#28](https://github.com/speee/jsx-slack/pull/28)) +- Update dependent packages to the latest version ([#28](https://github.com/yhatt/jsx-slack/pull/28)) ## v0.5.0 - 2019-06-28 ### Added -- Support Node.js 12 ([#23](https://github.com/speee/jsx-slack/pull/23)) +- Support Node.js 12 ([#23](https://github.com/yhatt/jsx-slack/pull/23)) ### Changed -- Make interchangeable with `` component and intrinsic `` tag ([#21](https://github.com/speee/jsx-slack/pull/21)) -- Upgrade dependent packages to the latest version ([#24](https://github.com/speee/jsx-slack/pull/24)) +- Make interchangeable with `` component and intrinsic `` tag ([#21](https://github.com/yhatt/jsx-slack/pull/21)) +- Upgrade dependent packages to the latest version ([#24](https://github.com/yhatt/jsx-slack/pull/24)) ### Removed -- Remove deprecated `` component ([#22](https://github.com/speee/jsx-slack/pull/22)) +- Remove deprecated `` component ([#22](https://github.com/yhatt/jsx-slack/pull/22)) ## v0.4.3 - 2019-05-15 ### Fixed -- Fix vanishing styled channel links and mentions ([#15](https://github.com/speee/jsx-slack/issues/15), [#17](https://github.com/speee/jsx-slack/pull/17)) +- Fix vanishing styled channel links and mentions ([#15](https://github.com/yhatt/jsx-slack/issues/15), [#17](https://github.com/yhatt/jsx-slack/pull/17)) ### Changed -- Upgrade dependent packages to the latest version ([#18](https://github.com/speee/jsx-slack/pull/18)) +- Upgrade dependent packages to the latest version ([#18](https://github.com/yhatt/jsx-slack/pull/18)) ## v0.4.2 - 2019-04-13 ### Added -- Add `style` prop for `` component ([#13](https://github.com/speee/jsx-slack/issues/13), [#14](https://github.com/speee/jsx-slack/pull/14)) +- Add `style` prop for `` component ([#13](https://github.com/yhatt/jsx-slack/issues/13), [#14](https://github.com/yhatt/jsx-slack/pull/14)) ## v0.4.1 - 2019-03-13 ### Added -- `` container component ([#12](https://github.com/speee/jsx-slack/pull/12)) +- `` container component ([#12](https://github.com/yhatt/jsx-slack/pull/12)) ### Deprecated -- Mark a confusable `` fragment component as deprecated in favor of added `` ([#11](https://github.com/speee/jsx-slack/issues/11), [#12](https://github.com/speee/jsx-slack/pull/12)) +- Mark a confusable `` fragment component as deprecated in favor of added `` ([#11](https://github.com/yhatt/jsx-slack/issues/11), [#12](https://github.com/yhatt/jsx-slack/pull/12)) ## v0.4.0 - 2019-03-12 ### Added -- Support nested list ([#10](https://github.com/speee/jsx-slack/pull/10)) +- Support nested list ([#10](https://github.com/yhatt/jsx-slack/pull/10)) ## v0.3.0 - 2019-03-11 ### Added -- Add `` component ([#9](https://github.com/speee/jsx-slack/pull/9)) +- Add `` component ([#9](https://github.com/yhatt/jsx-slack/pull/9)) ### Changed -- Right-aligned number in ordered list ([#8](https://github.com/speee/jsx-slack/pull/8)) +- Right-aligned number in ordered list ([#8](https://github.com/yhatt/jsx-slack/pull/8)) ## v0.2.0 - 2019-03-07 ### Added -- `jsxslack` template literal tag for using jsx-slack without transpiler, powered by [htm](https://github.com/developit/htm) ([#6](https://github.com/speee/jsx-slack/issues/6), [#7](https://github.com/speee/jsx-slack/pull/7)) +- `jsxslack` template literal tag for using jsx-slack without transpiler, powered by [htm](https://github.com/developit/htm) ([#6](https://github.com/yhatt/jsx-slack/issues/6), [#7](https://github.com/yhatt/jsx-slack/pull/7)) ### Fixed -- Improve `README.md` with some minor fixes ([#4](https://github.com/speee/jsx-slack/pull/4)) -- Revert ignored audit ([#5](https://github.com/speee/jsx-slack/pull/5)) +- Improve `README.md` with some minor fixes ([#4](https://github.com/yhatt/jsx-slack/pull/4)) +- Revert ignored audit ([#5](https://github.com/yhatt/jsx-slack/pull/5)) ## v0.1.0 - 2019-03-01 diff --git a/LICENSE b/LICENSE index 30d59f4c..87a0a91d 100644 --- a/LICENSE +++ b/LICENSE @@ -1,6 +1,6 @@ MIT License -Copyright (c) 2019- Yuki Hattori (yuki.hattori@speee.jp) and Speee, Inc. +Copyright (c) 2019- Yuki Hattori (yukihattori1116@gmail.com). Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal diff --git a/README.md b/README.md index 7b5e5a29..2bb6a253 100644 --- a/README.md +++ b/README.md @@ -1,23 +1,21 @@ - - - + + + jsx-slack -[![CircleCI](https://img.shields.io/circleci/project/github/speee/jsx-slack/master.svg?logo=circleci)][circleci] -[![Codecov](https://img.shields.io/codecov/c/github/speee/jsx-slack/master.svg?logo=codecov)](https://codecov.io/gh/speee/jsx-slack) -[![npm](https://img.shields.io/npm/v/@speee-js/jsx-slack.svg?logo=npm)][npm] -[![LICENSE](https://img.shields.io/github/license/speee/jsx-slack.svg)][license] +[![CircleCI](https://img.shields.io/circleci/project/github/yhatt/jsx-slack/master.svg?logo=circleci)][circleci] +[![Codecov](https://img.shields.io/codecov/c/github/yhatt/jsx-slack/master.svg?logo=codecov)](https://codecov.io/gh/yhatt/jsx-slack) +[![npm](https://img.shields.io/npm/v/jsx-slack.svg?logo=npm)][npm] +[![LICENSE](https://img.shields.io/github/license/yhatt/jsx-slack.svg)][license] -[circleci]: https://circleci.com/gh/speee/jsx-slack/ -[npm]: https://npm.im/@speee-js/jsx-slack +[circleci]: https://circleci.com/gh/yhatt/jsx-slack/ +[npm]: https://npm.im/jsx-slack [license]: ./LICENSE Build JSON object for [Slack][slack] [block kit] surfaces from [JSX]. -> :sparkles: **We have sparkling jsx-slack v2!** :sparkles: **[▶︎ See highlight of v2](docs/highlight/v2.md)** - [slack]: https://slack.com [jsx]: https://reactjs.org/docs/introducing-jsx.html [react]: https://reactjs.org/ @@ -25,16 +23,16 @@ Build JSON object for [Slack][slack] [block kit] surfaces from [JSX]. [block kit builder]: https://api.slack.com/tools/block-kit-builder - - + + - - + + -:point_right: **[Try our REPL demo](https://speee-jsx-slack.netlify.app/)** in https://speee-jsx-slack.netlify.app/. +:point_right: **[Try our REPL demo](https://jsx-slack.netlify.app/)** in https://jsx-slack.netlify.app/. ### Features @@ -61,12 +59,12 @@ We require Node.js >= 10. If you are using TypeScript, we also require TS >= 3.7 ```bash # npm -npm install --save @speee-js/jsx-slack +npm install --save jsx-slack ``` ```bash # yarn -yarn add @speee-js/jsx-slack +yarn add jsx-slack ``` ## Usage @@ -80,7 +78,7 @@ It allows the template syntax almost same as JSX, powered by [HTM (Hyperscript T This is a simple example of the template function just to say hello to someone. ```javascript -import { jsxslack } from '@speee-js/jsx-slack' +import { jsxslack } from 'jsx-slack' export const exampleBlock = ({ name }) => jsxslack` @@ -97,7 +95,7 @@ When you want to use jsx-slack with JSX transpiler, you have to set up to use im ```jsx /** @jsx JSXSlack.h */ -import { JSXSlack, Blocks, Section } from '@speee-js/jsx-slack' +import { JSXSlack, Blocks, Section } from 'jsx-slack' export const exampleBlock = ({ name }) => ( @@ -135,7 +133,7 @@ It would post a simple Slack message like this: [][block-kit-builder-example] -[block-kit-builder-example]: https://speee-jsx-slack.netlify.app/#bkb:jsx:eJyzccrJT84utuNSULAJTk0uyczPA7EVFDxSc3LydRRskuwiS7MzFTwSS0ryizJt9JPsFEFq9eGKbfShRgAAVeQWug== +[block-kit-builder-example]: https://jsx-slack.netlify.app/#bkb:jsx:eJyzccrJT84utuNSULAJTk0uyczPA7EVFDxSc3LydRRskuwiS7MzFTwSS0ryizJt9JPsFEFq9eGKbfShRgAAVeQWug== ## Block Kit as components @@ -143,7 +141,7 @@ Slack has recommended to use **[Block Kit]** for building tempting messages and By using jsx-slack, you can build a template with piling up Block Kit blocks by JSX. It is feeling like using components in React or Vue. -### [For messaging](https://speee-jsx-slack.netlify.app/) +### [For messaging](https://jsx-slack.netlify.app/) ```jsx @@ -151,12 +149,12 @@ By using jsx-slack, you can build a template with piling up Block Kit blocks by Enjoy building blocks! - @speee-js/jsx-slack + jsx-slack Build JSON for Slack Block Kit from JSX - + Maintained by Yuki Hattori @@ -164,13 +162,13 @@ By using jsx-slack, you can build a template with piling up Block Kit blocks by - GitHub - npm + GitHub + npm ``` -### [For modal](https://speee-jsx-slack.netlify.app/#modal) +### [For modal](https://jsx-slack.netlify.app/#modal) ```jsx @@ -199,7 +197,7 @@ By using jsx-slack, you can build a template with piling up Block Kit blocks by ``` -### [For home tab](https://speee-jsx-slack.netlify.app/#home) +### [For home tab](https://jsx-slack.netlify.app/#home) ```jsx @@ -249,37 +247,39 @@ By using jsx-slack, you can build a template with piling up Block Kit blocks by * **[HTML-like formatting](docs/html-like-formatting.md)** * **[About escape and exact mode](docs/about-escape-and-exact-mode.md)** +- **[Highlight of v2](docs/highlight/v2.md)** + ### Examples by use cases Ported from templates for [Block Kit Builder]. #### [Message](https://api.slack.com/tools/block-kit-builder?mode=message&template=1) -- [Approval (New device request)](https://speee-jsx-slack.netlify.app/#messagingApprovalNewDevice) -- [Approval (Time Off request)](https://speee-jsx-slack.netlify.app/#messagingApprovalTimeOff) -- [Notification](https://speee-jsx-slack.netlify.app/#messagingNotification) -- [Onboarding (Taskbot)](https://speee-jsx-slack.netlify.app/#messagingOnboardingTaskbot) -- [Onboarding (Onboarding App)](https://speee-jsx-slack.netlify.app/#messagingOnboardingApp) -- [Poll](https://speee-jsx-slack.netlify.app/#messagingPoll) -- [Search Results (TripAgent)](https://speee-jsx-slack.netlify.app/#messagingSearchResultsTripAgent) -- [Search Results (FileCard Agent)](https://speee-jsx-slack.netlify.app/#messagingSearchResultsFileCard) -- [Newsletter](https://speee-jsx-slack.netlify.app/#messagingNewsletter) +- [Approval (New device request)](https://jsx-slack.netlify.app/#messagingApprovalNewDevice) +- [Approval (Time Off request)](https://jsx-slack.netlify.app/#messagingApprovalTimeOff) +- [Notification](https://jsx-slack.netlify.app/#messagingNotification) +- [Onboarding (Taskbot)](https://jsx-slack.netlify.app/#messagingOnboardingTaskbot) +- [Onboarding (Onboarding App)](https://jsx-slack.netlify.app/#messagingOnboardingApp) +- [Poll](https://jsx-slack.netlify.app/#messagingPoll) +- [Search Results (TripAgent)](https://jsx-slack.netlify.app/#messagingSearchResultsTripAgent) +- [Search Results (FileCard Agent)](https://jsx-slack.netlify.app/#messagingSearchResultsFileCard) +- [Newsletter](https://jsx-slack.netlify.app/#messagingNewsletter) #### [Modal](https://api.slack.com/tools/block-kit-builder?mode=modal&template=1) -- [Poll](https://speee-jsx-slack.netlify.app/#modalPoll) -- [Search Results](https://speee-jsx-slack.netlify.app/#modalSearchResults) -- [Settings (App menu)](https://speee-jsx-slack.netlify.app/#modalSettingsAppMenu) -- [Settings (Notification settings)](https://speee-jsx-slack.netlify.app/#modalSettingsNotification) -- [List of information (Your itinerary)](https://speee-jsx-slack.netlify.app/#modalListOfInformationYourItinerary) -- [List of information (Ticket app)](https://speee-jsx-slack.netlify.app/#modalListOfInformationTicketApp) +- [Poll](https://jsx-slack.netlify.app/#modalPoll) +- [Search Results](https://jsx-slack.netlify.app/#modalSearchResults) +- [Settings (App menu)](https://jsx-slack.netlify.app/#modalSettingsAppMenu) +- [Settings (Notification settings)](https://jsx-slack.netlify.app/#modalSettingsNotification) +- [List of information (Your itinerary)](https://jsx-slack.netlify.app/#modalListOfInformationYourItinerary) +- [List of information (Ticket app)](https://jsx-slack.netlify.app/#modalListOfInformationTicketApp) #### [App Home](https://api.slack.com/tools/block-kit-builder?mode=appHome&template=1) -- [Project Tracker](https://speee-jsx-slack.netlify.app/#appHomeProjectTracker) -- [Calendar](https://speee-jsx-slack.netlify.app/#appHomeCalendar) -- [Expense App](https://speee-jsx-slack.netlify.app/#appHomeExpenseApp) -- [Todo App](https://speee-jsx-slack.netlify.app/#appHomeTodoApp) +- [Project Tracker](https://jsx-slack.netlify.app/#appHomeProjectTracker) +- [Calendar](https://jsx-slack.netlify.app/#appHomeCalendar) +- [Expense App](https://jsx-slack.netlify.app/#appHomeExpenseApp) +- [Todo App](https://jsx-slack.netlify.app/#appHomeTodoApp) ## Fragments @@ -291,7 +291,7 @@ Let's say about defining `` custom block that is consisted by ` ( @@ -318,7 +318,7 @@ Now the defined block can use in `` as like as the other blocks: [][custom-header-block] -[custom-header-block]: https://speee-jsx-slack.netlify.app/#bkb:jsx:eJxVjrEOgzAQQ3e-4jYmejs6Zag6duMLSIjQlZRIOEHt3xcaBphsD8-23EN0E0xFJJ13SeO8-y3ZoptT88KnQejdRC4jxTfZnRJWQy3yPIYe8GgLyH9S-FQnD1118AvxZejpUw2yWcNA35iXUns7ocLHvx9tITN_ +[custom-header-block]: https://jsx-slack.netlify.app/#bkb:jsx:eJxVjrEOgzAQQ3e-4jYmejs6Zag6duMLSIjQlZRIOEHt3xcaBphsD8-23EN0E0xFJJ13SeO8-y3ZoptT88KnQejdRC4jxTfZnRJWQy3yPIYe8GgLyH9S-FQnD1118AvxZejpUw2yWcNA35iXUns7ocLHvx9tITN_ ### Short syntax for fragments @@ -327,7 +327,7 @@ Babel transpiler and TypeScript 4 can use [the short syntax `<>>` for fragment ```javascript /** @jsx JSXSlack.h */ /** @jsxFrag JSXSlack.Fragment */ -import { JSXSlack } from '@speee-js/jsx-slack' +import { JSXSlack } from 'jsx-slack' const Header = ({ children }) => ( <> @@ -345,7 +345,7 @@ const Header = ({ children }) => ( ```javascript // Header.js -import { jsxslack } from '@speee-js/jsx-slack' +import { jsxslack } from 'jsx-slack' export const Header = ({ children }) => jsxslack` @@ -358,7 +358,7 @@ export const Header = ({ children }) => jsxslack` A defined component may use in `jsxslack` tag as below: ```javascript -import { jsxslack } from '@speee-js/jsx-slack' +import { jsxslack } from 'jsx-slack' import { Header } from './Header' console.log(jsxslack` @@ -405,8 +405,6 @@ FYI there are some projects based on React ([react-reconciler](https://github.co ## Author -Managed by [ Speee, Inc.](https://speee.jp) ([@speee](https://github.com/speee)) - - Yuki Hattori ([@yhatt](https://github.com/yhatt)) - Maintainer ## License diff --git a/demo/examples/basic.js b/demo/examples/basic.js index 446c4a04..45e488cd 100644 --- a/demo/examples/basic.js +++ b/demo/examples/basic.js @@ -6,12 +6,12 @@ export const message = `
` element ([#16](https://github.com/yhatt/jsx-slack/pull/16), [#46](https://github.com/yhatt/jsx-slack/pull/46)) ## v0.8.1 - 2019-08-07 ### Added -- Better dialog support for `jsxslack` template literal ([#42](https://github.com/speee/jsx-slack/issues/42), [#43](https://github.com/speee/jsx-slack/pull/43)) -- Update REPL demo to add dialog example ([#43](https://github.com/speee/jsx-slack/pull/43)) +- Better dialog support for `jsxslack` template literal ([#42](https://github.com/yhatt/jsx-slack/issues/42), [#43](https://github.com/yhatt/jsx-slack/pull/43)) +- Update REPL demo to add dialog example ([#43](https://github.com/yhatt/jsx-slack/pull/43)) ### Fixed -- Coerce number-expected prop to integer ([#44](https://github.com/speee/jsx-slack/pull/44)) +- Coerce number-expected prop to integer ([#44](https://github.com/yhatt/jsx-slack/pull/44)) ## v0.8.0 - 2019-08-06 ### Added -- Dialog support ([#19](https://github.com/speee/jsx-slack/issues/19), [#39](https://github.com/speee/jsx-slack/pull/39)) +- Dialog support ([#19](https://github.com/yhatt/jsx-slack/issues/19), [#39](https://github.com/yhatt/jsx-slack/pull/39)) ### Fixed -- Don't prevent generating `` with no options ([#41](https://github.com/speee/jsx-slack/pull/41)) +- Don't prevent generating `` with no options ([#41](https://github.com/yhatt/jsx-slack/pull/41)) ### Changed -- Update `htm` to [v2.2.0](https://github.com/developit/htm/releases/tag/2.2.0) ([#38](https://github.com/speee/jsx-slack/pull/38)) +- Update `htm` to [v2.2.0](https://github.com/developit/htm/releases/tag/2.2.0) ([#38](https://github.com/yhatt/jsx-slack/pull/38)) ## v0.7.0 - 2019-07-29 ### Added -- `` block component ([#34](https://github.com/speee/jsx-slack/issues/34), [#35](https://github.com/speee/jsx-slack/pull/35)) -- `jsxslack.fragment` template literal tag ([#32](https://github.com/speee/jsx-slack/pull/32)) -- Codecov integration and coverage badge ([#36](https://github.com/speee/jsx-slack/pull/36)) +- `` block component ([#34](https://github.com/yhatt/jsx-slack/issues/34), [#35](https://github.com/yhatt/jsx-slack/pull/35)) +- `jsxslack.fragment` template literal tag ([#32](https://github.com/yhatt/jsx-slack/pull/32)) +- Codecov integration and coverage badge ([#36](https://github.com/yhatt/jsx-slack/pull/36)) ### Changed -- Update dependent packages to the latest version ([#37](https://github.com/speee/jsx-slack/pull/37)) +- Update dependent packages to the latest version ([#37](https://github.com/yhatt/jsx-slack/pull/37)) ## v0.6.0 - 2019-07-20 ### Added -- Convert `` in `` into mrkdwn element ([#26](https://github.com/speee/jsx-slack/issues/26), [#31](https://github.com/speee/jsx-slack/pull/31)) -- `` built-in component ([#29](https://github.com/speee/jsx-slack/pull/29)) +- Convert `` in `` into mrkdwn element ([#26](https://github.com/yhatt/jsx-slack/issues/26), [#31](https://github.com/yhatt/jsx-slack/pull/31)) +- `` built-in component ([#29](https://github.com/yhatt/jsx-slack/pull/29)) ## v0.5.1 - 2019-07-14 ### Added -- Support mention to global user ID for Enterprise Grid ([#25](https://github.com/speee/jsx-slack/pull/25)) +- Support mention to global user ID for Enterprise Grid ([#25](https://github.com/yhatt/jsx-slack/pull/25)) ### Changed -- Update dependent packages to the latest version ([#28](https://github.com/speee/jsx-slack/pull/28)) +- Update dependent packages to the latest version ([#28](https://github.com/yhatt/jsx-slack/pull/28)) ## v0.5.0 - 2019-06-28 ### Added -- Support Node.js 12 ([#23](https://github.com/speee/jsx-slack/pull/23)) +- Support Node.js 12 ([#23](https://github.com/yhatt/jsx-slack/pull/23)) ### Changed -- Make interchangeable with `` component and intrinsic `` tag ([#21](https://github.com/speee/jsx-slack/pull/21)) -- Upgrade dependent packages to the latest version ([#24](https://github.com/speee/jsx-slack/pull/24)) +- Make interchangeable with `` component and intrinsic `` tag ([#21](https://github.com/yhatt/jsx-slack/pull/21)) +- Upgrade dependent packages to the latest version ([#24](https://github.com/yhatt/jsx-slack/pull/24)) ### Removed -- Remove deprecated `` component ([#22](https://github.com/speee/jsx-slack/pull/22)) +- Remove deprecated `` component ([#22](https://github.com/yhatt/jsx-slack/pull/22)) ## v0.4.3 - 2019-05-15 ### Fixed -- Fix vanishing styled channel links and mentions ([#15](https://github.com/speee/jsx-slack/issues/15), [#17](https://github.com/speee/jsx-slack/pull/17)) +- Fix vanishing styled channel links and mentions ([#15](https://github.com/yhatt/jsx-slack/issues/15), [#17](https://github.com/yhatt/jsx-slack/pull/17)) ### Changed -- Upgrade dependent packages to the latest version ([#18](https://github.com/speee/jsx-slack/pull/18)) +- Upgrade dependent packages to the latest version ([#18](https://github.com/yhatt/jsx-slack/pull/18)) ## v0.4.2 - 2019-04-13 ### Added -- Add `style` prop for `` component ([#13](https://github.com/speee/jsx-slack/issues/13), [#14](https://github.com/speee/jsx-slack/pull/14)) +- Add `style` prop for `` component ([#13](https://github.com/yhatt/jsx-slack/issues/13), [#14](https://github.com/yhatt/jsx-slack/pull/14)) ## v0.4.1 - 2019-03-13 ### Added -- `` container component ([#12](https://github.com/speee/jsx-slack/pull/12)) +- `` container component ([#12](https://github.com/yhatt/jsx-slack/pull/12)) ### Deprecated -- Mark a confusable `` fragment component as deprecated in favor of added `` ([#11](https://github.com/speee/jsx-slack/issues/11), [#12](https://github.com/speee/jsx-slack/pull/12)) +- Mark a confusable `` fragment component as deprecated in favor of added `` ([#11](https://github.com/yhatt/jsx-slack/issues/11), [#12](https://github.com/yhatt/jsx-slack/pull/12)) ## v0.4.0 - 2019-03-12 ### Added -- Support nested list ([#10](https://github.com/speee/jsx-slack/pull/10)) +- Support nested list ([#10](https://github.com/yhatt/jsx-slack/pull/10)) ## v0.3.0 - 2019-03-11 ### Added -- Add `` component ([#9](https://github.com/speee/jsx-slack/pull/9)) +- Add `` component ([#9](https://github.com/yhatt/jsx-slack/pull/9)) ### Changed -- Right-aligned number in ordered list ([#8](https://github.com/speee/jsx-slack/pull/8)) +- Right-aligned number in ordered list ([#8](https://github.com/yhatt/jsx-slack/pull/8)) ## v0.2.0 - 2019-03-07 ### Added -- `jsxslack` template literal tag for using jsx-slack without transpiler, powered by [htm](https://github.com/developit/htm) ([#6](https://github.com/speee/jsx-slack/issues/6), [#7](https://github.com/speee/jsx-slack/pull/7)) +- `jsxslack` template literal tag for using jsx-slack without transpiler, powered by [htm](https://github.com/developit/htm) ([#6](https://github.com/yhatt/jsx-slack/issues/6), [#7](https://github.com/yhatt/jsx-slack/pull/7)) ### Fixed -- Improve `README.md` with some minor fixes ([#4](https://github.com/speee/jsx-slack/pull/4)) -- Revert ignored audit ([#5](https://github.com/speee/jsx-slack/pull/5)) +- Improve `README.md` with some minor fixes ([#4](https://github.com/yhatt/jsx-slack/pull/4)) +- Revert ignored audit ([#5](https://github.com/yhatt/jsx-slack/pull/5)) ## v0.1.0 - 2019-03-01 diff --git a/LICENSE b/LICENSE index 30d59f4c..87a0a91d 100644 --- a/LICENSE +++ b/LICENSE @@ -1,6 +1,6 @@ MIT License -Copyright (c) 2019- Yuki Hattori (yuki.hattori@speee.jp) and Speee, Inc. +Copyright (c) 2019- Yuki Hattori (yukihattori1116@gmail.com). Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal diff --git a/README.md b/README.md index 7b5e5a29..2bb6a253 100644 --- a/README.md +++ b/README.md @@ -1,23 +1,21 @@ - - - + + + jsx-slack -[![CircleCI](https://img.shields.io/circleci/project/github/speee/jsx-slack/master.svg?logo=circleci)][circleci] -[![Codecov](https://img.shields.io/codecov/c/github/speee/jsx-slack/master.svg?logo=codecov)](https://codecov.io/gh/speee/jsx-slack) -[![npm](https://img.shields.io/npm/v/@speee-js/jsx-slack.svg?logo=npm)][npm] -[![LICENSE](https://img.shields.io/github/license/speee/jsx-slack.svg)][license] +[![CircleCI](https://img.shields.io/circleci/project/github/yhatt/jsx-slack/master.svg?logo=circleci)][circleci] +[![Codecov](https://img.shields.io/codecov/c/github/yhatt/jsx-slack/master.svg?logo=codecov)](https://codecov.io/gh/yhatt/jsx-slack) +[![npm](https://img.shields.io/npm/v/jsx-slack.svg?logo=npm)][npm] +[![LICENSE](https://img.shields.io/github/license/yhatt/jsx-slack.svg)][license] -[circleci]: https://circleci.com/gh/speee/jsx-slack/ -[npm]: https://npm.im/@speee-js/jsx-slack +[circleci]: https://circleci.com/gh/yhatt/jsx-slack/ +[npm]: https://npm.im/jsx-slack [license]: ./LICENSE Build JSON object for [Slack][slack] [block kit] surfaces from [JSX]. -> :sparkles: **We have sparkling jsx-slack v2!** :sparkles: **[▶︎ See highlight of v2](docs/highlight/v2.md)** - [slack]: https://slack.com [jsx]: https://reactjs.org/docs/introducing-jsx.html [react]: https://reactjs.org/ @@ -25,16 +23,16 @@ Build JSON object for [Slack][slack] [block kit] surfaces from [JSX]. [block kit builder]: https://api.slack.com/tools/block-kit-builder - - + + - - + + -:point_right: **[Try our REPL demo](https://speee-jsx-slack.netlify.app/)** in https://speee-jsx-slack.netlify.app/. +:point_right: **[Try our REPL demo](https://jsx-slack.netlify.app/)** in https://jsx-slack.netlify.app/. ### Features @@ -61,12 +59,12 @@ We require Node.js >= 10. If you are using TypeScript, we also require TS >= 3.7 ```bash # npm -npm install --save @speee-js/jsx-slack +npm install --save jsx-slack ``` ```bash # yarn -yarn add @speee-js/jsx-slack +yarn add jsx-slack ``` ## Usage @@ -80,7 +78,7 @@ It allows the template syntax almost same as JSX, powered by [HTM (Hyperscript T This is a simple example of the template function just to say hello to someone. ```javascript -import { jsxslack } from '@speee-js/jsx-slack' +import { jsxslack } from 'jsx-slack' export const exampleBlock = ({ name }) => jsxslack` @@ -97,7 +95,7 @@ When you want to use jsx-slack with JSX transpiler, you have to set up to use im ```jsx /** @jsx JSXSlack.h */ -import { JSXSlack, Blocks, Section } from '@speee-js/jsx-slack' +import { JSXSlack, Blocks, Section } from 'jsx-slack' export const exampleBlock = ({ name }) => ( @@ -135,7 +133,7 @@ It would post a simple Slack message like this: [][block-kit-builder-example] -[block-kit-builder-example]: https://speee-jsx-slack.netlify.app/#bkb:jsx:eJyzccrJT84utuNSULAJTk0uyczPA7EVFDxSc3LydRRskuwiS7MzFTwSS0ryizJt9JPsFEFq9eGKbfShRgAAVeQWug== +[block-kit-builder-example]: https://jsx-slack.netlify.app/#bkb:jsx:eJyzccrJT84utuNSULAJTk0uyczPA7EVFDxSc3LydRRskuwiS7MzFTwSS0ryizJt9JPsFEFq9eGKbfShRgAAVeQWug== ## Block Kit as components @@ -143,7 +141,7 @@ Slack has recommended to use **[Block Kit]** for building tempting messages and By using jsx-slack, you can build a template with piling up Block Kit blocks by JSX. It is feeling like using components in React or Vue. -### [For messaging](https://speee-jsx-slack.netlify.app/) +### [For messaging](https://jsx-slack.netlify.app/) ```jsx @@ -151,12 +149,12 @@ By using jsx-slack, you can build a template with piling up Block Kit blocks by Enjoy building blocks! - @speee-js/jsx-slack + jsx-slack Build JSON for Slack Block Kit from JSX - + Maintained by Yuki Hattori @@ -164,13 +162,13 @@ By using jsx-slack, you can build a template with piling up Block Kit blocks by - GitHub - npm + GitHub + npm ``` -### [For modal](https://speee-jsx-slack.netlify.app/#modal) +### [For modal](https://jsx-slack.netlify.app/#modal) ```jsx @@ -199,7 +197,7 @@ By using jsx-slack, you can build a template with piling up Block Kit blocks by ``` -### [For home tab](https://speee-jsx-slack.netlify.app/#home) +### [For home tab](https://jsx-slack.netlify.app/#home) ```jsx @@ -249,37 +247,39 @@ By using jsx-slack, you can build a template with piling up Block Kit blocks by * **[HTML-like formatting](docs/html-like-formatting.md)** * **[About escape and exact mode](docs/about-escape-and-exact-mode.md)** +- **[Highlight of v2](docs/highlight/v2.md)** + ### Examples by use cases Ported from templates for [Block Kit Builder]. #### [Message](https://api.slack.com/tools/block-kit-builder?mode=message&template=1) -- [Approval (New device request)](https://speee-jsx-slack.netlify.app/#messagingApprovalNewDevice) -- [Approval (Time Off request)](https://speee-jsx-slack.netlify.app/#messagingApprovalTimeOff) -- [Notification](https://speee-jsx-slack.netlify.app/#messagingNotification) -- [Onboarding (Taskbot)](https://speee-jsx-slack.netlify.app/#messagingOnboardingTaskbot) -- [Onboarding (Onboarding App)](https://speee-jsx-slack.netlify.app/#messagingOnboardingApp) -- [Poll](https://speee-jsx-slack.netlify.app/#messagingPoll) -- [Search Results (TripAgent)](https://speee-jsx-slack.netlify.app/#messagingSearchResultsTripAgent) -- [Search Results (FileCard Agent)](https://speee-jsx-slack.netlify.app/#messagingSearchResultsFileCard) -- [Newsletter](https://speee-jsx-slack.netlify.app/#messagingNewsletter) +- [Approval (New device request)](https://jsx-slack.netlify.app/#messagingApprovalNewDevice) +- [Approval (Time Off request)](https://jsx-slack.netlify.app/#messagingApprovalTimeOff) +- [Notification](https://jsx-slack.netlify.app/#messagingNotification) +- [Onboarding (Taskbot)](https://jsx-slack.netlify.app/#messagingOnboardingTaskbot) +- [Onboarding (Onboarding App)](https://jsx-slack.netlify.app/#messagingOnboardingApp) +- [Poll](https://jsx-slack.netlify.app/#messagingPoll) +- [Search Results (TripAgent)](https://jsx-slack.netlify.app/#messagingSearchResultsTripAgent) +- [Search Results (FileCard Agent)](https://jsx-slack.netlify.app/#messagingSearchResultsFileCard) +- [Newsletter](https://jsx-slack.netlify.app/#messagingNewsletter) #### [Modal](https://api.slack.com/tools/block-kit-builder?mode=modal&template=1) -- [Poll](https://speee-jsx-slack.netlify.app/#modalPoll) -- [Search Results](https://speee-jsx-slack.netlify.app/#modalSearchResults) -- [Settings (App menu)](https://speee-jsx-slack.netlify.app/#modalSettingsAppMenu) -- [Settings (Notification settings)](https://speee-jsx-slack.netlify.app/#modalSettingsNotification) -- [List of information (Your itinerary)](https://speee-jsx-slack.netlify.app/#modalListOfInformationYourItinerary) -- [List of information (Ticket app)](https://speee-jsx-slack.netlify.app/#modalListOfInformationTicketApp) +- [Poll](https://jsx-slack.netlify.app/#modalPoll) +- [Search Results](https://jsx-slack.netlify.app/#modalSearchResults) +- [Settings (App menu)](https://jsx-slack.netlify.app/#modalSettingsAppMenu) +- [Settings (Notification settings)](https://jsx-slack.netlify.app/#modalSettingsNotification) +- [List of information (Your itinerary)](https://jsx-slack.netlify.app/#modalListOfInformationYourItinerary) +- [List of information (Ticket app)](https://jsx-slack.netlify.app/#modalListOfInformationTicketApp) #### [App Home](https://api.slack.com/tools/block-kit-builder?mode=appHome&template=1) -- [Project Tracker](https://speee-jsx-slack.netlify.app/#appHomeProjectTracker) -- [Calendar](https://speee-jsx-slack.netlify.app/#appHomeCalendar) -- [Expense App](https://speee-jsx-slack.netlify.app/#appHomeExpenseApp) -- [Todo App](https://speee-jsx-slack.netlify.app/#appHomeTodoApp) +- [Project Tracker](https://jsx-slack.netlify.app/#appHomeProjectTracker) +- [Calendar](https://jsx-slack.netlify.app/#appHomeCalendar) +- [Expense App](https://jsx-slack.netlify.app/#appHomeExpenseApp) +- [Todo App](https://jsx-slack.netlify.app/#appHomeTodoApp) ## Fragments @@ -291,7 +291,7 @@ Let's say about defining `` custom block that is consisted by ` ( @@ -318,7 +318,7 @@ Now the defined block can use in `` as like as the other blocks: [][custom-header-block] -[custom-header-block]: https://speee-jsx-slack.netlify.app/#bkb:jsx:eJxVjrEOgzAQQ3e-4jYmejs6Zag6duMLSIjQlZRIOEHt3xcaBphsD8-23EN0E0xFJJ13SeO8-y3ZoptT88KnQejdRC4jxTfZnRJWQy3yPIYe8GgLyH9S-FQnD1118AvxZejpUw2yWcNA35iXUns7ocLHvx9tITN_ +[custom-header-block]: https://jsx-slack.netlify.app/#bkb:jsx:eJxVjrEOgzAQQ3e-4jYmejs6Zag6duMLSIjQlZRIOEHt3xcaBphsD8-23EN0E0xFJJ13SeO8-y3ZoptT88KnQejdRC4jxTfZnRJWQy3yPIYe8GgLyH9S-FQnD1118AvxZejpUw2yWcNA35iXUns7ocLHvx9tITN_ ### Short syntax for fragments @@ -327,7 +327,7 @@ Babel transpiler and TypeScript 4 can use [the short syntax `<>>` for fragment ```javascript /** @jsx JSXSlack.h */ /** @jsxFrag JSXSlack.Fragment */ -import { JSXSlack } from '@speee-js/jsx-slack' +import { JSXSlack } from 'jsx-slack' const Header = ({ children }) => ( <> @@ -345,7 +345,7 @@ const Header = ({ children }) => ( ```javascript // Header.js -import { jsxslack } from '@speee-js/jsx-slack' +import { jsxslack } from 'jsx-slack' export const Header = ({ children }) => jsxslack` @@ -358,7 +358,7 @@ export const Header = ({ children }) => jsxslack` A defined component may use in `jsxslack` tag as below: ```javascript -import { jsxslack } from '@speee-js/jsx-slack' +import { jsxslack } from 'jsx-slack' import { Header } from './Header' console.log(jsxslack` @@ -405,8 +405,6 @@ FYI there are some projects based on React ([react-reconciler](https://github.co ## Author -Managed by [ Speee, Inc.](https://speee.jp) ([@speee](https://github.com/speee)) - - Yuki Hattori ([@yhatt](https://github.com/yhatt)) - Maintainer ## License diff --git a/demo/examples/basic.js b/demo/examples/basic.js index 446c4a04..45e488cd 100644 --- a/demo/examples/basic.js +++ b/demo/examples/basic.js @@ -6,12 +6,12 @@ export const message = `
- - + + - - + +
Enjoy building blocks!
- @speee-js/jsx-slack + jsx-slack Build JSON for Slack Block Kit from JSX