playbook_ui 2.9.6 → 2.9.7

data/app/pb_kits/playbook/pb_message/message.rb

@@ -2,88 +2,31 @@
 
 module Playbook
   module PbMessage
-    class Message < Playbook::PbKit::Base
-      PROPS = %i[configured_avatar
-                 configured_classname
-                 configured_data
-                 configured_id
-                 configured_label
-                 configured_message
-                 configured_timestamp].freeze
+    class Message
+      include Playbook::Props
 
-      def initialize(avatar: default_configuration,
-                     classname: default_configuration,
-                     data: default_configuration,
-                     id: default_configuration,
-                     label: default_configuration,
-                     message: default_configuration,
-                     timestamp: default_configuration)
-        self.configured_avatar = avatar
-        self.configured_classname = classname
-        self.configured_data = data
-        self.configured_id = id
-        self.configured_label = label
-        self.configured_message = message
-        self.configured_timestamp = timestamp
-      end
-
-      def avatar
-        if is_set? configured_avatar
-          configured_avatar[:size] = "sm"
-          pb_avatar = Playbook::PbAvatar::Avatar.new(configured_avatar)
-          ApplicationController.renderer.render(partial: pb_avatar, as: :object)
-        end
-      end
-
-      def avatar_class
-        "avatar" if is_set? configured_avatar
-      end
+      partial "pb_message/message"
 
-      def label
-        if is_set? configured_label
-          caption_props = { text: configured_label }
-          pb_label = Playbook::PbCaption::Caption.new(caption_props)
-          ApplicationController.renderer.render(partial: pb_label, as: :object)
-        end
-      end
-
-      def message
-        if is_set? configured_message
-          pb_message = Playbook::PbBody::Body.new(classname: "message_text") do
-            configured_message
-          end
-          ApplicationController.renderer.render(partial: pb_message, as: :object)
-        end
-      end
+      prop :avatar_name
+      prop :avatar_status
+      prop :avatar_url
+      prop :label
+      prop :message
+      prop :timestamp
 
-      def timestamp
-        if is_set? configured_timestamp
-          timestamp_props = { text: configured_timestamp }
-          pb_timestamp = Playbook::PbTimestamp::Timestamp.new(timestamp_props)
-          ApplicationController.renderer.render(partial: pb_timestamp, as: :object)
-        end
+      def classname
+        generate_classname("pb_message_kit", avatar_class)
       end
 
-      def kit_class
-        kit_options = [
-          "pb_message_kit",
-          avatar_class,
-        ]
-        kit_options.compact.join("_")
-      end
-
-      def to_partial_path
-        "pb_message/message"
+      def valid?
+        avatar_url.present? || avatar_name
       end
 
     private
 
-      DEFAULT = Object.new
-      private_constant :DEFAULT
-      def default_configuration
-        DEFAULT
+      def avatar_class
+        avatar_name ? "avatar" : nil
       end
-      attr_accessor(*PROPS)
     end
   end
 end

data/app/pb_kits/playbook/pb_person_contact/_person_contact.html.erb

@@ -12,6 +12,7 @@
       <%= pb_rails("contact", props: {
           contact_type: contact[:contact_type],
           contact_value: contact[:contact_value],
+          contact_detail: contact[:contact_detail],
       }) %>
     <% end %>
 <% end %>

data/app/pb_kits/playbook/pb_person_contact/_person_contact.jsx

@@ -13,7 +13,7 @@ type PersonContactProps = {
   className?: String | Array<String>,
   dark?: Boolean,
   people?: Array<{firstName: String, lastName: String}>,
-  contacts?: Array<{contactType: String, contactValue: String}>,
+  contacts?: Array<{contactType: String, contactValue: String, contactDetail: String}>,
 }
 
 const contactsArray = ({contacts=[]}: PersonContactProps) => {
@@ -22,6 +22,7 @@ const contactsArray = ({contacts=[]}: PersonContactProps) => {
       <Contact
         contactType={contactObject.contactType}
         contactValue={contactObject.contactValue}
+        contactDetail={contactObject.contactDetail}
       />
     );
   })

data/app/pb_kits/playbook/pb_person_contact/docs/_person_contact_default.html.erb

@@ -12,10 +12,12 @@
   contacts: [
     {
       contact_type: "email",
-      contact_value: "email@example.com"
+      contact_value: "email@example.com",
+      contact_detail: "Pauline's Email"
     },
     {
       contact_value: 5555555555,
+      contact_detail: "Home"
     },
     {
       contact_type: "email",
@@ -24,6 +26,7 @@
     {
       contact_type: "work",
       contact_value: "3245627482",
+      contact_detail: "Harvey's Work"
     }
   ]
 }) %>

data/app/pb_kits/playbook/pb_person_contact/docs/_person_contact_default.jsx

