playbook_ui 16.9.0 → 16.10.0.pre.alpha.PLAY3053advancedtablebottompinnedrowsreact17469

data/app/pb_kits/playbook/pb_pb_bar_graph/docs/_playground.json

@@ -1,10 +1,85 @@
 {
   "template": "<PbBarGraph{{props}} />",
   "propTargets": {},
-  "defaults": {},
+  "defaults": {
+    "options": {
+      "series": [
+        {
+          "name": "Installation",
+          "data": [
+            1475,
+            200,
+            3000,
+            654,
+            656
+          ]
+        },
+        {
+          "name": "Manufacturing",
+          "data": [
+            4434,
+            524,
+            2320,
+            440,
+            500
+          ]
+        },
+        {
+          "name": "Sales & Distribution",
+          "data": [
+            3387,
+            743,
+            1344,
+            434,
+            440
+          ]
+        },
+        {
+          "name": "Project Development",
+          "data": [
+            3227,
+            878,
+            999,
+            780,
+            1000
+          ]
+        },
+        {
+          "name": "Other",
+          "data": [
+            1111,
+            677,
+            3245,
+            500,
+            200
+          ]
+        }
+      ],
+      "title": {
+        "text": "Solar Employment Growth by Sector, 2010-2016"
+      },
+      "subtitle": {
+        "text": "Source: thesolarfoundation.com"
+      },
+      "xAxis": {
+        "categories": [
+          "Jan",
+          "Feb",
+          "Mar",
+          "Apr",
+          "May"
+        ]
+      },
+      "yAxis": {
+        "title": {
+          "text": "Number of Employees"
+        }
+      }
+    }
+  },
   "groups": [
     {
-      "name": "Props",
+      "name": "Chart",
       "props": [
         "options"
       ]
@@ -13,9 +88,308 @@
   "presets": [
     {
       "name": "Default",
-      "props": {}
+      "props": {
+        "options": {
+          "series": [
+            {
+              "name": "Installation",
+              "data": [
+                1475,
+                200,
+                3000,
+                654,
+                656
+              ]
+            },
+            {
+              "name": "Manufacturing",
+              "data": [
+                4434,
+                524,
+                2320,
+                440,
+                500
+              ]
+            },
+            {
+              "name": "Sales & Distribution",
+              "data": [
+                3387,
+                743,
+                1344,
+                434,
+                440
+              ]
+            },
+            {
+              "name": "Project Development",
+              "data": [
+                3227,
+                878,
+                999,
+                780,
+                1000
+              ]
+            },
+            {
+              "name": "Other",
+              "data": [
+                1111,
+                677,
+                3245,
+                500,
+                200
+              ]
+            }
+          ],
+          "title": {
+            "text": "Solar Employment Growth by Sector, 2010-2016"
+          },
+          "subtitle": {
+            "text": "Source: thesolarfoundation.com"
+          },
+          "xAxis": {
+            "categories": [
+              "Jan",
+              "Feb",
+              "Mar",
+              "Apr",
+              "May"
+            ]
+          },
+          "yAxis": {
+            "title": {
+              "text": "Number of Employees"
+            }
+          }
+        }
+      }
+    },
+    {
+      "name": "Horizontal",
+      "props": {
+        "options": {
+          "chart": {
+            "type": "bar"
+          },
+          "title": {
+            "text": "Historic World Population by Region",
+            "align": "left"
+          },
+          "subtitle": {
+            "text": "Source: Wikipedia.org",
+            "align": "left"
+          },
+          "xAxis": {
+            "categories": [
+              "Africa",
+              "America",
+              "Asia",
+              "Europe"
+            ],
+            "lineWidth": 0
+          },
+          "yAxis": {
+            "title": {
+              "text": ""
+            }
+          },
+          "tooltip": {
+            "valueSuffix": " millions"
+          },
+          "plotOptions": {
+            "bar": {
+              "dataLabels": {
+                "enabled": true
+              },
+              "groupPadding": 0.1
+            }
+          },
+          "series": [
+            {
+              "name": "Year 1990",
+              "data": [
+                631,
+                727,
+                3202,
+                721
+              ]
+            },
+            {
+              "name": "Year 2000",
+              "data": [
+                814,
+                841,
+                3714,
+                726
+              ]
+            },
+            {
+              "name": "Year 2018",
+              "data": [
+                1276,
+                1007,
+                4561,
+                746
+              ]
+            }
+          ]
+        }
+      }
+    },
+    {
+      "name": "Stacked",
+      "props": {
+        "options": {
+          "series": [
+            {
+              "name": "Installation",
+              "data": [
+                1475,
+                200,
+                3000,
+                654,
+                656
+              ]
+            },
+            {
+              "name": "Manufacturing",
+              "data": [
+                1270,
+                800,
+                200,
+                454,
+                956
+              ]
+            },
+            {
+              "name": "Sales & Distribution",
+              "data": [
+                975,
+                1600,
+                1500,
+                924,
+                500
+              ]
+            }
+          ],
+          "title": {
+            "text": "Bar Graph with Stacked Columns"
+          },
+          "xAxis": {
+            "categories": [
+              "Jan",
+              "Feb",
+              "Mar",
+              "Apr",
+              "May"
+            ]
+          },
+          "yAxis": {
+            "title": {
+              "text": "Number of Employees"
+            }
+          },
+          "plotOptions": {
+            "column": {
+              "stacking": "normal",
+              "borderWidth": 0
+            }
+          },
+          "legend": {
+            "enabled": true
+          }
+        }
+      }
+    },
+    {
+      "name": "Custom Colors",
+      "props": {
+        "options": {
+          "series": [
+            {
+              "name": "Installation",
+              "data": [
+                1475,
+                200,
+                3000,
+                654,
+                656
+              ]
+            },
+            {
+              "name": "Manufacturing",
+              "data": [
+                4434,
+                524,
+                2320,
+                440,
+                500
+              ]
+            },
+            {
+              "name": "Sales & Distribution",
+              "data": [
+                3387,
+                743,
+                1344,
+                434,
+                440
+              ]
+            }
+          ],
+          "title": {
+            "text": "Bar Graph with Custom Data Colors"
+          },
+          "xAxis": {
+            "categories": [
+              "Jan",
+              "Feb",
+              "Mar",
+              "Apr",
+              "May"
+            ]
+          },
+          "yAxis": {
+            "title": {
+              "text": "Number of Employees"
+            }
+          },
+          "colors": [
+            "#144075",
+            "#005a8b",
+            "#00a4b4",
+            "#f9b115",
+            "#e87511"
+          ]
+        }
+      }
     }
   ],
   "conditionals": {},
-  "hints": {}
+  "hints": {
+    "charts_import": {
+      "when": {},
+      "message": "Highcharts kits are imported from playbook-ui/charts so apps can load the chart bundle only when needed.",
+      "type": "info"
+    },
+    "horizontal": {
+      "presetName": "Horizontal",
+      "message": "Set options.chart.type to bar for a horizontal bar chart.",
+      "type": "info"
+    },
+    "stacked": {
+      "presetName": "Stacked",
+      "message": "Stacked columns use options.plotOptions.column.stacking with multiple series.",
+      "type": "info"
+    },
+    "colors": {
+      "presetName": "Custom Colors",
+      "message": "Use options.colors to override the Highcharts series color palette.",
+      "type": "info"
+    }
+  },
+  "externalImports": [
+    "import { PbBarGraph } from 'playbook-ui/charts'"
+  ]
 }

data/app/pb_kits/playbook/pb_pb_bar_graph/docs/_playground.overrides.json

@@ -0,0 +1,245 @@
+{
+  "template": "<PbBarGraph{{props}} />",
+  "externalImports": [
+    "import { PbBarGraph } from 'playbook-ui/charts'"
+  ],
+  "defaults": {
+    "options": {
+      "series": [
+        {
+          "name": "Installation",
+          "data": [1475, 200, 3000, 654, 656]
+        },
+        {
+          "name": "Manufacturing",
+          "data": [4434, 524, 2320, 440, 500]
+        },
+        {
+          "name": "Sales & Distribution",
+          "data": [3387, 743, 1344, 434, 440]
+        },
+        {
+          "name": "Project Development",
+          "data": [3227, 878, 999, 780, 1000]
+        },
+        {
+          "name": "Other",
+          "data": [1111, 677, 3245, 500, 200]
+        }
+      ],
+      "title": {
+        "text": "Solar Employment Growth by Sector, 2010-2016"
+      },
+      "subtitle": {
+        "text": "Source: thesolarfoundation.com"
+      },
+      "xAxis": {
+        "categories": ["Jan", "Feb", "Mar", "Apr", "May"]
+      },
+      "yAxis": {
+        "title": {
+          "text": "Number of Employees"
+        }
+      }
+    }
+  },
+  "groups": [
+    {
+      "name": "Chart",
+      "props": ["options"]
+    }
+  ],
+  "presets": [
+    {
+      "name": "Default",
+      "props": {
+        "options": {
+          "series": [
+            {
+              "name": "Installation",
+              "data": [1475, 200, 3000, 654, 656]
+            },
+            {
+              "name": "Manufacturing",
+              "data": [4434, 524, 2320, 440, 500]
+            },
+            {
+              "name": "Sales & Distribution",
+              "data": [3387, 743, 1344, 434, 440]
+            },
+            {
+              "name": "Project Development",
+              "data": [3227, 878, 999, 780, 1000]
+            },
+            {
+              "name": "Other",
+              "data": [1111, 677, 3245, 500, 200]
+            }
+          ],
+          "title": {
+            "text": "Solar Employment Growth by Sector, 2010-2016"
+          },
+          "subtitle": {
+            "text": "Source: thesolarfoundation.com"
+          },
+          "xAxis": {
+            "categories": ["Jan", "Feb", "Mar", "Apr", "May"]
+          },
+          "yAxis": {
+            "title": {
+              "text": "Number of Employees"
+            }
+          }
+        }
+      }
+    },
+    {
+      "name": "Horizontal",
+      "props": {
+        "options": {
+          "chart": {
+            "type": "bar"
+          },
+          "title": {
+            "text": "Historic World Population by Region",
+            "align": "left"
+          },
+          "subtitle": {
+            "text": "Source: Wikipedia.org",
+            "align": "left"
+          },
+          "xAxis": {
+            "categories": ["Africa", "America", "Asia", "Europe"],
+            "lineWidth": 0
+          },
+          "yAxis": {
+            "title": {
+              "text": ""
+            }
+          },
+          "tooltip": {
+            "valueSuffix": " millions"
+          },
+          "plotOptions": {
+            "bar": {
+              "dataLabels": {
+                "enabled": true
+              },
+              "groupPadding": 0.1
+            }
+          },
+          "series": [
+            {
+              "name": "Year 1990",
+              "data": [631, 727, 3202, 721]
+            },
+            {
+              "name": "Year 2000",
+              "data": [814, 841, 3714, 726]
+            },
+            {
+              "name": "Year 2018",
+              "data": [1276, 1007, 4561, 746]
+            }
+          ]
+        }
+      }
+    },
+    {
+      "name": "Stacked",
+      "props": {
+        "options": {
+          "series": [
+            {
+              "name": "Installation",
+              "data": [1475, 200, 3000, 654, 656]
+            },
+            {
+              "name": "Manufacturing",
+              "data": [1270, 800, 200, 454, 956]
+            },
+            {
+              "name": "Sales & Distribution",
+              "data": [975, 1600, 1500, 924, 500]
+            }
+          ],
+          "title": {
+            "text": "Bar Graph with Stacked Columns"
+          },
+          "xAxis": {
+            "categories": ["Jan", "Feb", "Mar", "Apr", "May"]
+          },
+          "yAxis": {
+            "title": {
+              "text": "Number of Employees"
+            }
+          },
+          "plotOptions": {
+            "column": {
+              "stacking": "normal",
+              "borderWidth": 0
+            }
+          },
+          "legend": {
+            "enabled": true
+          }
+        }
+      }
+    },
+    {
+      "name": "Custom Colors",
+      "props": {
+        "options": {
+          "series": [
+            {
+              "name": "Installation",
+              "data": [1475, 200, 3000, 654, 656]
+            },
+            {
+              "name": "Manufacturing",
+              "data": [4434, 524, 2320, 440, 500]
+            },
+            {
+              "name": "Sales & Distribution",
+              "data": [3387, 743, 1344, 434, 440]
+            }
+          ],
+          "title": {
+            "text": "Bar Graph with Custom Data Colors"
+          },
+          "xAxis": {
+            "categories": ["Jan", "Feb", "Mar", "Apr", "May"]
+          },
+          "yAxis": {
+            "title": {
+              "text": "Number of Employees"
+            }
+          },
+          "colors": ["#144075", "#005a8b", "#00a4b4", "#f9b115", "#e87511"]
+        }
+      }
+    }
+  ],
+  "hints": {
+    "charts_import": {
+      "when": {},
+      "message": "Highcharts kits are imported from playbook-ui/charts so apps can load the chart bundle only when needed.",
+      "type": "info"
+    },
+    "horizontal": {
+      "presetName": "Horizontal",
+      "message": "Set options.chart.type to bar for a horizontal bar chart.",
+      "type": "info"
+    },
+    "stacked": {
+      "presetName": "Stacked",
+      "message": "Stacked columns use options.plotOptions.column.stacking with multiple series.",
+      "type": "info"
+    },
+    "colors": {
+      "presetName": "Custom Colors",
+      "message": "Use options.colors to override the Highcharts series color palette.",
+      "type": "info"
+    }
+  }
+}

data/app/pb_kits/playbook/pb_pb_bar_graph/kit.schema.json

@@ -8,7 +8,7 @@
   ],
   "props": {
     "options": {
-      "type": "Record<string, unknown>",
+      "type": "GenericObject",
       "platforms": [
         "react",
         "rails"