playbook_ui 16.0.0.pre.alpha.PLAY271013763 → 16.0.0.pre.alpha.PLAY272313713
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/example.yml +0 -1
- data/app/pb_kits/playbook/pb_background/docs/index.js +0 -1
- data/app/pb_kits/playbook/pb_form_pill/docs/_form_pill_truncated_text.html.erb +5 -5
- data/app/pb_kits/playbook/pb_form_pill/docs/_form_pill_truncated_text.jsx +4 -4
- data/app/pb_kits/playbook/pb_form_pill/form_pill.rb +0 -4
- data/app/pb_kits/playbook/pb_multi_level_select/docs/example.yml +33 -35
- data/app/pb_kits/playbook/pb_multi_level_select/docs/index.js +0 -1
- data/app/pb_kits/playbook/pb_textarea/index.ts +5 -12
- data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_truncated_text.html.erb +1 -1
- data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_truncated_text.jsx +1 -1
- data/app/pb_kits/playbook/pb_typeahead/typeahead.rb +0 -4
- data/dist/chunks/{_pb_line_graph-BgKF_zz1.js → _pb_line_graph-hxi01lk7.js} +1 -1
- data/dist/chunks/{_typeahead-B9a6ZsEP.js → _typeahead-C_Whhuv5.js} +1 -1
- data/dist/chunks/{globalProps-BhVYCqRf.js → globalProps-DgYwLYNx.js} +1 -1
- data/dist/chunks/{lib-DD34ZrWL.js → lib-NLxTo8OB.js} +1 -1
- data/dist/chunks/vendor.js +1 -1
- data/dist/playbook-rails-react-bindings.js +1 -1
- data/dist/playbook-rails.js +1 -1
- data/lib/playbook/truncate.rb +1 -1
- data/lib/playbook/version.rb +1 -1
- metadata +6 -11
- data/app/pb_kits/playbook/pb_background/docs/_background_responsive.jsx +0 -30
- data/app/pb_kits/playbook/pb_background/docs/_background_responsive.md +0 -1
- data/app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_input_display.html.erb +0 -74
- data/app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_input_display.jsx +0 -87
- data/app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_input_display.md +0 -3
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: 7ae471dc0472bf49b72232fb0b9e655baca6b28d36a5d07b16d1134e873db1e3
|
|
4
|
+
data.tar.gz: c59076a7a2c80b25b60c2f24a9fe39cdc55ea925003d0875b2ff9e343dc696da
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 945e50643061b5aa25249f1a1d75e50bcbdc82f99107c695b58b429564a8a820d0e518ade39ae8f335d39de6d2fcd53e725a1dbf3f52bd9a23cc48505099d7c1
|
|
7
|
+
data.tar.gz: 84d74d62a1388c0c1b7f956b0030913926d15159d94a8441c9f5c4a6b7f122ef161c2ce3a9f15181ec02b76578f5f46c592dfcb6c5540ca7fd0b9cbb59bbd935
|
|
@@ -7,4 +7,3 @@ export { default as BackgroundStatusSubtle } from './_background_status_subtle.j
|
|
|
7
7
|
export { default as BackgroundCategory } from './_background_category.jsx'
|
|
8
8
|
export { default as BackgroundSize } from './_background_size.jsx'
|
|
9
9
|
export { default as BackgroundOverlay } from './_background_overlay.jsx'
|
|
10
|
-
export { default as BackgroundResponsive } from './_background_responsive.jsx'
|
|
@@ -15,7 +15,7 @@
|
|
|
15
15
|
options: names,
|
|
16
16
|
label: "Truncation Within Typeahead",
|
|
17
17
|
pills: true,
|
|
18
|
-
truncate:
|
|
18
|
+
truncate: 1,
|
|
19
19
|
}) %>
|
|
20
20
|
|
|
21
21
|
<%= pb_rails("caption", props: { text: "Form Pill Truncation" }) %>
|
|
@@ -24,19 +24,19 @@
|
|
|
24
24
|
name: "Princess Amelia Mignonette Grimaldi Thermopolis Renaldo",
|
|
25
25
|
avatar_url: "https://randomuser.me/api/portraits/women/44.jpg",
|
|
26
26
|
tabindex: 0,
|
|
27
|
-
truncate:
|
|
27
|
+
truncate: 1,
|
|
28
28
|
id: "truncation-1"
|
|
29
29
|
}) %>
|
|
30
30
|
<%= pb_rails("form_pill", props: {
|
|
31
31
|
icon: "badge-check",
|
|
32
32
|
text: "icon and a very long tag to show truncation",
|
|
33
33
|
tabindex: 0,
|
|
34
|
-
truncate:
|
|
34
|
+
truncate: 1,
|
|
35
35
|
id: "truncation-2"
|
|
36
36
|
}) %>
|
|
37
37
|
<%= pb_rails("form_pill", props: {
|
|
38
38
|
text: "form pill long tag no tooltip show truncation",
|
|
39
39
|
tabindex: 0,
|
|
40
|
-
truncate:
|
|
40
|
+
truncate: 1,
|
|
41
41
|
}) %>
|
|
42
|
-
<% end %>
|
|
42
|
+
<% end %>
|
|
@@ -21,7 +21,7 @@ const FormPillTruncatedText = (props) => {
|
|
|
21
21
|
isMulti
|
|
22
22
|
label="Truncation Within Typeahead"
|
|
23
23
|
options={names}
|
|
24
|
-
truncate={
|
|
24
|
+
truncate={1}
|
|
25
25
|
{...props}
|
|
26
26
|
/>
|
|
27
27
|
<Caption text="Form Pill Truncation"/>
|
|
@@ -31,20 +31,20 @@ const FormPillTruncatedText = (props) => {
|
|
|
31
31
|
name="Princess Amelia Mignonette Grimaldi Thermopolis Renaldo"
|
|
32
32
|
onClick={() => alert('Click!')}
|
|
33
33
|
tabIndex={0}
|
|
34
|
-
truncate={
|
|
34
|
+
truncate={1}
|
|
35
35
|
/>
|
|
36
36
|
<FormPill
|
|
37
37
|
icon="badge-check"
|
|
38
38
|
onClick={() => {alert('Click!')}}
|
|
39
39
|
tabIndex={0}
|
|
40
40
|
text="icon and a very long tag to show truncation"
|
|
41
|
-
truncate={
|
|
41
|
+
truncate={1}
|
|
42
42
|
/>
|
|
43
43
|
<FormPill
|
|
44
44
|
onClick={() => {alert('Click!')}}
|
|
45
45
|
tabIndex={0}
|
|
46
46
|
text="form pill with a very long tag to show truncation"
|
|
47
|
-
truncate={
|
|
47
|
+
truncate={1}
|
|
48
48
|
/>
|
|
49
49
|
</Card>
|
|
50
50
|
</>
|
|
@@ -1,39 +1,37 @@
|
|
|
1
1
|
examples:
|
|
2
2
|
rails:
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
- multi_level_select_single_disabled: Disabled Options (Single Select)
|
|
3
|
+
- multi_level_select_default: Default
|
|
4
|
+
- multi_level_select_single: Single Select
|
|
5
|
+
- multi_level_select_single_children_only: Single Select w/ Hidden Radios
|
|
6
|
+
- multi_level_select_return_all_selected: Return All Selected
|
|
7
|
+
- multi_level_select_selected_ids: Selected Ids
|
|
8
|
+
- multi_level_select_with_form: With Form
|
|
9
|
+
- multi_level_select_color: With Pills (Custom Color)
|
|
10
|
+
- multi_level_select_reset: Reset Selection
|
|
11
|
+
- multi_level_select_label: With Label
|
|
12
|
+
- multi_level_select_error: Error
|
|
13
|
+
- multi_level_select_disabled: Disabled Input
|
|
14
|
+
- multi_level_select_disabled_options_default: Disabled Options (Default)
|
|
15
|
+
- multi_level_select_disabled_options: Disabled Options (Return All Selected)
|
|
16
|
+
- multi_level_select_disabled_options_parent_default: Disabled Parent Option (Default)
|
|
17
|
+
- multi_level_select_disabled_options_parent: Disabled Parent Option (Return All Selected)
|
|
18
|
+
- multi_level_select_single_disabled: Disabled Options (Single Select)
|
|
20
19
|
|
|
21
20
|
react:
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
- multi_level_select_single_disabled: Disabled Options (Single Select)
|
|
21
|
+
- multi_level_select_default: Default
|
|
22
|
+
- multi_level_select_react_hook: React Hook
|
|
23
|
+
- multi_level_select_single: Single Select
|
|
24
|
+
- multi_level_select_single_children_only: Single Select w/ Hidden Radios
|
|
25
|
+
- multi_level_select_return_all_selected: Return All Selected
|
|
26
|
+
- multi_level_select_selected_ids_react: Selected Ids
|
|
27
|
+
- multi_level_select_color: With Pills (Custom Color)
|
|
28
|
+
- multi_level_select_with_children: Checkboxes With Children
|
|
29
|
+
- multi_level_select_with_children_with_radios: Single Select With Children
|
|
30
|
+
- multi_level_select_label: With Label
|
|
31
|
+
- multi_level_select_error: Error
|
|
32
|
+
- multi_level_select_disabled: Disabled Input
|
|
33
|
+
- multi_level_select_disabled_options_default: Disabled Options (Default)
|
|
34
|
+
- multi_level_select_disabled_options: Disabled Options (Return All Selected)
|
|
35
|
+
- multi_level_select_disabled_options_parent_default: Disabled Parent Option (Default)
|
|
36
|
+
- multi_level_select_disabled_options_parent: Disabled Parent Option (Return All Selected)
|
|
37
|
+
- multi_level_select_single_disabled: Disabled Options (Single Select)
|
|
@@ -4,7 +4,6 @@ export { default as MultiLevelSelectSingleChildrenOnly } from './_multi_level_se
|
|
|
4
4
|
export { default as MultiLevelSelectReturnAllSelected } from './_multi_level_select_return_all_selected.jsx'
|
|
5
5
|
export { default as MultiLevelSelectSelectedIdsReact } from "./_multi_level_select_selected_ids_react.jsx"
|
|
6
6
|
export { default as MultiLevelSelectColor } from './_multi_level_select_color.jsx'
|
|
7
|
-
export { default as MultiLevelSelectInputDisplay } from './_multi_level_select_input_display.jsx'
|
|
8
7
|
export { default as MultiLevelSelectWithChildren } from './_multi_level_select_with_children.jsx'
|
|
9
8
|
export { default as MultiLevelSelectWithChildrenWithRadios } from './_multi_level_select_with_children_with_radios.jsx'
|
|
10
9
|
export { default as MultiLevelSelectDisabled } from './_multi_level_select_disabled.jsx'
|
|
@@ -11,21 +11,18 @@ export default class PbTextarea extends PbEnhancedElement {
|
|
|
11
11
|
}
|
|
12
12
|
|
|
13
13
|
hasEmojiMask(): boolean {
|
|
14
|
-
if (!this.element) return false
|
|
15
14
|
return (this.element as HTMLElement).dataset.pbEmojiMask === "true"
|
|
16
15
|
}
|
|
17
16
|
|
|
18
|
-
onInput
|
|
19
|
-
if (!this.element) return
|
|
20
|
-
|
|
17
|
+
onInput(): void {
|
|
21
18
|
if ((this.element as HTMLElement).closest('.resize_auto')) {
|
|
22
|
-
|
|
23
|
-
|
|
19
|
+
this.style.height = 'auto'
|
|
20
|
+
this.style.height = (this.scrollHeight) + 'px'
|
|
24
21
|
}
|
|
25
22
|
}
|
|
26
23
|
|
|
27
24
|
handleEmojiInput = (): void => {
|
|
28
|
-
if (!this.
|
|
25
|
+
if (!this.hasEmojiMask()) return
|
|
29
26
|
|
|
30
27
|
if (this.skipNextEmojiFilter) {
|
|
31
28
|
this.skipNextEmojiFilter = false
|
|
@@ -36,7 +33,7 @@ export default class PbTextarea extends PbEnhancedElement {
|
|
|
36
33
|
}
|
|
37
34
|
|
|
38
35
|
handleEmojiPaste = (event: ClipboardEvent): void => {
|
|
39
|
-
if (!this.
|
|
36
|
+
if (!this.hasEmojiMask()) return
|
|
40
37
|
|
|
41
38
|
const pastedText = event.clipboardData?.getData('text') || ''
|
|
42
39
|
const filteredText = stripEmojisForPaste(pastedText)
|
|
@@ -60,8 +57,6 @@ export default class PbTextarea extends PbEnhancedElement {
|
|
|
60
57
|
}
|
|
61
58
|
|
|
62
59
|
connect(): void {
|
|
63
|
-
if (!this.element) return
|
|
64
|
-
|
|
65
60
|
if ((this.element as HTMLElement).closest('.resize_auto')) {
|
|
66
61
|
this.element.setAttribute('style', 'height:' + (this.element as HTMLTextAreaElement).scrollHeight + 'px;overflow-y:hidden;')
|
|
67
62
|
this.element.addEventListener('input', this.onInput, false)
|
|
@@ -74,8 +69,6 @@ export default class PbTextarea extends PbEnhancedElement {
|
|
|
74
69
|
}
|
|
75
70
|
|
|
76
71
|
disconnect(): void {
|
|
77
|
-
if (!this.element) return
|
|
78
|
-
|
|
79
72
|
this.element.removeEventListener('input', this.onInput, false)
|
|
80
73
|
this.element.removeEventListener('input', this.handleEmojiInput, false)
|
|
81
74
|
this.element.removeEventListener('paste', this.handleEmojiPaste as EventListener, false)
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx}from"react/jsx-runtime";import{useMemo}from"react";import{b as buildAriaProps,a as buildDataProps,c as buildHtmlProps,d as classnames,e as buildCss,g as globalProps}from"./globalProps-
|
|
1
|
+
import{jsx}from"react/jsx-runtime";import{useMemo}from"react";import{b as buildAriaProps,a as buildDataProps,c as buildHtmlProps,d as classnames,e as buildCss,g as globalProps}from"./globalProps-DgYwLYNx.js";import Highcharts from"highcharts";import HighchartsReact from"highcharts-react-official";import{t as typography,c as colors}from"./lib-NLxTo8OB.js";import highchartsMore from"highcharts/highcharts-more";import solidGauge from"highcharts/modules/solid-gauge";const barGraphTheme={title:{text:"",style:{color:colors.text_lt_default,fontFamily:typography.font_family_base,fontWeight:typography.bold,fontSize:typography.heading_3}},subtitle:{text:"",style:{fontFamily:typography.font_family_base,color:colors.text_lt_light,fontWeight:typography.regular,fontSize:typography.text_base}},chart:{type:"column"},tooltip:{backgroundColor:{linearGradient:{x1:0,y1:0,x2:0,y2:1},stops:[[0,colors.bg_dark],[1,colors.bg_dark]]},style:{fontFamily:typography.font_family_base,color:colors.text_dk_default,fontWeight:typography.regular,fontSize:typography.text_smaller}},colors:[colors.data_1,colors.data_2,colors.data_3,colors.data_4,colors.data_5,colors.data_6,colors.data_7],credits:{enabled:false},legend:{enabled:false,itemStyle:{color:colors.text_lt_light,fill:colors.text_lt_light,fontSize:typography.text_smaller}},xAxis:{gridLineWidth:0,lineColor:colors.border_light,tickColor:colors.border_light,labels:{style:{fontFamily:typography.font_family_base,color:colors.text_lt_lighter,fontWeight:typography.bold,fontSize:typography.text_smaller}},title:{style:{color:colors.text_lt_default,fontFamily:typography.font_family_base,fontWeight:typography.regular,fontSize:typography.heading_4}}},yAxis:{alternateGridColor:void 0,minorTickInterval:null,gridLineColor:colors.border_light,minorGridLineColor:colors.border_light,lineWidth:0,tickWidth:0,labels:{style:{fontFamily:typography.font_family_base,color:colors.text_lt_lighter,fontWeight:typography.bold,fontSize:typography.text_smaller}},title:{style:{fontFamily:typography.font_family_base,color:colors.text_lt_lighter,fontWeight:typography.bold,fontSize:typography.text_smaller}}}};const PbBarGraph=props=>{const{aria:aria={},data:data={},id:id,htmlOptions:htmlOptions={},options:options,className:className}=props;const ariaProps=buildAriaProps(aria);const dataProps=buildDataProps(data);const htmlProps=buildHtmlProps(htmlOptions);const classes=classnames(buildCss("pb_pb_bar_graph"),globalProps(props),className);const mergedOptions=useMemo((()=>{if(!options||typeof options!=="object"){console.error("❌ Invalid options passed to <PbBarGraph />",options);return{}}return Highcharts.merge({},barGraphTheme,options)}),[options]);return jsx("div",{children:jsx(HighchartsReact,{containerProps:{className:classnames(classes),id:id,...ariaProps,...dataProps,...htmlProps},highcharts:Highcharts,options:mergedOptions})})};const pbCircleChartTheme={title:{text:"",style:{color:colors.text_lt_default,fontFamily:typography.font_family_base,fontWeight:typography.bold,fontSize:typography.heading_3}},chart:{type:"pie"},tooltip:{backgroundColor:{linearGradient:{x1:0,y1:0,x2:0,y2:1},stops:[[0,colors.bg_dark],[1,colors.bg_dark]]},pointFormat:'<span style="font-weight: bold; color:{point.color};">●</span>{point.name}: <b>{point.y}</b>',followPointer:true,shadow:false,borderWidth:0,borderRadius:10,style:{fontFamily:typography.font_family_base,color:colors.text_dk_default,fontWeight:typography.regular,fontSize:typography.text_smaller}},plotOptions:{pie:{dataLabels:{enabled:false,connectorShape:"straight",connectorWidth:3,format:"<div>{point.name}</div>",style:{fontFamily:typography.font_family_base,fontSize:typography.text_smaller,color:colors.text_lt_light,fontWeight:typography.regular,textOutline:"2px $white"}},innerSize:"50%",borderColor:"",borderWidth:null,colors:[colors.data_1,colors.data_2,colors.data_3,colors.data_4,colors.data_5,colors.data_6,colors.data_7]}},legend:{layout:"horizontal",align:"center",verticalAlign:"bottom",itemStyle:{fontFamily:typography.font_family_base,color:colors.text_lt_light,fontWeight:typography.regular,fontSize:typography.text_smaller},itemHoverStyle:{color:colors.text_lt_default},itemHiddenStyle:{color:colors.text_lt_lighter}},credits:{enabled:false}};const PbCircleChart=props=>{const{aria:aria={},className:className,data:data={},id:id,htmlOptions:htmlOptions={},options:options}=props;const ariaProps=buildAriaProps(aria);const dataProps=buildDataProps(data);const htmlProps=buildHtmlProps(htmlOptions);const classes=classnames(buildCss("pb_pb_circle_chart"),globalProps(props),className);const mergedOptions=useMemo((()=>{if(!options||typeof options!=="object"){console.error("❌ Invalid options passed to <PbCircleChart />",options);return{}}return Highcharts.merge({},pbCircleChartTheme,options)}),[options]);return jsx("div",{children:jsx(HighchartsReact,{containerProps:{className:classnames(classes),id:id,...ariaProps,...dataProps,...htmlProps},highcharts:Highcharts,options:mergedOptions})})};const pbGaugeGraphTheme={title:{text:"",style:{fontFamily:typography.font_family_base,fontSize:typography.text_larger}},chart:{type:"solidgauge",events:{render(){this.container;const arc=this.container.querySelector("path.gauge-pane");if(arc)arc.setAttribute("stroke-linejoin","round")}}},pane:{size:"90%",startAngle:-100,endAngle:100,background:[{borderWidth:20,innerRadius:"90%",outerRadius:"90%",shape:"arc",className:"gauge-pane",borderColor:colors.border_light,borderRadius:"50%"}]},tooltip:{backgroundColor:{linearGradient:{x1:0,y1:0,x2:0,y2:1},stops:[[0,colors.bg_dark],[1,colors.bg_dark]]},pointFormat:'<span style="font-weight: bold; color:{point.color};">●</span>{point.name}: <b>{point.y}</b>',followPointer:true,shadow:false,borderWidth:0,borderRadius:10,style:{fontFamily:typography.font_family_base,color:colors.text_dk_default,fontWeight:typography.regular,fontSize:typography.text_smaller}},yAxis:{min:0,max:100,lineWidth:0,tickPositions:[]},plotOptions:{solidgauge:{borderColor:colors.data_1,borderWidth:20,color:colors.data_1,radius:90,innerRadius:"90%",y:-26,dataLabels:{borderWidth:0,color:colors.text_lt_default,enabled:true,format:'<span class="fix">{y:,f}</span>',style:{fontFamily:typography.font_family_base,fontWeight:typography.regular,fontSize:typography.heading_2},y:-26}}},credits:{enabled:false}};const PbGaugeChart=props=>{const{aria:aria={},className:className,data:data={},htmlOptions:htmlOptions={},id:id,ref:ref,options:options={}}=props;const ariaProps=buildAriaProps(aria);const dataProps=buildDataProps(data);const htmlProps=buildHtmlProps(htmlOptions);const classes=classnames(buildCss("pb_pb_gauge_chart"),globalProps(props),className);const mergedOptions=useMemo((()=>{if(!options||typeof options!=="object"){console.error("❌ Invalid options passed to <PbLineGraph />",options);return{}}return Highcharts.merge({},pbGaugeGraphTheme,options)}),[options]);highchartsMore(Highcharts);solidGauge(Highcharts);return jsx("div",{children:jsx(HighchartsReact,{containerProps:{className:classnames(classes),id:id,ref:ref,...ariaProps,...dataProps,...htmlProps},highcharts:Highcharts,options:mergedOptions})})};const pbLineGraphTheme={title:{text:"",style:{color:colors.text_lt_default,fontFamily:typography.font_family_base,fontWeight:typography.bold,fontSize:typography.heading_3}},subtitle:{text:"",style:{fontFamily:typography.font_family_base,color:colors.text_lt_light,fontWeight:typography.regular,fontSize:typography.text_base}},chart:{type:"line"},tooltip:{backgroundColor:{linearGradient:{x1:0,y1:0,x2:0,y2:1},stops:[[0,colors.bg_dark],[1,colors.bg_dark]]},followPointer:true,shadow:false,borderWidth:0,borderRadius:10,style:{fontFamily:typography.font_family_base,color:colors.text_dk_default,fontWeight:typography.regular,fontSize:typography.text_smaller}},plotOptions:{line:{dataLabels:{enabled:false}}},credits:{enabled:false},legend:{enabled:false,itemStyle:{fontFamily:typography.font_family_base,color:colors.text_lt_light,fontWeight:typography.regular,fontSize:typography.text_smaller},itemHoverStyle:{color:colors.text_lt_default},itemHiddenStyle:{color:colors.text_lt_lighter}},colors:[colors.data_1,colors.data_2,colors.data_3,colors.data_4,colors.data_5,colors.data_6,colors.data_7],xAxis:{gridLineWidth:0,lineColor:colors.border_light,tickColor:colors.border_light,labels:{style:{fontFamily:typography.font_family_base,color:colors.text_lt_lighter,fontWeight:typography.bold,fontSize:typography.text_smaller}},title:{style:{color:colors.text_lt_default,fontFamily:typography.font_family_base,fontWeight:typography.regular,fontSize:typography.heading_4}}},yAxis:{alternateGridColor:void 0,minorTickInterval:null,gridLineColor:colors.border_light,minorGridLineColor:colors.border_light,lineWidth:0,tickWidth:0,tickPixelInterval:50,labels:{style:{fontFamily:typography.font_family_base,color:colors.text_lt_lighter,fontWeight:typography.bold,fontSize:typography.text_smaller}},title:{style:{fontFamily:typography.font_family_base,color:colors.text_lt_lighter,fontWeight:typography.bold,fontSize:typography.text_smaller}}}};const PbLineGraph=props=>{const{aria:aria={},className:className,data:data={},id:id,htmlOptions:htmlOptions={},options:options}=props;const ariaProps=buildAriaProps(aria);const dataProps=buildDataProps(data);const htmlProps=buildHtmlProps(htmlOptions);const classes=classnames(buildCss("pb_pb_line_graph"),globalProps(props),className);const mergedOptions=useMemo((()=>{if(!options||typeof options!=="object"){console.error("❌ Invalid options passed to <PbLineGraph />",options);return{}}return Highcharts.merge({},pbLineGraphTheme,options)}),[options]);return jsx("div",{children:jsx(HighchartsReact,{containerProps:{className:classnames(classes),id:id,...ariaProps,...dataProps,...htmlProps},highcharts:Highcharts,options:mergedOptions})})};export{PbBarGraph as P,PbCircleChart as a,PbGaugeChart as b,PbLineGraph as c};
|