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 CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: 364db9a32d67ef8695aa48175b6281ce41ca017ababac0f98507a349efb31f57
4
- data.tar.gz: 51c8d0f6422756b9f015b98b56aebf4c25fef5ac4536e225e3004b831a132276
3
+ metadata.gz: 71665013535983bbbb262a5e9fd63b1418f67026361e2660fbe3c5f4c2ccea1a
4
+ data.tar.gz: a343b17a0932ac52611e4861419b243c188e410d07a8502a8acab75e029ff42f
5
5
  SHA512:
6
- metadata.gz: b107c5b9a7271ac4c9b28c8476b0127cfd2149f7f5e2b9466ad8204f2e68c4c0c99a67a5d28c011d2ab7f0265a9ba6fcf5017b381624620e0c34b3ba142aa345
7
- data.tar.gz: 55542d06b2056c8c4f617b2acbfdb0e9a66115d4352d51f342e3fcbc0bb90924f9740d26382ffaea54a4a1cf4677e2de140d599b70b89e53bb599dde600bd682
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('Hello World!')) // add popup
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('Hello World!')) // add popup
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('Hello World!')) // add popup
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>
@@ -0,0 +1,3 @@
1
+ This mask feature lets you style your inputs while maintaining the value that the user typed in.
2
+
3
+ There's a hidden input file that stores the raw value, and has the `name` feild. It will also copy the id field with a "#{your-id-sanitized}"
@@ -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: ""