playbook_ui_docs 13.32.0.pre.alpha.PBNTR405dropdownformfixesrails3301 → 13.32.0.pre.alpha.PLAY1138iconkitaddcolorprop3268

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: playbook_ui_docs
 version: !ruby/object:Gem::Version
-  version: 13.32.0.pre.alpha.PBNTR405dropdownformfixesrails3301
+  version: 13.32.0.pre.alpha.PLAY1138iconkitaddcolorprop3268
 platform: ruby
 authors:
 - Power UX
@@ -9,7 +9,7 @@ authors:
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2024-07-19 00:00:00.000000000 Z
+date: 2024-07-17 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: playbook_ui
@@ -644,13 +644,9 @@ files:
 - app/pb_kits/playbook/pb_draggable/docs/_draggable_with_selectable_list.md
 - app/pb_kits/playbook/pb_draggable/docs/example.yml
 - app/pb_kits/playbook/pb_draggable/docs/index.js
-- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_blank_selection.html.erb
-- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_blank_selection.jsx
 - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_default.html.erb
 - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_default.jsx
 - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_default.md
-- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_default_value.html.erb
-- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_default_value.jsx
 - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_error.html.erb
 - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_error.jsx
 - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_subcomponent_structure.jsx
@@ -888,6 +884,9 @@ files:
 - app/pb_kits/playbook/pb_icon/docs/_icon_border.html.erb
 - app/pb_kits/playbook/pb_icon/docs/_icon_border.jsx
 - app/pb_kits/playbook/pb_icon/docs/_icon_border_swift.md
+- app/pb_kits/playbook/pb_icon/docs/_icon_color.html.erb
+- app/pb_kits/playbook/pb_icon/docs/_icon_color.jsx
+- app/pb_kits/playbook/pb_icon/docs/_icon_color.md
 - app/pb_kits/playbook/pb_icon/docs/_icon_custom.html.erb
 - app/pb_kits/playbook/pb_icon/docs/_icon_custom.jsx
 - app/pb_kits/playbook/pb_icon/docs/_icon_custom.md
@@ -1195,8 +1194,6 @@ files:
 - app/pb_kits/playbook/pb_nav/docs/_subtle_no_highlight_nav.jsx
 - app/pb_kits/playbook/pb_nav/docs/_subtle_with_icons_nav.html.erb
 - app/pb_kits/playbook/pb_nav/docs/_subtle_with_icons_nav.jsx
-- app/pb_kits/playbook/pb_nav/docs/_tab_nav.html.erb
-- app/pb_kits/playbook/pb_nav/docs/_tab_nav.md
 - app/pb_kits/playbook/pb_nav/docs/_with_icons_nav.html.erb
 - app/pb_kits/playbook/pb_nav/docs/_with_icons_nav.jsx
 - app/pb_kits/playbook/pb_nav/docs/_with_img_nav.html.erb
@@ -1527,7 +1524,6 @@ files:
 - app/pb_kits/playbook/pb_star_rating/docs/_star_rating_default.jsx
 - app/pb_kits/playbook/pb_star_rating/docs/_star_rating_hide.html.erb
 - app/pb_kits/playbook/pb_star_rating/docs/_star_rating_hide.jsx
-- app/pb_kits/playbook/pb_star_rating/docs/_star_rating_interactive.html.erb
 - app/pb_kits/playbook/pb_star_rating/docs/_star_rating_number_config.html.erb
 - app/pb_kits/playbook/pb_star_rating/docs/_star_rating_number_config.jsx
 - app/pb_kits/playbook/pb_star_rating/docs/_star_rating_size_options.html.erb

data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_blank_selection.html.erb

@@ -1,10 +0,0 @@
-<% 
-  options = [
-    { label: 'United States', value: 'United States', id: 'us' },
-    { label: 'Canada', value: 'Canada', id: 'ca' },
-    { label: 'Pakistan', value: 'Pakistan', id: 'pk' },
-  ]
-
-%>
-
-<%= pb_rails("dropdown", props: { blank_selection: "Select One...", options: options }) %>

data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_blank_selection.jsx

@@ -1,31 +0,0 @@
-import React from 'react'
-import { Dropdown } from '../../'
-
-const DropdownBlankSelection = (props) => {
-  const options = [
-    {
-      label: "United States",
-      value: "United States",
-    },
-    {
-      label: "Canada",
-      value: "Canada",
-    },
-    {
-      label: "Pakistan",
-      value: "Pakistan",
-    }
-  ];
-
-  return (
-  <>
-    <Dropdown
-        blankSelection="Select one..."
-        options={options}
-        {...props}
-    />
-  </>
-  )
-}
-
-export default DropdownBlankSelection

