playbook_ui_docs 14.11.1.pre.alpha.play1724darkmodeauditmap5413 → 14.11.1.pre.alpha.play17725372
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_map/docs/_map_default.jsx +4 -4
- data/app/pb_kits/playbook/pb_map/docs/_map_with_custom_button.jsx +7 -7
- data/app/pb_kits/playbook/pb_map/docs/_map_with_plugin.jsx +5 -5
- data/app/pb_kits/playbook/pb_text_input/docs/_text_input_mask.html.erb +50 -0
- data/app/pb_kits/playbook/pb_text_input/docs/_text_input_mask_rails.md +3 -0
- data/app/pb_kits/playbook/pb_text_input/docs/example.yml +2 -1
- data/dist/playbook-doc.js +1 -1
- metadata +4 -2
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 71665013535983bbbb262a5e9fd63b1418f67026361e2660fbe3c5f4c2ccea1a
|
4
|
+
data.tar.gz: a343b17a0932ac52611e4861419b243c188e410d07a8502a8acab75e029ff42f
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 7a91954d5fef65f3f118f85a45ab2c038560f6a5016a740ce0e6114d3040fa71a3148829dd0874ef4ada370d5018370cd48dbadcd506832a64e0ef384c90f2ba
|
7
|
+
data.tar.gz: d0c777e8b3e108bef802adfa5f68cf78017af5505ad3e39278399fc8721effc54d74c5a2263640477e39a3b8809ab6c6193897fc6e94571f656aa6a420d8d2a8
|
@@ -25,12 +25,12 @@ const MapDefault = (props) => {
|
|
25
25
|
new maplibregl.Marker({
|
26
26
|
color: mapTheme.marker,
|
27
27
|
}).setLngLat(defaultPosition)
|
28
|
-
.setPopup(new maplibregl.Popup({closeButton: false}).setHTML(
|
28
|
+
.setPopup(new maplibregl.Popup({closeButton: false}).setHTML(`<h4 class="pb_title_kit_size_4">Hello World!</h4>`)) // add popup
|
29
29
|
.addTo(map);
|
30
30
|
|
31
31
|
// disable map zoom when using scroll
|
32
32
|
map.scrollZoom.disable();
|
33
|
-
|
33
|
+
|
34
34
|
//add attributioncontrols
|
35
35
|
map.addControl(new maplibregl.AttributionControl({
|
36
36
|
compact: true
|
@@ -49,7 +49,7 @@ const MapDefault = (props) => {
|
|
49
49
|
|
50
50
|
}, [])
|
51
51
|
|
52
|
-
return (
|
52
|
+
return (
|
53
53
|
<Map flyTo
|
54
54
|
flyToClick={()=> {handleFlyTo(mapInstance)}}
|
55
55
|
zoomBtns
|
@@ -63,7 +63,7 @@ return (
|
|
63
63
|
position: 'absolute',
|
64
64
|
left: 0,
|
65
65
|
right: 0,
|
66
|
-
top: 0,
|
66
|
+
top: 0,
|
67
67
|
bottom: 0,
|
68
68
|
}}
|
69
69
|
/>
|
@@ -25,12 +25,12 @@ const MapWithCustomButton = (props) => {
|
|
25
25
|
new maplibregl.Marker({
|
26
26
|
color: mapTheme.marker,
|
27
27
|
}).setLngLat(defaultPosition)
|
28
|
-
.setPopup(new maplibregl.Popup({closeButton: false}).setHTML(
|
28
|
+
.setPopup(new maplibregl.Popup({closeButton: false}).setHTML(`<h4 class="pb_title_kit_size_4">Hello World!</h4>`)) // add popup
|
29
29
|
.addTo(map);
|
30
30
|
|
31
31
|
// disable map zoom when using scroll
|
32
32
|
map.scrollZoom.disable();
|
33
|
-
|
33
|
+
|
34
34
|
//add attributioncontrols
|
35
35
|
map.addControl(new maplibregl.AttributionControl({
|
36
36
|
compact: true
|
@@ -49,8 +49,8 @@ const MapWithCustomButton = (props) => {
|
|
49
49
|
|
50
50
|
}, [])
|
51
51
|
|
52
|
-
return (
|
53
|
-
<Map
|
52
|
+
return (
|
53
|
+
<Map
|
54
54
|
{...props}
|
55
55
|
>
|
56
56
|
<Map.Controls flyTo
|
@@ -59,10 +59,10 @@ return (
|
|
59
59
|
zoomInClick={() => {handleZoomIn(mapInstance)}}
|
60
60
|
zoomOutClick={()=> {handleZoomOut(mapInstance)}}
|
61
61
|
>
|
62
|
-
<MapCustomButton icon="home"
|
62
|
+
<MapCustomButton icon="home"
|
63
63
|
onClick={() => alert("button clicked!")}
|
64
64
|
/>
|
65
|
-
<MapCustomButton icon="search"
|
65
|
+
<MapCustomButton icon="search"
|
66
66
|
onClick={() => alert("button clicked!")}
|
67
67
|
/>
|
68
68
|
</Map.Controls>
|
@@ -72,7 +72,7 @@ return (
|
|
72
72
|
position: 'absolute',
|
73
73
|
left: 0,
|
74
74
|
right: 0,
|
75
|
-
top: 0,
|
75
|
+
top: 0,
|
76
76
|
bottom: 0,
|
77
77
|
}}
|
78
78
|
/>
|
@@ -25,7 +25,7 @@ const MapWithPlugin = (props) => {
|
|
25
25
|
new maplibregl.Marker({
|
26
26
|
color: mapTheme.marker,
|
27
27
|
}).setLngLat(defaultPosition)
|
28
|
-
.setPopup(new maplibregl.Popup({className: 'map_popup', closeButton: false}).setHTML(
|
28
|
+
.setPopup(new maplibregl.Popup({className: 'map_popup', closeButton: false}).setHTML(`<h4 class="pb_title_kit_size_4">Hello World!</h4>`)) // add popup
|
29
29
|
.addTo(map);
|
30
30
|
|
31
31
|
//add maplibre default zoom controls
|
@@ -48,7 +48,7 @@ const MapWithPlugin = (props) => {
|
|
48
48
|
map.addControl(new maplibregl.AttributionControl({
|
49
49
|
compact: true
|
50
50
|
}));
|
51
|
-
|
51
|
+
|
52
52
|
//set map instance
|
53
53
|
setMapInstance(map)
|
54
54
|
}
|
@@ -62,8 +62,8 @@ const MapWithPlugin = (props) => {
|
|
62
62
|
}, [])
|
63
63
|
|
64
64
|
|
65
|
-
|
66
|
-
return (
|
65
|
+
|
66
|
+
return (
|
67
67
|
<Map flyTo
|
68
68
|
flyToClick={()=> {handleFlyTo(mapInstance)}}
|
69
69
|
zoomBtns
|
@@ -77,7 +77,7 @@ return (
|
|
77
77
|
position: 'absolute',
|
78
78
|
left: 0,
|
79
79
|
right: 0,
|
80
|
-
top: 0,
|
80
|
+
top: 0,
|
81
81
|
bottom: 0,
|
82
82
|
}}
|
83
83
|
/>
|
@@ -0,0 +1,50 @@
|
|
1
|
+
|
2
|
+
|
3
|
+
|
4
|
+
<%= pb_rails("title", props: { text: "Input Masks", size: 4, margin_bottom: "md" }) %>
|
5
|
+
|
6
|
+
<div class="pb--doc-demo-elements">
|
7
|
+
<%= pb_rails("text_input", props: {
|
8
|
+
label: "Currency",
|
9
|
+
mask: "currency",
|
10
|
+
margin_bottom: "md",
|
11
|
+
name: "currency_name"
|
12
|
+
}) %>
|
13
|
+
|
14
|
+
<%= pb_rails("text_input", props: {
|
15
|
+
label: "ZIP Code",
|
16
|
+
mask: "zip_code",
|
17
|
+
margin_bottom: "md",
|
18
|
+
}) %>
|
19
|
+
|
20
|
+
<%= pb_rails("text_input", props: {
|
21
|
+
label: "Postal Code",
|
22
|
+
mask: "postal_code",
|
23
|
+
placeholder: "12345-6789",
|
24
|
+
margin_bottom: "md",
|
25
|
+
}) %>
|
26
|
+
|
27
|
+
<%= pb_rails("text_input", props: {
|
28
|
+
label: "Social Security Number",
|
29
|
+
mask: "ssn",
|
30
|
+
margin_bottom: "md",
|
31
|
+
}) %>
|
32
|
+
|
33
|
+
<%= pb_rails("title" , props: {
|
34
|
+
text: "Hidden Input Under The Hood",
|
35
|
+
padding_bottom: "sm"
|
36
|
+
})%>
|
37
|
+
|
38
|
+
<%= pb_rails("text_input", props: {
|
39
|
+
label: "Currency",
|
40
|
+
mask: "currency",
|
41
|
+
margin_bottom: "md",
|
42
|
+
name: "currency_name",
|
43
|
+
id: "example-currency"
|
44
|
+
}) %>
|
45
|
+
|
46
|
+
<style>
|
47
|
+
#example-currency-sanitized {display: flex !important;}
|
48
|
+
</style>
|
49
|
+
|
50
|
+
</div>
|
@@ -8,6 +8,7 @@ examples:
|
|
8
8
|
- text_input_inline: Inline
|
9
9
|
- text_input_no_label: No Label
|
10
10
|
- text_input_options: Input Options
|
11
|
+
- text_input_mask: Mask
|
11
12
|
react:
|
12
13
|
- text_input_default: Default
|
13
14
|
- text_input_error: With Error
|
@@ -23,4 +24,4 @@ examples:
|
|
23
24
|
- text_input_error_swift: With Error
|
24
25
|
- text_input_disabled_swift: Disabled
|
25
26
|
- text_input_add_on_swift: Add On
|
26
|
-
- text_input_props_swift: ""
|
27
|
+
- text_input_props_swift: ""
|