playbook_ui_docs 14.9.0.pre.alpha.PLAY16264952 → 14.9.0.pre.alpha.pbntr700newresettodefaultprop4736

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: b467fbcae42be9e319abfbe8598c7faac4e81b90c8b0e9e917f2e10cc80e88a3
-  data.tar.gz: 509c4072db236dfab4715bcab6a0b781b01bd72521366a0f57389fa847d9df32
+  metadata.gz: 5919b5e54cea8382d0c3e75f48f10d2332ffd2c933bcb5530e9246e55d69f930
+  data.tar.gz: 17502d32d2992da54fe67d9689a8a5f395e6ccc5172725a8a28a2e54efd06d75
 SHA512:
-  metadata.gz: b0b6b3151f01ea063e24f2bad4c8358fcdb9e9f7b2339bed8dc8767c15bfdccbe37c8fd5607e2dc64aa7fadfa8d5438e598efb0b582e2b84525521a13c04edc8
-  data.tar.gz: a1798e5a109c940e7133ac624b9a22bf3a93267d4fead3b7647ab9849c3b97327d510c4f1664b1b31683e288ada514679bb506c1dfff047854d0bb8ee360094a
+  metadata.gz: 8494d5893ca61cad7f55fe8fd505506ed3f3b757c823c2be7757875dcacbacff18ce5edd573a6933b19daf331ce8bcf2a480525d9d77808d94c3adc1e69f4b7c
+  data.tar.gz: 1419f7d34fac7c22c04eca45ff4fb9bf8fd104ed45797a52d1ca2f4035bde4e5d56d435ccf15ebdbbd009529bf447b3a9171bd8b91535b8e8d7ff0bc9d81f0e6

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

@@ -18,5 +18,3 @@ examples:
   - advanced_table_inline_row_loading: Inline Row Loading
   - advanced_table_responsive: Responsive Tables
   - advanced_table_custom_cell: Custom Components for Cells
-  - advanced_table_pagination: Pagination
-  - advanced_table_pagination_with_props: Pagination Props

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

@@ -10,5 +10,3 @@ export { default as AdvancedTableTableProps } from './_advanced_table_table_prop
 export { default as AdvancedTableInlineRowLoading } from './_advanced_table_inline_row_loading.jsx'
 export { default as AdvancedTableResponsive } from './_advanced_table_responsive.jsx'
 export { default as AdvancedTableCustomCell } from './_advanced_table_custom_cell.jsx'
-export { default as AdvancedTablePagination } from './_advanced_table_pagination.jsx'
-export { default as AdvancedTablePaginationWithProps } from './_advanced_table_pagination_with_props.jsx'

data/app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_custom.jsx

@@ -1,70 +1,66 @@
 import React from 'react'
-import ReactDOMServer from 'react-dom/server'
-import BarGraph from '../_bar_graph'
-import Icon from '../../pb_icon/_icon'
 
-const chartData = [
-  {
-    name: 'Role',
-    data: [0, 200, 300, 654, 656],
-  },
-  {
-    name: 'Company',
-    data: [150, 524, 320, 440, 500],
-  },
-]
+import BarGraph from '../_bar_graph'
 
-const renderIcon = (iconName, color) => {
-  return ReactDOMServer.renderToStaticMarkup(
-  <Icon
-      color={color}
-      icon={iconName}
-  />)
-};
+const chartData = [{
+  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],
+}]
 
 const barGraphOptions = {
-  yAxis: {
-    tickInterval: 5,
+  subtitle: {
+    text: "Overwritten subtitle",
+    style: {
+      color: "red"
+    }
   },
   xAxis: {
-    categories: ['1', '2', '3', '4', '5'],
-    labels: {
-      useHTML: true,
-      formatter: function () {
-        switch (this.value) {
-          case '1':
-            return `${renderIcon('frown', 'error')}`;
-          case '2':
-            return `${renderIcon('frown', 'warning')}`;
-          case '3':
-            return `${renderIcon('frown-open', 'neutral')}`;
-          case '4':
-            return `${renderIcon('smile', 'category_7')}`;
-          case '5':
-            return `${renderIcon('smile-beam', 'success')}`;
-          default:
-            return ''
-        }
-      },
-      style: {
-        fontSize: '1.4em',
-      },
-      y: 42,
-    },
-  },
-  legend: {
-    itemMarginTop: 62,
-  },
+      labels: {
+          useHTML: true,
+          formatter: function() {
+              switch (this.value) {
+                  case 'Jan':
+                      return `<i class="far fa-apple-whole"></i> ${this.value}`
+                  case 'Feb':
+                      return `<i class="far fa-strawberry"></i> ${this.value}`
+                  case 'Mar':
+                      return `<i class="far fa-lemon"></i> ${this.value}`
+                  case 'Apr':
+                      return `<i class="far fa-pear"></i> ${this.value}`
+                  case 'May':
+                      return `<i class="far fa-peach"></i> ${this.value}`
+                  default:
+                      return ''
+              }
+          }
+      }
+  }
 }
 
