playbook_ui 14.12.0.pre.alpha.PBNTR8335906 → 14.12.0.pre.alpha.PLAY1602lightboxoverlapnitrobugzindextoken5751
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/app/pb_kits/playbook/pb_advanced_table/Components/TableHeaderCell.tsx +3 -10
- data/app/pb_kits/playbook/pb_advanced_table/_advanced_table.scss +10 -9
- data/app/pb_kits/playbook/pb_advanced_table/_advanced_table.tsx +21 -34
- data/app/pb_kits/playbook/pb_advanced_table/index.js +6 -9
- data/app/pb_kits/playbook/pb_advanced_table/table_row.html.erb +5 -8
- data/app/pb_kits/playbook/pb_avatar/_avatar.scss +0 -9
- data/app/pb_kits/playbook/pb_avatar/_avatar.tsx +7 -11
- data/app/pb_kits/playbook/pb_avatar/avatar.html.erb +7 -6
- data/app/pb_kits/playbook/pb_avatar/docs/_avatar_badge_component_overlay.jsx +3 -9
- data/app/pb_kits/playbook/pb_avatar/docs/_avatar_circle_icon_component_overlay.jsx +2 -6
- data/app/pb_kits/playbook/pb_button/button.rb +1 -1
- data/app/pb_kits/playbook/pb_copy_button/_copy_button.scss +1 -2
- data/app/pb_kits/playbook/pb_copy_button/docs/example.yml +3 -3
- data/app/pb_kits/playbook/pb_date/_date.tsx +4 -14
- data/app/pb_kits/playbook/pb_date/docs/_date_default.jsx +1 -2
- data/app/pb_kits/playbook/pb_date/docs/_date_unstyled.jsx +5 -13
- data/app/pb_kits/playbook/pb_file_upload/file_upload.html.erb +6 -1
- data/app/pb_kits/playbook/pb_filter/filter.html.erb +5 -1
- data/app/pb_kits/playbook/pb_fixed_confirmation_toast/docs/example.yml +0 -1
- data/app/pb_kits/playbook/pb_fixed_confirmation_toast/index.js +5 -7
- data/app/pb_kits/playbook/pb_form_group/form_group.html.erb +6 -1
- data/app/pb_kits/playbook/pb_form_pill/form_pill.html.erb +1 -1
- data/app/pb_kits/playbook/pb_lightbox/lightbox.scss +7 -6
- data/app/pb_kits/playbook/pb_link/_link.tsx +0 -18
- data/app/pb_kits/playbook/pb_link/docs/example.yml +3 -5
- data/app/pb_kits/playbook/pb_link/docs/index.js +1 -2
- data/app/pb_kits/playbook/pb_link/link.html.erb +1 -1
- data/app/pb_kits/playbook/pb_link/link.rb +0 -6
- data/app/pb_kits/playbook/pb_link/link.test.jsx +0 -30
- data/app/pb_kits/playbook/pb_progress_step/docs/_progress_step_tooltip.html.erb +6 -6
- data/app/pb_kits/playbook/pb_table/docs/_table_with_background_kit.html.erb +9 -6
- data/app/pb_kits/playbook/pb_table/docs/_table_with_background_kit.jsx +9 -6
- data/app/pb_kits/playbook/pb_table/styles/_desktop_collapse.scss +0 -26
- data/app/pb_kits/playbook/pb_table/styles/_mobile.scss +1 -0
- data/app/pb_kits/playbook/pb_table/styles/_mobile_collapse.scss +0 -25
- data/app/pb_kits/playbook/pb_table/styles/_tablet_collapse.scss +0 -25
- data/app/pb_kits/playbook/pb_tooltip/docs/_tooltip_default.html.erb +1 -1
- data/app/pb_kits/playbook/pb_tooltip/index.js +27 -45
- data/app/pb_kits/playbook/pb_tooltip/tooltip.rb +1 -5
- data/app/pb_kits/playbook/pb_user/_user.tsx +0 -3
- data/app/pb_kits/playbook/pb_user/docs/example.yml +0 -2
- data/app/pb_kits/playbook/pb_user/docs/index.js +0 -1
- data/app/pb_kits/playbook/pb_user/user.html.erb +1 -1
- data/app/pb_kits/playbook/pb_user/user.rb +0 -1
- data/app/pb_kits/playbook/pb_user/user.test.js +0 -14
- data/dist/chunks/{_typeahead-CkemExmL.js → _typeahead-BIhRQo8Q.js} +3 -3
- data/dist/chunks/_weekday_stacked-VKMYuo6-.js +45 -0
- data/dist/chunks/{lib-DjpLC8uO.js → lib-kMuhBuU7.js} +1 -1
- data/dist/chunks/{pb_form_validation-S56UaHZl.js → pb_form_validation-DBJ0wZuS.js} +1 -1
- data/dist/chunks/vendor.js +1 -1
- data/dist/menu.yml +2 -2
- data/dist/playbook-doc.js +1 -1
- data/dist/playbook-rails-react-bindings.js +1 -1
- data/dist/playbook-rails.js +1 -1
- data/dist/playbook.css +1 -1
- data/lib/playbook/version.rb +1 -1
- metadata +7 -20
- data/app/pb_kits/playbook/pb_advanced_table/Utilities/ActionBarAnimationHelper.ts +0 -26
- data/app/pb_kits/playbook/pb_copy_button/copy_button.html.erb +0 -15
- data/app/pb_kits/playbook/pb_copy_button/copy_button.rb +0 -28
- data/app/pb_kits/playbook/pb_copy_button/docs/_copy_button_default.html.erb +0 -2
- data/app/pb_kits/playbook/pb_copy_button/docs/_copy_button_from.html.erb +0 -5
- data/app/pb_kits/playbook/pb_copy_button/index.js +0 -47
- data/app/pb_kits/playbook/pb_fixed_confirmation_toast/docs/_fixed_confirmation_toast_auto_close.html.erb +0 -58
- data/app/pb_kits/playbook/pb_fixed_confirmation_toast/docs/_fixed_confirmation_toast_auto_close_rails.md +0 -3
- data/app/pb_kits/playbook/pb_link/docs/_link_target.html.erb +0 -15
- data/app/pb_kits/playbook/pb_link/docs/_link_target.jsx +0 -29
- data/app/pb_kits/playbook/pb_user/docs/_user_light_weight.html.erb +0 -42
- data/app/pb_kits/playbook/pb_user/docs/_user_light_weight.jsx +0 -59
- data/app/pb_kits/playbook/pb_user/docs/_user_light_weight.md +0 -2
- data/dist/chunks/_weekday_stacked-CtSzPEH0.js +0 -45
- /data/app/pb_kits/playbook/pb_fixed_confirmation_toast/docs/{_fixed_confirmation_toast_auto_close_react.md → _fixed_confirmation_toast_auto_close.md} +0 -0
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: 14.12.0.pre.alpha.
|
4
|
+
version: 14.12.0.pre.alpha.PLAY1602lightboxoverlapnitrobugzindextoken5751
|
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: 2025-
|
12
|
+
date: 2025-01-30 00:00:00.000000000 Z
|
13
13
|
dependencies:
|
14
14
|
- !ruby/object:Gem::Dependency
|
15
15
|
name: actionpack
|
@@ -265,7 +265,6 @@ files:
|
|
265
265
|
- app/pb_kits/playbook/pb_advanced_table/README.md
|
266
266
|
- app/pb_kits/playbook/pb_advanced_table/SubKits/TableBody.tsx
|
267
267
|
- app/pb_kits/playbook/pb_advanced_table/SubKits/TableHeader.tsx
|
268
|
-
- app/pb_kits/playbook/pb_advanced_table/Utilities/ActionBarAnimationHelper.ts
|
269
268
|
- app/pb_kits/playbook/pb_advanced_table/Utilities/BrowserCheck.tsx
|
270
269
|
- app/pb_kits/playbook/pb_advanced_table/Utilities/ExpansionControlHelpers.tsx
|
271
270
|
- app/pb_kits/playbook/pb_advanced_table/Utilities/IconHelpers.tsx
|
@@ -801,17 +800,12 @@ files:
|
|
801
800
|
- app/pb_kits/playbook/pb_contact/docs/index.js
|
802
801
|
- app/pb_kits/playbook/pb_copy_button/_copy_button.scss
|
803
802
|
- app/pb_kits/playbook/pb_copy_button/_copy_button.tsx
|
804
|
-
- app/pb_kits/playbook/pb_copy_button/copy_button.html.erb
|
805
|
-
- app/pb_kits/playbook/pb_copy_button/copy_button.rb
|
806
803
|
- app/pb_kits/playbook/pb_copy_button/copy_button.test.jsx
|
807
|
-
- app/pb_kits/playbook/pb_copy_button/docs/_copy_button_default.html.erb
|
808
804
|
- app/pb_kits/playbook/pb_copy_button/docs/_copy_button_default.jsx
|
809
|
-
- app/pb_kits/playbook/pb_copy_button/docs/_copy_button_from.html.erb
|
810
805
|
- app/pb_kits/playbook/pb_copy_button/docs/_copy_button_from.jsx
|
811
806
|
- app/pb_kits/playbook/pb_copy_button/docs/_copy_button_from.md
|
812
807
|
- app/pb_kits/playbook/pb_copy_button/docs/example.yml
|
813
808
|
- app/pb_kits/playbook/pb_copy_button/docs/index.js
|
814
|
-
- app/pb_kits/playbook/pb_copy_button/index.js
|
815
809
|
- app/pb_kits/playbook/pb_currency/_currency.scss
|
816
810
|
- app/pb_kits/playbook/pb_currency/_currency.tsx
|
817
811
|
- app/pb_kits/playbook/pb_currency/currency.html.erb
|
@@ -1349,10 +1343,8 @@ files:
|
|
1349
1343
|
- app/pb_kits/playbook/pb_fixed_confirmation_toast/_fixed_confirmation_toast.scss
|
1350
1344
|
- app/pb_kits/playbook/pb_fixed_confirmation_toast/_fixed_confirmation_toast.tsx
|
1351
1345
|
- app/pb_kits/playbook/pb_fixed_confirmation_toast/docs/_description.md
|
1352
|
-
- app/pb_kits/playbook/pb_fixed_confirmation_toast/docs/_fixed_confirmation_toast_auto_close.html.erb
|
1353
1346
|
- app/pb_kits/playbook/pb_fixed_confirmation_toast/docs/_fixed_confirmation_toast_auto_close.jsx
|
1354
|
-
- app/pb_kits/playbook/pb_fixed_confirmation_toast/docs/
|
1355
|
-
- app/pb_kits/playbook/pb_fixed_confirmation_toast/docs/_fixed_confirmation_toast_auto_close_react.md
|
1347
|
+
- app/pb_kits/playbook/pb_fixed_confirmation_toast/docs/_fixed_confirmation_toast_auto_close.md
|
1356
1348
|
- app/pb_kits/playbook/pb_fixed_confirmation_toast/docs/_fixed_confirmation_toast_children.html.erb
|
1357
1349
|
- app/pb_kits/playbook/pb_fixed_confirmation_toast/docs/_fixed_confirmation_toast_children.jsx
|
1358
1350
|
- app/pb_kits/playbook/pb_fixed_confirmation_toast/docs/_fixed_confirmation_toast_children.md
|
@@ -1844,8 +1836,6 @@ files:
|
|
1844
1836
|
- app/pb_kits/playbook/pb_link/docs/_link_icon.jsx
|
1845
1837
|
- app/pb_kits/playbook/pb_link/docs/_link_tag.html.erb
|
1846
1838
|
- app/pb_kits/playbook/pb_link/docs/_link_tag.jsx
|
1847
|
-
- app/pb_kits/playbook/pb_link/docs/_link_target.html.erb
|
1848
|
-
- app/pb_kits/playbook/pb_link/docs/_link_target.jsx
|
1849
1839
|
- app/pb_kits/playbook/pb_link/docs/_link_underline.html.erb
|
1850
1840
|
- app/pb_kits/playbook/pb_link/docs/_link_underline.jsx
|
1851
1841
|
- app/pb_kits/playbook/pb_link/docs/example.yml
|
@@ -3164,9 +3154,6 @@ files:
|
|
3164
3154
|
- app/pb_kits/playbook/pb_user/docs/_user_default.html.erb
|
3165
3155
|
- app/pb_kits/playbook/pb_user/docs/_user_default.jsx
|
3166
3156
|
- app/pb_kits/playbook/pb_user/docs/_user_horizontal_swift.md
|
3167
|
-
- app/pb_kits/playbook/pb_user/docs/_user_light_weight.html.erb
|
3168
|
-
- app/pb_kits/playbook/pb_user/docs/_user_light_weight.jsx
|
3169
|
-
- app/pb_kits/playbook/pb_user/docs/_user_light_weight.md
|
3170
3157
|
- app/pb_kits/playbook/pb_user/docs/_user_presence_indicator_swift.md
|
3171
3158
|
- app/pb_kits/playbook/pb_user/docs/_user_props_table.md
|
3172
3159
|
- app/pb_kits/playbook/pb_user/docs/_user_size.html.erb
|
@@ -3322,11 +3309,11 @@ files:
|
|
3322
3309
|
- app/pb_kits/playbook/utilities/test/globalProps/truncate.test.js
|
3323
3310
|
- app/pb_kits/playbook/utilities/text.ts
|
3324
3311
|
- app/pb_kits/playbook/utilities/validEmojiChecker.ts
|
3325
|
-
- dist/chunks/_typeahead-
|
3326
|
-
- dist/chunks/_weekday_stacked-
|
3312
|
+
- dist/chunks/_typeahead-BIhRQo8Q.js
|
3313
|
+
- dist/chunks/_weekday_stacked-VKMYuo6-.js
|
3327
3314
|
- dist/chunks/lazysizes-B7xYodB-.js
|
3328
|
-
- dist/chunks/lib-
|
3329
|
-
- dist/chunks/pb_form_validation-
|
3315
|
+
- dist/chunks/lib-kMuhBuU7.js
|
3316
|
+
- dist/chunks/pb_form_validation-DBJ0wZuS.js
|
3330
3317
|
- dist/chunks/vendor.js
|
3331
3318
|
- dist/menu.yml
|
3332
3319
|
- dist/playbook-doc.js
|
@@ -1,26 +0,0 @@
|
|
1
|
-
export const showActionBar = (elem: HTMLElement) => {
|
2
|
-
elem.style.display = "block";
|
3
|
-
const height = elem.scrollHeight + "px";
|
4
|
-
elem.style.height = height;
|
5
|
-
elem.classList.add("is-visible");
|
6
|
-
elem.style.overflow = "hidden";
|
7
|
-
|
8
|
-
window.setTimeout(() => {
|
9
|
-
if (elem.classList.contains("is-visible")) {
|
10
|
-
elem.style.height = "";
|
11
|
-
elem.style.overflow = "visible";
|
12
|
-
}
|
13
|
-
}, 300);
|
14
|
-
};
|
15
|
-
|
16
|
-
export const hideActionBar = (elem: HTMLElement) => {
|
17
|
-
elem.style.height = elem.scrollHeight + "px";
|
18
|
-
elem.offsetHeight;
|
19
|
-
window.setTimeout(() => {
|
20
|
-
elem.style.height = "0";
|
21
|
-
elem.style.overflow = "hidden";
|
22
|
-
}, 10);
|
23
|
-
window.setTimeout(() => {
|
24
|
-
elem.classList.remove("is-visible");
|
25
|
-
}, 300);
|
26
|
-
};
|
@@ -1,15 +0,0 @@
|
|
1
|
-
<%= pb_content_tag do %>
|
2
|
-
<%= pb_rails("button", props: { icon: "copy" }) do %>
|
3
|
-
<%= object.text %>
|
4
|
-
<% end %>
|
5
|
-
<% if object.id %>
|
6
|
-
<%= pb_rails("tooltip", props: {
|
7
|
-
trigger_element_selector: "##{object.id}",
|
8
|
-
position: object.tooltip_position,
|
9
|
-
tooltip_id: "#{object.id}_tooltip",
|
10
|
-
trigger_method: "click"
|
11
|
-
}) do %>
|
12
|
-
<%= object.tooltip_text %>
|
13
|
-
<% end %>
|
14
|
-
<% end %>
|
15
|
-
<% end %>
|
@@ -1,28 +0,0 @@
|
|
1
|
-
# frozen_string_literal: true
|
2
|
-
|
3
|
-
module Playbook
|
4
|
-
module PbCopyButton
|
5
|
-
class CopyButton < ::Playbook::KitBase
|
6
|
-
prop :text
|
7
|
-
prop :tooltip_position,
|
8
|
-
type: Playbook::Props::Enum,
|
9
|
-
values: %w[top right bottom left],
|
10
|
-
default: "top"
|
11
|
-
prop :tooltip_text, type: Playbook::Props::String,
|
12
|
-
default: "Copied!"
|
13
|
-
prop :value
|
14
|
-
prop :from
|
15
|
-
|
16
|
-
def classname
|
17
|
-
generate_classname("pb_copy_button_kit")
|
18
|
-
end
|
19
|
-
|
20
|
-
def data
|
21
|
-
Hash(values[:data]).merge(
|
22
|
-
"copy-value": value,
|
23
|
-
"from": from
|
24
|
-
)
|
25
|
-
end
|
26
|
-
end
|
27
|
-
end
|
28
|
-
end
|
@@ -1,2 +0,0 @@
|
|
1
|
-
<%= pb_rails("copy_button", props: { id: "default-copy-button", text: "Copy Text", value: "Playbook makes it easy to support bleeding edge, or legacy systems. Use Playbook’s 200+ components and end-to-end design language to create simple, intuitive and beautiful experiences with ease." } ) %>
|
2
|
-
<%= pb_rails("textarea", props: { margin_top: "xs", placeholder: "Copy and paste here" }) %>
|
@@ -1,5 +0,0 @@
|
|
1
|
-
<%= pb_rails("body", props: { id: "body", text: "Copy this body text!"}) %>
|
2
|
-
<%= pb_rails("copy_button", props: { text: "Copy Body text", from: "body", id: "copy-body-button" }) %>
|
3
|
-
<%= pb_rails("text_input", props: { margin_top: "xs", placeholder: "Copy and paste here" }) %>
|
4
|
-
<%= pb_rails("copy_button", props: { text: "Copy Text Input", from: "copy-input", id: "copy-input-button" }) %>
|
5
|
-
<%= pb_rails("text_input", props: { margin_top: "xs", id: "copy-input" , value: "Copy and paste here" }) %>
|
@@ -1,47 +0,0 @@
|
|
1
|
-
import PbEnhancedElement from "../pb_enhanced_element"
|
2
|
-
|
3
|
-
export default class PbCopyButton extends PbEnhancedElement {
|
4
|
-
static get selector() {
|
5
|
-
return '.pb_copy_button_kit'
|
6
|
-
}
|
7
|
-
|
8
|
-
connect() {
|
9
|
-
this.handleClick = this.handleClick.bind(this)
|
10
|
-
this.button = this.element.querySelector('button')
|
11
|
-
if (this.button) {
|
12
|
-
this.button.addEventListener('click', this.handleClick)
|
13
|
-
}
|
14
|
-
}
|
15
|
-
|
16
|
-
disconnect() {
|
17
|
-
if (this.button) {
|
18
|
-
this.button.removeEventListener('click', this.handleClick)
|
19
|
-
}
|
20
|
-
}
|
21
|
-
|
22
|
-
handleClick() {
|
23
|
-
const fromId = this.element.getAttribute('data-from')
|
24
|
-
if (fromId) {
|
25
|
-
const fromElement = document.querySelector(`#${fromId}`)
|
26
|
-
if (fromElement) {
|
27
|
-
let contentToCopy = ''
|
28
|
-
if (fromElement.tagName.toLowerCase() === 'input') {
|
29
|
-
contentToCopy = fromElement.value
|
30
|
-
} else {
|
31
|
-
contentToCopy = fromElement.innerText
|
32
|
-
}
|
33
|
-
navigator.clipboard.writeText(contentToCopy)
|
34
|
-
.catch(err => console.error('Failed to copy text', err))
|
35
|
-
return
|
36
|
-
}
|
37
|
-
}
|
38
|
-
|
39
|
-
const textToCopy = this.element.getAttribute('data-copy-value')
|
40
|
-
if (textToCopy) {
|
41
|
-
navigator.clipboard.writeText(textToCopy)
|
42
|
-
.catch(err => console.error('Failed to copy text', err))
|
43
|
-
} else {
|
44
|
-
console.warn('No data-copy-value attribute found or data-from element')
|
45
|
-
}
|
46
|
-
}
|
47
|
-
}
|
@@ -1,58 +0,0 @@
|
|
1
|
-
<%= pb_rails("button", props: { text: "Show Auto Close Toast", variant: "secondary", data: { toast: "#toast-auto-close" } }) %>
|
2
|
-
<%= pb_rails("button", props: { text: "Show Closeable Auto Close Toast", variant: "secondary", data: { toast: "#toast-auto-close-closeable" } }) %>
|
3
|
-
|
4
|
-
<%= pb_rails("fixed_confirmation_toast", props: {
|
5
|
-
auto_close: 3000,
|
6
|
-
classname: "toast-to-hide",
|
7
|
-
id: "toast-auto-close",
|
8
|
-
text: "I will disappear in 3 seconds.",
|
9
|
-
status: "tip",
|
10
|
-
vertical: "top",
|
11
|
-
horizontal: "center"
|
12
|
-
}) %>
|
13
|
-
|
14
|
-
<%= pb_rails("fixed_confirmation_toast", props: {
|
15
|
-
auto_close: 10000,
|
16
|
-
closeable: true,
|
17
|
-
id: "toast-auto-close-closeable",
|
18
|
-
text: "I will disappear in 10 seconds.",
|
19
|
-
status: "tip",
|
20
|
-
vertical: "top",
|
21
|
-
horizontal: "center"
|
22
|
-
}) %>
|
23
|
-
|
24
|
-
<script>
|
25
|
-
document.addEventListener('DOMContentLoaded', () => {
|
26
|
-
// Initialize toast elements and buttons
|
27
|
-
const toasts = {
|
28
|
-
'#toast-auto-close': document.querySelector("#toast-auto-close"),
|
29
|
-
'#toast-auto-close-closeable': document.querySelector("#toast-auto-close-closeable")
|
30
|
-
}
|
31
|
-
|
32
|
-
const buttons = {
|
33
|
-
'#toast-auto-close': document.querySelector("button[data-toast='#toast-auto-close']"),
|
34
|
-
'#toast-auto-close-closeable': document.querySelector("button[data-toast='#toast-auto-close-closeable']")
|
35
|
-
}
|
36
|
-
|
37
|
-
// Store original toasts and remove them from DOM
|
38
|
-
const originalToasts = {}
|
39
|
-
Object.entries(toasts).forEach(([id, toast]) => {
|
40
|
-
if (toast) {
|
41
|
-
originalToasts[id] = toast.cloneNode(true)
|
42
|
-
toast.remove()
|
43
|
-
}
|
44
|
-
})
|
45
|
-
|
46
|
-
// Set up button click handlers
|
47
|
-
Object.keys(buttons).forEach((toastId) => {
|
48
|
-
const button = buttons[toastId]
|
49
|
-
if (button) {
|
50
|
-
button.onclick = () => {
|
51
|
-
const newToast = originalToasts[toastId].cloneNode(true)
|
52
|
-
newToast.style.display = "flex"
|
53
|
-
document.body.appendChild(newToast)
|
54
|
-
}
|
55
|
-
}
|
56
|
-
})
|
57
|
-
})
|
58
|
-
</script>
|
@@ -1,3 +0,0 @@
|
|
1
|
-
Auto close is used when you want the confirmation toast to close automatically after a certain time. `auto_close` property will be a delay number in ms.
|
2
|
-
|
3
|
-
The script tag in this code snippet is for demonstration purposes only. It clones the toasts in order to have it appear with a button click prompt and not upon initial page load. In a typical production environment the event triggering a fixed confirmation toast to appear would be handled by a controller or a separate javascript file.
|
@@ -1,15 +0,0 @@
|
|
1
|
-
<div>
|
2
|
-
<%= pb_rails("link", props: {
|
3
|
-
href: "http://google.com",
|
4
|
-
target: "blank",
|
5
|
-
text: "Open In New Window"
|
6
|
-
}) %>
|
7
|
-
</div>
|
8
|
-
|
9
|
-
<div>
|
10
|
-
<%= pb_rails("link", props: {
|
11
|
-
href: "https://playbook.powerapp.cloud/",
|
12
|
-
target: "child",
|
13
|
-
text: "Open In Child Tab",
|
14
|
-
}) %>
|
15
|
-
</div>
|
@@ -1,29 +0,0 @@
|
|
1
|
-
import React from 'react'
|
2
|
-
import { Link } from 'playbook-ui'
|
3
|
-
|
4
|
-
const LinkTarget = (props) => (
|
5
|
-
<div>
|
6
|
-
<div>
|
7
|
-
<Link
|
8
|
-
aria={{ label: 'Link to Google in new window' }}
|
9
|
-
href="https://google.com"
|
10
|
-
tabIndex={0}
|
11
|
-
target='blank'
|
12
|
-
text="Open In New Window"
|
13
|
-
{...props}
|
14
|
-
/>
|
15
|
-
</div>
|
16
|
-
<div>
|
17
|
-
<Link
|
18
|
-
aria={{ label: 'Link to Playbook in a child tab' }}
|
19
|
-
href="https://playbook.powerapp.cloud/"
|
20
|
-
tabIndex={0}
|
21
|
-
target='child'
|
22
|
-
text="Open In Child Tab"
|
23
|
-
{...props}
|
24
|
-
/>
|
25
|
-
</div>
|
26
|
-
</div>
|
27
|
-
)
|
28
|
-
|
29
|
-
export default LinkTarget
|
@@ -1,42 +0,0 @@
|
|
1
|
-
<div class="pb--doc-demo-row">
|
2
|
-
<div>
|
3
|
-
<%= pb_rails("user", props: {
|
4
|
-
name: "Anna Black",
|
5
|
-
title: "Remodeling Consultant",
|
6
|
-
orientation: "vertical",
|
7
|
-
align: "center",
|
8
|
-
size: "lg",
|
9
|
-
avatar_url: "https://randomuser.me/api/portraits/women/44.jpg",
|
10
|
-
bold: false
|
11
|
-
}) %>
|
12
|
-
</div>
|
13
|
-
<div>
|
14
|
-
<%= pb_rails("user", props: {
|
15
|
-
name: "Anna Black",
|
16
|
-
title: "Remodeling Consultant",
|
17
|
-
orientation: "horizontal",
|
18
|
-
align: "left",
|
19
|
-
avatar_url: "https://randomuser.me/api/portraits/women/44.jpg",
|
20
|
-
bold: false
|
21
|
-
}) %>
|
22
|
-
</div>
|
23
|
-
<div>
|
24
|
-
<%= pb_rails("user", props: {
|
25
|
-
name: "Anna Black",
|
26
|
-
orientation: "horizontal",
|
27
|
-
align: "left",
|
28
|
-
avatar_url: "https://randomuser.me/api/portraits/women/44.jpg",
|
29
|
-
bold: false
|
30
|
-
}) %>
|
31
|
-
|
32
|
-
<br>
|
33
|
-
|
34
|
-
<%= pb_rails("user", props: {
|
35
|
-
name: "Anna Black",
|
36
|
-
orientation: "horizontal",
|
37
|
-
align: "left",
|
38
|
-
avatar: true,
|
39
|
-
bold: false
|
40
|
-
}) %>
|
41
|
-
</div>
|
42
|
-
</div>
|
@@ -1,59 +0,0 @@
|
|
1
|
-
import React from 'react'
|
2
|
-
import { User } from 'playbook-ui'
|
3
|
-
|
4
|
-
const UserLightWeight = (props) => {
|
5
|
-
return (
|
6
|
-
<div className="pb--doc-demo-row">
|
7
|
-
|
8
|
-
<div>
|
9
|
-
<User
|
10
|
-
align="center"
|
11
|
-
avatarUrl="https://randomuser.me/api/portraits/women/44.jpg"
|
12
|
-
bold={false}
|
13
|
-
name="Anna Black"
|
14
|
-
orientation="vertical"
|
15
|
-
size="lg"
|
16
|
-
title="Remodeling Consultant"
|
17
|
-
{...props}
|
18
|
-
/>
|
19
|
-
</div>
|
20
|
-
|
21
|
-
<div>
|
22
|
-
<User
|
23
|
-
align="left"
|
24
|
-
avatarUrl="https://randomuser.me/api/portraits/women/44.jpg"
|
25
|
-
bold={false}
|
26
|
-
name="Anna Black"
|
27
|
-
orientation="horizontal"
|
28
|
-
title="Remodeling Consultant"
|
29
|
-
{...props}
|
30
|
-
/>
|
31
|
-
</div>
|
32
|
-
|
33
|
-
<div>
|
34
|
-
<User
|
35
|
-
align="left"
|
36
|
-
avatarUrl="https://randomuser.me/api/portraits/women/44.jpg"
|
37
|
-
bold={false}
|
38
|
-
name="Anna Black"
|
39
|
-
orientation="horizontal"
|
40
|
-
{...props}
|
41
|
-
/>
|
42
|
-
|
43
|
-
<br />
|
44
|
-
|
45
|
-
<User
|
46
|
-
align="left"
|
47
|
-
avatar
|
48
|
-
bold={false}
|
49
|
-
name="Anna Black"
|
50
|
-
orientation="horizontal"
|
51
|
-
{...props}
|
52
|
-
/>
|
53
|
-
</div>
|
54
|
-
|
55
|
-
</div>
|
56
|
-
)
|
57
|
-
}
|
58
|
-
|
59
|
-
export default UserLightWeight
|