playbook_ui 2.9.6 → 2.9.7

data/app/pb_kits/playbook/pb_stat_change/docs/_stat_change_default.html.erb

@@ -1,18 +1,18 @@
 <%= pb_rails("stat_change", props: {
   change: "increase",
-  value: "28.4%"
+  value: 28.4
 }) %>
 
 <br>
 
 <%= pb_rails("stat_change", props: {
   change: "decrease",
-  value: "6.1%"
+  value: 6.1
 }) %>
 
 <br>
 
 <%= pb_rails("stat_change", props: {
   change: "neutral",
-  value: "98%"
+  value: 98
 }) %>

data/app/pb_kits/playbook/pb_stat_change/docs/_stat_change_default.jsx

@@ -4,15 +4,15 @@ import {StatChange} from "../../"
 function StatChangeDefault() {
   return (
     <div>
-      <StatChange change="increase" value="28.4%" />
+      <StatChange change="increase" value="28.4" />
 
       <br/>
 
-      <StatChange change="decrease" value="6.1%" />
+      <StatChange change="decrease" value={6.1} />
 
       <br/>
 
-      <StatChange change="neutral" value="98%" />
+      <StatChange change="neutral" value={98} />
     </div>
   )
 }

data/app/pb_kits/playbook/pb_stat_change/stat_change.rb

@@ -2,29 +2,15 @@
 
 module Playbook
   module PbStatChange
-    class StatChange < Playbook::PbKit::Base
-      PROPS = %i[configured_change
-                 configured_classname
-                 configured_data
-                 configured_id
-                 configured_value].freeze
+    class StatChange
+      include Playbook::Props
 
-      def initialize(change: default_configuration,
-                     classname: default_configuration,
-                     data: default_configuration,
-                     id: default_configuration,
-                     value: default_configuration)
-        self.configured_change = change
-        self.configured_classname = classname
-        self.configured_data = data
-        self.configured_id = id
-        self.configured_value = value
-      end
+        partial "pb_stat_change/stat_change"
 
-      def change
-        change_options = %w[neutral increase decrease]
-        one_of_value(configured_change, change_options, "neutral")
-      end
+        prop :change, type: Playbook::Props::Enum,
+                      values: %w[neutral increase decrease],
+                      default: "neutral"
+        prop :value, type: Playbook::Props::Percentage
 
       def status
         case change
@@ -43,50 +29,14 @@ module Playbook
           "arrow-up"
         when "decrease"
           "arrow-down"
-        end
-      end
-
-      def display_icon
-        if !icon.nil?
-          pb_icon = Playbook::PbIcon::Icon.new(icon: icon, fixed_width: true)
-          ApplicationController.renderer.render(partial: pb_icon, as: :object)
         else
-          ""
+          false
         end
       end
 
-      def value
-        default_value(configured_value, "")
-      end
-
-      def display_value
-        pb_icon_element = Playbook::PbBody::Body.new(status: status) do
-          display_icon +
-            value
-        end
-        ApplicationController.renderer.render(partial: pb_icon_element, as: :object)
-      end
-
-      def kit_class
-        stat_options = [
-          "pb_stat_change_kit",
-          status,
-        ]
-        stat_options.join("_")
-      end
-
-      def to_partial_path
-        "pb_stat_change/stat_change"
-      end
-
-    private
-
-      DEFAULT = Object.new
-      private_constant :DEFAULT
-      def default_configuration
-        DEFAULT
+      def classname
+        generate_classname("pb_stat_change_kit", status)
       end
-      attr_accessor(*PROPS)
     end
   end
 end

data/app/pb_kits/playbook/pb_timestamp/_timestamp.html.erb

@@ -1,6 +1,6 @@
 <%= content_tag(:div,
     id: object.id,
     data: object.data,
-    class: object.classname(object.kit_class)) do %>
-  <%= object.yield(context: self) %>
+    class: object.classname) do %>
+  <%= !object.children.nil? ? capture(&object.children) : object.text %>
 <% end %>

data/app/pb_kits/playbook/pb_timestamp/timestamp.rb

@@ -2,49 +2,16 @@
 
 module Playbook
   module PbTimestamp
-    class Timestamp < Playbook::PbKit::Base
-      PROPS = %i[configured_classname
-                 configured_data
-                 configured_id
-                 configured_text
-                 block].freeze
+    class Timestamp
+      include Playbook::Props
 