-const BarGraphCustom = () => (
+const BarGraphCustom = (props) => (
   <div>
     <BarGraph
+        axisTitle="Number of Employees"
         chartData={chartData}
         customOptions={barGraphOptions}
-        id="happiness-dashboard"
-        legend
+        id="bar-custom"
+        subTitle="Subtitle to replace"
         title="Bar Graph with Custom Overrides"
+        xAxisCategories={['Jan', 'Feb', 'Mar', 'Apr', 'May']}
+        yAxisMin={0}
+        {...props}
     />
   </div>
 )

data/app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_custom_rails.html.erb

@@ -1,42 +1,49 @@
 <% data = [{
-  name: 'Role',
-  data: [0, 200, 300, 654, 656],
+    name: 'Installation',
+    data: [1475,200,3000,654,656]
 }, {
-  name: 'Company',
-  data: [150, 524, 320, 440, 500],
+    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]
 }] %>
 
 <% bar_graph_options = {
-  customOptions: {
-    yAxis: {
-      tickInterval: 5,
-    },
-    xAxis: {
-      categories: [
-        raw(pb_rails("icon", props: { icon: "frown", color: "error", size: "2x" })),
-        raw(pb_rails("icon", props: { icon: "frown", color: "warning", size: "2x" })),
-        raw(pb_rails("icon", props: { icon: "frown-open", color: "neutral", size: "2x" })),
-        raw(pb_rails("icon", props: { icon: "smile", color: "category_7", size: "2x" })),
-        raw(pb_rails("icon", props: { icon: "smile-beam", color: "success", size: "2x" }))
-      ],
-      labels: {
-        useHTML: true,
-        sytle: {
-          fontSize: '1.4em',
+    customOptions: {
+        subtitle: {
+            text: "Overwritten subtitle",
+            style: {
+                color: "red"
+            }
         },
-        y: 42,
-      },
-    },
-    legend: {
-      itemMarginTop: 62,
-    },
-  } 
+        xAxis: {
+            categories: [
+                '<i class="far fa-apple-whole"></i> Jan',
+                '<i class="far fa-strawberry"></i> Feb',
+                '<i class="far fa-lemon"></i> Mar',
+                '<i class="far fa-pear"></i> Apr',
+                '<i class="far fa-peach"></i> May'
+            ],
+            labels: {
+                useHTML: true,
+            }
+        }
+    }
 } %>
 
 <%= pb_rails("bar_graph", props: {
+    axis_title: 'Number of Employees',
     chart_data: data,
     id: "bar-default",
-    legend: true,
+    y_axis_min: 0,
+    subtitle: 'Subtitle to replace',
     title: 'Bar Graph with Custom Overrides',
     custom_options: bar_graph_options
-}) %>
+}) %>

data/app/pb_kits/playbook/pb_bread_crumbs/docs/_bread_crumbs_default.jsx

