playbook_ui_docs 14.18.0.pre.alpha.play1736highchartslinegraphdefaultrebuild7444 → 14.18.0.pre.alpha.play2034zonesandcolors7407

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: playbook_ui_docs
 version: !ruby/object:Gem::Version
-  version: 14.18.0.pre.alpha.play1736highchartslinegraphdefaultrebuild7444
+  version: 14.18.0.pre.alpha.play2034zonesandcolors7407
 platform: ruby
 authors:
 - Power UX
@@ -9,7 +9,7 @@ authors:
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2025-04-29 00:00:00.000000000 Z
+date: 2025-04-28 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: playbook_ui
@@ -595,10 +595,6 @@ files:
 - app/pb_kits/playbook/pb_date_picker/docs/_date_picker_quick_pick_react.md
 - app/pb_kits/playbook/pb_date_picker/docs/_date_picker_range.html.erb
 - app/pb_kits/playbook/pb_date_picker/docs/_date_picker_range.jsx
-- app/pb_kits/playbook/pb_date_picker/docs/_date_picker_range_pattern.jsx
-- app/pb_kits/playbook/pb_date_picker/docs/_date_picker_range_pattern.md
-- app/pb_kits/playbook/pb_date_picker/docs/_date_picker_range_pattern_rails.html.erb
-- app/pb_kits/playbook/pb_date_picker/docs/_date_picker_range_pattern_rails.md
 - app/pb_kits/playbook/pb_date_picker/docs/_date_picker_time.html.erb
 - app/pb_kits/playbook/pb_date_picker/docs/_date_picker_time.jsx
 - app/pb_kits/playbook/pb_date_picker/docs/_date_picker_time.md
@@ -1251,8 +1247,6 @@ files:
 - app/pb_kits/playbook/pb_line_graph/docs/_line_graph_legend_position.html.erb
 - app/pb_kits/playbook/pb_line_graph/docs/_line_graph_legend_position.jsx
 - app/pb_kits/playbook/pb_line_graph/docs/_line_graph_legend_position.md
-- app/pb_kits/playbook/pb_line_graph/docs/_line_graph_pb_styles.jsx
-- app/pb_kits/playbook/pb_line_graph/docs/_line_graph_pb_styles.md
 - app/pb_kits/playbook/pb_line_graph/docs/example.yml
 - app/pb_kits/playbook/pb_line_graph/docs/index.js
 - app/pb_kits/playbook/pb_link/docs/_link_color.html.erb

data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_range_pattern.jsx

@@ -1,34 +0,0 @@
-import React from "react";
-import DatePicker from "../_date_picker";
-
-const DatePickerRangePattern = (props) => {
-  return (
-    <>
-      <DatePicker
-          controlsEndId="end-date-picker"
-          controlsStartId="start-date-picker"
-          mode="range"
-          pickerId="quickpick-for-range"
-          placeholder="Select a Range"
-          selectionType="quickpick"
-          {...props}
-      />
-
-      <DatePicker
-          pickerId="start-date-picker"
-          placeholder="Select a Start Date"
-          syncStartWith="quickpick-for-range"
-          {...props}
-      />
-
-      <DatePicker
-          pickerId="end-date-picker"
-          placeholder="Select a End Date"
-          syncEndWith="quickpick-for-range"
-          {...props}
-      />
-    </>
-  );
-};
-
-export default DatePickerRangePattern;

data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_range_pattern.md

@@ -1,14 +0,0 @@
-You can link a Quickpick DatePicker to standard DatePickers using the following props:
-
-**For the Quickpick DatePicker**:
-`controlsStartId`: ID of the DatePicker that should receive the start date.
-
-`controlsEndId`: ID of the DatePicker that should receive the end date.
-
-When a quickpick option like “This Year” is selected, it automatically populates the linked start and end inputs.
-
-**For the Start/End DatePickers**:
-`syncStartWith`: ID of the quickpick this start date is synced to.
-`syncEndWith`: ID of the quickpick this end date is synced to.
-
-When a user manually edits the start or end date, it clears the selected quickpick to prevent conflicting values.

data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_range_pattern_rails.html.erb

@@ -1,20 +0,0 @@
-<%= pb_rails("date_picker", props: {
-  mode: "range",
-  picker_id: "quick-pick-date-range",
-  placeholder: "Select a Date Range",
-  selection_type: "quickpick",
-  controls_end_id: "quick-pick-date-range-end",
-  controls_start_id: "quick-pick-date-range-start",
-}) %>
-
-<%= pb_rails("date_picker", props: {
-  picker_id: "quick-pick-date-range-start",
-  placeholder: "Select a Start Date",
-  sync_start_with:"quick-pick-date-range",
-}) %>
-
-<%= pb_rails("date_picker", props: {
-  picker_id: "quick-pick-date-range-end",
-  placeholder: "Select an End Date",
-  sync_end_with:"quick-pick-date-range",
-}) %>

data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_range_pattern_rails.md

@@ -1,14 +0,0 @@
-You can link a Quickpick DatePicker to standard DatePickers using the following props:
-
-**For the Quickpick DatePicker**:
-`controls_start_id`: ID of the DatePicker that should receive the start date.
-
-`controls_end_id`: ID of the DatePicker that should receive the end date.
-
-When a quickpick option like “This Year” is selected, it automatically populates the linked start and end inputs.
-
-**For the Start/End DatePickers**:
-`sync_start_with`: ID of the quickpick this start date is synced to.
-`sync_end_with`: ID of the quickpick this end date is synced to.
-
-When a user manually edits the start or end date, it clears the selected quickpick to prevent conflicting values.

data/app/pb_kits/playbook/pb_line_graph/docs/_line_graph_pb_styles.jsx

@@ -1,52 +0,0 @@
-import React from 'react'
-import lineGraphTheme from '../lineGraphTheme'
-import Highcharts from "highcharts"
-import HighchartsReact from "highcharts-react-official"
-
-const data = [{
-  name: 'Installation',
-  data: [43934, 52503, 57177, 69658, 97031, 119931, 137133, 154175],
-}, {
-  name: 'Manufacturing',
-  data: [24916, 24064, 29742, 29851, 32490, 30282, 38121, 40434],
-}, {
-  name: 'Sales & Distribution',
-  data: [11744, 17722, 16005, 19771, 20185, 24377, 32147, 39387],
-}, {
-  name: 'Project Development',
-  data: [null, null, 7988, 12169, 15112, 22452, 34400, 34227],
-}, {
-  name: 'Other',
-  data: [12908, 5948, 8105, 11248, 8989, 11816, 18274, 18111],
-}]
-
-const categories = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
-
-const baseOptions = {
-  series: data,
-  title: { text: "Solar Employment Growth by Sector, 2010-2016" },
-  subtitle: { text: "Source: thesolarfoundation.com" },
-  xAxis: {
-    categories: categories,
-  },
-  yAxis: {
-    title: {
-      text: "Number of Employees",
-    },
-  },
-}
-
-const LineGraphPbStyles = () => {
-  const options = Highcharts.merge({}, lineGraphTheme, baseOptions)
-
-  return(
-    <div>
-      <HighchartsReact
-          highcharts={Highcharts}
-          options={options}
-      />
-    </div>
-  )
-}
-
-export default LineGraphPbStyles

data/app/pb_kits/playbook/pb_line_graph/docs/_line_graph_pb_styles.md

@@ -1 +0,0 @@
-You don't need to use the Line Graph Kit to apply Playbook styles to your Highcharts line graph. Just import lineGraphTheme.ts and merge it with your graph options—Playbook’s styling will apply automatically.