playbook_ui 11.6.0 → 11.7.0.pre.alpha.pre.guagechart1

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.
Files changed (11) hide show
  1. checksums.yaml +4 -4
  2. data/app/pb_kits/playbook/pb_gauge/docs/_gauge_complex.html.erb +32 -0
  3. data/app/pb_kits/playbook/pb_gauge/docs/_gauge_complex.jsx +101 -0
  4. data/app/pb_kits/playbook/pb_gauge/docs/_gauge_complex.md +1 -0
  5. data/app/pb_kits/playbook/pb_gauge/docs/_gauge_sizing.html.erb +2 -1
  6. data/app/pb_kits/playbook/pb_gauge/docs/_gauge_sizing.jsx +2 -0
  7. data/app/pb_kits/playbook/pb_gauge/docs/example.yml +2 -0
  8. data/app/pb_kits/playbook/pb_gauge/docs/index.js +1 -0
  9. data/app/pb_kits/playbook/plugins/pb_chart.js +5 -0
  10. data/lib/playbook/version.rb +2 -2
  11. metadata +7 -4
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: 8aef1eda410390ce74bde2dd7060436279bd3b373d825d7ece15d7c8ae9f5c21
4
- data.tar.gz: 3b9437069af2f2bd018a6a8787146f519182f77591f6f929eb990181c30e0014
3
+ metadata.gz: b3c15ebbe9a1fbfc39421f5a48270f09e9992eb440be598fd6913e9e24ed9afd
4
+ data.tar.gz: 813c6e5d1511ffc6a343afb19670c1ade1466802b2ac1d5447537f771861f3fd
5
5
  SHA512:
