Get basic text input from the user using a form text input and validate
the input using a specific regex pattern. This component can also be used
as a text input widget in a page.
- regex_input: >
^
([A-Za-z]\d[A-Za-z])
[ -]?
(?P<second_part>\d[A-Za-z]\d)
$
label: Postal code
required: true
placeholder: Type your postal code here
Which produces the following in the Meya Orb Web SDK client:
The regex input component is also an interactive component which allows you to set
quick replies, configure the input composer
and set context data.
Here is a more advanced example:
- regex_input: >
^
([A-Za-z]\d[A-Za-z])
[ -]?
(?P<second_part>\d[A-Za-z]\d)
$
label: Postal code
required: true
placeholder: Type your postal code here
quick_replies:
- text: Find my postal code
action:
flow: flow.find_postal_code
- text: Talk to an agent
action:
flow: flow.agent
context:
foo: bar
composer:
focus: blur
visibility: collapse
collapse_placeholder: Ask a question
Which produces the following output:
Note, not all integrations support the quick_replies and composer
fields. Check the compatibility matrix
and integration documentation to see which features the specific integration
you are using supports.
Input validation
Once the user submits their input, it is evaluated against the specified
regex pattern, and if the pattern matches then the component will store the
value in (@ flow.result )
in your app's flow scope data.
If the pattern fails to match, then the regex component will display an
error.
Here is an example of the error:
Pages support
This regex input component is also a widget component that can be displayed as a field
in a page.
Here is an example using the regex input component in a page:
- page:
- regex_input: >
^
([A-Za-z]\d[A-Za-z])
[ -]?
(?P<second_part>\d[A-Za-z]\d)
$
label: Postal code
required: true
placeholder: Type your postal code here
Which produces the following output:
Check the Widgets & Pages guide for more info on creating advanced
form wizards for collecting user input.
Element details
type: meya.text.component.regex_input
class: RegexInputComponent
path: /meya/text/component/regex_input/regex_input.py
signature: regex_input
Fields
field | description | required | signature | default | type |
---|---|---|---|---|---|
spec | Override the original spec for this element. | ○ | ○ | null | Spec |
context | Send context data with this component's event. | ○ | ○ | {} | dict |
sensitive | Mark this component's event as sensitive. This will encrypt the event if the Sensitive Data integration has been enabled. | ○ | ○ | false | bool |
triggers | Activate these dynamic triggers when the component runs. Check the component triggers guide for more info. | ○ | ○ | [] | list |
quick_replies | List of buttons that the user can select for replies. | ○ | ○ | [] | list |
composer | The composer spec that allows you to control the Orb's input composer. Check the Composer guide for more info. | ○ | ○ | focus: blur placeholder: collapse_placeholder: visibility: character_limit: | ComposerElementSpec |
header | Override the header for this component. | ○ | ○ | buttons: title: progress: milestones: extra_buttons: | HeaderElementSpec |
markdown | Override the bot Markdown mode for this component. Check the Markdown guide for more info. | ○ | ○ | null | list bool NoneType |
required | ○ | ○ | false | bool | |
label | ○ | ○ | null | str | |
disabled | ○ | ○ | false | bool | |
icon | The icon spec or URL to use for the input field. See the Icons guide for more info. | ○ | ○ | null | IconElementSpec str NoneType |
placeholder | The input field's placeholder text. This is displayed when thefield has not user specified text. | ○ | ○ | null | str |
default | The input's default value. | ○ | ○ | null | str |
regex_input | The regex (regular expression) pattern to validate the user input against. | ◉ | ◉ | str | |
capture_groups | Capture the regex groups. | ○ | ○ | false | bool |
ignorecase | Ignore the case of the user input when validating against the regex pattern. | ○ | ○ | null | bool |
error_message | ○ | ○ | "Invalid input, please try again." | str | |
Usage reference
Basic
triggers:
- keyword: meya.text.component.regex_input
steps:
- regex_input: STRING
Full
triggers:
- keyword: meya.text.component.regex_input
steps:
- spec:
type: STRING
data:
STRING: ANY
timeout: 123
trigger_when: ANY
context:
STRING: ANY
sensitive: false
triggers:
- type: STRING
data:
STRING: ANY
timeout: 123
trigger_when: ANY
quick_replies:
- url: STRING
javascript: STRING
button_id: STRING
context:
STRING: ANY
default: false
disabled: false
divider: false
icon:
url: STRING
color: STRING
path: STRING
action: COMPONENT
value: ANY
result: ANY
data:
STRING: ANY
magic: false
type: text|url|static|menu|divider|action|flow_next|component_next
menu:
- BUTTONELEMENTSPEC
text: STRING
composer:
focus: file|image|text|blur
placeholder: STRING
collapse_placeholder: STRING
visibility: collapse|hide|show
character_limit:
length: 123
error_text: STRING
header:
buttons:
- url: STRING
javascript: STRING
button_id: STRING
context:
STRING: ANY
default: false
disabled: false
divider: false
icon:
url: STRING
color: STRING
path: STRING
action: COMPONENT
value: ANY
result: ANY
data:
STRING: ANY
magic: false
type: text|url|static|menu|divider|action|flow_next|component_next
menu:
- BUTTONELEMENTSPEC
text: STRING
title:
text: STRING
icon:
url: STRING
color: STRING
path: STRING
progress:
value: 123
show_percent: false
milestones:
- text: STRING
current: false
extra_buttons:
- url: STRING
javascript: STRING
button_id: STRING
context:
STRING: ANY
default: false
disabled: false
divider: false
icon:
url: STRING
color: STRING
path: STRING
action: COMPONENT
value: ANY
result: ANY
data:
STRING: ANY
magic: false
type: text|url|static|menu|divider|action|flow_next|component_next
menu:
- BUTTONELEMENTSPEC
text: STRING
markdown:
- format|linkify|breaks|typographer
required: false
label: STRING
disabled: false
icon:
url: STRING
color: STRING
path: STRING
placeholder: STRING
default: STRING
regex_input: STRING
capture_groups: false
ignorecase: false
error_message: STRING