playbook_ui_docs 14.6.2.pre.alpha.PLAY15814384 → 14.7.0.pre.rc.0
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_currency/docs/example.yml +1 -3
- data/app/pb_kits/playbook/pb_currency/docs/index.js +0 -1
- data/app/pb_kits/playbook/pb_form_pill/docs/_form_pill_truncated_text.html.erb +1 -24
- data/app/pb_kits/playbook/pb_form_pill/docs/_form_pill_truncated_text.jsx +2 -25
- data/app/pb_kits/playbook/pb_form_pill/docs/_form_pill_truncated_text.md +1 -0
- data/app/pb_kits/playbook/pb_timeline/docs/example.yml +1 -2
- data/app/pb_kits/playbook/pb_timeline/docs/index.js +0 -1
- data/dist/playbook-doc.js +1 -1
- metadata +3 -22
- data/app/pb_kits/playbook/pb_currency/docs/_currency_comma_separator.html.erb +0 -7
- data/app/pb_kits/playbook/pb_currency/docs/_currency_comma_separator.jsx +0 -18
- data/app/pb_kits/playbook/pb_currency/docs/_currency_comma_separator.md +0 -3
- data/app/pb_kits/playbook/pb_form_pill/docs/_form_pill_truncated_text_rails.md +0 -3
- data/app/pb_kits/playbook/pb_form_pill/docs/_form_pill_truncated_text_react.md +0 -1
- data/app/pb_kits/playbook/pb_link/docs/_link_color.html.erb +0 -30
- data/app/pb_kits/playbook/pb_link/docs/_link_color.jsx +0 -40
- data/app/pb_kits/playbook/pb_link/docs/_link_disabled.html.erb +0 -5
- data/app/pb_kits/playbook/pb_link/docs/_link_disabled.jsx +0 -15
- data/app/pb_kits/playbook/pb_link/docs/_link_icon.html.erb +0 -15
- data/app/pb_kits/playbook/pb_link/docs/_link_icon.jsx +0 -25
- data/app/pb_kits/playbook/pb_link/docs/_link_tag.html.erb +0 -35
- data/app/pb_kits/playbook/pb_link/docs/_link_tag.jsx +0 -45
- data/app/pb_kits/playbook/pb_link/docs/_link_underline.html.erb +0 -5
- data/app/pb_kits/playbook/pb_link/docs/_link_underline.jsx +0 -15
- data/app/pb_kits/playbook/pb_link/docs/example.yml +0 -16
- data/app/pb_kits/playbook/pb_link/docs/index.js +0 -5
- data/app/pb_kits/playbook/pb_timeline/docs/_timeline_with_children.html.erb +0 -43
- data/app/pb_kits/playbook/pb_timeline/docs/_timeline_with_children.jsx +0 -68
- data/app/pb_kits/playbook/pb_timeline/docs/_timeline_with_children.md +0 -2
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: 14.
|
4
|
+
version: 14.7.0.pre.rc.0
|
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: 2024-
|
12
|
+
date: 2024-10-23 00:00:00.000000000 Z
|
13
13
|
dependencies:
|
14
14
|
- !ruby/object:Gem::Dependency
|
15
15
|
name: playbook_ui
|
@@ -409,9 +409,6 @@ files:
|
|
409
409
|
- app/pb_kits/playbook/pb_currency/docs/_currency_alignment.html.erb
|
410
410
|
- app/pb_kits/playbook/pb_currency/docs/_currency_alignment.jsx
|
411
411
|
- app/pb_kits/playbook/pb_currency/docs/_currency_alignment_swift.md
|
412
|
-
- app/pb_kits/playbook/pb_currency/docs/_currency_comma_separator.html.erb
|
413
|
-
- app/pb_kits/playbook/pb_currency/docs/_currency_comma_separator.jsx
|
414
|
-
- app/pb_kits/playbook/pb_currency/docs/_currency_comma_separator.md
|
415
412
|
- app/pb_kits/playbook/pb_currency/docs/_currency_matching_decimals.html.erb
|
416
413
|
- app/pb_kits/playbook/pb_currency/docs/_currency_matching_decimals.jsx
|
417
414
|
- app/pb_kits/playbook/pb_currency/docs/_currency_no_symbol.html.erb
|
@@ -856,8 +853,7 @@ files:
|
|
856
853
|
- app/pb_kits/playbook/pb_form_pill/docs/_form_pill_tag.jsx
|
857
854
|
- app/pb_kits/playbook/pb_form_pill/docs/_form_pill_truncated_text.html.erb
|
858
855
|
- app/pb_kits/playbook/pb_form_pill/docs/_form_pill_truncated_text.jsx
|
859
|
-
- app/pb_kits/playbook/pb_form_pill/docs/
|
860
|
-
- app/pb_kits/playbook/pb_form_pill/docs/_form_pill_truncated_text_react.md
|
856
|
+
- app/pb_kits/playbook/pb_form_pill/docs/_form_pill_truncated_text.md
|
861
857
|
- app/pb_kits/playbook/pb_form_pill/docs/_form_pill_user.html.erb
|
862
858
|
- app/pb_kits/playbook/pb_form_pill/docs/_form_pill_user.jsx
|
863
859
|
- app/pb_kits/playbook/pb_form_pill/docs/example.yml
|
@@ -1103,18 +1099,6 @@ files:
|
|
1103
1099
|
- app/pb_kits/playbook/pb_line_graph/docs/_line_graph_legend_position.md
|
1104
1100
|
- app/pb_kits/playbook/pb_line_graph/docs/example.yml
|
1105
1101
|
- app/pb_kits/playbook/pb_line_graph/docs/index.js
|
1106
|
-
- app/pb_kits/playbook/pb_link/docs/_link_color.html.erb
|
1107
|
-
- app/pb_kits/playbook/pb_link/docs/_link_color.jsx
|
1108
|
-
- app/pb_kits/playbook/pb_link/docs/_link_disabled.html.erb
|
1109
|
-
- app/pb_kits/playbook/pb_link/docs/_link_disabled.jsx
|
1110
|
-
- app/pb_kits/playbook/pb_link/docs/_link_icon.html.erb
|
1111
|
-
- app/pb_kits/playbook/pb_link/docs/_link_icon.jsx
|
1112
|
-
- app/pb_kits/playbook/pb_link/docs/_link_tag.html.erb
|
1113
|
-
- app/pb_kits/playbook/pb_link/docs/_link_tag.jsx
|
1114
|
-
- app/pb_kits/playbook/pb_link/docs/_link_underline.html.erb
|
1115
|
-
- app/pb_kits/playbook/pb_link/docs/_link_underline.jsx
|
1116
|
-
- app/pb_kits/playbook/pb_link/docs/example.yml
|
1117
|
-
- app/pb_kits/playbook/pb_link/docs/index.js
|
1118
1102
|
- app/pb_kits/playbook/pb_list/docs/_description.md
|
1119
1103
|
- app/pb_kits/playbook/pb_list/docs/_list_borderless.html.erb
|
1120
1104
|
- app/pb_kits/playbook/pb_list/docs/_list_borderless.jsx
|
@@ -1814,9 +1798,6 @@ files:
|
|
1814
1798
|
- app/pb_kits/playbook/pb_timeline/docs/_timeline_default.jsx
|
1815
1799
|
- app/pb_kits/playbook/pb_timeline/docs/_timeline_vertical.html.erb
|
1816
1800
|
- app/pb_kits/playbook/pb_timeline/docs/_timeline_vertical.jsx
|
1817
|
-
- app/pb_kits/playbook/pb_timeline/docs/_timeline_with_children.html.erb
|
1818
|
-
- app/pb_kits/playbook/pb_timeline/docs/_timeline_with_children.jsx
|
1819
|
-
- app/pb_kits/playbook/pb_timeline/docs/_timeline_with_children.md
|
1820
1801
|
- app/pb_kits/playbook/pb_timeline/docs/_timeline_with_date.html.erb
|
1821
1802
|
- app/pb_kits/playbook/pb_timeline/docs/_timeline_with_date.jsx
|
1822
1803
|
- app/pb_kits/playbook/pb_timeline/docs/_timeline_with_date.md
|
@@ -1,18 +0,0 @@
|
|
1
|
-
import React from "react"
|
2
|
-
|
3
|
-
import Currency from "../_currency"
|
4
|
-
|
5
|
-
const CurrencyCommaSeparator = (props) => {
|
6
|
-
return (
|
7
|
-
<Currency
|
8
|
-
amount='1234567.89'
|
9
|
-
commaSeparator
|
10
|
-
decimals="matching"
|
11
|
-
emphasized={false}
|
12
|
-
size="lg"
|
13
|
-
{...props}
|
14
|
-
/>
|
15
|
-
)
|
16
|
-
}
|
17
|
-
|
18
|
-
export default CurrencyCommaSeparator
|
@@ -1,3 +0,0 @@
|
|
1
|
-
For Form Pills with longer text, the truncate global prop can be used to truncate the label within each Form Pill. See [here](https://playbook.powerapp.cloud/visual_guidelines/truncate) for more information on the truncate global prop.
|
2
|
-
|
3
|
-
__NOTE__: For Rails Form Pills (not ones embedded within a React-rendered Typeahead or MultiLevelSelect), a unique `id` is required to enable the Tooltip functionality displaying the text or tag section of the Form Pill.
|
@@ -1 +0,0 @@
|
|
1
|
-
For Form Pills with longer text, the `truncate` global prop can be used to truncate the label within each Form Pill. Hover over the truncated Form Pill and a Tooltip containing the text or tag section of the Form Pill will appear. See [here](https://playbook.powerapp.cloud/visual_guidelines/truncate) for more information on the truncate global prop.
|
@@ -1,30 +0,0 @@
|
|
1
|
-
<div>
|
2
|
-
<%= pb_rails("link", props: {
|
3
|
-
text: "link example",
|
4
|
-
href: "https://www.google.com/search?q=playbook+design+system",
|
5
|
-
}) %>
|
6
|
-
</div>
|
7
|
-
|
8
|
-
<div>
|
9
|
-
<%= pb_rails("link", props: {
|
10
|
-
text: "link example",
|
11
|
-
href: "https://www.youtube.com/@PowerHRG",
|
12
|
-
color: "body",
|
13
|
-
}) %>
|
14
|
-
</div>
|
15
|
-
|
16
|
-
<div>
|
17
|
-
<%= pb_rails("link", props: {
|
18
|
-
text: "link example",
|
19
|
-
href: "https://github.com/powerhome/.github/blob/main/profile/README.md",
|
20
|
-
color: "muted",
|
21
|
-
}) %>
|
22
|
-
</div>
|
23
|
-
|
24
|
-
<div>
|
25
|
-
<%= pb_rails("link", props: {
|
26
|
-
text: "link example",
|
27
|
-
href: "https://rubygems.org/gems/playbook_ui/",
|
28
|
-
color: "destructive",
|
29
|
-
}) %>
|
30
|
-
</div>
|
@@ -1,40 +0,0 @@
|
|
1
|
-
import React from 'react'
|
2
|
-
import { Link } from 'playbook-ui'
|
3
|
-
|
4
|
-
const LinkColor = (props) => (
|
5
|
-
<div>
|
6
|
-
<div>
|
7
|
-
<Link
|
8
|
-
href="https://www.google.com/search?q=playbook+design+system"
|
9
|
-
text="link example"
|
10
|
-
{...props}
|
11
|
-
/>
|
12
|
-
</div>
|
13
|
-
<div>
|
14
|
-
<Link
|
15
|
-
color="body"
|
16
|
-
href="https://www.youtube.com/@PowerHRG"
|
17
|
-
text="link example"
|
18
|
-
{...props}
|
19
|
-
/>
|
20
|
-
</div>
|
21
|
-
<div>
|
22
|
-
<Link
|
23
|
-
color="muted"
|
24
|
-
href="https://github.com/powerhome/.github/blob/main/profile/README.md"
|
25
|
-
text="link example"
|
26
|
-
{...props}
|
27
|
-
/>
|
28
|
-
</div>
|
29
|
-
<div>
|
30
|
-
<Link
|
31
|
-
color="destructive"
|
32
|
-
href="https://rubygems.org/gems/playbook_ui/"
|
33
|
-
text="link example"
|
34
|
-
{...props}
|
35
|
-
/>
|
36
|
-
</div>
|
37
|
-
</div>
|
38
|
-
)
|
39
|
-
|
40
|
-
export default LinkColor
|
@@ -1,15 +0,0 @@
|
|
1
|
-
<div>
|
2
|
-
<%= pb_rails("link", props: {
|
3
|
-
text: "link example",
|
4
|
-
href: "#icon",
|
5
|
-
icon: "arrow-up-right-from-square",
|
6
|
-
}) %>
|
7
|
-
</div>
|
8
|
-
|
9
|
-
<div>
|
10
|
-
<%= pb_rails("link", props: {
|
11
|
-
text: "link example",
|
12
|
-
href: "#icon2",
|
13
|
-
icon_right: "chevron-right",
|
14
|
-
}) %>
|
15
|
-
</div>
|
@@ -1,25 +0,0 @@
|
|
1
|
-
import React from 'react'
|
2
|
-
import { Link } from 'playbook-ui'
|
3
|
-
|
4
|
-
const LinkIcon = (props) => (
|
5
|
-
<div>
|
6
|
-
<div>
|
7
|
-
<Link
|
8
|
-
href="#icon"
|
9
|
-
icon="arrow-up-right-from-square"
|
10
|
-
text="link example"
|
11
|
-
{...props}
|
12
|
-
/>
|
13
|
-
</div>
|
14
|
-
<div>
|
15
|
-
<Link
|
16
|
-
href="#icon2"
|
17
|
-
iconRight="chevron-right"
|
18
|
-
text="link example"
|
19
|
-
{...props}
|
20
|
-
/>
|
21
|
-
</div>
|
22
|
-
</div>
|
23
|
-
)
|
24
|
-
|
25
|
-
export default LinkIcon
|
@@ -1,35 +0,0 @@
|
|
1
|
-
<%= pb_rails("link", props: {
|
2
|
-
text: "h1 link example",
|
3
|
-
href: "#tag",
|
4
|
-
icon: "arrow-up-right-from-square",
|
5
|
-
tag: "h1",
|
6
|
-
}) %>
|
7
|
-
|
8
|
-
<%= pb_rails("link", props: {
|
9
|
-
text: "h3 link example",
|
10
|
-
href: "#tag2",
|
11
|
-
tag: "h3",
|
12
|
-
underline: true,
|
13
|
-
}) %>
|
14
|
-
|
15
|
-
<%= pb_rails("link", props: {
|
16
|
-
color: "destructive",
|
17
|
-
text: "h6 link example",
|
18
|
-
href: "#tag3",
|
19
|
-
tag: "h6",
|
20
|
-
}) %>
|
21
|
-
|
22
|
-
<%= pb_rails("link", props: {
|
23
|
-
text: "p link example",
|
24
|
-
href: "#tag4",
|
25
|
-
icon_right: "chevron-right",
|
26
|
-
tag: "p",
|
27
|
-
}) %>
|
28
|
-
|
29
|
-
<div>
|
30
|
-
This is a <%= pb_rails("link", props: {
|
31
|
-
text: "span link example",
|
32
|
-
href: "#tag5",
|
33
|
-
tag: "span",
|
34
|
-
}) %>
|
35
|
-
</div>
|
@@ -1,45 +0,0 @@
|
|
1
|
-
import React from 'react'
|
2
|
-
import { Link } from 'playbook-ui'
|
3
|
-
|
4
|
-
const LinkTag = (props) => (
|
5
|
-
<div>
|
6
|
-
<Link
|
7
|
-
href="#tag"
|
8
|
-
icon="arrow-up-right-from-square"
|
9
|
-
tag="h1"
|
10
|
-
text="h1 link example"
|
11
|
-
{...props}
|
12
|
-
/>
|
13
|
-
<Link
|
14
|
-
href="#tag2"
|
15
|
-
tag="h3"
|
16
|
-
text="h3 link example"
|
17
|
-
underline
|
18
|
-
{...props}
|
19
|
-
/>
|
20
|
-
<Link
|
21
|
-
color="destructive"
|
22
|
-
href="#tag3"
|
23
|
-
tag="h6"
|
24
|
-
text="h6 link example"
|
25
|
-
{...props}
|
26
|
-
/>
|
27
|
-
<Link
|
28
|
-
href="#tag4"
|
29
|
-
iconRight="chevron-right"
|
30
|
-
tag="p"
|
31
|
-
text="p link example"
|
32
|
-
{...props}
|
33
|
-
/>
|
34
|
-
<div>
|
35
|
-
This is a <Link
|
36
|
-
href="#tag5"
|
37
|
-
tag="span"
|
38
|
-
text="span link example"
|
39
|
-
{...props}
|
40
|
-
/>
|
41
|
-
</div>
|
42
|
-
</div>
|
43
|
-
)
|
44
|
-
|
45
|
-
export default LinkTag
|
@@ -1,16 +0,0 @@
|
|
1
|
-
examples:
|
2
|
-
|
3
|
-
rails:
|
4
|
-
- link_color: Color
|
5
|
-
- link_underline: Underline
|
6
|
-
- link_icon: Icon
|
7
|
-
- link_disabled: Disabled
|
8
|
-
- link_tag: Tag
|
9
|
-
|
10
|
-
|
11
|
-
react:
|
12
|
-
- link_color: Color
|
13
|
-
- link_underline: Underline
|
14
|
-
- link_icon: Icon
|
15
|
-
- link_disabled: Disabled
|
16
|
-
- link_tag: Tag
|
@@ -1,5 +0,0 @@
|
|
1
|
-
export { default as LinkColor } from './_link_color.jsx'
|
2
|
-
export { default as LinkUnderline } from './_link_underline.jsx'
|
3
|
-
export { default as LinkIcon } from './_link_icon.jsx'
|
4
|
-
export { default as LinkDisabled } from './_link_disabled.jsx'
|
5
|
-
export { default as LinkTag } from './_link_tag.jsx'
|
@@ -1,43 +0,0 @@
|
|
1
|
-
<%= pb_rails("timeline", props: {orientation: "horizontal", show_date: true}) do %>
|
2
|
-
<%= pb_rails("timeline/item", props: { line_style: "solid"}) do |item| %>
|
3
|
-
|
4
|
-
<% item.label do %>
|
5
|
-
<%= pb_rails("timeline/label") do %>
|
6
|
-
<%= pb_rails("title", props: { text: "Any Kit Here", size: 2 }) %>
|
7
|
-
<% end %>
|
8
|
-
<% end %>
|
9
|
-
|
10
|
-
<% item.step do %>
|
11
|
-
<%= pb_rails("timeline/step", props: { icon: 'check', icon_color: 'teal' }) %>
|
12
|
-
<% end %>
|
13
|
-
|
14
|
-
<% item.detail do %>
|
15
|
-
<%= pb_rails("title_detail", props: {
|
16
|
-
title: "Jackson Heights",
|
17
|
-
detail: "37-27 74th Street"
|
18
|
-
}) %>
|
19
|
-
<% end %>
|
20
|
-
<% end %>
|
21
|
-
<%= pb_rails("timeline/item", props: { line_style: "dotted"}) do |item| %>
|
22
|
-
|
23
|
-
<% item.step do %>
|
24
|
-
<%= pb_rails("timeline/step") do %>
|
25
|
-
<%= pb_rails("pill", props: { text: "Any Kit" , variant: "success" }) %>
|
26
|
-
<% end %>
|
27
|
-
<% end %>
|
28
|
-
|
29
|
-
<% item.detail do %>
|
30
|
-
<%= pb_rails("title_detail", props: {
|
31
|
-
title: "Greenpoint",
|
32
|
-
detail: "81 Gate St Brooklyn"
|
33
|
-
}) %>
|
34
|
-
<% end %>
|
35
|
-
<% end %>
|
36
|
-
|
37
|
-
<%= pb_rails("timeline/item", props: {icon: "map-marker-alt", icon_color: "purple", date: Date.today+1 }) do |item| %>
|
38
|
-
<%= pb_rails("title_detail", props: {
|
39
|
-
title: "Society Hill",
|
40
|
-
detail: "72 E St Astoria"
|
41
|
-
}) %>
|
42
|
-
<% end %>
|
43
|
-
<% end %>
|
@@ -1,68 +0,0 @@
|
|
1
|
-
import React from 'react'
|
2
|
-
|
3
|
-
import Timeline from '../_timeline'
|
4
|
-
import Title from '../../pb_title/_title'
|
5
|
-
import Pill from '../../pb_pill/_pill'
|
6
|
-
|
7
|
-
import TitleDetail from '../../pb_title_detail/_title_detail'
|
8
|
-
|
9
|
-
const TimelineWithChildren = (props) => (
|
10
|
-
<div>
|
11
|
-
<Timeline orientation="horizontal"
|
12
|
-
showDate
|
13
|
-
{...props}
|
14
|
-
>
|
15
|
-
<Timeline.Item lineStyle="solid"
|
16
|
-
{...props}
|
17
|
-
>
|
18
|
-
<Timeline.Label>
|
19
|
-
<Title size={2}
|
20
|
-
text='Any Kit Here'
|
21
|
-
/>
|
22
|
-
</Timeline.Label>
|
23
|
-
<Timeline.Step icon="user"
|
24
|
-
iconColor="royal"
|
25
|
-
/>
|
26
|
-
<Timeline.Detail>
|
27
|
-
<TitleDetail detail="37-27 74th Street"
|
28
|
-
title="Jackson Heights"
|
29
|
-
{...props}
|
30
|
-
/>
|
31
|
-
</Timeline.Detail>
|
32
|
-
</Timeline.Item>
|
33
|
-
|
34
|
-
<Timeline.Item lineStyle="dotted"
|
35
|
-
{...props}
|
36
|
-
>
|
37
|
-
<Timeline.Step>
|
38
|
-
<Pill text="Any Kit"
|
39
|
-
variant="success"
|
40
|
-
/>
|
41
|
-
</Timeline.Step>
|
42
|
-
<Timeline.Detail>
|
43
|
-
<TitleDetail detail="81 Gate St Brooklyn"
|
44
|
-
title="Greenpoint"
|
45
|
-
{...props}
|
46
|
-
/>
|
47
|
-
</Timeline.Detail>
|
48
|
-
</Timeline.Item>
|
49
|
-
|
50
|
-
<Timeline.Item lineStyle="solid"
|
51
|
-
{...props}
|
52
|
-
>
|
53
|
-
<Timeline.Label date={new Date(new Date().setDate(new Date().getDate() + 1))} />
|
54
|
-
<Timeline.Step icon="map-marker-alt"
|
55
|
-
iconColor="purple"
|
56
|
-
/>
|
57
|
-
<Timeline.Detail>
|
58
|
-
<TitleDetail detail="72 E St Astoria"
|
59
|
-
title="Society Hill"
|
60
|
-
{...props}
|
61
|
-
/>
|
62
|
-
</Timeline.Detail>
|
63
|
-
</Timeline.Item>
|
64
|
-
</Timeline>
|
65
|
-
</div>
|
66
|
-
)
|
67
|
-
|
68
|
-
export default TimelineWithChildren
|