6
- metadata.gz: 158c3aae011b0c696d20fe669fb2bcc22e85712e2db09a48dac48a3c8372b0a586423fcfe3172441f550a1d5a511032c2a97363456410625d5b859eb9db379f9
7
- data.tar.gz: 84aec8b09e55179e3ab03d30b95820bfc2209118cae8b9f0a465fa26cabaa957aa7177d813d0e46f57cd9aa42de601eb16e14f500983f66fffcea276f639da33
6
+ metadata.gz: 10c3cae3f5fb56ee7cf2f4c3f663902c9af9d9126aae1da0901b5a26fb8f1612dc404cf352d2f2ba4cfe09c3f91eab740c566581d99773cc5de38cc72c772d2a
7
+ data.tar.gz: bfad6320a42c988dfec679e35737390a16e09be1b5b07cf0aa7617e452c971b1f63539a60c62e592e08695c081787c05885cd1150c04e6c950099ca24749700f
data/app/pb_kits/playbook/pb_gauge/docs/_gauge_complex.html.erb ADDED
@@ -0,0 +1,32 @@
1
+ <%= pb_rails("flex", props: {wrap: true, padding: "xl", gap: "sm"}) do %>
2
+ <%= pb_rails("flex/flex_item", props: {flex: 1, grow: true }) do %>
3
+ <%= pb_rails("card", props: {max_width: "xs", padding: "md", }) do %>
4
+ <%= pb_rails("title", props: {padding_bottom: "sm", size: 4, text: "Abandoned Calls" })%>
5
+ <%= pb_rails("flex", props: {align: "stretch"}) do %>
6
+ <%= pb_rails("flex", props: {margin_right: "sm", orientation: "column"}) do %>
7
+ <%= pb_rails("body", props: {color: "light", padding_bottom: "sm",text: "Total Abandoned"}) %>
8
+ <%= pb_rails("flex", props: {align: "baseline", padding_bottom: "sx"}) do %>
9
+ <%= pb_rails("title", props: {size: 1, text: "39"})%>
10
+ <%= pb_rails("title", props: {color: "light", size: 3, text: "calls"}) %>
11
+ <% end %>
12
+ <%= pb_rails("caption", props: {size: "xs", text: "of 390" }) %>
13
+ <%end %>
14
+ <%= pb_rails("section_separator", props: {align_self: "stretch", margin_right: "sm", orientation: "vertical" }) %>
15
+ <%= pb_rails("flex", props: {orientation: "column", wrap: true}) do %>
16
+ <%= pb_rails("body", props: {color: "light", text: "% Abandoned"}) %>
17
+ <%= pb_rails("flex", props: {wrap: true}) do %>
18
+ <%= pb_rails("flex/flex_item", props: {fixed_size: "150px", overflow: "hidden", shrink: true}) do %>
19
+ <%= pb_rails("gauge", props: {
20
+ chart_data: [{ name: "Name", value: 10 }],
21
+ disable_animation: true,
22
+ height: '100%',
23
+ id: "gauge-complex",
24
+ suffix: "%"
25
+ }) %>
26
+ <% end %>
27
+ <% end %>
28
+ <% end %>
29
+ <%end %>
30
+ <% end %>
31
+ <% end %>
32
+ <% end %>
data/app/pb_kits/playbook/pb_gauge/docs/_gauge_complex.jsx ADDED
@@ -0,0 +1,101 @@
1
+ import React from "react";
2
+ import {
3
+ Title,
4
+ Card,
5
+ Gauge,
6
+ Flex,
7
+ FlexItem,
8
+ SectionSeparator,
9
+ Body,
10
+ Caption,
11
+ } from "../..";
12
+
13
+ const data = [{ name: "Name", value: 10 }];
14
+
15
+ const GaugeComplex = (props) => (
16
+ <Flex
17
+ gap="sm"
18
+ padding="xl"
19
+ wrap
20
+ >
21
+ <FlexItem
22
+ flex={1}
23
+ grow
24
+ >
25
+ <Card
26
+ maxWidth="xs"
27
+ padding="md"
28
+ >
29
+ <Title
30
+ paddingBottom="sm"
31
+ size={4}
32
+ text="Abandoned Calls"
33
+ />
34
+ <Flex align="stretch">
35
+ <Flex
36
+ marginRight="sm"
37
+ orientation="column"
38
+ >
39
+ <Body
40
+ color="light"
41
+ paddingBottom="sm"
42
+ text="Total Abandoned"
43
+ />
44
+ <Flex
45
+ align="baseline"
46
+ paddingBottom="xs"
47
+ >
48
+ <Title
49
+ size={1}
50
+ text="39"
51
+ />
52
+ <Title
53
+ color="light"
54
+ size={3}
55
+ text="calls"
56
+ />
57
+ </Flex>
58
+ <Caption
59
+ size="xs"
60
+ text="of 390"
61
+ />
62
+ </Flex>
63
+
64
+ <SectionSeparator
65
+ alignSelf="stretch"
66
+ marginRight="sm"
67
+ orientation="vertical"
68
+ />
69
+
70
+ <Flex
71
+ orientation="column"
72
+ wrap
73
+ >
74
+ <Body
75
+ color="light"
76
+ text="% Abandoned"
77
+ />
78
+ <Flex wrap>
79
+ <FlexItem
80
+ fixedSize="150px"
81
+ overflow="hidden"
82
+ shrink
83
+ >
84
+ <Gauge
85
+ chartData={data}
86
+ disableAnimation
87
+ height="100%"
88
+ id="gauge-complex"
89
+ suffix="%"
90
+ {...props}
91
+ />
92
+ </FlexItem>
93
+ </Flex>
94
+ </Flex>
95
+ </Flex>
96
+ </Card>
97
+ </FlexItem>
98
+ </Flex>
99
+ );
100
+
101
+ export default GaugeComplex;
data/app/pb_kits/playbook/pb_gauge/docs/_gauge_complex.md ADDED
@@ -0,0 +1 @@
1
+ We are able to wrap our Gauge kits within multiple other Flex and Card components.
data/app/pb_kits/playbook/pb_gauge/docs/_gauge_sizing.html.erb CHANGED
@@ -1,4 +1,4 @@
1
- <%= pb_rails("flex", props: {wrap: true}) do %>
1
+ <%= pb_rails("flex", props: {wrap: true, align: "center"}) do %>
2
2
  <%= pb_rails("flex/flex_item", props: {fixed_size: "400px", overflow: "hidden", shrink: true }) do %>
