playbook_ui_docs 12.24.0.pre.alpha.play824753 → 12.24.0.pre.alpha.railsmultilevelimprovements739

Sign up to get free protection for your applications and to get access to all the features.
metadata CHANGED
@@ -1,7 +1,7 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: playbook_ui_docs
3
3
  version: !ruby/object:Gem::Version
4
- version: 12.24.0.pre.alpha.play824753
4
+ version: 12.24.0.pre.alpha.railsmultilevelimprovements739
5
5
  platform: ruby
6
6
  authors:
7
7
  - Power UX
@@ -9,7 +9,7 @@ authors:
9
9
  autorequire:
10
10
  bindir: bin
11
11
  cert_chain: []
12
- date: 2023-06-09 00:00:00.000000000 Z
12
+ date: 2023-06-06 00:00:00.000000000 Z
13
13
  dependencies:
14
14
  - !ruby/object:Gem::Dependency
15
15
  name: playbook_ui
@@ -933,8 +933,6 @@ files:
933
933
  - app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_preferred_countries.html.erb
934
934
  - app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_preferred_countries.jsx
935
935
  - app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_preferred_countries.md
936
- - app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_validation.html.erb
937
- - app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_validation.jsx
938
936
  - app/pb_kits/playbook/pb_phone_number_input/docs/example.yml
939
937
  - app/pb_kits/playbook/pb_phone_number_input/docs/index.js
940
938
  - app/pb_kits/playbook/pb_pill/docs/_description.md
@@ -1,14 +0,0 @@
1
- <form id="example-form-validation" action="" method="get">
2
- <%= pb_rails("phone_number_input", props: { error: "Missing phone number.", id: "validation", initial_country: "af", value: "", required: true }) %>
3
- <%= pb_rails("button", props: {html_type: "submit", text: "Save Phone Number"}) %>
4
- </form>
5
-
6
- <% content_for(:pb_js) do %>
7
- <%= javascript_tag do %>
8
- document.addEventListener('DOMContentLoaded', function () {
9
- document.querySelector('#example-form-validation').addEventListener('submit', function (e) {
10
- if (e.target.querySelectorAll('[error]:not([error=""])').length > 0) e.preventDefault();
11
- })
12
- })
13
- <% end %>
14
- <% end %>
@@ -1,60 +0,0 @@
1
- import React, { useEffect, useState } from "react";
2
- import { Button, FixedConfirmationToast, PhoneNumberInput } from "../../";
3
-
4
- const PhoneNumberInputValidation = (props) => {
5
- const [formErrors, setFormErrors] = useState("");
6
- const [showFormErrors, setShowFormErrors] = useState(false);
7
- const [phoneNumber, setPhoneNumber] = useState("");
8
- const [countryCode, setCountryCode] = useState("af");
9
-
10
- const handleOnValidate = (valid) => {
11
- setFormErrors(
12
- valid ? "" : "Please correct the fields below and try again."
13
- );
14
- };
15
-
16
- const handleOnChange = ({ iso2, number }) => {
17
- setCountryCode(iso2);
18
- setPhoneNumber(number);
19
- };
20
-
21
- const handleOnSubmit = (e) => {
22
- if (showFormErrors) e.preventDefault()
23
- }
24
-
25
- useEffect(() => {
26
- setShowFormErrors(formErrors.length > 0);
27
- }, [formErrors]);
28
-
29
- return (
30
- <form
31
- action=""
32
- method="get"
33
- onSubmit={handleOnSubmit}
34
- >
35
- {showFormErrors && (
36
- <FixedConfirmationToast
37
- marginBottom="md"
38
- status="error"
39
- text={formErrors}
40
- />
41
- )}
42
- <PhoneNumberInput
43
- error="Missing phone number."
44
- id="validation"
45
- initialCountry={countryCode}
46
- onChange={handleOnChange}
47
- onValidate={handleOnValidate}
48
- required
49
- value={phoneNumber}
50
- {...props}
51
- />
52
- <Button
53
- htmlType="submit"
54
- text="Save Phone Number"
55
- />
56
- </form>
57
- );
58
- };
59
-
60
- export default PhoneNumberInputValidation;