data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_default_value.html.erb

@@ -1,10 +0,0 @@
-<% 
-  options = [
-    { label: 'United States', value: 'United States', id: 'us' },
-    { label: 'Canada', value: 'Canada', id: 'ca' },
-    { label: 'Pakistan', value: 'Pakistan', id: 'pk' },
-  ]
-
-%>
-
-<%= pb_rails("dropdown", props: {options: options, default_value: options.last}) %>

data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_default_value.jsx

@@ -1,31 +0,0 @@
-import React from 'react'
-import { Dropdown } from '../../'
-
-const DropdownDefaultValue = (props) => {
-  const options = [
-    {
-      label: "United States",
-      value: "United States",
-    },
-    {
-      label: "Canada",
-      value: "Canada",
-    },
-    {
-      label: "Pakistan",
-      value: "Pakistan",
-    }
-  ];  
-
-  return (
-  <>
-    <Dropdown
-        defaultValue={options[2]}
-        options={options}
-        {...props}
-    />
-  </>
-  )
-}
-
-export default DropdownDefaultValue

data/app/pb_kits/playbook/pb_nav/docs/_tab_nav.html.erb

@@ -1,48 +0,0 @@
-<%= pb_rails("nav", props: { orientation: "horizontal", tabbing: true, padding_bottom: "sm" }) do %>
-  <%= pb_rails("nav/item", props: { text: "About", active: true, data: { pb_tab_target: "about" }, cursor: "pointer" }) %>
-  <%= pb_rails("nav/item", props: { text: "Case Studies", data: { pb_tab_target: "case_studies" }, cursor: "pointer" }) %>
-  <%= pb_rails("nav/item", props: { text: "Service", data: { pb_tab_target: "service" }, cursor: "pointer" }) %>
-  <%= pb_rails("nav/item", props: { text: "Contacts", data: { pb_tab_target: "contacts" }, cursor: "pointer" }) %>
-<% end %>
-
-<div id="about">
-  <%= pb_rails("body", props: { text: "This is about!" }) %>
-</div>
-
-<div id="case_studies">
-  <%= pb_rails("body", props: { text: "This is case studies!" }) %>
-</div>
-
-<div id="service">
-  <%= pb_rails("body", props: { text: "This is service!" }) %>
-</div>
-
-<div id="contacts">
-  <%= pb_rails("body", props: { text: "This is contacts!" }) %>
-</div>
-
-<script>
-  // The script in the code snippet below is for demonstrating the active state and NOT needed for the kit to function.
-  // The active prop can be used to highlight this active state.
-  const navItemClass = "pb_nav_list_kit_item"
-  const navItemActiveClass = "pb_nav_list_kit_item_active"
-  const dataNavItems = "[data-pb-tab-target]"
-
-  const navItemTabs = document.querySelectorAll(dataNavItems)
-  navItemTabs.forEach(navItemTab => {
-    navItemTab.addEventListener("click", event => {
-      const navItemTabs = document.querySelectorAll(dataNavItems)
-      navItemTabs.forEach(navItemTab => {
-        if (navItemTab === event.target.closest(dataNavItems)) {
-          navItemTab.classList.add(navItemActiveClass)
-          navItemTab.classList.remove(navItemClass)
-        } else {
-          if (navItemTab.classList.contains(navItemActiveClass)) {
-            navItemTab.classList.remove(navItemActiveClass)
-            navItemTab.classList.add(navItemClass)
-          }
-        }
-      })
-    })
-  })
-</script>

data/app/pb_kits/playbook/pb_nav/docs/_tab_nav.md

@@ -1,3 +0,0 @@
-The Nav kit can also be used to create dynamic tabbing. To do so, use the boolean `tabbing` prop as shown here. 
-
-All divs you want to use as tabs MUST have an id attached to them. To link the tab to the nav, use the required data attribute `pb_tab_target` on each nav/item and pass it the id of the tab you want linked to that specific nav/item. See code example below to see this in action.

data/app/pb_kits/playbook/pb_star_rating/docs/_star_rating_interactive.html.erb

@@ -1 +0,0 @@
-<%= pb_rails("star_rating", props: { padding_bottom: "xs", variant: "interactive" }) %>