@@ -18,10 +18,12 @@ function PersonContactDefault() {
         contacts={[
           {
             contactType: "email",
-            contactValue: "email@example.com"
+            contactValue: "email@example.com",
+            contactDetail: "Pauline's Email",
           },
           {
             contactValue: "5555555555",
+            contactDetail: "Home",
           },
           {
             contactType: "email",
@@ -30,6 +32,7 @@ function PersonContactDefault() {
           {
             contactType: "work",
             contactValue: "3245627482",
+            contactDetail: "Harvey's Work"
           }
         ]}
       />

data/app/pb_kits/playbook/pb_person_contact/docs/_person_contact_single_person.html.erb

@@ -8,14 +8,17 @@
   contacts: [
     {
       contact_type: "email",
-      contact_value: "email@example.com"
+      contact_value: "email@example.com",
+      contact_detail: "Harvey's Email"
     },
     {
       contact_value: 5555555555,
+      contact_detail: "Home",
     },
     {
       contact_type: "work",
       contact_value: "3245627482",
+      contact_detail: "Harvey's Work"
     }
   ]
 }) %>

data/app/pb_kits/playbook/pb_person_contact/docs/_person_contact_single_person.jsx

@@ -14,14 +14,17 @@ function PersonContactSinglePerson() {
         contacts={[
           {
             contactType: "email",
-            contactValue: "email@example.com"
+            contactValue: "email@example.com",
+            contactDetail: "Harvey's Email",
           },
           {
             contactValue: "5555555555",
+            contactDetail: "Home",
           },
           {
             contactType: "work",
             contactValue: "3245627482",
+            contactDetail: "Harvey's Work",
           }
         ]}
       />

data/app/pb_kits/playbook/pb_section_separator/_section_separator.html.erb

@@ -1,6 +1,6 @@
 <%= content_tag(:div,
     id: object.id,
     data: object.data,
-    class: object.classname(object.kit_class)) do %>
-  <span><%= object.text %></span>
+    class: object.classname) do %>
+ <span><%= pb_rails("caption", props: { text: object.text }) %></span>
 <% end %>

data/app/pb_kits/playbook/pb_section_separator/section_separator.rb

@@ -2,45 +2,16 @@
 
 module Playbook
   module PbSectionSeparator
-    class SectionSeparator < Playbook::PbKit::Base
-      PROPS = %i[configured_classname
-                 configured_data
-                 configured_id
-                 configured_text].freeze
+    class SectionSeparator
+      include Playbook::Props
 
-      def initialize(classname: default_configuration,
-                     data: default_configuration,
-                     id: default_configuration,
-                     text: default_configuration)
-        self.configured_classname = classname
-        self.configured_data = data
-        self.configured_id = id
-        self.configured_text = text
-      end
-
-      def text
-        if is_set? configured_text
-          pb_text = Playbook::PbCaption::Caption.new(text: configured_text)
-          ApplicationController.renderer.render(partial: pb_text, as: :object)
-        end
-      end
-
-      def kit_class
-        "pb_section_separator_kit"
-      end
-
-      def to_partial_path
-        "pb_section_separator/section_separator"
-      end
+      partial "pb_section_separator/section_separator"
 
-    private
+      prop :text
 
-      DEFAULT = Object.new
-      private_constant :DEFAULT
-      def default_configuration
-        DEFAULT
+      def classname
+        generate_classname("pb_section_separator_kit")
       end
-      attr_accessor(*PROPS)
     end
   end
 end

data/app/pb_kits/playbook/pb_star_rating/_star_rating.html.erb

@@ -1,23 +1,23 @@
 <%= content_tag(:div,
     id: object.id,
     data: object.data,
-    class: object.classname(object.kit_class)) do %>
+    class: object.classname) do %>
     <%# Rating value %>
-    <%= content_tag(:div, object.rating, class: "pb__star_rating_number") %>
+    <%= content_tag(:div, object.rating, class: "pb_star_rating_number") %>
 
-    <%= content_tag(:div, class: "pb__star_rating_wrapper") do %>
+    <%= content_tag(:div, class: "pb_star_rating_wrapper") do %>
       <%# Gold stars generated by rating value %>
-      <%= content_tag(:div, class: "pb__star_rating_highlight") do %>
-          <% object.star_count.each do %>
-            <%= pb_rails("icon", props: { icon: "star", fixed_width: true }) %>
-          <% end %>
-          <% unless object.star_full %>
-            <%= pb_rails("icon", props: { icon: "star-half", fixed_width: true }) %>
-          <% end %>
+      <%= content_tag(:div, class: "pb_star_rating_highlight") do %>
+        <% object.star_count.each do %>
+          <%= pb_rails("icon", props: { icon: "star", fixed_width: true }) %>
+        <% end %>
+        <% unless object.star_full %>
+          <%= pb_rails("icon", props: { icon: "star-half", fixed_width: true }) %>
+        <% end %>
       <% end %>
 
       <%# Grey background stars as base %>
