playbook_ui 12.23.0.pre.alpha.play698responsivespacingglobalprop703 → 12.24.0.pre.alpha.play833boldoptionfortitle2and3717
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_avatar/docs/_avatar_swift.md +1 -0
- data/app/pb_kits/playbook/pb_avatar/docs/example.yml +2 -0
- data/app/pb_kits/playbook/pb_card/_card.tsx +1 -0
- data/app/pb_kits/playbook/pb_docs/kit_example.html.erb +6 -1
- data/app/pb_kits/playbook/pb_docs/kit_example.rb +13 -2
- data/app/pb_kits/playbook/pb_title/_title.scss +2 -0
- data/app/pb_kits/playbook/pb_title/_title.tsx +2 -1
- data/app/pb_kits/playbook/pb_title/docs/_title_default.html.erb +1 -1
- data/app/pb_kits/playbook/pb_title/docs/_title_light_weight.html.erb +1 -0
- data/app/pb_kits/playbook/pb_title/docs/_title_light_weight.jsx +11 -6
- data/app/pb_kits/playbook/pb_title/docs/_title_light_weight.md +2 -2
- data/app/pb_kits/playbook/pb_title/title.rb +8 -1
- data/app/pb_kits/playbook/pb_title/title.test.js +2 -2
- data/lib/playbook/pb_doc_helper.rb +4 -1
- data/lib/playbook/version.rb +2 -2
- metadata +3 -2
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: e94d873152c1cc2e61164252945bf8886d4f8d78f9f7171d88c2c1122fd2a773
|
4
|
+
data.tar.gz: 5ef03ff135408bcfa5ad9a487be278bbbb2d96030c0da367a85ed4446c76ea30
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 68709ae639291c9b472725adfef76aeac599bdf467ebd4a113a7933f4d6a7d4d3a234cf8eff64eaa8b7fcbaf6fb9efb25992a0f99e2b6de05d515753604fd1d5
|
7
|
+
data.tar.gz: 73908e6af09435d622d57a90a211da2d7e353fbb94ec6490f41650ebe8032a1fe233068e6baf2e4687fe04d45f4020516eadd0e45375f86f9d47fb2094fc949e
|
@@ -0,0 +1 @@
|
|
1
|
+
![image for avatar](https://images.unsplash.com/photo-1684237276530-a562fa8338b1?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=580&q=80)
|
@@ -7,7 +7,12 @@
|
|
7
7
|
<%= example %>
|
8
8
|
<br>
|
9
9
|
</div>
|
10
|
-
|
10
|
+
|
11
|
+
<% if (action_name == "kit_show_swift") %>
|
12
|
+
<div class="pb--kit-example-markdown pt_none <%= dark ? "dark" : "" %>">
|
13
|
+
<%= render_markdown(description) %>
|
14
|
+
</div>
|
15
|
+
<% end %>
|
11
16
|
<% if show_code %>
|
12
17
|
<div class="markdown pb--kit-example-markdown <%= dark ? "dark" : "" %>">
|
13
18
|
<%= render_markdown(description) %>
|
@@ -11,7 +11,7 @@ module Playbook
|
|
11
11
|
prop :example_title, type: Playbook::Props::String, required: true
|
12
12
|
prop :example_key, type: Playbook::Props::String, required: true
|
13
13
|
prop :show_code, type: Playbook::Props::Boolean, default: true
|
14
|
-
prop :type, type: Playbook::Props::Enum, values: %w[rails react], default: "rails"
|
14
|
+
prop :type, type: Playbook::Props::Enum, values: %w[rails react swift], default: "rails"
|
15
15
|
prop :dark, type: Playbook::Props::Boolean, default: false
|
16
16
|
|
17
17
|
def example
|
@@ -19,6 +19,9 @@ module Playbook
|
|
19
19
|
render inline: source
|
20
20
|
elsif type == "react"
|
21
21
|
react_component example_key.camelize, { dark: dark }
|
22
|
+
elsif type == "swift"
|
23
|
+
## render the markdown file
|
24
|
+
render inline: source
|
22
25
|
end
|
23
26
|
end
|
24
27
|
|
@@ -32,7 +35,11 @@ module Playbook
|
|
32
35
|
|
33
36
|
def source
|
34
37
|
@source ||= begin
|
35
|
-
extension = type == "
|
38
|
+
extension = if type == "rails"
|
39
|
+
"html.erb"
|
40
|
+
else
|
41
|
+
type == "swift" ? "swift" : "jsx"
|
42
|
+
end
|
36
43
|
stringified_code = read_kit_file("docs", "_#{example_key}.#{extension}")
|
37
44
|
sanitize_code(stringified_code)
|
38
45
|
end
|
@@ -42,6 +49,10 @@ module Playbook
|
|
42
49
|
read_kit_file("", "_#{example_key}.tsx")
|
43
50
|
end
|
44
51
|
|
52
|
+
def swift_source
|
53
|
+
read_kit_file("", "_#{example_key}.swift")
|
54
|
+
end
|
55
|
+
|
45
56
|
private
|
46
57
|
|
47
58
|
def sanitize_code(stringified_code)
|
@@ -21,13 +21,13 @@ const Title = (props: TitleProps): React.ReactElement => {
|
|
21
21
|
if (props.variant) deprecatedProps('Title', ['variant']) //variant prop is deprecated, use color instead
|
22
22
|
const {
|
23
23
|
aria = {},
|
24
|
-
bold = true,
|
25
24
|
children,
|
26
25
|
className,
|
27
26
|
color,
|
28
27
|
data = {},
|
29
28
|
id,
|
30
29
|
size = 3,
|
30
|
+
bold = size === 3 ? false : true,
|
31
31
|
tag = 'h3',
|
32
32
|
text,
|
33
33
|
variant = null,
|
@@ -35,6 +35,7 @@ const Title = (props: TitleProps): React.ReactElement => {
|
|
35
35
|
|
36
36
|
const ariaProps: {[key: string]: string | number} = buildAriaProps(aria)
|
37
37
|
const dataProps: {[key: string]: string | number} = buildDataProps(data)
|
38
|
+
|
38
39
|
const getBold = bold ? '' : 'thin'
|
39
40
|
const classes = classnames(
|
40
41
|
buildCss('pb_title_kit', `size_${size}`, variant, color, getBold),
|
@@ -7,5 +7,5 @@
|
|
7
7
|
|
8
8
|
<%= pb_rails("title", props: { text: "Title 1", tag: "h1", size: 1 }) %>
|
9
9
|
<%= pb_rails("title", props: { text: "Title 2", tag: "h2", size: 2 }) %>
|
10
|
-
<%= pb_rails("title", props: { text: "Title 3", tag: "h3", size: 3 }) %>
|
10
|
+
<%= pb_rails("title", props: { text: "Title 3", tag: "h3", size: 3, color: "success"}) %>
|
11
11
|
<%= pb_rails("title", props: { text: "Title 4", tag: "h4", size: 4 }) %>
|
@@ -1,15 +1,20 @@
|
|
1
|
-
import React from
|
1
|
+
import React from "react"
|
2
2
|
|
3
|
-
import Title from
|
3
|
+
import Title from "../_title"
|
4
4
|
|
5
5
|
const TitleLightWeight = (props) => {
|
6
6
|
return (
|
7
7
|
<div>
|
8
|
-
<Title
|
9
|
-
bold={false}
|
8
|
+
<Title bold={false}
|
10
9
|
size={1}
|
11
|
-
tag=
|
12
|
-
text=
|
10
|
+
tag='h1'
|
11
|
+
text='Title 1'
|
12
|
+
{...props}
|
13
|
+
/>
|
14
|
+
<Title bold={false}
|
15
|
+
size={2}
|
16
|
+
tag='h2'
|
17
|
+
text='Title 2'
|
13
18
|
{...props}
|
14
19
|
/>
|
15
20
|
</div>
|
@@ -1,4 +1,4 @@
|
|
1
1
|
##### Prop
|
2
|
-
Title `size 1` will use `font-weight: 700` by default, if you want a lighter font weight, use the `bold` prop set to `false`.
|
3
|
-
Title `size
|
2
|
+
Title `size 1` & `size 2` will use `font-weight: 700` by default, if you want a lighter font weight, use the `bold` prop set to `false`.
|
3
|
+
Title `size 3` uses a light font weight by default and will not accept a bold font weight.
|
4
4
|
Title `size 4` uses a heavy font weight by default and will not accept a lighter font weight.
|
@@ -17,7 +17,14 @@ module Playbook
|
|
17
17
|
values: [nil, "link"],
|
18
18
|
default: nil,
|
19
19
|
deprecated: true
|
20
|
-
|
20
|
+
|
21
|
+
def initialize(props)
|
22
|
+
props[:bold] = [1, 2, 4].include?(props[:size]) unless props.key?(:bold)
|
23
|
+
props[:bold] = false if props[:size].nil? && !props.key?(:bold)
|
24
|
+
super(props)
|
25
|
+
end
|
26
|
+
|
27
|
+
prop :bold, type: Playbook::Props::Boolean
|
21
28
|
|
22
29
|
def classname
|
23
30
|
generate_classname("pb_title_kit", size, variant, color, is_bold)
|
@@ -12,7 +12,7 @@ test('returns namespaced class name', () => {
|
|
12
12
|
)
|
13
13
|
|
14
14
|
const kit = screen.getByTestId('primary-test')
|
15
|
-
expect(kit).toHaveClass('
|
15
|
+
expect(kit).toHaveClass('pb_title_kit_size_3_thin')
|
16
16
|
})
|
17
17
|
|
18
18
|
test('with thin font weight', () => {
|
@@ -38,5 +38,5 @@ test('with colors', () => {
|
|
38
38
|
)
|
39
39
|
|
40
40
|
const kit = screen.getByTestId('primary-test')
|
41
|
-
expect(kit).toHaveClass('
|
41
|
+
expect(kit).toHaveClass('pb_title_kit_size_3_success_thin')
|
42
42
|
})
|
@@ -84,8 +84,11 @@ module Playbook
|
|
84
84
|
def pb_doc_render_clickable_title(kit, type)
|
85
85
|
url = "#"
|
86
86
|
begin
|
87
|
-
url =
|
87
|
+
url = case type
|
88
|
+
when "react"
|
88
89
|
kit_show_reacts_path(kit)
|
90
|
+
when "swift"
|
91
|
+
kit_show_swift_path(kit)
|
89
92
|
else
|
90
93
|
kit_show_path(kit)
|
91
94
|
end
|
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: 12.
|
4
|
+
version: 12.24.0.pre.alpha.play833boldoptionfortitle2and3717
|
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: 2023-05-
|
12
|
+
date: 2023-05-30 00:00:00.000000000 Z
|
13
13
|
dependencies:
|
14
14
|
- !ruby/object:Gem::Dependency
|
15
15
|
name: actionpack
|
@@ -311,6 +311,7 @@ files:
|
|
311
311
|
- app/pb_kits/playbook/pb_avatar/docs/_avatar_status.html.erb
|
312
312
|
- app/pb_kits/playbook/pb_avatar/docs/_avatar_status.jsx
|
313
313
|
- app/pb_kits/playbook/pb_avatar/docs/_avatar_status.md
|
314
|
+
- app/pb_kits/playbook/pb_avatar/docs/_avatar_swift.md
|
314
315
|
- app/pb_kits/playbook/pb_avatar/docs/_description.md
|
315
316
|
- app/pb_kits/playbook/pb_avatar/docs/_footer.md
|
316
317
|
- app/pb_kits/playbook/pb_avatar/docs/example.yml
|