-      def initialize(classname: default_configuration,
-                     data: default_configuration,
-                     id: default_configuration,
-                     text: default_configuration,
-                     &block)
-        self.configured_classname = classname
-        self.configured_data = data
-        self.configured_id = id
-        self.configured_text = text
-        self.block = block_given? ? block : nil
-      end
-
-      def text
-        default_value(configured_text, "")
-      end
-
-      def yield(context:)
-        !block.nil? ? context.capture(&block) : text
-      end
-
-      def kit_class
-        "pb_timestamp_kit"
-      end
-
-      def to_partial_path
-        "pb_timestamp/timestamp"
-      end
+      partial "pb_timestamp/timestamp"
 
-    private
+      prop :text
 
-      DEFAULT = Object.new
-      private_constant :DEFAULT
-      def default_configuration
-        DEFAULT
+      def classname
+        generate_classname("pb_timestamp_kit")
       end
-      attr_accessor(*PROPS)
     end
   end
 end

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

@@ -31,7 +31,7 @@ const Toggle = ({
   onCheck = noop,
   onUncheck = noop,
   size = 'md',
-  ...props,
+  ...props
 }: Props) =>{
   const ariaProps = buildAriaProps(aria)
   const dataProps = buildDataProps(data)

data/app/pb_kits/playbook/pb_user/_user.html.erb

@@ -1,11 +1,20 @@
 <%= content_tag(:div,
     id: object.id,
     data: object.data,
-    class: object.classname(object.kit_class)) do %>
-  <%= object.avatar %>
+    class: object.classname) do %>
+  <% if object.avatar_url.present? || object.avatar %>
+    <%= pb_rails("avatar", props: {
+      name: object.name,
+      size: object.avatar_size,
+      image_url: object.avatar_url
+    }) %>
+  <% end %>
   <%= content_tag(:div,
       class: "content_wrapper") do %>
-    <%= object.name %>
-    <%= object.title %>
+    <%= pb_rails("title", props: { text: object.name, size: object.title_size }) %>
+    <%= pb_rails("body", props: {
+      text: object.title,
+      color: "light"
+    }) %>
   <% end %>
 <% end %>

data/app/pb_kits/playbook/pb_user/docs/_user_default.html.erb

@@ -6,8 +6,7 @@
       orientation: "vertical",
       align: "center",
       size: "lg",
-      avatar: {
-        image: { url: "https://randomuser.me/api/portraits/women/44.jpg"} }
+      avatar_url: "https://randomuser.me/api/portraits/women/44.jpg"
       }) %>
   </div>
   <div>
@@ -16,8 +15,7 @@
       title: "Remodeling Consultant",
       orientation: "horizontal",
       align: "left",
-      avatar: {
-        image: { url: "https://randomuser.me/api/portraits/women/44.jpg"} }
+      avatar_url: "https://randomuser.me/api/portraits/women/44.jpg"
       }) %>
   </div>
   <div>
@@ -25,8 +23,7 @@
       name: "Anna Black",
       orientation: "horizontal",
       align: "left",
-      avatar: {
-        image: { url: "https://randomuser.me/api/portraits/women/44.jpg"} }
+      avatar_url: "https://randomuser.me/api/portraits/women/44.jpg"
       }) %>
 
      <br>

data/app/pb_kits/playbook/pb_user/docs/_user_size.html.erb

@@ -6,8 +6,7 @@
       orientation: "horizontal",
       align: "left",
       size: "sm",
-      avatar: {
-        image: { url: "https://randomuser.me/api/portraits/women/44.jpg"} }
+      avatar_url: "https://randomuser.me/api/portraits/women/44.jpg"
       }) %>
   </div>
   <div>
@@ -17,8 +16,7 @@
       orientation: "horizontal",
       align: "left",
       size: "md",
-      avatar: {
-        image: { url: "https://randomuser.me/api/portraits/women/44.jpg"} }
+      avatar_url: "https://randomuser.me/api/portraits/women/44.jpg"
       }) %>
   </div>
   <div>
@@ -28,8 +26,7 @@
       orientation: "horizontal",
       align: "left",
       size: "lg",
-      avatar: {
-        image: { url: "https://randomuser.me/api/portraits/women/44.jpg"} }
+      avatar_url: "https://randomuser.me/api/portraits/women/44.jpg"
       }) %>
   </div>
 </div>

data/app/pb_kits/playbook/pb_user/docs/_user_vertical_size.html.erb

@@ -4,8 +4,7 @@
   orientation: "vertical",
   align: "center",
   size: "sm",