-      <%= content_tag(:div, class: "pb__star_rating_base") do %>
+      <%= content_tag(:div, class: "pb_star_rating_base") do %>
         <%= pb_rails("icon", props: { icon: "star", fixed_width: true }) %>
         <%= pb_rails("icon", props: { icon: "star", fixed_width: true }) %>
         <%= pb_rails("icon", props: { icon: "star", fixed_width: true }) %>

data/app/pb_kits/playbook/pb_star_rating/_star_rating.scss

@@ -12,7 +12,7 @@ $pb_star_rating_height: 26px;
   justify-content: flex-start;
   align-items: flex-start;
 
-  .pb__star_rating_number {
+  .pb_star_rating_number {
     flex-shrink: 0;
     flex-grow: 0;
     flex-basis: $pb_star_rating_number_width;
@@ -26,7 +26,7 @@ $pb_star_rating_height: 26px;
     align-items: center;
   }
 
-  .pb__star_rating_wrapper {
+  .pb_star_rating_wrapper {
     position: relative;
     width: $pb_star_rating_wrapper_width;
     flex-basis: $pb_star_rating_wrapper_width;
@@ -34,7 +34,7 @@ $pb_star_rating_height: 26px;
     flex-grow: 1;
     min-height: $pb_star_rating_height;
 
-    .pb__star_rating_highlight {
+    .pb_star_rating_highlight {
       position: absolute;
       top: 0;
       left: 0;
@@ -42,7 +42,7 @@ $pb_star_rating_height: 26px;
       color: $yellow;
       line-height: $pb_star_rating_height;
     }
-    .pb__star_rating_base {
+    .pb_star_rating_base {
       position: absolute;
       top: 0;
       left: 0;
@@ -53,7 +53,7 @@ $pb_star_rating_height: 26px;
   }
 
   &[class*=_hide_rating] {
-    .pb__star_rating_number {
+    .pb_star_rating_number {
       display: none;
     }
   }

data/app/pb_kits/playbook/pb_star_rating/star_rating.rb

@@ -2,36 +2,15 @@
 
 module Playbook
   module PbStarRating
-    class StarRating < Playbook::PbKit::Base
-      PROPS = %i[configured_classname
-                 configured_data
-                 configured_hide_rating
-                 configured_id
-                 configured_rating].freeze
+    class StarRating
+      include Playbook::Props
 
-      def initialize(classname: default_configuration,
-                     data: default_configuration,
-                     hide_rating: default_configuration,
-                     id: default_configuration,
-                     rating: default_configuration)
-        self.configured_classname = classname
-        self.configured_data = data
-        self.configured_hide_rating = hide_rating
-        self.configured_id = id
-        self.configured_rating = rating
-      end
-
-      def hide_rating
-        true_value(configured_hide_rating, "hide_rating", nil)
-      end
+      partial "pb_star_rating/star_rating"
 
-      def rating
-        rating_options = []
-        (0..5).step(0.5) do |number|
-          rating_options.push strip_trailing_zero(number)
-        end
-        one_of_value(configured_rating.to_s, rating_options, "0")
-      end
+      prop :hide_rating, type: Playbook::Props::Boolean,
+                         default: false
+      prop :rating, type: Playbook::Props::Numeric,
+                    default: 0
 
       def star_count
         [*1..rating.to_f]
@@ -41,30 +20,9 @@ module Playbook
         (rating.to_f % 1).zero?
       end
 
-      def kit_class
-        kit_options = [
-          "pb_star_rating_kit",
-          hide_rating,
-        ]
-        kit_options.compact.join("_")
-      end
-
-      def to_partial_path
-        "pb_star_rating/star_rating"
-      end
-
-    private
-
-      def strip_trailing_zero(number)
-        number.to_s.sub(/\.?0+$/, "")
-      end
-
-      DEFAULT = Object.new
-      private_constant :DEFAULT
-      def default_configuration
-        DEFAULT
+      def classname
+        generate_classname("pb_star_rating_kit")
       end
-      attr_accessor(*PROPS)
     end
   end
 end

data/app/pb_kits/playbook/pb_stat_change/_stat_change.html.erb

@@ -1,6 +1,9 @@
 <%= content_tag(:div,
     id: object.id,
     data: object.data,
-    class: object.classname(object.kit_class)) do %>
-  <%= object.display_value %>
+    class: object.classname) do %>
+      <%= pb_rails("body", props: { status: object.status }) do %>
+        <%= pb_rails("icon", props: { fixed_width: true, icon: object.icon }) if object.icon %>
+        <%= "#{object.value}%" if object.value %>
+      <% end %>
 <% end %>

data/app/pb_kits/playbook/pb_stat_change/_stat_change.jsx

@@ -68,7 +68,7 @@ const StatChange = (props: StatChangeProps) => {
       return (
         <Body status={status}>
           {displayIcon(icon)}
-          {value}
+          {value}%
         </Body>
       )
     }