playbook_ui_docs 14.22.0.pre.alpha.popoverkittransitionpoppertofloatingui8856 → 14.22.0.pre.rc.0

data/app/pb_kits/playbook/pb_treemap_chart/docs/_treemap_chart_tooltip.jsx

@@ -0,0 +1,48 @@
+import React from 'react'
+
+import TreemapChart from '../_treemap_chart'
+
+const chartData = [
+  {
+    name: "Pepperoni",
+    parent: "Toppings",
+    value: 600,
+  }, {
+    name: "Cheese",
+    parent: "Toppings",
+    value: 510,
+  }, {
+    name: "Mushroom",
+    parent: "Toppings",
+    value: 330,
+  },{
+    name: "Onions",
+    parent: "Toppings",
+    value: 250,
+  }, {
+    name: "Olives",
+    parent: "Toppings",
+    value: 204,
+  }, {
+    name: "Pineapple",
+    parent: "Toppings",
+    value: 90,
+  }, {
+    name: "Pizza Toppings",
+    id: "Toppings",
+  },
+]
+
+const TreemapChartTooltip = (props) => (
+  <div>
+    <TreemapChart
+        chartData={chartData}
+        id="treemap-tooltip"
+        title="Favored Pizza Toppings"
+        tooltipHtml= '<p>Custom tooltip for {point.name} <br/>with value: {point.value}</p>'
+        {...props}
+    />
+  </div>
+)
+
+export default TreemapChartTooltip

data/app/pb_kits/playbook/pb_treemap_chart/docs/_treemap_chart_tooltip.md

@@ -0,0 +1,3 @@
+A custom tooltip format can be specified. The desired format can be passed as a `string` of custom HTML to the `tooltipHtml` prop.
+
+`{point.name}` and `{point.value}` are useful values that can be referenced for each point in the graph.

data/app/pb_kits/playbook/pb_treemap_chart/docs/example.yml

@@ -0,0 +1,15 @@
+examples:
+
+  rails:
+  - treemap_chart_default: Default
+  - treemap_chart_grouped_data: Grouped Data
+  - treemap_chart_drillable: Drillable
+  - treemap_chart_colors: Color Overrides
+  - treemap_chart_tooltip: Tooltip Customization
+
+  react:
+  - treemap_chart_default: Default
+  - treemap_chart_grouped_data: Grouped Data
+  - treemap_chart_drillable: Drillable
+  - treemap_chart_colors: Color Overrides
+  - treemap_chart_tooltip: Tooltip Customization

data/app/pb_kits/playbook/pb_treemap_chart/docs/index.js

@@ -0,0 +1,5 @@
+export { default as TreemapChartDefault } from './_treemap_chart_default.jsx'
+export { default as TreemapChartGroupedData } from './_treemap_chart_grouped_data.jsx'
+export { default as TreemapChartDrillable } from './_treemap_chart_drillable.jsx'
+export { default as TreemapChartColors } from './_treemap_chart_colors.jsx'
+export { default as TreemapChartTooltip } from './_treemap_chart_tooltip.jsx'

data/app/pb_kits/playbook/pb_typeahead/docs/example.yml

@@ -15,7 +15,6 @@ examples:
     - typeahead_dynamic_options: Dynamic Options
     - typeahead_dynamic_options_pure_rails: Dynamic Options (Pure Rails)
     - typeahead_disabled: Disabled
-    - typeahead_preserve_input: Preserve Search Input
 
   react:
     - typeahead_default: Default