@@ -13,7 +13,6 @@ const BreadCrumbsDefault = (props) => {
       <Icon
           icon="home"
           size="1x"
-          {...props}
       />
       <BreadCrumbItem
           {...props}
@@ -23,13 +22,11 @@ const BreadCrumbsDefault = (props) => {
             size="4"
             tag="span"
             text="Home"
-            {...props}
         />
       </BreadCrumbItem>
       <Icon
           icon="users"
           size="1x"
-          {...props}
       />
       <Link
           {...props}
@@ -39,20 +36,17 @@ const BreadCrumbsDefault = (props) => {
             size="4"
             tag="span"
             text="Users"
-            {...props}
         />
       </Link>
       <Icon
           icon="user"
           size="1x"
-          {...props}
       />
       <Link {...props}>
         <Title
             size="4"
             tag="span"
             text="User"
-            {...props}
         />
       </Link>
     </BreadCrumbs>

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

@@ -9,13 +9,12 @@ examples:
     - checkbox_disabled: Disabled Checkbox
 
   react:
-    - checkbox_default: Default
-    - checkbox_checked: Load as checked
-    - checkbox_custom: Custom Checkbox
-    - checkbox_error: Default w/ Error
-    - checkbox_indeterminate: Indeterminate Checkbox
-    - checkbox_disabled: Disabled Checkbox
-    - checkbox_form: Checkbox Form
+  - checkbox_default: Default
+  - checkbox_checked: Load as checked
+  - checkbox_custom: Custom Checkbox
+  - checkbox_error: Default w/ Error
+  - checkbox_indeterminate: Indeterminate Checkbox
+  - checkbox_disabled: Disabled Checkbox
 
   swift:
     - checkbox_default_swift: Default

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

@@ -4,4 +4,3 @@ export { default as CheckboxError } from './_checkbox_error.jsx'
 export { default as CheckboxChecked } from './_checkbox_checked.jsx'
 export { default as CheckboxIndeterminate } from './_checkbox_indeterminate.jsx'
 export { default as CheckboxDisabled } from './_checkbox_disabled.jsx'
-export { default as CheckboxForm } from './_checkbox_form.jsx'

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

@@ -2,6 +2,7 @@ examples:
 
   rails:
   - date_picker_default: Default
+  - date_picker_reset_to_default: Reset to Default
   - date_picker_hide_icon: Hide Input Icon
   - date_picker_default_date: Default Date
   - date_picker_allow_input: Allow Input

data/app/pb_kits/playbook/pb_form/docs/_form_form_with.html.erb

@@ -45,11 +45,12 @@
     class: "checkbox-class"
   %>
   <%= form.date_picker :example_date_picker_1, props: { label: true } %>
+  <%= form.date_picker :example_date_picker_2,  props: { label: true,  reset_to_default: true, default_date: "06/09/1994" } %>
   <%= form.star_rating_field :example_star_rating, props: { variant: "interactive", label: true } %>
 
   <%= form.actions do |action| %>
     <%= action.submit %>
-    <%= action.button props: { type: "reset", text: "Cancel", variant: "secondary" } %>
+    <%= action.button props: { type: "reset", text: "Cancel", variant: "secondary", onclick: "resetDates()"  } %>
   <% end %>
 <% end %>
 

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

@@ -30,7 +30,6 @@ examples:
   - select_inline_show_arrow: Select Inline (Always Show Arrow)
   - select_inline_compact: Select Inline Compact
   - select_multiple: Select Multiple
-  - select_form: Form
 
   swift:
   - select_default_swift: Default

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

@@ -10,4 +10,3 @@ export { default as SelectInline } from './_select_inline.jsx'
 export { default as SelectInlineShowArrow } from './_select_inline_show_arrow.jsx'
 export { default as SelectInlineCompact } from './_select_inline_compact.jsx'
 export { default as SelectMultiple } from './_select_multiple.jsx'
-export { default as SelectForm } from './_select_form.jsx'

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

@@ -55,8 +55,3 @@ examples:
     - table_with_subcomponents: Table with Sub Components (Table Elements)
     - table_with_subcomponents_as_divs: Table with Sub Components (Divs)
     - table_outer_padding: Outer Padding
-    - table_with_collapsible: Table with Collapsible
-    - table_with_collapsible_with_custom_click: Table with Collapsible with Custom Click
-    - table_with_collapsible_with_custom_content: Table with Collapsible with Custom Content
-    - table_with_collapsible_with_nested_rows: Table with Collapsible with Nested Rows
-    - table_with_collapsible_with_nested_table: Table with Collapsible with Nested Table

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

@@ -26,8 +26,3 @@ export { default as TableWithSubcomponents } from './_table_with_subcomponents.j
 export { default as TableWithSubcomponentsAsDivs } from './_table_with_subcomponents_as_divs.jsx'
 export { default as TableOuterPadding } from './_table_outer_padding.jsx'
 export { default as TableStickyLeftColumns } from './_table_sticky_left_columns.jsx'
-export { default as TableWithCollapsible } from './_table_with_collapsible.jsx'
-export { default as TableWithCollapsibleWithCustomContent } from './_table_with_collapsible_with_custom_content.jsx'
-export { default as TableWithCollapsibleWithNestedTable } from './_table_with_collapsible_with_nested_table.jsx'
-export { default as TableWithCollapsibleWithNestedRows } from './_table_with_collapsible_with_nested_rows.jsx'
-export { default as TableWithCollapsibleWithCustomClick } from './_table_with_collapsible_with_custom_click.jsx'