feat(block-kit): add block element examples

block-kit/README.md

@@ -20,3 +20,38 @@ Read the [docs](https://docs.slack.dev/block-kit/) to learn concepts behind thes
 - **[Section](https://docs.slack.dev/reference/block-kit/blocks/section-block)**: Displays text, possibly alongside elements. [Implementation](./src/main/java/blocks/Section.java).
 - **[Video](https://docs.slack.dev/reference/block-kit/blocks/video-block)**: Displays an embedded video player. [Implementation](./src/main/java/blocks/Video.java).
 
+### Block elements
+
+- **[Broadcast](https://docs.slack.dev/reference/block-kit/block-elements/broadcast-element)**: Displays a broadcast mention such as here, channel, or everyone. [Implementation](./src/main/java/elements/Broadcast.java).
+- **[Button](https://docs.slack.dev/reference/block-kit/block-elements/button-element)**: Allows users a direct path to performing basic actions. [Implementation](./src/main/java/elements/Button.java).
+- **[Channel](https://docs.slack.dev/reference/block-kit/block-elements/channel-element)**: Renders as a mention of a channel. [Implementation](./src/main/java/elements/Channel.java).
+- **[Color](https://docs.slack.dev/reference/block-kit/block-elements/color-element)**: Displays a color swatch from a hex value. [Implementation](./src/main/java/elements/Color.java).
+- **[Date](https://docs.slack.dev/reference/block-kit/block-elements/date-element)**: Displays a formatted, localized date. [Implementation](./src/main/java/elements/Date.java).
+- **[Date picker](https://docs.slack.dev/reference/block-kit/block-elements/date-picker-element)**: Allows users to select a date from a calendar style UI. [Implementation](./src/main/java/elements/DatePicker.java).
+- **[Datetime picker](https://docs.slack.dev/reference/block-kit/block-elements/datetime-picker-element)**: Allows users to select both a date and a time of day. [Implementation](./src/main/java/elements/DatetimePicker.java).
+- **[Email input](https://docs.slack.dev/reference/block-kit/block-elements/email-input-element)**: Allows user to enter an email into a single-line field. [Implementation](./src/main/java/elements/EmailInput.java).
+- **[Emoji](https://docs.slack.dev/reference/block-kit/block-elements/emoji-element)**: Displays an emoji. [Implementation](./src/main/java/elements/Emoji.java).
+- **[Feedback buttons](https://docs.slack.dev/reference/block-kit/block-elements/feedback-buttons-element)**: Buttons to indicate positive or negative feedback. [Implementation](./src/main/java/elements/FeedbackButtons.java).
+- **[File input](https://docs.slack.dev/reference/block-kit/block-elements/file-input-element)**: Allows user to upload files. [Implementation](./src/main/java/elements/FileInput.java).
+- **[Icon button](https://docs.slack.dev/reference/block-kit/block-elements/icon-button-element)**: An icon button to perform actions. [Implementation](./src/main/java/elements/IconButton.java).
+- **[Image](https://docs.slack.dev/reference/block-kit/block-elements/image-element)**: Displays an image as part of a larger block of content. [Implementation](./src/main/java/elements/Image.java).
+- **[Link](https://docs.slack.dev/reference/block-kit/block-elements/link-element)**: Displays a hyperlink. [Implementation](./src/main/java/elements/Link.java).
+- **[Multi-select menu](https://docs.slack.dev/reference/block-kit/block-elements/multi-select-menu-element)**: Allows users to select multiple items from a list of options. [Implementation](./src/main/java/elements/MultiSelectMenu.java).
+- **[Number input](https://docs.slack.dev/reference/block-kit/block-elements/number-input-element)**: Allows user to enter a number into a single-line field. [Implementation](./src/main/java/elements/NumberInput.java).
+- **[Overflow menu](https://docs.slack.dev/reference/block-kit/block-elements/overflow-menu-element)**: Allows users to press a button to view a list of options. [Implementation](./src/main/java/elements/OverflowMenu.java).
+- **[Plain-text input](https://docs.slack.dev/reference/block-kit/block-elements/plain-text-input-element)**: Allows users to enter freeform text data into a single-line or multi-line field. [Implementation](./src/main/java/elements/PlainTextInput.java).
+- **[Radio button group](https://docs.slack.dev/reference/block-kit/block-elements/radio-button-group-element)**: Allows users to choose one item from a list of possible options. [Implementation](./src/main/java/elements/RadioButtons.java).
+- **[Rich text input](https://docs.slack.dev/reference/block-kit/block-elements/rich-text-input-element)**: Allows users to enter formatted text in a WYSIWYG composer, offering the same messaging writing experience as in Slack. [Implementation](./src/main/java/elements/RichTextInput.java).
+- **[Rich text list](https://docs.slack.dev/reference/block-kit/block-elements/rich-text-list-element)**: Displays a list of rich text items. [Implementation](./src/main/java/elements/RichTextList.java).
+- **[Rich text preformatted](https://docs.slack.dev/reference/block-kit/block-elements/rich-text-preformatted-element)**: Displays a preformatted rich text element. [Implementation](./src/main/java/elements/RichTextPreformatted.java).
+- **[Rich text quote](https://docs.slack.dev/reference/block-kit/block-elements/rich-text-quote-element)**: Displays a rich text quote block. [Implementation](./src/main/java/elements/RichTextQuote.java).
+- **[Rich text section](https://docs.slack.dev/reference/block-kit/block-elements/rich-text-section-element)**: A section element that holds rich text elements. [Implementation](./src/main/java/elements/RichTextSection.java).
+- **[Select menu](https://docs.slack.dev/reference/block-kit/block-elements/select-menu-element)**: Allows users to choose an option from a drop down menu. [Implementation](./src/main/java/elements/SelectMenu.java).
+- **[Team](https://docs.slack.dev/reference/block-kit/block-elements/team-element)**: Renders as a mention of a workspace or team. [Implementation](./src/main/java/elements/Team.java).
+- **[Text](https://docs.slack.dev/reference/block-kit/block-elements/text-element)**: Displays text, optionally with styling. [Implementation](./src/main/java/elements/Text.java).
+- **[Time picker](https://docs.slack.dev/reference/block-kit/block-elements/time-picker-element)**: Allows users to enter numerical data into a single-line field. [Implementation](./src/main/java/elements/TimePicker.java).
+- **[URL input](https://docs.slack.dev/reference/block-kit/block-elements/url-input-element)**: Allows user to enter a URL into a single-line field. [Implementation](./src/main/java/elements/UrlInput.java).
+- **[User](https://docs.slack.dev/reference/block-kit/block-elements/user-element)**: Renders as a mention of a user. [Implementation](./src/main/java/elements/User.java).
+- **[Usergroup](https://docs.slack.dev/reference/block-kit/block-elements/usergroup-element)**: Renders as a mention of a user group. [Implementation](./src/main/java/elements/UserGroup.java).
+- **[Workflow button](https://docs.slack.dev/reference/block-kit/block-elements/workflow-button-element)**: Allows users to run a link trigger with customizable inputs. [Implementation](./src/main/java/elements/WorkflowButton.java).
+

block-kit/src/main/java/elements/Broadcast.java

@@ -0,0 +1,24 @@
+package elements;
+
+import com.slack.api.model.block.Blocks;
+import com.slack.api.model.block.RichTextBlock;
+import com.slack.api.model.block.element.RichTextSectionElement;
+import java.util.List;
+
+/**
+ * Displays a broadcast mention such as here, channel, or everyone.
+ * {@link https://docs.slack.dev/reference/block-kit/block-elements/broadcast-element/}
+ */
+public class Broadcast {
+    /**
+     * A rich text block with a broadcast mention in a section.
+     */
+    public static RichTextBlock example01() {
+        RichTextBlock block = Blocks.richText(rt -> rt.elements(List.of(RichTextSectionElement.builder()
+                .elements(List.of(RichTextSectionElement.Broadcast.builder()
+                        .range("everyone")
+                        .build()))
+                .build())));
+        return block;
+    }
+}

block-kit/src/main/java/elements/Button.java

@@ -0,0 +1,62 @@
+package elements;
+
+import static com.slack.api.model.block.composition.BlockCompositions.markdownText;
+import static com.slack.api.model.block.composition.BlockCompositions.plainText;
+
+import com.slack.api.model.block.Blocks;
+import com.slack.api.model.block.LayoutBlock;
+import com.slack.api.model.block.element.BlockElements;
+import com.slack.api.model.block.element.ButtonElement;
+import java.util.List;
+
+/**
+ * Allows users a direct path to performing basic actions.
+ * {@link https://docs.slack.dev/reference/block-kit/block-elements/button-element/}
+ */
+public class Button {
+    /**
+     * A regular interactive button.
+     */
+    public static ButtonElement example01() {
+        ButtonElement element = BlockElements.button(
+                b -> b.text(plainText("Click Me")).value("click_me_123").actionId("button"));
+        return element;
+    }
+
+    /**
+     * A button with a primary style attribute.
+     */
+    public static ButtonElement example02() {
+        ButtonElement element = BlockElements.button(b ->
+                b.text(plainText("Save")).style("primary").value("click_me_123").actionId("button"));
+        return element;
+    }
+
+    /**
+     * A link button.
+     */
+    public static ButtonElement example03() {
+        ButtonElement element =
+                BlockElements.button(b -> b.text(plainText("Link Button")).url("https://docs.slack.dev/block-kit"));
+        return element;
+    }
+
+    /**
+     * The button element used inside either the section or actions block.
+     */
+    public static List<LayoutBlock> example05() {
+        List<LayoutBlock> blocks = List.of(
+                Blocks.section(s -> s.text(markdownText("This is a section block with a button."))
+                        .accessory(BlockElements.button(b -> b.text(plainText("Click Me"))
+                                .value("click_me_123")
+                                .actionId("button")))),
+                Blocks.actions(a -> a.blockId("actionblock789")
+                        .elements(List.of(
+                                BlockElements.button(b -> b.text(plainText("Primary Button"))
+                                        .style("primary")
+                                        .value("click_me_456")),
+                                BlockElements.button(b ->
+                                        b.text(plainText("Link Button")).url("https://api.slack.com/block-kit"))))));
+        return blocks;
+    }
+}

block-kit/src/main/java/elements/Channel.java

@@ -0,0 +1,24 @@
+package elements;
+
+import com.slack.api.model.block.Blocks;
+import com.slack.api.model.block.RichTextBlock;
+import com.slack.api.model.block.element.RichTextSectionElement;
+import java.util.List;
+
+/**
+ * Renders as a mention of a channel.
+ * {@link https://docs.slack.dev/reference/block-kit/block-elements/channel-element/}
+ */
+public class Channel {
+    /**
+     * A rich text block with a channel mention in a section.
+     */
+    public static RichTextBlock example01() {
+        RichTextBlock block = Blocks.richText(rt -> rt.elements(List.of(RichTextSectionElement.builder()
+                .elements(List.of(RichTextSectionElement.Channel.builder()
+                        .channelId("C123ABC456")
+                        .build()))
+                .build())));
+        return block;
+    }
+}

block-kit/src/main/java/elements/Color.java

@@ -0,0 +1,23 @@
+package elements;
+
+import com.slack.api.model.block.Blocks;
+import com.slack.api.model.block.RichTextBlock;
+import com.slack.api.model.block.element.RichTextSectionElement;
+import java.util.List;
+
+/**
+ * Displays a color swatch from a hex value.
+ * {@link https://docs.slack.dev/reference/block-kit/block-elements/color-element/}
+ */
+public class Color {
+    /**
+     * A rich text block with a color element in a section.
+     */
+    public static RichTextBlock example01() {
+        RichTextBlock block = Blocks.richText(rt -> rt.elements(List.of(RichTextSectionElement.builder()
+                .elements(List.of(
+                        RichTextSectionElement.Color.builder().value("#F405B3").build()))
+                .build())));
+        return block;
+    }
+}

block-kit/src/main/java/elements/Date.java

@@ -0,0 +1,26 @@
+package elements;
+
+import com.slack.api.model.block.Blocks;
+import com.slack.api.model.block.RichTextBlock;
+import com.slack.api.model.block.element.RichTextSectionElement;
+import java.util.List;
+
+/**
+ * Displays a formatted, localized date.
+ * {@link https://docs.slack.dev/reference/block-kit/block-elements/date-element/}
+ */
+public class Date {
+    /**
+     * A rich text block with a date element in a section.
+     */
+    public static RichTextBlock example01() {
+        RichTextBlock block = Blocks.richText(rt -> rt.elements(List.of(RichTextSectionElement.builder()
+                .elements(List.of(RichTextSectionElement.Date.builder()
+                        .timestamp(1720710212)
+                        .format("{date_num} at {time}")
+                        .fallback("timey")
+                        .build()))
+                .build())));
+        return block;
+    }
+}

block-kit/src/main/java/elements/DatePicker.java

@@ -0,0 +1,26 @@
+package elements;
+
+import static com.slack.api.model.block.composition.BlockCompositions.markdownText;
+import static com.slack.api.model.block.composition.BlockCompositions.plainText;
+
+import com.slack.api.model.block.Blocks;
+import com.slack.api.model.block.SectionBlock;
+import com.slack.api.model.block.element.BlockElements;
+
+/**
+ * Allows users to select a date from a calendar style UI.
+ * {@link https://docs.slack.dev/reference/block-kit/block-elements/date-picker-element/}
+ */
+public class DatePicker {
+    /**
+     * A section block with a date picker accessory.
+     */
+    public static SectionBlock example01() {
+        SectionBlock block = Blocks.section(s -> s.blockId("section1234")
+                .text(markdownText("Pick a date for the deadline."))
+                .accessory(BlockElements.datePicker(d -> d.actionId("datepicker123")
+                        .initialDate("1990-04-28")
+                        .placeholder(plainText("Select a date")))));
+        return block;
+    }
+}

block-kit/src/main/java/elements/DatetimePicker.java

@@ -0,0 +1,24 @@
+package elements;
+
+import static com.slack.api.model.block.composition.BlockCompositions.plainText;
+
+import com.slack.api.model.block.Blocks;
+import com.slack.api.model.block.InputBlock;
+import com.slack.api.model.block.element.BlockElements;
+
+/**
+ * Allows users to select both a date and a time of day.
+ * {@link https://docs.slack.dev/reference/block-kit/block-elements/datetime-picker-element/}
+ */
+public class DatetimePicker {
+    /**
+     * An input block with a datetime picker element.
+     */
+    public static InputBlock example01() {
+        InputBlock block =
+                Blocks.input(i -> i.element(BlockElements.datetimePicker(d -> d.actionId("datetimepicker-action")))
+                        .hint(plainText(pt -> pt.text("This is some hint text").emoji(true)))
+                        .label(plainText(pt -> pt.text("Start date").emoji(true))));
+        return block;
+    }
+}

block-kit/src/main/java/elements/EmailInput.java

@@ -0,0 +1,24 @@
+package elements;
+
+import static com.slack.api.model.block.composition.BlockCompositions.plainText;
+
+import com.slack.api.model.block.Blocks;
+import com.slack.api.model.block.InputBlock;
+import com.slack.api.model.block.element.BlockElements;
+
+/**
+ * Allows user to enter an email into a single-line field.
+ * {@link https://docs.slack.dev/reference/block-kit/block-elements/email-input-element/}
+ */
+public class EmailInput {
+    /**
+     * An input block with an email input element.
+     */
+    public static InputBlock example01() {
+        InputBlock block = Blocks.input(i -> i.blockId("input123")
+                .label(plainText("Email Address"))
+                .element(BlockElements.emailTextInput(
+                        e -> e.actionId("email_text_input-action").placeholder(plainText("Enter an email")))));
+        return block;
+    }
+}

block-kit/src/main/java/elements/Emoji.java

@@ -0,0 +1,33 @@
+package elements;
+
+import com.slack.api.model.block.Blocks;
+import com.slack.api.model.block.RichTextBlock;
+import com.slack.api.model.block.element.RichTextSectionElement;
+import java.util.List;
+
+/**
+ * Displays an emoji.
+ * {@link https://docs.slack.dev/reference/block-kit/block-elements/emoji-element/}
+ */
+public class Emoji {
+    /**
+     * A rich text block with emoji elements in a section.
+     */
+    public static RichTextBlock example01() {
+        RichTextBlock block = Blocks.richText(rt -> rt.elements(List.of(RichTextSectionElement.builder()
+                .elements(List.of(
+                        RichTextSectionElement.Emoji.builder()
+                                .name("basketball")
+                                .build(),
+                        RichTextSectionElement.Text.builder().text(" ").build(),
+                        RichTextSectionElement.Emoji.builder()
+                                .name("snowboarder")
+                                .build(),
+                        RichTextSectionElement.Text.builder().text(" ").build(),
+                        RichTextSectionElement.Emoji.builder()
+                                .name("checkered_flag")
+                                .build()))
+                .build())));
+        return block;
+    }
+}

block-kit/src/main/java/elements/FeedbackButtons.java

@@ -0,0 +1,34 @@
+package elements;
+
+import static com.slack.api.model.block.composition.BlockCompositions.plainText;
+
+import com.slack.api.model.block.Blocks;
+import com.slack.api.model.block.ContextActionsBlock;
+import com.slack.api.model.block.composition.FeedbackButtonObject;
+import com.slack.api.model.block.element.BlockElements;
+import java.util.List;
+
+/**
+ * Buttons to indicate positive or negative feedback.
+ * {@link https://docs.slack.dev/reference/block-kit/block-elements/feedback-buttons-element/}
+ */
+public class FeedbackButtons {
+    /**
+     * A context actions block with feedback buttons.
+     */
+    public static ContextActionsBlock example01() {
+        ContextActionsBlock block =
+                Blocks.contextActions(List.of(BlockElements.feedbackButtons(fb -> fb.actionId("feedback_buttons_1")
+                        .positiveButton(FeedbackButtonObject.builder()
+                                .text(plainText("Good"))
+                                .value("positive_feedback")
+                                .accessibilityLabel("Mark this response as good")
+                                .build())
+                        .negativeButton(FeedbackButtonObject.builder()
+                                .text(plainText("Bad"))
+                                .value("negative_feedback")
+                                .accessibilityLabel("Mark this response as bad")
+                                .build()))));
+        return block;
+    }
+}

block-kit/src/main/java/elements/FileInput.java

@@ -0,0 +1,32 @@
+package elements;
+
+import static com.slack.api.model.block.composition.BlockCompositions.plainText;
+
+import com.slack.api.model.block.Blocks;
+import com.slack.api.model.block.element.BlockElements;
+import com.slack.api.model.view.View;
+import com.slack.api.model.view.Views;
+import java.util.List;
+
+/**
+ * Allows user to upload files.
+ * {@link https://docs.slack.dev/reference/block-kit/block-elements/file-input-element/}
+ */
+public class FileInput {
+    /**
+     * A modal view with a file input element hosted in an input block.
+     */
+    public static View example01() {
+        View view = Views.view(v -> v.type("modal")
+                .title(Views.viewTitle(t -> t.type("plain_text").text("My App").emoji(true)))
+                .submit(Views.viewSubmit(
+                        s -> s.type("plain_text").text("Submit").emoji(true)))
+                .close(Views.viewClose(c -> c.type("plain_text").text("Cancel").emoji(true)))
+                .blocks(List.of(Blocks.input(i -> i.blockId("input_block_id")
+                        .label(plainText("Upload Files"))
+                        .element(BlockElements.fileInput(f -> f.actionId("file_input_action_id_1")
+                                .filetypes(List.of("jpg", "png"))
+                                .maxFiles(5)))))));
+        return view;
+    }
+}