-  avatar: {
-    image: { url: "https://randomuser.me/api/portraits/women/44.jpg"} }
+  avatar_url: "https://randomuser.me/api/portraits/women/44.jpg"
   }) %>
 
 <br><br>
@@ -16,8 +15,7 @@
   orientation: "vertical",
   align: "center",
   size: "md",
-  avatar: {
-    image: { url: "https://randomuser.me/api/portraits/women/44.jpg"} }
+  avatar_url: "https://randomuser.me/api/portraits/women/44.jpg"
   }) %>
 
 <br><br>
@@ -28,6 +26,5 @@
   orientation: "vertical",
   align: "center",
   size: "lg",
-  avatar: {
-    image: { url: "https://randomuser.me/api/portraits/women/44.jpg"} }
+  avatar_url: "https://randomuser.me/api/portraits/women/44.jpg"
   }) %>

data/app/pb_kits/playbook/pb_user/user.rb

@@ -2,40 +2,28 @@
 
 module Playbook
   module PbUser
-    class User < Playbook::PbKit::Base
-      PROPS = %i[configured_align
-                 configured_avatar
-                 configured_classname
-                 configured_data
-                 configured_id
-                 configured_name
-                 configured_orientation
-                 configured_size
-                 configured_title].freeze
-
-      def initialize(align: default_configuration,
-                     avatar: default_configuration,
-                     classname: default_configuration,
-                     data: default_configuration,
-                     id: default_configuration,
-                     name: default_configuration,
-                     orientation: default_configuration,
-                     size: default_configuration,
-                     title: default_configuration)
-        self.configured_align = align
-        self.configured_avatar = avatar
-        self.configured_classname = classname
-        self.configured_data = data
-        self.configured_id = id
-        self.configured_name = name
-        self.configured_orientation = orientation
-        self.configured_size = size
-        self.configured_title = title
-      end
-
-      def align
-        align_options = %w[left center right]
-        one_of_value(configured_align, align_options, "left")
+    class User
+      include Playbook::Props
+
+      partial "pb_user/user"
+
+      prop :align, type: Playbook::Props::Enum,
+                   values: %w[left center right],
+                   default: "left"
+      prop :avatar, type: Playbook::Props::Boolean,
+                    default: false
+      prop :avatar_url
+      prop :name
+      prop :orientation, type: Playbook::Props::Enum,
+                         values: %w[vertical horizontal],
+                         default: "horizontal"
+      prop :size, type: Playbook::Props::Enum,
+                  values: %w[lg md sm],
+                  default: "sm"
+      prop :title
+
+      def classname
+        generate_classname("pb_user_kit", align, orientation, size)
       end
 
       def avatar_size
@@ -49,69 +37,9 @@ module Playbook
         end
       end
 
-      def avatar
-        if is_set? configured_avatar
-          avatar_obj = configured_avatar == true ? {} : configured_avatar
-          avatar_obj[:size] = avatar_size
-          avatar_obj[:name] = configured_name if is_set? configured_name
-          pb_avatar = Playbook::PbAvatar::Avatar.new(avatar_obj)
-          ApplicationController.renderer.render(partial: pb_avatar, as: :object)
-        end
-      end
-
-      def name_size
+      def title_size
         size == "lg" ? 3 : 4
       end
-
-      def name
-        if is_set? configured_name
-          title_props = { text: configured_name, size: name_size }
-          pb_name = Playbook::PbTitle::Title.new(title_props)
-          ApplicationController.renderer.render(partial: pb_name, as: :object)
-        end
-      end
-
-      def orientation
-        orientation_options = %w[vertical horizontal]
-        one_of_value(configured_orientation, orientation_options, "horizontal")
-      end
-
-      def size
-        size_options = %w[lg md sm]
-        one_of_value(configured_size, size_options, "sm")
-      end
-
-      def title
-        if is_set? configured_title
-          pb_icon_element = Playbook::PbBody::Body.new(color: "light") do
-            configured_title
-          end
-          ApplicationController.renderer.render(partial: pb_icon_element, as: :object)
-        end
-      end
-
-      def kit_class
-        kit_options = [
-          "pb_user_kit",
-          align,
-          orientation,
-          size,
-        ]
-        kit_options.join("_")
-      end
-
-      def to_partial_path
-        "pb_user/user"
-      end
-
-    private
-
-      DEFAULT = Object.new
-      private_constant :DEFAULT
-      def default_configuration
-        DEFAULT
-      end
-      attr_accessor(*PROPS)
     end
   end
 end