playbook_ui 6.0.1.pre.alpha4 → 6.1.0.pre.alpha2

data/app/pb_kits/playbook/props.rb

@@ -43,11 +43,16 @@ module Playbook
       end.compact.join(" ")
     end
 
+    def dark_props
+      dark ? "dark" : nil
+    end
+
     def generate_classname(*name_parts, separator: "_")
       [
         name_parts.compact.join(separator),
         prop(:classname),
         spacing_props,
+        dark_props
       ].compact.join(" ")
     end
 
@@ -81,6 +86,7 @@ module Playbook
       prop :padding_top
       prop :padding_x
       prop :padding_y
+      prop :dark, type: Playbook::Props::Boolean, default: false
     end
 
     def spacing_options

data/app/pb_kits/playbook/utilities/{spacing.js → globalProps.js}

@@ -1,4 +1,5 @@
-export const spacing = ({
+// Prop categories
+const spacingProps = ({
   marginRight,
   marginLeft,
   marginTop,
@@ -31,3 +32,15 @@ export const spacing = ({
   css += padding ? `p_${padding} ` : ''
   return css
 }
+
+const darkProps = ({ dark }) => {
+  let css = ''
+  css += dark ? 'dark' : ''
+  return css
+}
+
+// All Exported as a single function
+export const globalProps = (props, defaultProps = {}) => {
+  const allProps = { ...props, ...defaultProps }
+  return spacingProps(allProps) + darkProps(allProps)
+}

data/app/pb_kits/playbook/utilities/props.js

@@ -46,3 +46,4 @@ export const buildDataProps = (data) => buildPrefixedProps('data', data)
  * @returns {String} the derived root className value.
  */
 export const buildCss = (...rules) => classnames(rules).replace(/\s/g, '_')
+

data/lib/generators/kit/templates/kit_jsx.erb.tt

@@ -38,7 +38,7 @@ props_names = @kit_props.keys.map do |key|
 import React from 'react'
 import classnames from 'classnames'
 import { buildAriaProps, buildCss, buildDataProps } from '../utilities/props'
-import { spacing } from '../utilities/spacing.js'
+import { globalProps } from '../utilities/globalProps.js'
 
 type <%= type_name %> = {
   <%= break_lines.call(props_types) %>
@@ -51,7 +51,7 @@ const <%= @kit_name_pascal %> = (props: <%= type_name %>) => {
 
   const ariaProps = buildAriaProps(aria)
   const dataProps = buildDataProps(data)
-  const classes = classnames(buildCss('pb_<%= @kit_name_underscore %>'), className, spacing(props))
+  const classes = classnames(buildCss('pb_<%= @kit_name_underscore %>'), className, globalProps(props))
 
   return (
     <div

data/lib/playbook/version.rb

@@ -1,5 +1,5 @@
 # frozen_string_literal: true
 
 module Playbook
-  VERSION = "6.0.1.pre.alpha4"
+  VERSION = "6.1.0.pre.alpha2"
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: playbook_ui
 version: !ruby/object:Gem::Version
-  version: 6.0.1.pre.alpha4
+  version: 6.1.0.pre.alpha2
 platform: ruby
 authors:
 - Power UX
@@ -9,7 +9,7 @@ authors:
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2020-08-05 00:00:00.000000000 Z
+date: 2020-08-07 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: actionpack
@@ -522,6 +522,21 @@ files:
 - app/pb_kits/playbook/pb_button/docs/_footer.md
 - app/pb_kits/playbook/pb_button/docs/example.yml
 - app/pb_kits/playbook/pb_button/docs/index.js
+- app/pb_kits/playbook/pb_button_toolbar/_button_toolbar.html.erb
+- app/pb_kits/playbook/pb_button_toolbar/_button_toolbar.jsx
+- app/pb_kits/playbook/pb_button_toolbar/_button_toolbar.scss
+- app/pb_kits/playbook/pb_button_toolbar/button_toolbar.rb
+- app/pb_kits/playbook/pb_button_toolbar/docs/_button_toolbar_default.html.erb
+- app/pb_kits/playbook/pb_button_toolbar/docs/_button_toolbar_default.jsx
+- app/pb_kits/playbook/pb_button_toolbar/docs/_button_toolbar_secondary.html.erb
+- app/pb_kits/playbook/pb_button_toolbar/docs/_button_toolbar_secondary.jsx
+- app/pb_kits/playbook/pb_button_toolbar/docs/_button_toolbar_vertical.html.erb
+- app/pb_kits/playbook/pb_button_toolbar/docs/_button_toolbar_vertical.jsx
+- app/pb_kits/playbook/pb_button_toolbar/docs/_button_toolbar_vertical_secondary.html.erb
+- app/pb_kits/playbook/pb_button_toolbar/docs/_button_toolbar_vertical_secondary.jsx
+- app/pb_kits/playbook/pb_button_toolbar/docs/_description.md
+- app/pb_kits/playbook/pb_button_toolbar/docs/example.yml
+- app/pb_kits/playbook/pb_button_toolbar/docs/index.js
 - app/pb_kits/playbook/pb_caption/_caption.html.erb
 - app/pb_kits/playbook/pb_caption/_caption.jsx
 - app/pb_kits/playbook/pb_caption/_caption.scss
@@ -870,6 +885,31 @@ files:
 - app/pb_kits/playbook/pb_form_pill/docs/example.yml
 - app/pb_kits/playbook/pb_form_pill/docs/index.js
 - app/pb_kits/playbook/pb_form_pill/form_pill.rb
+- app/pb_kits/playbook/pb_gauge/_gauge.html.erb
+- app/pb_kits/playbook/pb_gauge/_gauge.jsx
+- app/pb_kits/playbook/pb_gauge/_gauge.scss
+- app/pb_kits/playbook/pb_gauge/docs/_gauge_default.html.erb
+- app/pb_kits/playbook/pb_gauge/docs/_gauge_default.jsx
+- app/pb_kits/playbook/pb_gauge/docs/_gauge_disable_animation.html.erb
+- app/pb_kits/playbook/pb_gauge/docs/_gauge_disable_animation.jsx
+- app/pb_kits/playbook/pb_gauge/docs/_gauge_full_circle.html.erb
+- app/pb_kits/playbook/pb_gauge/docs/_gauge_full_circle.jsx
+- app/pb_kits/playbook/pb_gauge/docs/_gauge_height.html.erb
+- app/pb_kits/playbook/pb_gauge/docs/_gauge_height.jsx
+- app/pb_kits/playbook/pb_gauge/docs/_gauge_live_data.jsx
+- app/pb_kits/playbook/pb_gauge/docs/_gauge_min_max.html.erb
+- app/pb_kits/playbook/pb_gauge/docs/_gauge_min_max.jsx
+- app/pb_kits/playbook/pb_gauge/docs/_gauge_min_max.md
+- app/pb_kits/playbook/pb_gauge/docs/_gauge_sizing.html.erb
+- app/pb_kits/playbook/pb_gauge/docs/_gauge_sizing.jsx
+- app/pb_kits/playbook/pb_gauge/docs/_gauge_sizing.md
+- app/pb_kits/playbook/pb_gauge/docs/_gauge_title.html.erb
+- app/pb_kits/playbook/pb_gauge/docs/_gauge_title.jsx
+- app/pb_kits/playbook/pb_gauge/docs/_gauge_units.html.erb
+- app/pb_kits/playbook/pb_gauge/docs/_gauge_units.jsx
+- app/pb_kits/playbook/pb_gauge/docs/example.yml
+- app/pb_kits/playbook/pb_gauge/docs/index.js
+- app/pb_kits/playbook/pb_gauge/gauge.rb
 - app/pb_kits/playbook/pb_hashtag/_hashtag.html.erb
 - app/pb_kits/playbook/pb_hashtag/_hashtag.jsx
 - app/pb_kits/playbook/pb_hashtag/_hashtag.scss
@@ -1121,6 +1161,7 @@ files:
 - app/pb_kits/playbook/pb_loading_inline/docs/example.yml
 - app/pb_kits/playbook/pb_loading_inline/docs/index.js
 - app/pb_kits/playbook/pb_loading_inline/loading_inline.rb
+- app/pb_kits/playbook/pb_logistic/_logistic.jsx
 - app/pb_kits/playbook/pb_message/_message.html.erb
 - app/pb_kits/playbook/pb_message/_message.jsx
 - app/pb_kits/playbook/pb_message/_message.scss
@@ -1553,9 +1594,13 @@ files:
 - app/pb_kits/playbook/pb_time/_time.scss
 - app/pb_kits/playbook/pb_time/docs/_description.md
 - app/pb_kits/playbook/pb_time/docs/_footer.md
+- app/pb_kits/playbook/pb_time/docs/_time_align.jsx
+- app/pb_kits/playbook/pb_time/docs/_time_dark.jsx
 - app/pb_kits/playbook/pb_time/docs/_time_default.html.erb
+- app/pb_kits/playbook/pb_time/docs/_time_default.jsx
 - app/pb_kits/playbook/pb_time/docs/_time_default.md
 - app/pb_kits/playbook/pb_time/docs/_time_timestamp.html.erb
+- app/pb_kits/playbook/pb_time/docs/_time_timestamp.jsx
 - app/pb_kits/playbook/pb_time/docs/example.yml
 - app/pb_kits/playbook/pb_time/docs/index.js
 - app/pb_kits/playbook/pb_time/time.rb
@@ -1650,14 +1695,16 @@ files:
 - app/pb_kits/playbook/pb_toggle/_toggle.scss
 - app/pb_kits/playbook/pb_toggle/docs/_description.md
 - app/pb_kits/playbook/pb_toggle/docs/_footer.md
-- app/pb_kits/playbook/pb_toggle/docs/_toggle_accessibility.jsx
-- app/pb_kits/playbook/pb_toggle/docs/_toggle_checked.html.erb
 - app/pb_kits/playbook/pb_toggle/docs/_toggle_custom.html.erb
+- app/pb_kits/playbook/pb_toggle/docs/_toggle_custom.jsx
 - app/pb_kits/playbook/pb_toggle/docs/_toggle_custom_radio.html.erb
-- app/pb_kits/playbook/pb_toggle/docs/_toggle_data.jsx
+- app/pb_kits/playbook/pb_toggle/docs/_toggle_custom_radio.jsx
 - app/pb_kits/playbook/pb_toggle/docs/_toggle_default.html.erb
 - app/pb_kits/playbook/pb_toggle/docs/_toggle_default.jsx
 - app/pb_kits/playbook/pb_toggle/docs/_toggle_name.html.erb
+- app/pb_kits/playbook/pb_toggle/docs/_toggle_name.jsx
+- app/pb_kits/playbook/pb_toggle/docs/_toggle_size.html.erb
+- app/pb_kits/playbook/pb_toggle/docs/_toggle_size.jsx
 - app/pb_kits/playbook/pb_toggle/docs/example.yml
 - app/pb_kits/playbook/pb_toggle/docs/index.js
 - app/pb_kits/playbook/pb_toggle/toggle.rb
@@ -1757,8 +1804,8 @@ files:
 - app/pb_kits/playbook/utilities/_background_colors.scss
 - app/pb_kits/playbook/utilities/_colors.scss
 - app/pb_kits/playbook/utilities/_spacing.scss
+- app/pb_kits/playbook/utilities/globalProps.js
 - app/pb_kits/playbook/utilities/props.js
-- app/pb_kits/playbook/utilities/spacing.js
 - app/pb_kits/playbook/utilities/text.js
 - app/pb_kits/playbook/vendor.js
 - app/views/layouts/playbook/_mobile_hamburger.html.erb

data/app/pb_kits/playbook/pb_toggle/docs/_toggle_accessibility.jsx

@@ -1,12 +0,0 @@
-// @flow
-
-import React from 'react'
-import { Toggle } from '../..'
-
-const Example = () => {
-  return (
-    <Toggle aria={{ label: 'toggle', expanded: false }} />
-  )
-}
-
-export default Example

data/app/pb_kits/playbook/pb_toggle/docs/_toggle_data.jsx

@@ -1,15 +0,0 @@
-// @flow
-
-import React from 'react'
-import { Toggle } from '../..'
-
-const Example = () => {
-  return (
-    <Toggle
-        checked
-        data={{ id: 'the-toggle', expanded: true }}
-    />
-  )
-}
-
-export default Example