Template with an image, title, text, and multiple action buttons.
This action can be configured only with quick reply buttons. When a button associated with this action is tapped, the camera screen in LINE is opened.
This action can be configured only with quick reply buttons. When a button associated with this action is tapped, the camera roll screen in LINE is opened.
Column items of CarouselTemplate.
Template with multiple columns which can be cycled like a carousel. The columns are shown in order when scrolling horizontally.
Template with two action buttons.
When a control associated with this action is tapped, a postback event is returned via webhook with the date and time selected by the user from the date and time selection dialog. The datetime picker action does not support time zones.
Insert a LINE emoji within a Expression element.
Append quick replies to the children content.
Body block. Specify a FlexBox in the children.
FlexBox is a component that defines the layout of child components. You can also include a box in a box.
FlexBubbleContainer is a container that contains one message bubble. It can contain four blocks: header, hero, body, and footer. The maximum size of JSON data that defines a bubble is 10 KB.
FlexButton renders a button. When the user taps a button, a specified action is performed.
A carousel is a container that contains multiple bubbles as child elements. Users can scroll horizontally through the bubbles.
FlexFiller is used to create a space. You can put a space between, before, or after components by inserting a filler anywhere within a box.
Footer block. Specify a FlexBox in the children.
Header block. Specify a FlexBox in the children.
FlexIconProps renders an icon for decorating the adjacent text.
FlexImage renders an image.
Flex Messages are messages with a customizable layout. You can customize the layout freely based on the specification for CSS Flexible Box (CSS Flexbox).
FlexImage renders an image.
Not recommended. Use box padding instead.
FlexSpan renders multiple text strings with different designs in one row. A FlexSpan element can only be placed under FlexText children.
FlexText renders a text string in one row.
Image sends an image message.
Column items of ImageCarouselTemplate.
Template with multiple images which can be cycled like a carousel. The images are shown in order when scrolling horizontally.
Imagemap messages are messages configured with an image that has multiple tappable areas. You can assign one tappable area for the entire image or different tappable areas on divided areas of the image.
ImageMapArea specifies the actions and tappable areas of an imagemap.
ImageMapVideoAreaProps play a video on the image and display a label with a hyperlink after the video is finished.
Leave a room or group. It throw when being sent to an user or by multicast.
Links a rich menu to one or multiple users.
Location sends a user location message.
This action can be configured only with quick reply buttons. When a button associated with this action is tapped, the location screen in LINE is opened.
When a control associated with this action is tapped, the string in the
text property is sent as a message from the user.
When a control associated with this action is tapped, a postback event is returned via webhook with the specified string in the data property.
QuickReply add a button at the bottom of screen after the Expression containing it is displayed.
Sticker sends an sticker message.
Uninks the rich menu bound to one or multiple users.
When a control associated with this action is tapped, the URI specified in
the uri property is opened.
Video sends an video message.
Length of audio file (milliseconds)
URL of audio file (Max character limit: 1000)
Action elements displayed as the buttons at the template. Max 4 buttons.
Alternative text. Displayed on devices that do not support template messages. Max character limit: 400. If a function is given, the return value would be used. The rendered template object is passed as the first param.
Texual nodes of message text.
An Action element to be triggered when image, title or text area is tapped.
Aspect ratio of the image, rectangle: 1.51:1, square: 1:1. Default to
'rectangle'.
Background color of the image. Specify a RGB color value. Default: #FFFFFF.
Size of the image. Default to 'cover'.
Image URL (Max character limit: 1,000)
Label for the action. Max character limit: 20
Label for the action. Max character limit: 20
Action elements displayed as the buttons at the template. Max 3 buttons.
Texual nodes of message text.
An Action element to be triggered when image, title or text area is tapped.
Background color of the image. Specify a RGB color value. The default value is #FFFFFF (white).
Image URL (Max character limit: 1,000)
Alternative text. Displayed on devices that do not support template messages. Max character limit: 400 If a function is given, the return value would be used. The rendered template object is passed as the first param.
CarouselItem elements displayed as bubble columns in the carousel. Max 10 columns.
Aspect ratio of the image, rectangle: 1.51:1, square: 1:1. Default to
'rectangle'.
Size of the image. Default to 'cover'.
Exactly 2 Action elements displayed as the buttons at the template.
Alternative text. Displayed on devices that do not support template messages. Max character limit: 400 If a function is given, the return value would be used. The rendered template object is passed as the first param.
Texual nodes of message text.
String returned via webhook in the postback.data property of the postback event. Max character limit: 300.
Initial value of date or time
Label for the action
Largest date or time value that can be selected. Must be greater than the min value.
Smallest date or time value that can be selected. Must be less than the max value.
Action mode
ID for a LINE emoji inside a set. See Sendable LINE emoji list.
Product ID for a set of LINE emoji. See Sendable LINE emoji list.
Content nodes.
QuickReply elements to be appended after content.
Background color of the block. Use a hexadecimal color code.
Exactly one content node of the block.
true to place a separator above the block. Default to false.
Color of the separator. Use a hexadecimal color code.
An Action element performed when this image is tapped.
Background color of the block. In addition to the RGB color, an alpha channel (transparency) can also be set. Use a hexadecimal color code. (Example:#RRGGBBAA) The default value is #00000000.
Color of box border. Use a hexadecimal color code.
Width of box border.
Content nodes.
Radius at the time of rounding the corners of the border.
The ratio of the width or height of this component within the parent box.
The height of a box. You can specify in % (the percentage with reference to the height of the parent element) or in pixels.
The layout style of components in this box.
Minimum space between this component and the previous component in the parent element
The bottom offset.
The right offset.
The left offset.
The top offset.
Free space between the borders of this box and the child element.
Free space between the border at the lower end of this box and the lower end of the child element.
Free space between the border at the right end of this box and the right end of the child element.
Free space between the border at the left end of this box and the left end of the child element.
Free space between the border at the upper end of this box and the upper end of the child element.
Reference position for placing this box. The default value is relative.
Minimum space between components in this box. The default value is none.
The width of a box. You can specify in % (the percentage with reference to the width of the parent element) or in pixels.
An Action element performed when this image is tapped.
Bubble block elements including FlexHeader, FlexHero, FlexBody and {@flex FlexFooter}. Each kind of bubble part should present no more than once.
Text directionality and the direction of placement of components in horizontal boxes.
Alias of direction="rtl" when set to true.
An Action element performed when this button is tapped.
Background color of the block. In addition to the RGB color, an alpha channel (transparency) can also be set. Use a hexadecimal color code. (Example:#RRGGBBAA) The default value is #00000000.
Character color when the style property is link. Background color when the style property is primary or secondary. Use a hexadecimal color code.
The ratio of the width or height of this component within the parent box.
Alignment style in vertical direction. Default to top
Height of the button.
Minimum space between this component and the previous component in the parent element
The bottom offset.
The right offset.
The left offset.
The top offset.
Reference for offsetTop, offsetBottom, offsetStart, and offsetEnd. The default value is relative.
Style of the button. The default value is link.
FlexBubbleContainer elements in the carousel. Max: 10 bubbles
The ratio of the width or height of this component within the parent box.
Aspect ratio of the icon. {width}:{height} format. The values of {width} and {height} must be in the range 1–100000. {height} can't be more than three times the value of {width}. The default value is 1:1.
Minimum space between this component and the previous component in the parent element
The bottom offset.
The right offset.
The left offset.
The top offset.
Reference for offsetTop, offsetBottom, offsetStart, and offsetEnd. The default value is relative.
Maximum size of the icon width. The default value is md.
Image URL
An Action element performed when this image is tapped.
Alignment style in horizontal direction.
The display style of the image if the aspect ratio of the image and that specified by the aspectRatio property do not match.
Aspect ratio of the image. {width}:{height} format. The values of {width} and {height} must be in the range 1–100000. {height} can't be more than three times the value of {width}. The default value is 1:1.
Background color of the image. Use a hexadecimal color code.
The ratio of the width or height of this component within the parent box.
Alignment style in vertical direction.
Minimum space between this component and the previous component in the parent element
The bottom offset.
The right offset.
The left offset.
The top offset.
Reference for offsetTop, offsetBottom, offsetStart, and offsetEnd. The default value is relative.
Maximum size of the image width.
Image URL
Alternative text. Max character limit: 400
FlexBubbleContainer or FlexCarouselContainer element.
Size of the space.
Content textual nodes.
Font color. Use a hexadecimal color code.
Decoration of the text.
Font size.
Style of the text.
Font weight. The default value is regular.
An Action element performed when this image is tapped.
Alignment style in horizontal direction.
Texual nodes and FlexSpan elements as the content text.
Font color. Use a hexadecimal color code.
Decoration of the text.
The ratio of the width or height of this component within the parent box.
Alignment style in vertical direction.
Minimum space between this component and the previous component in the parent element
Max number of lines. If the text does not fit in the specified number of lines, an ellipsis (…) is displayed at the end of the last line. If set to 0, all the text is displayed. The default value is 0.
The bottom offset.
The right offset.
The left offset.
The top offset.
Reference for offsetTop, offsetBottom, offsetStart, and offsetEnd. The default value is relative.
Font size.
Style of the text.
Font weight. The default value is regular.
true to wrap text. The default value is false. If set to true, you can
use a new line character \n to begin on a new line.
Color of the separator. Use a hexadecimal color code.
Minimum space between this component and the previous component in the parent element.
One Action element to be triggered the when image is tapped.
Image URL (Max character limit: 1,000)
Alternative text. Displayed on devices that do not support template messages. Max character limit: 400 If a function is given, the return value would be used. The rendered template object is passed as the first param.
ImageCarouselItem elements displayed as image columns in the carousel. Max 10 columns.
An UriAction or MessageAction element to be triggered when the area is touched.
Height of the tappable area.
Width of the tappable area.
Horizontal position relative to the left edge of the area. Value must be 0 or higher.
Vertical position relative to the top of the area. Value must be 0 or higher.
Alternative text.
Base URL of the image
ImageMapArea elements for the actions on touching.
Height of base image. Set to the height that corresponds to a width of 1040 pixels.
One ImageMapVideoArea element to play video within the image map.
An UriAction element to be displayed after the video is finished.
Height of the video area
URL of the video file (Max character limit: 1000)
URL of the preview image (Max character limit: 1000)
Width of the video area
Horizontal position of the video area relative to the left edge of the imagemap area. Value must be 0 or higher.
Vertical position of the video area relative to the top of the imagemap area. Value must be 0 or higher.
Image URL (Max character limit: 1000)
Preview image URL (Max character limit: 1000)
ID of a rich menu.
Label for the action. Max character limit: 20
Label for the action
Text sent when the action is performed. Max character limit: 300
String returned via webhook in the postback.data property of the postback
event. Max character limit: 300.
Text displayed in the chat as a message sent by the user when the action is performed. Required for quick reply buttons. Optional for the other message types. Max character limit: 300.
Label for the action
One Action element to be performed when the button is touched.
URL of the icon that is displayed at the beginning of the button.
Sticker ID. For a list of sticker IDs for stickers that can be sent with the Messaging API, see the Sticker list.
Package ID for a set of stickers. For information on package IDs, see the Sticker list.
Label for the action
URI opened when the action is performed (Max character limit: 1000). The available schemes are http, https, line, and tel.
URL of video file (Max character limit: 1000)
URL of preview image (Max character limit: 1000)
ID used to identify the video when Video viewing complete event occurs. If you send a video message with trackingId added, the video viewing complete event occurs when the user finishes watching the video.
Generated using TypeDoc
Audio sends an audio message.
AudioProps
Check official reference.