Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Docs for phone picker #117

Open
wants to merge 3 commits into
base: master
Choose a base branch
from
Open

Docs for phone picker #117

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
318953e
Docs for phone picker
safijanet Aug 12, 2024
477d9f2
Desc updated
Aug 12, 2024
ed071f5
Value updated
safijanet Aug 12, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Binary file added src/.vuepress/public/.attachments/applications/Controls/phonepickerbase.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
174 changes: 150 additions & 24 deletions src/en/developer-guide/applications/controls/phonepicker.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,35 +1,161 @@
---
Author: Jan Losenicky
Author: Safija Hubljar
---

# Phone Picker

# Visual Example

![Email Picker Displayed On Form](/.attachments/applications/Controls/phonepickercontrol.png)
<p>Provides features that extend the native Phone field control. Most notably:</p>

# Description
- **Autoformat**: Inputed number gets automatically formated based on provided country code. This includes automatic detection of country prefix.
- **Verification** (optional): If enabled, the control will check if the provided number has been verified (through SMS OTP). Verification status is displayed directly in the control. If not verified, the user has the option to trigger verification directly through the control.

This control is used to enter a phone number in field. It is checking the format of phone and also there is a function to verify the phone.

# Binding Field
<img src='/.attachments/applications/Controls/phonepickerbase.png' width="300px" />

Control can be binded to field of type SingleLine.Phone, SingleLine.Text and SingleLine.
## Bindings

# Inputs
<table>
<thead>
<tr>
<th>Property Name</th>
<th>Description</th>
<th>Of Type</th>
<th>Input</th>
<th>Output</th>
<th>Usage</th>
<th>Required</th>
</tr>
</thead>
<tbody>
<tr>
<td>phoneNumber</td>
<td>Phone number field</td>
<td>
<p><code>SingleLine.Phone</code></p>
<p><code>SingleLine.Text</code></p>
<p<code>SingleLine</code></p>
<td>
<code>111 222 333</code>
<p style="width: 200px"><code>{"phoneNumber": "111222333",</br> "asyncJobInstanceId": null,
</br> "prefix": +420",</br> "status": "unverified",</br> "type": 0,</br> "url": null,</br> "verifiedOn": null}
</code></p>
</td>
<td><p style="width: 180px"><code>{"phoneNumber":"111 222 333",</br>"prefix":"+420",</br>"status":"unverified",</br>"type":2}</code></p></td>
<td><code>bound</code></td>
<td><code>true</code></td>
</tr>
<tr>
<td>entityName</td>
<td><p style="width: 180px">Entity name of the record the PhonePicker is on. Required if verification feature is on.</p></td>
<td><code>SingleLine.Text</code></td>
<td>
<code>account</code>
</td>
<td>N/A</td>
<td><code>input</code></td>
<td><code>false</code></td>
</tr>
<tr>
<td>defaultCountryCode</td>
<td>Default Country code. CZ by default</td>
<td><code>SingleLine.Text</code></td>
<td>
<code>CZ</code>
</td>
<td>N/A</td>
<td><code>input</code></td>
<td><code>false</code></td>
</tr>
<tr>
<td>placeholderMessage</td>
<td>Placeholder message</td>
<td><code>SingleLine.Text</code></td>
<td>
<code>---</code>
</td>
<td>N/A</td>
<td><code>input</code></td>
<td><code>false</code></td>
</tr>
<tr>
<td>verificationFeature</td>
<td>Enable the functionality for verification phone number.</td>
<td><code>Enum</code></td>
<td>
<p><code>0</code></p>
<p><code>1</code></p>
</td>
<td>N/A</td>
<td><code>input</code></td>
<td><code>true</code></td>
</tr>
<tr>
<td>verificationDialogDisabled</td>
<td>Field for disabling the verification dialog.</td>
<td><code>Enum</code></td>
<td>
<p><code>true</code></p>
<p><code>false</code></p>
</td>
<td>N/A</td>
<td><code>input</code></td>
<td><code>false</code></td>
</tr>
<tr>
<td>enforceMobile</td>
<td>Enforces the use of a mobile number or allows a landline.</td>
<td><code>Enum</code></td>
<td>
<p> <code>0</code></p>
<p> <code>1</code></p>
</td>
<td>N/A</td>
<td><code>input</code></td>
<td><code>false</code></td>
</tr>
<tr>
<td>callFeature</td>
<td>Enable call functionality.</td>
<td><code>Enum</code></td>
<td>
<p<code>0</code></p>
<p<code>1</code></p>
</td>
<td>N/A</td>
<td><code>input</code></td>
<td><code>false</code></td>
</tr>
<tr>
<td>plainPhone</td>
<td>Binding field returning plain phone number</td>
<td>
<p><code>SingleLine.Phone</code></p>
<p><code>SingleLine.Text</code></p>
<p><code>SingleLine</code></p>
</td>
<td><p style="width: 130px"><code>+420 111 222 333</code></p></td>
<td><p style="width: 150px"><code>+420 111 222 333</code></p></td>
<td><code>bound</code></td>
<td><code>false</code></td>
</tr>
<tr>
<td>clickToCopyEnabled</td>
<td>Enable click to copy button.</td>
<td><code>Enum</code></td>
<td>
<p><code>true</code></p>
<p<code>false</code></p>
</td>
<td>N/A</td>
<td><code>input</code></td>
<td><code>false</code></td>
</tr>
</tbody>
</table>

- Default Country Code - Set to "CZ" by default.
- Place Holder Message - Default vaule is "---"
- Call Feature
- Disabled
- Enabled (default)
- Enforce Mobile - Enforce mobile phone or allow landline
- Disabled
- Enabled (default)
- Verification Feature
- Disabled (default)
- Enabled
## Changelog

Using Verication Feature
- Entity Name (required)
- Record Id (required)
<h2>2024-08-07</h2>
<h3> Changed</h3>
<ul>
<li>Changed PCF to use TextField Base control</li>
</ul>