playbook_ui 6.1.0 → 6.2.0

data/app/pb_kits/playbook/pb_time/_time.jsx

@@ -11,11 +11,11 @@ import { Body, Icon, Title  } from '../'
 
 type TimeProps = {
   align?: 'left" | "center' | 'right',
-  className?: String | Array<String>,
-  data?: String,
-  date: String,
-  id?: String,
-  showTimezone?: Boolean,
+  className?: string | array<string>,
+  data?: string,
+  date: string,
+  id?: string,
+  showTimezone?: boolean,
   size?: 'lg' | 'sm' | 'xs',
 }
 

data/app/pb_kits/playbook/pb_time_range_inline/_time_range_inline.jsx

@@ -7,16 +7,16 @@ import DateTime from '../pb_kit/dateTime.js'
 import { globalProps } from '../utilities/globalProps.js'
 
 type TimeRangeInlineProps = {
-  className?: String,
-  id?: String,
-  data?: String,
+  className?: string,
+  id?: string,
+  data?: string,
   alignment?: "left" | "center" | "vertical",
   size?: "sm" | "xs",
-  dark?: Boolean,
-  icon?: Boolean,
-  timezone?: Boolean,
-  startTime: String,
-  endTime: String,
+  dark?: boolean,
+  icon?: boolean,
+  timezone?: boolean,
+  startTime: string,
+  endTime: string,
 }
 
 const timezoneString = (dateValue) => {

data/app/pb_kits/playbook/pb_time_stacked/_time_stacked.jsx

@@ -14,11 +14,11 @@ const Components = {
 }
 
 type TimeStackedProps = {
-  className?: String | Array<String>,
-  dark?: Boolean,
-  data?: String,
-  date: String,
-  id?: String,
+  className?: string | array<string>,
+  dark?: boolean,
+  data?: string,
+  date: string,
+  id?: string,
   align?: "left" | "center" | "right",
   tag?: "body" | "caption",
 }

data/app/pb_kits/playbook/pb_timeline/_item.jsx

@@ -7,8 +7,8 @@ import { DateStacked, IconCircle } from '..'
 
 type ItemProps = {
   className?: string,
-  children?: Array<React.Node>,
-  date?: Date,
+  children?: array<React.Node>,
+  date?: date,
   icon?: string,
   iconColor?: 'default' | 'royal' | 'blue' | 'purple' | 'teal' | 'red' | 'yellow' | 'green',
   lineStyle?: 'solid' | 'dotted',

data/app/pb_kits/playbook/pb_timeline/_timeline.jsx

@@ -7,12 +7,12 @@ import { buildAriaProps, buildCss, buildDataProps } from '../utilities/props'
 
 type TimelineProps = {
   aria?: object,
-  children?: Array<React.ReactChild>,
-  className?: String,
-  data?: String,
-  id?: String,
-  orientation?: String,
-  showDate?: Boolean,
+  children?: array<React.ReactChild>,
+  className?: string,
+  data?: string,
+  id?: string,
+  orientation?: string,
+  showDate?: boolean,
 }
 
 const Timeline = ({

data/app/pb_kits/playbook/pb_timestamp/_timestamp.jsx

@@ -10,10 +10,10 @@ import { buildCss, buildDataProps } from '../utilities/props'
 import { globalProps } from '../utilities/globalProps.js'
 
 type TimestampProps = {
-  id?: String,
+  id?: string,
   data?: object,
-  className?: String,
-  text?: String,
+  className?: string,
+  text?: string,
 }
 
 const Timestamp = (props: TimestampProps) => {

data/app/pb_kits/playbook/pb_title/_title.jsx

@@ -7,13 +7,13 @@ import { globalProps } from '../utilities/globalProps.js'
 
 type TitleProps = {
   aria?: object,
-  children?: Array<React.ReactNode> | React.ReactNode,
-  className?: String,
+  children?: array<React.ReactNode> | React.ReactNode,
+  className?: string,
   data?: object,
-  id?: String,
+  id?: string,
   size?: 1 | 2 | 3 | 4,
   tag?: "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "div" | "span",
-  text?: String,
+  text?: string,
   variant?: null | "primary",
 }
 

data/app/pb_kits/playbook/pb_title_count/_title_count.jsx

@@ -11,11 +11,11 @@ import { globalProps } from '../utilities/globalProps.js'
 type TitleCountProps = {
   align: "center" | "left" | "right",
   aria?: object,
-  className?: String,
+  className?: string,
   count?: Numeric,
   data?: object,
-  id?: String,
-  title?: String,
+  id?: string,
+  title?: string,
   size?: "lg" | "sm",
 };
 

data/app/pb_kits/playbook/pb_title_detail/docs/_title_detail_dark.html.erb

@@ -0,0 +1,19 @@
+<%= pb_rails("title_detail", props: {
+  dark: true,
+  title: "Email Notifications",
+  detail: "Commits data and history"
+}) %>
+
+<%= pb_rails("title_detail", props: {
+  dark: true,
+  title: "Email Notifications",
+  detail: "Commits data and history",
+  align: "center"
+}) %>
+
+<%= pb_rails("title_detail", props: {
+  dark: true,
+  title: "Email Notifications",
+  detail: "Commits data and history",
+  align: "right"
+}) %>

data/app/pb_kits/playbook/pb_title_detail/docs/_title_detail_dark.jsx

@@ -0,0 +1,29 @@
+import React from 'react'
+import { TitleDetail } from '../../'
+
+const TitleDetailDark = () => (
+  <div>
+    <TitleDetail
+        dark
+        detail="Commits data and history"
+        title="Email Notifications"
+    />
+
+    <TitleDetail
+        align="center"
+        dark
+        detail="Commits data and history"
+        title="Email Notifications"
+    />
+
+    <TitleDetail
+        align="right"
+        dark
+        detail="Commits data and history"
+        title="Email Notifications"
+    />
+
+  </div>
+)
+
+export default TitleDetailDark

data/app/pb_kits/playbook/pb_toggle/_toggle.jsx

@@ -14,15 +14,15 @@ import { globalProps } from '../utilities/globalProps.js'
 
 type Props = {
   aria?: object,
-  checked?: Boolean,
+  checked?: boolean,
   children?: React.Node,
-  className?: String,
+  className?: string,
   data?: object,
-  id?: String,
-  name?: String,
+  id?: string,
+  name?: string,
   onChange?: InputCallback<HTMLInputElement>,
   size?: "sm" | "md",
-  value?: String,
+  value?: string,
 }
 
 const Toggle = ({

data/app/pb_kits/playbook/pb_typeahead/_typeahead.html.erb

@@ -11,10 +11,9 @@
       label: object.label,
       name: object.name,
       value: object.value,
-      placeholder: object.placeholder,
-      dark: object.dark
+      placeholder: object.placeholder
     }) %>
-    <%= pb_rails("list", props: { ordered: false, dark: false, borderless: false, xpadding: true, role: "status", aria: { live: "polite" }, data: { pb_typeahead_kit_results: true } }) do %>
+    <%= pb_rails("list", props: { ordered: false, borderless: false, xpadding: true, role: "status", aria: { live: "polite" }, data: { pb_typeahead_kit_results: true } }) do %>
     <% end %>
   </div>
 

data/app/pb_kits/playbook/pb_typeahead/_typeahead.scss

@@ -79,7 +79,7 @@
     }
   }
 
-  &[class*=_dark] {
+  .dark {
     .pb_typeahead_wrapper .pb_typeahead_loading_indicator {
       color: $text_dk_light;
     }

data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_context_dark.html.erb

@@ -16,7 +16,6 @@
 
 <br><br><br>
 
-
 <%= javascript_tag defer: "defer" do %>
   document.addEventListener("pb-typeahead-kit-search", function(event) {
     if (!event.target.dataset.typeaheadExample2) return;

data/app/pb_kits/playbook/pb_typeahead/typeahead.rb

@@ -11,13 +11,11 @@ module Playbook
       prop :placeholder
       prop :search_term_minimum_length, default: 3
       prop :search_debounce_timeout, default: 250
-      prop :dark, type: Playbook::Props::Boolean,
-                  default: false
 
       partial "pb_typeahead/typeahead"
 
       def classname
-        generate_classname("pb_typeahead_kit", dark_class)
+        generate_classname("pb_typeahead_kit")
       end
 
       def data
@@ -27,12 +25,6 @@ module Playbook
           pb_typeahead_kit_search_debounce_timeout: search_debounce_timeout
         )
       end
-
-    private
-
-      def dark_class
-        dark ? "dark" : nil
-      end
     end
   end
 end

data/app/pb_kits/playbook/pb_user/_user.jsx

@@ -6,16 +6,16 @@ import { Avatar, Body, Title } from '../'
 import { globalProps } from '../utilities/globalProps.js'
 
 type UserProps = {
-  className?: String,
-  id?: String,
-  name: String,
-  territory?: String,
-  title?: String,
+  className?: string,
+  id?: string,
+  name: string,
+  territory?: string,
+  title?: string,
   size?: "sm" | "md" | "lg",
   align?: "left" | "center" | "right",
   orientation?: "horiztonal" | "vertical",
-  avatar?: Boolean,
-  avatarUrl?: String,
+  avatar?: boolean,
+  avatarUrl?: string,
 }
 
 const User = (props: UserProps) => {

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

@@ -4,8 +4,8 @@ import classnames from 'classnames'
 import { globalProps } from '../utilities/globalProps.js'
 
 type UserBadgeProps = {
-  className?: String,
-  id?: String,
+  className?: string,
+  id?: string,
   badge?: "million-dollar" | "veteran",
   size?: "sm" | "md" | "lg",
 }

data/app/pb_kits/playbook/pb_weekday_stacked/_weekday_stacked.jsx

@@ -11,12 +11,12 @@ import DateTime from '../pb_kit/dateTime.js'
 
 type WeekdayStackedProps = {
   align?: "left" | "center" | "right",
-  className?: String,
-  dark?: Boolean,
-  date: Date,
+  className?: string,
+  dark?: boolean,
+  date: date,
   variant?: "day_only" | "month_day" | "expanded",
-  compact?: Boolean,
-  id?: String,
+  compact?: boolean,
+  id?: string,
 }
 
 const getDayOfWeek = (date, compact) => {

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

@@ -9,9 +9,9 @@ props_types = @kit_props.map do |key, val|
   prop_name = key == "classname" ? "className" : key.camelize(:lower)
   prop_type = case val
               when "enum", "one_of" then "'option_1' | 'option_2'"
-              when "boolean", "bool" then "Boolean"
+              when "boolean", "bool" then "boolean"
               when "object", "obj" then "object"
-              else "String"
+              else "string"
               end
 
   "#{prop_name}?: #{prop_type}"

data/lib/playbook/version.rb

@@ -1,5 +1,5 @@
 # frozen_string_literal: true
 
 module Playbook
-  VERSION = "6.1.0"
+  VERSION = "6.2.0"
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: playbook_ui
 version: !ruby/object:Gem::Version
-  version: 6.1.0
+  version: 6.2.0
 platform: ruby
 authors:
 - Power UX
@@ -9,7 +9,7 @@ authors:
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2020-08-07 00:00:00.000000000 Z
+date: 2020-08-14 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: actionpack
@@ -71,6 +71,20 @@ dependencies:
     - - "<"
       - !ruby/object:Gem::Version
         version: '7.0'
+- !ruby/object:Gem::Dependency
+  name: github_changelog_generator
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - '='
+      - !ruby/object:Gem::Version
+        version: 1.15.2
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - '='
+      - !ruby/object:Gem::Version
+        version: 1.15.2
 - !ruby/object:Gem::Dependency
   name: react-rails
   requirement: !ruby/object:Gem::Requirement
@@ -1305,6 +1319,8 @@ files:
 - app/pb_kits/playbook/pb_progress_step/_progress_step_item.html.erb
 - app/pb_kits/playbook/pb_progress_step/_progress_step_item.jsx
 - app/pb_kits/playbook/pb_progress_step/docs/_description.md
+- app/pb_kits/playbook/pb_progress_step/docs/_progress_step_child.html.erb
+- app/pb_kits/playbook/pb_progress_step/docs/_progress_step_child.jsx
 - app/pb_kits/playbook/pb_progress_step/docs/_progress_step_dark.html.erb
 - app/pb_kits/playbook/pb_progress_step/docs/_progress_step_dark.jsx
 - app/pb_kits/playbook/pb_progress_step/docs/_progress_step_default.html.erb
@@ -1537,6 +1553,8 @@ files:
 - app/pb_kits/playbook/pb_text_input/docs/_text_input_dark_error.jsx
 - app/pb_kits/playbook/pb_text_input/docs/_text_input_default.html.erb
 - app/pb_kits/playbook/pb_text_input/docs/_text_input_default.jsx
+- app/pb_kits/playbook/pb_text_input/docs/_text_input_disabled.html.erb
+- app/pb_kits/playbook/pb_text_input/docs/_text_input_disabled.jsx
 - app/pb_kits/playbook/pb_text_input/docs/_text_input_error.html.erb
 - app/pb_kits/playbook/pb_text_input/docs/_text_input_error.jsx
 - app/pb_kits/playbook/pb_text_input/docs/_text_input_error.md
@@ -1660,6 +1678,8 @@ files:
 - app/pb_kits/playbook/pb_title_detail/_title_detail.scss
 - app/pb_kits/playbook/pb_title_detail/docs/_description.md
 - app/pb_kits/playbook/pb_title_detail/docs/_footer.md
+- app/pb_kits/playbook/pb_title_detail/docs/_title_detail_dark.html.erb
+- app/pb_kits/playbook/pb_title_detail/docs/_title_detail_dark.jsx
 - app/pb_kits/playbook/pb_title_detail/docs/_title_detail_default.html.erb
 - app/pb_kits/playbook/pb_title_detail/docs/_title_detail_default.jsx
 - app/pb_kits/playbook/pb_title_detail/docs/_title_detail_default.md
@@ -1863,7 +1883,8 @@ required_rubygems_version: !ruby/object:Gem::Requirement
     - !ruby/object:Gem::Version
       version: '0'
 requirements: []
-rubygems_version: 3.1.2
+rubyforge_project: 
+rubygems_version: 2.7.3
 signing_key: 
 specification_version: 4
 summary: Playbook Design System