3
3
  <%= pb_rails("gauge", props: {
4
4
  id: "gauge-sizing4",
@@ -20,6 +20,7 @@
20
20
  <%= pb_rails("flex/flex_item", props: {fixed_size: "125px", overflow: "hidden", shrink: true }) do %>
21
21
  <%= pb_rails("gauge", props: {
22
22
  id: "gauge-sizing1",
23
+ height: '100%',
23
24
  chart_data: [{ name: "Point 4", value: 25 }],
24
25
  }) %>
25
26
  <% end %>
data/app/pb_kits/playbook/pb_gauge/docs/_gauge_sizing.jsx CHANGED
@@ -4,6 +4,7 @@ import { Flex, FlexItem, Gauge } from '../../'
4
4
  const GaugeSizing = (props) => (
5
5
  <div>
6
6
  <Flex
7
+ align="center"
7
8
  wrap
8
9
  {...props}
9
10
  >
@@ -51,6 +52,7 @@ const GaugeSizing = (props) => (
51
52
  >
52
53
  <Gauge
53
54
  chartData={[ { name: 'Point 4', value: 25 } ]}
55
+ height="100%"
54
56
  id="gauge-sizing1"
55
57
  {...props}
56
58
  />
data/app/pb_kits/playbook/pb_gauge/docs/example.yml CHANGED
@@ -10,6 +10,7 @@ examples:
10
10
  - gauge_sizing: Sizing
11
11
  - gauge_height: Height
12
12
  - gauge_colors: Color Overrides
13
+ - gauge_complex: Complex
13
14
 
14
15
 
15
16
  react:
@@ -23,3 +24,4 @@ examples:
23
24
  - gauge_height: Height
24
25
  - gauge_live_data: Live Data
25
26
  - gauge_colors: Color Overrides
27
+ - gauge_complex: Complex
data/app/pb_kits/playbook/pb_gauge/docs/index.js CHANGED
@@ -8,3 +8,4 @@ export { default as GaugeTitle } from './_gauge_title.jsx'
8
8
  export { default as GaugeUnits } from './_gauge_units.jsx'
9
9
  export { default as GaugeLiveData } from './_gauge_live_data.jsx'
10
10
  export { default as GaugeColors } from './_gauge_colors.jsx'
11
+ export { default as GaugeComplex } from './_gauge_complex.jsx'
data/app/pb_kits/playbook/plugins/pb_chart.js CHANGED
@@ -82,6 +82,11 @@ class pbChart {
82
82
 
83
83
  Highcharts.chart(this.defaults.id, {
84
84
  chart: {
85
+ events: {
86
+ load() {
87
+ setTimeout(this.reflow.bind(this), 0)
88
+ },
89
+ },
85
90
  type: this.defaults.style,
86
91
  height: this.defaults.height,
87
92
  },
data/lib/playbook/version.rb CHANGED
@@ -1,6 +1,6 @@
1
1
  # frozen_string_literal: true
2
2
 
3
3
  module Playbook
4
- PREVIOUS_VERSION = "11.5.0"
5
- VERSION = "11.6.0"
4
+ PREVIOUS_VERSION = "11.6.0"
5
+ VERSION = "11.7.0.pre.alpha-guagechart1"
6
6
  end
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: 11.6.0
4
+ version: 11.7.0.pre.alpha.pre.guagechart1
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: 2022-09-23 00:00:00.000000000 Z
12
+ date: 2022-09-26 00:00:00.000000000 Z
13
13
  dependencies:
14
14
  - !ruby/object:Gem::Dependency
15
15
  name: actionpack
@@ -1001,6 +1001,9 @@ files:
1001
1001
  - app/pb_kits/playbook/pb_gauge/docs/_gauge_colors.html.erb
1002
1002
  - app/pb_kits/playbook/pb_gauge/docs/_gauge_colors.jsx
1003
1003
  - app/pb_kits/playbook/pb_gauge/docs/_gauge_colors.md
1004
+ - app/pb_kits/playbook/pb_gauge/docs/_gauge_complex.html.erb
1005
+ - app/pb_kits/playbook/pb_gauge/docs/_gauge_complex.jsx
1006
+ - app/pb_kits/playbook/pb_gauge/docs/_gauge_complex.md
1004
1007
  - app/pb_kits/playbook/pb_gauge/docs/_gauge_default.html.erb
1005
1008
  - app/pb_kits/playbook/pb_gauge/docs/_gauge_default.jsx
1006
1009
  - app/pb_kits/playbook/pb_gauge/docs/_gauge_disable_animation.html.erb
@@ -2297,9 +2300,9 @@ required_ruby_version: !ruby/object:Gem::Requirement
2297
2300
  version: '0'
2298
2301
  required_rubygems_version: !ruby/object:Gem::Requirement
2299
2302
  requirements:
2300
- - - ">="
2303
+ - - ">"
2301
2304
  - !ruby/object:Gem::Version
2302
- version: '0'
2305
+ version: 1.3.1
2303
2306
  requirements: []
2304
2307
  rubygems_version: 3.3.7
2305
2308
  signing_key: