playbook_ui 13.9.0 → 13.10.0

data/app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_single.jsx

@@ -0,0 +1,87 @@
+import React from "react";
+import MultiLevelSelect from "../_multi_level_select";
+
+const treeData = [
+  {
+    label: "Power Home Remodeling",
+    value: "Power Home Remodeling",
+    id: "powerhome2",
+    expanded: true,
+    children: [
+      {
+        label: "People",
+        value: "People",
+        id: "people2",
+        expanded: true,
+        children: [
+          {
+            label: "Talent Acquisition",
+            value: "Talent Acquisition",
+            id: "talent2",
+          },
+          {
+            label: "Business Affairs",
+            value: "Business Affairs",
+            id: "business2",
+            children: [
+              {
+                label: "Initiatives",
+                value: "Initiatives",
+                id: "initiative2",
+              },
+              {
+                label: "Learning & Development",
+                value: "Learning & Development",
+                id: "development2",
+              },
+            ],
+          },
+          {
+            label: "People Experience",
+            value: "People Experience",
+            id: "experience2",
+          },
+        ],
+      },
+      {
+        label: "Contact Center",
+        value: "Contact Center",
+        id: "contact2",
+        children: [
+          {
+            label: "Appointment Management",
+            value: "Appointment Management",
+            id: "appointment2",
+          },
+          {
+            label: "Customer Service",
+            value: "Customer Service",
+            id: "customer2",
+          },
+          {
+            label: "Energy",
+            value: "Energy",
+            id: "energy2",
+          },
+        ],
+      },
+    ],
+  },
+];
+
+const MultiLevelSelectSingle = (props) => {
+  return (
+    <div>
+      <MultiLevelSelect
+          id="multiselect-single"
+          inputName="Power"
+          onSelect={(selectedNode) => console.log("Selected Node", selectedNode)}
+          treeData={treeData}
+          variant="single"
+          {...props}
+      />
+    </div>
+  )
+};
+
+export default MultiLevelSelectSingle;

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

@@ -1,12 +1,13 @@
 examples:
   rails:
   - multi_level_select_default: Default
+  - multi_level_select_single: Single Select
   - multi_level_select_return_all_selected: Return All Selected
   - multi_level_select_selected_ids: Selected Ids
   - multi_level_select_with_form: With Form
-  
+
   react:
   - multi_level_select_default: Default
+  - multi_level_select_single: Single Select
   - multi_level_select_return_all_selected: Return All Selected
   - multi_level_select_selected_ids: Selected Ids
-  

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

@@ -1,3 +1,4 @@
 export { default as MultiLevelSelectDefault } from './_multi_level_select_default.jsx'
+export { default as MultiLevelSelectSingle } from './_multi_level_select_single.jsx'
 export { default as MultiLevelSelectReturnAllSelected } from './_multi_level_select_return_all_selected.jsx'
-export { default as MultiLevelSelectSelectedIds } from "./_multi_level_select_selected_ids.jsx"
+export { default as MultiLevelSelectSelectedIds } from "./_multi_level_select_selected_ids.jsx"

data/app/pb_kits/playbook/pb_multi_level_select/multi_level_select.rb

@@ -14,6 +14,11 @@ module Playbook
       prop :input_display, type: Playbook::Props::Enum,
                            values: %w[pills none],
                            default: "pills"
+      prop :input_name, type: Playbook::Props::String,
+                        default: ""
+      prop :variant, type: Playbook::Props::Enum,
+                     values: %w[multi single],
+                     default: "multi"
 
       def classname
         generate_classname("pb_multi_level_select")
@@ -27,6 +32,8 @@ module Playbook
           treeData: tree_data,
           returnAllSelected: return_all_selected,
           selectedIds: selected_ids,
+          input_name: input_name,
+          variant: variant,
         }
       end
     end