playbook_ui_docs 15.5.0.pre.alpha.play260612706 → 15.5.0.pre.alpha.testingdialog12768
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_background/docs/_background_light.html.erb +1 -1
- data/app/pb_kits/playbook/pb_background/docs/_background_light.jsx +1 -0
- data/app/pb_kits/playbook/pb_background/docs/example.yml +2 -2
- data/app/pb_kits/playbook/pb_home_address_street/docs/_home_address_street_default.html.erb +1 -1
- data/app/pb_kits/playbook/pb_multiple_users/docs/_multiple_users_with_tooltip.jsx +42 -0
- data/app/pb_kits/playbook/pb_multiple_users/docs/_multiple_users_with_tooltip.md +1 -0
- data/app/pb_kits/playbook/pb_multiple_users/docs/example.yml +1 -0
- data/app/pb_kits/playbook/pb_multiple_users/docs/index.js +1 -0
- data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_input_display.html.erb +30 -0
- data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_input_display.jsx +37 -0
- data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_input_display.md +3 -0
- data/app/pb_kits/playbook/pb_typeahead/docs/example.yml +2 -0
- data/app/pb_kits/playbook/pb_typeahead/docs/index.js +2 -1
- metadata +7 -3
- data/app/pb_kits/playbook/pb_background/docs/_background_light.md +0 -1
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: 4600d9fd55ee7592b848edc582dece5cfcb7b4f4ef0f057f911d6da1a550b00d
|
|
4
|
+
data.tar.gz: 1543976778d17e0fd487f28bb3825aa7a2e9d2c08968cfbf1dbf2ab803d85e84
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 0be7568569a8b24212d21dc1ffec8f0e815cacfe220387e4672b00b8074f6a09bc68143e9a9fa3f5dc8520442d6ba5ea782f05a29a1a863a0570670c9ebbbf8c
|
|
7
|
+
data.tar.gz: 34b9a2786529f7f5f406517f0c7b4d34660e80b0b67f1ce0a9a7c9fb08417daacb19dcd9774b40974fc1d3821eccf2837c828ad6ea962b8d4d56fb7e28104871
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
examples:
|
|
2
2
|
|
|
3
3
|
rails:
|
|
4
|
-
- background_light:
|
|
4
|
+
- background_light: Light
|
|
5
5
|
- background_white: White
|
|
6
6
|
- background_gradient: Gradient
|
|
7
7
|
- background_image: Image
|
|
@@ -11,7 +11,7 @@ examples:
|
|
|
11
11
|
- background_size: Size
|
|
12
12
|
|
|
13
13
|
react:
|
|
14
|
-
- background_light:
|
|
14
|
+
- background_light: Light
|
|
15
15
|
- background_white: White
|
|
16
16
|
- background_gradient: Gradient
|
|
17
17
|
- background_image: Image
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
import React from 'react'
|
|
2
|
+
import MultipleUsers from '../../pb_multiple_users/_multiple_users'
|
|
3
|
+
|
|
4
|
+
const MultipleUsersWithTooltip = (props) => {
|
|
5
|
+
return (
|
|
6
|
+
<div>
|
|
7
|
+
<MultipleUsers
|
|
8
|
+
users={[
|
|
9
|
+
{
|
|
10
|
+
name: 'Patrick Welch',
|
|
11
|
+
imageUrl: 'https://randomuser.me/api/portraits/men/9.jpg',
|
|
12
|
+
tooltip: "Patrick Welch - Online"
|
|
13
|
+
},
|
|
14
|
+
{
|
|
15
|
+
name: 'Lucille Sanchez',
|
|
16
|
+
imageUrl: 'https://randomuser.me/api/portraits/women/6.jpg',
|
|
17
|
+
tooltip: "Lucille Sanchez - Offline"
|
|
18
|
+
},
|
|
19
|
+
{
|
|
20
|
+
name: 'Beverly Reyes',
|
|
21
|
+
imageUrl: 'https://randomuser.me/api/portraits/women/74.jpg',
|
|
22
|
+
tooltip: "Beverly Reyes - Online"
|
|
23
|
+
},
|
|
24
|
+
{
|
|
25
|
+
name: 'Keith Craig',
|
|
26
|
+
imageUrl: 'https://randomuser.me/api/portraits/men/40.jpg',
|
|
27
|
+
tooltip: "Keith Craig - Away"
|
|
28
|
+
},
|
|
29
|
+
{
|
|
30
|
+
name: 'Alicia Cooper',
|
|
31
|
+
imageUrl: 'https://randomuser.me/api/portraits/women/46.jpg',
|
|
32
|
+
tooltip: "Alicia Cooper - Busy"
|
|
33
|
+
},
|
|
34
|
+
]}
|
|
35
|
+
withTooltip
|
|
36
|
+
{...props}
|
|
37
|
+
/>
|
|
38
|
+
</div>
|
|
39
|
+
)
|
|
40
|
+
}
|
|
41
|
+
``
|
|
42
|
+
export default MultipleUsersWithTooltip
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
Use the `withTooltip` boolean prop to enable setting user-specific tooltip content via the `tooltip` property in the users array.
|
|
@@ -1,3 +1,4 @@
|
|
|
1
1
|
export { default as MultipleUsersDefault } from './_multiple_users_default.jsx'
|
|
2
2
|
export { default as MultipleUsersReverse } from './_multiple_users_reverse.jsx'
|
|
3
3
|
export { default as MultipleUsersSize } from './_multiple_users_size.jsx'
|
|
4
|
+
export { default as MultipleUsersWithTooltip } from './_multiple_users_with_tooltip.jsx'
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
<%
|
|
2
|
+
options = [
|
|
3
|
+
{ label: 'Orange', value: '#FFA500' },
|
|
4
|
+
{ label: 'Red', value: '#FF0000' },
|
|
5
|
+
{ label: 'Green', value: '#00FF00' },
|
|
6
|
+
{ label: 'Blue', value: '#0000FF' },
|
|
7
|
+
{ label: 'Yellow', value: '#FFFF00' },
|
|
8
|
+
{ label: 'Purple', value: '#800080' },
|
|
9
|
+
{ label: 'Cyan', value: '#00FFFF' },
|
|
10
|
+
{ label: 'Magenta', value: '#FF00FF' }
|
|
11
|
+
]
|
|
12
|
+
%>
|
|
13
|
+
|
|
14
|
+
<%= pb_rails("typeahead", props: {
|
|
15
|
+
id: "typeahead-input-display-none",
|
|
16
|
+
label: "With Input Display None",
|
|
17
|
+
options: options,
|
|
18
|
+
name: :foo,
|
|
19
|
+
input_display: "none",
|
|
20
|
+
})
|
|
21
|
+
%>
|
|
22
|
+
<br/>
|
|
23
|
+
<%= pb_rails("typeahead", props: {
|
|
24
|
+
id: "typeahead-input-display-pills",
|
|
25
|
+
label: "With Input Display Pills (Default)",
|
|
26
|
+
options: options,
|
|
27
|
+
name: :foo,
|
|
28
|
+
pills: true,
|
|
29
|
+
})
|
|
30
|
+
%>
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
import React from 'react'
|
|
2
|
+
|
|
3
|
+
import Typeahead from '../_typeahead'
|
|
4
|
+
|
|
5
|
+
const options = [
|
|
6
|
+
{ label: 'Orange', value: '#FFA500' },
|
|
7
|
+
{ label: 'Red', value: '#FF0000' },
|
|
8
|
+
{ label: 'Green', value: '#00FF00' },
|
|
9
|
+
{ label: 'Blue', value: '#0000FF' },
|
|
10
|
+
{ label: 'Yellow', value: '#FFFF00' },
|
|
11
|
+
{ label: 'Purple', value: '#800080' },
|
|
12
|
+
{ label: 'Cyan', value: '#00FFFF' },
|
|
13
|
+
{ label: 'Magenta', value: '#FF00FF' }
|
|
14
|
+
]
|
|
15
|
+
|
|
16
|
+
const TypeaheadInputDisplay = (props) => {
|
|
17
|
+
return (
|
|
18
|
+
<>
|
|
19
|
+
<Typeahead
|
|
20
|
+
inputDisplay="none"
|
|
21
|
+
isMulti
|
|
22
|
+
label="With Input Display None"
|
|
23
|
+
options={options}
|
|
24
|
+
{...props}
|
|
25
|
+
/>
|
|
26
|
+
<br/>
|
|
27
|
+
<Typeahead
|
|
28
|
+
isMulti
|
|
29
|
+
label="With Input Display Pills (Default)"
|
|
30
|
+
options={options}
|
|
31
|
+
{...props}
|
|
32
|
+
/>
|
|
33
|
+
</>
|
|
34
|
+
)
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
export default TypeaheadInputDisplay
|
|
@@ -5,6 +5,7 @@ examples:
|
|
|
5
5
|
- typeahead_default_options: With Default Options
|
|
6
6
|
- typeahead_with_context: With Context
|
|
7
7
|
- typeahead_with_pills: With Pills
|
|
8
|
+
- typeahead_input_display: Input Display
|
|
8
9
|
- typeahead_without_pills: Without Pills (Single Select)
|
|
9
10
|
- typeahead_with_pills_async: With Pills (Async Data)
|
|
10
11
|
- typeahead_with_pills_async_users: With Pills (Async Data w/ Users)
|
|
@@ -26,6 +27,7 @@ examples:
|
|
|
26
27
|
- typeahead_react_hook: React Hook
|
|
27
28
|
- typeahead_with_highlight: With Highlight
|
|
28
29
|
- typeahead_with_pills: With Pills
|
|
30
|
+
- typeahead_input_display: Input Display
|
|
29
31
|
- typeahead_with_pills_async: With Pills (Async Data)
|
|
30
32
|
- typeahead_with_pills_async_users: With Pills (Async Data w/ Users)
|
|
31
33
|
- typeahead_with_pills_async_custom_options: With Pills (Async Data w/ Custom Options)
|
|
@@ -17,4 +17,5 @@ export { default as TypeaheadReactHook } from './_typeahead_react_hook.jsx'
|
|
|
17
17
|
export { default as TypeaheadDisabled } from './_typeahead_disabled.jsx'
|
|
18
18
|
export { default as TypeaheadPreserveInput } from './_typeahead_preserve_input.jsx'
|
|
19
19
|
export { default as TypeaheadDefaultValue } from './_typeahead_default_value.jsx'
|
|
20
|
-
export { default as TypeaheadCustomOptions } from './_typeahead_custom_options.jsx'
|
|
20
|
+
export { default as TypeaheadCustomOptions } from './_typeahead_custom_options.jsx'
|
|
21
|
+
export { default as TypeaheadInputDisplay } from './_typeahead_input_display.jsx'
|
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: 15.5.0.pre.alpha.
|
|
4
|
+
version: 15.5.0.pre.alpha.testingdialog12768
|
|
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-
|
|
12
|
+
date: 2025-12-03 00:00:00.000000000 Z
|
|
13
13
|
dependencies:
|
|
14
14
|
- !ruby/object:Gem::Dependency
|
|
15
15
|
name: playbook_ui
|
|
@@ -220,7 +220,6 @@ files:
|
|
|
220
220
|
- app/pb_kits/playbook/pb_background/docs/_background_image.md
|
|
221
221
|
- app/pb_kits/playbook/pb_background/docs/_background_light.html.erb
|
|
222
222
|
- app/pb_kits/playbook/pb_background/docs/_background_light.jsx
|
|
223
|
-
- app/pb_kits/playbook/pb_background/docs/_background_light.md
|
|
224
223
|
- app/pb_kits/playbook/pb_background/docs/_background_overlay.jsx
|
|
225
224
|
- app/pb_kits/playbook/pb_background/docs/_background_overlay.md
|
|
226
225
|
- app/pb_kits/playbook/pb_background/docs/_background_size.html.erb
|
|
@@ -1527,6 +1526,8 @@ files:
|
|
|
1527
1526
|
- app/pb_kits/playbook/pb_multiple_users/docs/_multiple_users_size.jsx
|
|
1528
1527
|
- app/pb_kits/playbook/pb_multiple_users/docs/_multiple_users_size.md
|
|
1529
1528
|
- app/pb_kits/playbook/pb_multiple_users/docs/_multiple_users_size_swift.md
|
|
1529
|
+
- app/pb_kits/playbook/pb_multiple_users/docs/_multiple_users_with_tooltip.jsx
|
|
1530
|
+
- app/pb_kits/playbook/pb_multiple_users/docs/_multiple_users_with_tooltip.md
|
|
1530
1531
|
- app/pb_kits/playbook/pb_multiple_users/docs/example.yml
|
|
1531
1532
|
- app/pb_kits/playbook/pb_multiple_users/docs/index.js
|
|
1532
1533
|
- app/pb_kits/playbook/pb_multiple_users_stacked/docs/_description.md
|
|
@@ -2577,6 +2578,9 @@ files:
|
|
|
2577
2578
|
- app/pb_kits/playbook/pb_typeahead/docs/_typeahead_error_state.md
|
|
2578
2579
|
- app/pb_kits/playbook/pb_typeahead/docs/_typeahead_inline.html.erb
|
|
2579
2580
|
- app/pb_kits/playbook/pb_typeahead/docs/_typeahead_inline.jsx
|
|
2581
|
+
- app/pb_kits/playbook/pb_typeahead/docs/_typeahead_input_display.html.erb
|
|
2582
|
+
- app/pb_kits/playbook/pb_typeahead/docs/_typeahead_input_display.jsx
|
|
2583
|
+
- app/pb_kits/playbook/pb_typeahead/docs/_typeahead_input_display.md
|
|
2580
2584
|
- app/pb_kits/playbook/pb_typeahead/docs/_typeahead_margin_bottom.html.erb
|
|
2581
2585
|
- app/pb_kits/playbook/pb_typeahead/docs/_typeahead_margin_bottom.jsx
|
|
2582
2586
|
- app/pb_kits/playbook/pb_typeahead/docs/_typeahead_multi_kit.html.erb
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
By default, the Background kit sets background color to 'light' as seen here.
|