playbook_ui_docs 16.4.0.pre.rc.0 → 16.4.0.pre.rc.1
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_dialog/docs/_dialog_default.html.erb +18 -9
- data/app/pb_kits/playbook/pb_dialog/docs/_dialog_default.jsx +24 -5
- data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_closing_options_rails.html.erb +16 -0
- data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_closing_options_rails.md +1 -0
- data/app/pb_kits/playbook/pb_dropdown/docs/example.yml +1 -0
- 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: 5ae2c66c75f3bee93815118daedfe0ff9c8154af93b53053b7a9dbe513861c7d
|
|
4
|
+
data.tar.gz: ccdd3daf560f457083281fbef655b996aada3f7e8f68cd1ad090bf096986fbe3
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: cf3b794e608e76573d6e78b747cd2a3b439e98560ae1405361f2009c8a090a57d29817302419b5ad2355798e5beebb038a6eadf67366a4e4f927d83acc1b7ce9
|
|
7
|
+
data.tar.gz: c7c962a501267eef55d2901d821d29aae0b8fe08c0f85108cf1418bf0c742605d2dc3b08640064dc1b0988829a211de06e034e988c17010be27bb8894b1fb096
|
|
@@ -1,11 +1,20 @@
|
|
|
1
1
|
<%= pb_rails("button", props: { text: "Open Dialog", data: {"open-dialog": "dialog-1"} }) %>
|
|
2
2
|
|
|
3
|
-
<%= pb_rails("dialog", props: {
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
}) %>
|
|
3
|
+
<%= pb_rails("dialog", props: {
|
|
4
|
+
id:"dialog-1",
|
|
5
|
+
size: "md",
|
|
6
|
+
title: "Header Title is the Title Prop"
|
|
7
|
+
}) do %>
|
|
8
|
+
<%= pb_rails("dialog/dialog_body") do %>
|
|
9
|
+
<%= pb_rails("button", props: { aria: { label: "Loading" }, loading: true, margin_right: "lg", text: "Button Primary" }) %>
|
|
10
|
+
<div style="height: 800px; background-color: lightgray;"></div>
|
|
11
|
+
<%= pb_rails("button", props: { loading: true, text: "Loading..." }) %>
|
|
12
|
+
<% end %>
|
|
13
|
+
|
|
14
|
+
<%= pb_rails("dialog/dialog_footer") do %>
|
|
15
|
+
<%= pb_rails("flex", props: { spacing: "between", padding_x: "md", padding_bottom: "md", padding: "sm" }) do %>
|
|
16
|
+
<%= pb_rails("button", props: { loading: true, text: "Send My Issue" }) %>
|
|
17
|
+
<%= pb_rails("button", props: { text: "Back", variant: "link", data: {"close-dialog": "dialog-1"} }) %>
|
|
18
|
+
<% end %>
|
|
19
|
+
<% end %>
|
|
20
|
+
<% end %>
|
|
@@ -12,16 +12,35 @@ const DialogDefault = () => {
|
|
|
12
12
|
<>
|
|
13
13
|
<Button onClick={open}>{'Open Dialog'}</Button>
|
|
14
14
|
<Dialog
|
|
15
|
-
cancelButton="Cancel Button"
|
|
16
|
-
confirmButton="Okay"
|
|
17
15
|
onCancel={close}
|
|
18
16
|
onClose={close}
|
|
19
17
|
onConfirm={close}
|
|
20
18
|
opened={isOpen}
|
|
21
|
-
size="
|
|
22
|
-
text="Hello Body Text, Nice to meet ya."
|
|
19
|
+
size="md"
|
|
23
20
|
title="Header Title is the Title Prop"
|
|
24
|
-
|
|
21
|
+
>
|
|
22
|
+
<Dialog.Body>
|
|
23
|
+
<Button
|
|
24
|
+
aria={{ label: 'Loading' }}
|
|
25
|
+
loading
|
|
26
|
+
text="Button Primary"
|
|
27
|
+
/>
|
|
28
|
+
<div style={{height: '800px', backgroundColor: 'lightgray'}} />
|
|
29
|
+
<Button
|
|
30
|
+
loading
|
|
31
|
+
text="Loading..."
|
|
32
|
+
/>
|
|
33
|
+
</Dialog.Body>
|
|
34
|
+
<Dialog.Footer>
|
|
35
|
+
<Button
|
|
36
|
+
loading
|
|
37
|
+
text="Send My Issue"
|
|
38
|
+
/>
|
|
39
|
+
<Button variant="link">
|
|
40
|
+
{"Back"}
|
|
41
|
+
</Button>
|
|
42
|
+
</Dialog.Footer>
|
|
43
|
+
</Dialog>
|
|
25
44
|
</>
|
|
26
45
|
)
|
|
27
46
|
}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
<%
|
|
2
|
+
options = [
|
|
3
|
+
{ label: "United States", value: "unitedStates", id: "us" },
|
|
4
|
+
{ label: "Canada", value: "canada", id: "ca" },
|
|
5
|
+
{ label: "Pakistan", value: "pakistan", id: "pk" },
|
|
6
|
+
]
|
|
7
|
+
%>
|
|
8
|
+
|
|
9
|
+
<%= pb_rails("caption", props: { margin_bottom: "xs", text: "Any" }) %>
|
|
10
|
+
<%= pb_rails("dropdown", props: { options: options, close_on_click: "any", margin_bottom: "md" }) %>
|
|
11
|
+
|
|
12
|
+
<%= pb_rails("caption", props: { margin_bottom: "xs", text: "Outside" }) %>
|
|
13
|
+
<%= pb_rails("dropdown", props: { options: options, close_on_click: "outside", margin_bottom: "md" }) %>
|
|
14
|
+
|
|
15
|
+
<%= pb_rails("caption", props: { margin_bottom: "xs", text: "Inside" }) %>
|
|
16
|
+
<%= pb_rails("dropdown", props: { options: options, close_on_click: "inside" }) %>
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
The `close_on_click` prop allows you to control when the Dropdown closes in response to click interactions. The value `any` reflects the default behavior, where the dropdown will close after any click. Set it to `outside` to ensure interactive elements as dropdown options are able to be interacted with or modified. Set it to `inside` for a dropdown that only closes when the input or dropdown menu is clicked.
|
|
@@ -25,6 +25,7 @@ examples:
|
|
|
25
25
|
- dropdown_separators_hidden: Separators Hidden
|
|
26
26
|
- dropdown_with_clearable: Clearable
|
|
27
27
|
- dropdown_with_constrain_height_rails: Constrain Height
|
|
28
|
+
- dropdown_closing_options_rails: Closing Options
|
|
28
29
|
- dropdown_quickpick_rails: Quick Pick Variant
|
|
29
30
|
- dropdown_quickpick_range_end_rails: Quick Pick Variant (Range Ends Today)
|
|
30
31
|
- dropdown_quickpick_default_dates: Quick Pick Variant (Default Dates)
|
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: 16.4.0.pre.rc.
|
|
4
|
+
version: 16.4.0.pre.rc.1
|
|
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: 2026-03-
|
|
12
|
+
date: 2026-03-04 00:00:00.000000000 Z
|
|
13
13
|
dependencies:
|
|
14
14
|
- !ruby/object:Gem::Dependency
|
|
15
15
|
name: playbook_ui
|
|
@@ -861,6 +861,8 @@ files:
|
|
|
861
861
|
- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_clear_selection.md
|
|
862
862
|
- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_closing_options.jsx
|
|
863
863
|
- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_closing_options.md
|
|
864
|
+
- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_closing_options_rails.html.erb
|
|
865
|
+
- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_closing_options_rails.md
|
|
864
866
|
- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_default.jsx
|
|
865
867
|
- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_default.md
|
|
866
868
|
- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_default_rails.html.erb
|