Block KitのButtonに色つけれるようになったのでAnketでも取り入れました

Back by popular demand! Color buttons are now available for Block Kit enabled apps https://t.co/hM2H0RzN1H

— Slack Platform (@SlackAPI) April 12, 2019

ついに Slack Block Kit のButtonに色がつけられるようになった!!!!
嬉しい。

[
    {
        "type": "actions",
        "elements": [
            {
                "type": "button",
                "text": {
                    "type": "plain_text",
                    "text": "default",
                    "emoji": true
                }
            },
            {
                "type": "button",
                "text": {
                    "type": "plain_text",
                    "text": "primary",
                    "emoji": true
                },
                "style": "primary"
            },
            {
                "type": "button",
                "text": {
                    "type": "plain_text",
                    "text": "danger",
                    "emoji": true
                },
                "style": "danger"
            }
        ]
    }
]

styleを定義をすることで普通のボタンとは違う緑と赤なボタンを使うことができる。

Anketではjsx-slackを使ってBlock Kitを使っているけど昨日リリースされたv0.4.2でこのstyleをサポートされたので早速使ってみました。

github.com

jsx-slackを使って↓のように定義することで色がつきます！

<Blocks>
  <Actions>
    <Button style="primary" actionId="submit">投稿する</Button>
    <Button style="danger" actionId="cancel">キャンセルする</Button>
  </Actions>
</Blocks>

最後に

今回のSlack APIのupdateは偶然しったのですがRSS feedをsubscribeするか@slackapiをフォローしておくと良いそうです。
api.slack.com