playbook_ui 12.24.0.pre.alpha.play824753 → 12.24.0.pre.alpha.railsmultilevelimprovements739
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/app/pb_kits/playbook/pb_phone_number_input/_phone_number_input.tsx +45 -110
- data/app/pb_kits/playbook/pb_phone_number_input/docs/example.yml +1 -3
- data/app/pb_kits/playbook/pb_phone_number_input/docs/index.js +0 -1
- data/app/pb_kits/playbook/pb_phone_number_input/phone_number_input.rb +0 -6
- data/app/pb_kits/playbook/pb_phone_number_input/phone_number_input.test.js +62 -110
- data/dist/playbook-rails.js +2 -2
- data/lib/playbook/forms/builder/multi_level_select_field.rb +12 -0
- data/lib/playbook/forms/builder.rb +2 -1
- data/lib/playbook/version.rb +1 -1
- metadata +3 -6
- data/app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_validation.html.erb +0 -14
- data/app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_validation.jsx +0 -60
- data/app/pb_kits/playbook/utilities/object.ts +0 -3
- data/lib/playbook/forms/builder/intl_telephone_field.rb +0 -12
@@ -0,0 +1,12 @@
|
|
1
|
+
# frozen_string_literal: true
|
2
|
+
|
3
|
+
module Playbook
|
4
|
+
module Forms
|
5
|
+
class Builder
|
6
|
+
def multi_level_select(id, _options = {}, _html_options = {}, props: {})
|
7
|
+
props[:id] = id
|
8
|
+
@template.pb_rails("multi_level_select", props: props)
|
9
|
+
end
|
10
|
+
end
|
11
|
+
end
|
12
|
+
end
|
@@ -10,7 +10,7 @@ module Playbook
|
|
10
10
|
require_relative "builder/form_field_builder"
|
11
11
|
require_relative "builder/select_field"
|
12
12
|
require_relative "builder/typeahead_field"
|
13
|
-
require_relative "builder/
|
13
|
+
require_relative "builder/multi_level_select_field"
|
14
14
|
|
15
15
|
prepend(FormFieldBuilder.new(:email_field, kit_name: "text_input"))
|
16
16
|
prepend(FormFieldBuilder.new(:number_field, kit_name: "text_input"))
|
@@ -20,6 +20,7 @@ module Playbook
|
|
20
20
|
prepend(FormFieldBuilder.new(:password_field, kit_name: "text_input"))
|
21
21
|
prepend(FormFieldBuilder.new(:url_field, kit_name: "text_input"))
|
22
22
|
prepend(FormFieldBuilder.new(:text_area, kit_name: "textarea"))
|
23
|
+
prepend(FormFieldBuilder.new(:multi_level_select, kit_name: "multi_level_select"))
|
23
24
|
|
24
25
|
def actions
|
25
26
|
context = @template.respond_to?(:view_context) ? @template.view_context : @template
|
data/lib/playbook/version.rb
CHANGED
metadata
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: playbook_ui
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 12.24.0.pre.alpha.
|
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-
|
12
|
+
date: 2023-06-06 00:00:00.000000000 Z
|
13
13
|
dependencies:
|
14
14
|
- !ruby/object:Gem::Dependency
|
15
15
|
name: actionpack
|
@@ -1579,8 +1579,6 @@ files:
|
|
1579
1579
|
- app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_preferred_countries.html.erb
|
1580
1580
|
- app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_preferred_countries.jsx
|
1581
1581
|
- app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_preferred_countries.md
|
1582
|
-
- app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_validation.html.erb
|
1583
|
-
- app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_validation.jsx
|
1584
1582
|
- app/pb_kits/playbook/pb_phone_number_input/docs/example.yml
|
1585
1583
|
- app/pb_kits/playbook/pb_phone_number_input/docs/index.js
|
1586
1584
|
- app/pb_kits/playbook/pb_phone_number_input/phone_number_input.html.erb
|
@@ -2389,7 +2387,6 @@ files:
|
|
2389
2387
|
- app/pb_kits/playbook/utilities/flexbox_global_props/_justify_self.scss
|
2390
2388
|
- app/pb_kits/playbook/utilities/flexbox_global_props/_order.scss
|
2391
2389
|
- app/pb_kits/playbook/utilities/globalProps.ts
|
2392
|
-
- app/pb_kits/playbook/utilities/object.ts
|
2393
2390
|
- app/pb_kits/playbook/utilities/props.ts
|
2394
2391
|
- app/pb_kits/playbook/utilities/test-utils.js
|
2395
2392
|
- app/pb_kits/playbook/utilities/test/globalProps/alignContent.test.js
|
@@ -2428,7 +2425,7 @@ files:
|
|
2428
2425
|
- lib/playbook/forms/builder/collection_select_field.rb
|
2429
2426
|
- lib/playbook/forms/builder/date_picker_field.rb
|
2430
2427
|
- lib/playbook/forms/builder/form_field_builder.rb
|
2431
|
-
- lib/playbook/forms/builder/
|
2428
|
+
- lib/playbook/forms/builder/multi_level_select_field.rb
|
2432
2429
|
- lib/playbook/forms/builder/select_field.rb
|
2433
2430
|
- lib/playbook/forms/builder/typeahead_field.rb
|
2434
2431
|
- lib/playbook/justify_content.rb
|
data/app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_validation.html.erb
DELETED
@@ -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;
|