RubyGems - playbook_ui - Versions diffs - 7.0.1.pre.alpha12 → 7.0.1.pre.alpha14 - Mend

playbook_ui 7.0.1.pre.alpha12 → 7.0.1.pre.alpha14

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (156) hide show

data/app/pb_kits/playbook/pb_user_badge/_user_badge.jsx CHANGED

@@ -26,8 +26,11 @@ const UserBadge = (props: UserBadgeProps) => {
   const image = require(`./badges/_${badge}.svg`)
   const ariaProps = buildAriaProps(aria)
   const dataProps = buildDataProps(data)
-  const classes = classnames(buildCss('pb_user_badge_kit', size), globalProps(props),
-    className)
+  const classes = classnames(
+    buildCss('pb_user_badge_kit', size),
+    globalProps(props),
+    className
+  )
   return (
     <div

data/app/pb_kits/playbook/plugins/pb_chart.js CHANGED

@@ -33,7 +33,7 @@ const mapColors = (array) => {
 // Adjust Circle Chart Block Kit Dimensions to Match the Chart for Centering
 const alignBlockElement = (event) => {
-  const itemToMove = document.querySelector(`#wrapper-circle-chart-${event.target.renderTo.id} .pb_circle_chart_block`)
+  const itemToMove = document.querySelector(`#wrapper-circle-chart-${event.target.renderTo.id} .pb-circle-chart-block`)
   const chartContainer = document.querySelector(`#${event.target.renderTo.id}`)
   if (itemToMove !== null) {
     itemToMove.style.height = `${event.target.chartHeight}px`

data/app/pb_kits/playbook/tokens/_typography.scss CHANGED

@@ -39,9 +39,9 @@ $heading_4: $font_base;
 // Letter Spacing
-$lspace_tightest:         _.1em;
-$lspace_tighter:          _.07em;
-$lspace_tight:            _.03em;
+$lspace_tightest:         -.1em;
+$lspace_tighter:          -.07em;
+$lspace_tight:            -.03em;
 $lspace_normal:           0;
 $lspace_loose:            .03em;
 $lspace_looser:           .07em;

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

@@ -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, globalProps(props))
+  const classes = classnames(buildCss('pb_<%= @kit_name_underscore %>'), globalProps(props), className)
   return (
     <div

data/lib/playbook/version.rb CHANGED

@@ -1,4 +1,4 @@
 # frozen_string_literal: true
 module Playbook
-  VERSION = "7.0.1-alpha12"
+  VERSION = "7.0.1-alpha14"
 end

metadata CHANGED

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: playbook_ui
 version: !ruby/object:Gem::Version
-  version: 7.0.1.pre.alpha12
+  version: 7.0.1.pre.alpha14
 platform: ruby
 authors:
 - Power UX
@@ -9,7 +9,7 @@ authors:
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2020-09-10 00:00:00.000000000 Z
+date: 2020-10-07 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: actionpack
@@ -464,6 +464,14 @@ files:
 - app/pb_kits/playbook/pb_avatar_action_button/docs/_avatar_action_button_tooltip.html.erb
 - app/pb_kits/playbook/pb_avatar_action_button/docs/example.yml
 - app/pb_kits/playbook/pb_avatar_action_button/docs/index.js
+- app/pb_kits/playbook/pb_background/_background.html.erb
+- app/pb_kits/playbook/pb_background/_background.jsx
+- app/pb_kits/playbook/pb_background/_background.scss
+- app/pb_kits/playbook/pb_background/background.rb
+- app/pb_kits/playbook/pb_background/docs/_background_default.html.erb
+- app/pb_kits/playbook/pb_background/docs/_background_default.jsx
+- app/pb_kits/playbook/pb_background/docs/example.yml
+- app/pb_kits/playbook/pb_background/docs/index.js
 - app/pb_kits/playbook/pb_badge/_badge.html.erb
 - app/pb_kits/playbook/pb_badge/_badge.jsx
 - app/pb_kits/playbook/pb_badge/_badge.scss
@@ -604,21 +612,33 @@ files:
 - app/pb_kits/playbook/pb_checkbox/docs/_checkbox_default.jsx
 - app/pb_kits/playbook/pb_checkbox/docs/_checkbox_error.html.erb
 - app/pb_kits/playbook/pb_checkbox/docs/_checkbox_error.jsx
+- app/pb_kits/playbook/pb_checkbox/docs/_checkbox_options.html.erb
 - app/pb_kits/playbook/pb_checkbox/docs/_description.md
 - app/pb_kits/playbook/pb_checkbox/docs/example.yml
 - app/pb_kits/playbook/pb_checkbox/docs/index.js
 - app/pb_kits/playbook/pb_circle_chart/_circle_chart.html.erb
+- app/pb_kits/playbook/pb_circle_chart/_circle_chart.jsx
 - app/pb_kits/playbook/pb_circle_chart/_circle_chart.scss
 - app/pb_kits/playbook/pb_circle_chart/circle_chart.rb
 - app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_block.html.erb
+- app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_block.jsx
 - app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_colors.html.erb
+- app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_colors.jsx
 - app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_default.html.erb
+- app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_default.jsx
 - app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_inner_sizes.html.erb
+- app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_inner_sizes.jsx
+- app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_live_data.jsx
 - app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_rounded.html.erb
+- app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_rounded.jsx
 - app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_with_labels.html.erb
+- app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_with_labels.jsx
 - app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_with_legend_kit.html.erb
+- app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_with_legend_kit.jsx
 - app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_with_title.html.erb
+- app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_with_title.jsx
 - app/pb_kits/playbook/pb_circle_chart/docs/example.yml
+- app/pb_kits/playbook/pb_circle_chart/docs/index.js
 - app/pb_kits/playbook/pb_circle_icon_button/_circle_icon_button.html.erb
 - app/pb_kits/playbook/pb_circle_icon_button/_circle_icon_button.jsx
 - app/pb_kits/playbook/pb_circle_icon_button/_circle_icon_button.scss
@@ -677,6 +697,8 @@ files:
 - app/pb_kits/playbook/pb_date/date.rb
 - app/pb_kits/playbook/pb_date/docs/_date_default.html.erb
 - app/pb_kits/playbook/pb_date/docs/_date_default.jsx
+- app/pb_kits/playbook/pb_date/docs/_date_timezone.html.erb
+- app/pb_kits/playbook/pb_date/docs/_date_timezone.md
 - app/pb_kits/playbook/pb_date/docs/_description.md
 - app/pb_kits/playbook/pb_date/docs/example.yml
 - app/pb_kits/playbook/pb_date/docs/index.js
@@ -685,6 +707,9 @@ files:
 - app/pb_kits/playbook/pb_date_picker/_date_picker.scss
 - app/pb_kits/playbook/pb_date_picker/date_picker.rb
 - app/pb_kits/playbook/pb_date_picker/date_picker_helper.js
+- app/pb_kits/playbook/pb_date_picker/docs/_date_picker_allow_input.html.erb
+- app/pb_kits/playbook/pb_date_picker/docs/_date_picker_allow_input.jsx
+- app/pb_kits/playbook/pb_date_picker/docs/_date_picker_allow_input.md
 - app/pb_kits/playbook/pb_date_picker/docs/_date_picker_dark.html.erb
 - app/pb_kits/playbook/pb_date_picker/docs/_date_picker_dark.jsx
 - app/pb_kits/playbook/pb_date_picker/docs/_date_picker_default.html.erb
@@ -711,11 +736,10 @@ files:
 - app/pb_kits/playbook/pb_date_picker/docs/_date_picker_label.md
 - app/pb_kits/playbook/pb_date_picker/docs/_date_picker_min_max.html.erb
 - app/pb_kits/playbook/pb_date_picker/docs/_date_picker_min_max.jsx
+- app/pb_kits/playbook/pb_date_picker/docs/_date_picker_on_change.jsx
+- app/pb_kits/playbook/pb_date_picker/docs/_date_picker_on_change.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_read_only.html.erb
-- app/pb_kits/playbook/pb_date_picker/docs/_date_picker_read_only.jsx
-- app/pb_kits/playbook/pb_date_picker/docs/_date_picker_read_only.md
 - app/pb_kits/playbook/pb_date_picker/docs/_date_picker_year_range.html.erb
 - app/pb_kits/playbook/pb_date_picker/docs/_date_picker_year_range.jsx
 - app/pb_kits/playbook/pb_date_picker/docs/_date_picker_year_range.md
@@ -1373,6 +1397,7 @@ files:
 - app/pb_kits/playbook/pb_radio/docs/_radio_error.html.erb
 - app/pb_kits/playbook/pb_radio/docs/_radio_error.jsx
 - app/pb_kits/playbook/pb_radio/docs/_radio_error.md
+- app/pb_kits/playbook/pb_radio/docs/_radio_options.html.erb
 - app/pb_kits/playbook/pb_radio/docs/example.yml
 - app/pb_kits/playbook/pb_radio/docs/index.js
 - app/pb_kits/playbook/pb_radio/radio.rb
@@ -1590,12 +1615,16 @@ 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.html.erb
 - app/pb_kits/playbook/pb_time/docs/_time_align.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_sizes.html.erb
+- app/pb_kits/playbook/pb_time/docs/_time_sizes.jsx
 - 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/_time_timezone.html.erb
 - app/pb_kits/playbook/pb_time/docs/_time_timezone.jsx
 - app/pb_kits/playbook/pb_time/docs/_time_timezone.md
 - app/pb_kits/playbook/pb_time/docs/example.yml
@@ -1697,8 +1726,6 @@ files:
 - 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
@@ -1710,12 +1737,27 @@ files:
 - app/pb_kits/playbook/pb_tooltip/index.js
 - app/pb_kits/playbook/pb_tooltip/tooltip.rb
 - app/pb_kits/playbook/pb_typeahead/_typeahead.html.erb
+- app/pb_kits/playbook/pb_typeahead/_typeahead.jsx
 - app/pb_kits/playbook/pb_typeahead/_typeahead.scss
+- app/pb_kits/playbook/pb_typeahead/components/Control.jsx
+- app/pb_kits/playbook/pb_typeahead/components/IndicatorsContainer.jsx
+- app/pb_kits/playbook/pb_typeahead/components/MenuList.jsx
+- app/pb_kits/playbook/pb_typeahead/components/MultiValue.jsx
+- app/pb_kits/playbook/pb_typeahead/components/Option.jsx
+- app/pb_kits/playbook/pb_typeahead/components/Placeholder.jsx
+- app/pb_kits/playbook/pb_typeahead/components/ValueContainer.jsx
 - app/pb_kits/playbook/pb_typeahead/docs/_description.md
 - app/pb_kits/playbook/pb_typeahead/docs/_footer.md
 - app/pb_kits/playbook/pb_typeahead/docs/_typeahead_default.html.erb
+- app/pb_kits/playbook/pb_typeahead/docs/_typeahead_default.jsx
 - app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_context_dark.html.erb
+- app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_pills.jsx
+- app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_pills_async.jsx
+- app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_pills_async_summary.jsx
+- app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_pills_async_users.jsx
+- app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_pills_summary.jsx
 - app/pb_kits/playbook/pb_typeahead/docs/example.yml
+- app/pb_kits/playbook/pb_typeahead/docs/index.js
 - app/pb_kits/playbook/pb_typeahead/index.js
 - app/pb_kits/playbook/pb_typeahead/typeahead.rb
 - app/pb_kits/playbook/pb_user/_user.html.erb
@@ -1879,7 +1921,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
     - !ruby/object:Gem::Version
       version: 1.3.1
 requirements: []
-rubygems_version: 3.1.2
+rubygems_version: 3.1.4
 signing_key:
 specification_version: 4
 summary: Playbook Design System

data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_read_only.jsx DELETED

@@ -1,13 +0,0 @@
-import React from 'react'
-import { DatePicker } from '../../'
-const DatePickerReadOnly = () => (
-  <div>
-    <DatePicker
-        pickerId="date-picker-read-only"
-        readOnly
-    />
-  </div>
-)
-export default DatePickerReadOnly

data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_read_only.md DELETED

	@@ -1 +0,0 @@
1	- Read only inputs do not accept keyboard input. The only way to change the date value is by picking a date on the calendar. Especially useful on mobile as it prevents the keyboard from popping up and obscuring the date picker.

data/app/pb_kits/playbook/pb_toggle/docs/_toggle_size.html.erb DELETED

@@ -1,11 +0,0 @@
-<%= pb_rails("toggle", props: {
-  size: "sm",
-  checked: false
-}) %>
-<br>
-<%= pb_rails("toggle", props: {
-  size: "md",
-  checked: false
-}) %>

data/app/pb_kits/playbook/pb_toggle/docs/_toggle_size.jsx DELETED

@@ -1,44 +0,0 @@
-// @flow
-import React, { useState } from 'react'
-import { Toggle } from '../..'
-const ToggleSize = () => {
-  const [choice, setChoice] = useState(false)
-  const handleOnChange = ({ target }) => {
-    setChoice(target.value = !choice)
-  }
-  return (
-    <>
-      <Toggle
-          checked={choice}
-          size="sm"
-      >
-        <input
-            name="toggleSmall"
-            onChange={handleOnChange}
-            type="checkbox"
-            value="toggleSmall"
-        />
-      </Toggle>
-      <br />
-      <Toggle
-          checked={choice}
-          size="md"
-      >
-        <input
-            name="toggleMedium"
-            onChange={handleOnChange}
-            type="checkbox"
-            value="toggleMedium"
-        />
-      </Toggle>
-    </>
-  )
-}
-export default ToggleSize