playbook_ui 10.17.0 → 10.19.0.pre.lightbox

data/lib/playbook/classnames.rb

@@ -17,6 +17,9 @@ module Playbook
         z_index_props,
         number_spacing_props,
         shadow_props,
+        line_height_props,
+        display_props,
+        cursor_props,
       ].compact.join(" ")
     end
 

data/lib/playbook/cursor.rb

@@ -0,0 +1,29 @@
+# frozen_string_literal: true
+
+module Playbook
+  module Cursor
+    def self.included(base)
+      base.prop :cursor
+    end
+
+    def cursor_props
+      selected_props = cursor_options.keys.select { |sk| try(sk) }
+      return nil unless selected_props.present?
+
+      selected_props.map do |k|
+        cursor_value = send(k)
+        "cursor_#{cursor_value}" if cursor_values.include? cursor_value
+      end.compact.join(" ")
+    end
+
+    def cursor_options
+      {
+        cursor: "cursor",
+      }
+    end
+
+    def cursor_values
+      %w[pointer]
+    end
+  end
+end

data/lib/playbook/display.rb

@@ -0,0 +1,29 @@
+# frozen_string_literal: true
+
+module Playbook
+  module Display
+    def self.included(base)
+      base.prop :display
+    end
+
+    def display_props
+      selected_props = display_options.keys.select { |sk| try(sk) }
+      return nil unless selected_props.present?
+
+      selected_props.map do |k|
+        display_value = send(k)
+        "display_#{display_value}" if display_values.include? display_value
+      end.compact.join(" ")
+    end
+
+    def display_options
+      {
+        display: "display",
+      }
+    end
+
+    def display_values
+      %w[block inline_block inline flex inline_flex hidden]
+    end
+  end
+end

data/lib/playbook/engine.rb

@@ -1,7 +1,6 @@
 # frozen_string_literal: true
 
 require "action_view/railtie"
-require "view_component/engine"
 require "webpacker/react"
 
 module Playbook

data/lib/playbook/kit_base.rb

@@ -5,6 +5,9 @@ require "playbook/spacing"
 require "playbook/z_index"
 require "playbook/number_spacing"
 require "playbook/shadow"
+require "playbook/line_height"
+require "playbook/display"
+require "playbook/cursor"
 
 module Playbook
   class KitBase < ViewComponent::Base
@@ -15,6 +18,9 @@ module Playbook
     include Playbook::ZIndex
     include Playbook::NumberSpacing
     include Playbook::Shadow
+    include Playbook::LineHeight
+    include Playbook::Display
+    include Playbook::Cursor
 
     prop :id
     prop :data, type: Playbook::Props::Hash, default: {}

data/lib/playbook/line_height.rb

@@ -0,0 +1,29 @@
+# frozen_string_literal: true
+
+module Playbook
+  module LineHeight
+    def self.included(base)
+      base.prop :line_height
+    end
+
+    def line_height_props
+      selected_props = line_height_options.keys.select { |sk| try(sk) }
+      return nil unless selected_props.present?
+
+      selected_props.map do |k|
+        line_height_value = send(k)
+        "line_height_#{line_height_value}" if line_height_values.include? line_height_value
+      end.compact.join(" ")
+    end
+
+    def line_height_options
+      {
+        line_height: "line_height",
+      }
+    end
+
+    def line_height_values
+      %w[tightest tighter tight normal loose looser loosest]
+    end
+  end
+end

data/lib/playbook/version.rb

@@ -1,6 +1,6 @@
 # frozen_string_literal: true
 
 module Playbook
-  PREVIOUS_VERSION = "10.17.0"
-  VERSION = "10.17.0"
+  PREVIOUS_VERSION = "10.18.1"
+  VERSION = "10.19.0.pre.lightbox"
 end

data/lib/playbook.rb

@@ -1,5 +1,7 @@
 # frozen_string_literal: true
 
+require "view_component"
+
 require "playbook/version"
 require "playbook/engine"
 require "playbook/props"

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: playbook_ui
 version: !ruby/object:Gem::Version
-  version: 10.17.0
+  version: 10.19.0.pre.lightbox
 platform: ruby
 authors:
 - Power UX
@@ -9,7 +9,7 @@ authors:
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2021-12-10 00:00:00.000000000 Z
+date: 2022-01-27 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: actionpack
@@ -101,14 +101,14 @@ dependencies:
     requirements:
     - - "~>"
       - !ruby/object:Gem::Version
-        version: '2.23'
+        version: '2.47'
   type: :runtime
   prerelease: false
   version_requirements: !ruby/object:Gem::Requirement
     requirements:
     - - "~>"
       - !ruby/object:Gem::Version
-        version: '2.23'
+        version: '2.47'
 - !ruby/object:Gem::Dependency
   name: webpacker-react
   requirement: !ruby/object:Gem::Requirement
@@ -380,10 +380,12 @@ files:
 - app/pb_kits/playbook/pb_body/_body_mixins.scss
 - app/pb_kits/playbook/pb_body/body.html.erb
 - app/pb_kits/playbook/pb_body/body.rb
+- app/pb_kits/playbook/pb_body/body.test.js
 - app/pb_kits/playbook/pb_body/docs/_body_block.html.erb
 - app/pb_kits/playbook/pb_body/docs/_body_block.jsx
 - app/pb_kits/playbook/pb_body/docs/_body_light.html.erb
 - app/pb_kits/playbook/pb_body/docs/_body_light.jsx
+- app/pb_kits/playbook/pb_body/docs/_body_light.md
 - app/pb_kits/playbook/pb_body/docs/_description.md
 - app/pb_kits/playbook/pb_body/docs/_footer.md
 - app/pb_kits/playbook/pb_body/docs/example.yml
@@ -446,16 +448,14 @@ files:
 - app/pb_kits/playbook/pb_caption/_caption_mixin.scss
 - app/pb_kits/playbook/pb_caption/caption.html.erb
 - app/pb_kits/playbook/pb_caption/caption.rb
+- app/pb_kits/playbook/pb_caption/caption.test.js
 - app/pb_kits/playbook/pb_caption/docs/_caption_block.html.erb
 - app/pb_kits/playbook/pb_caption/docs/_caption_block.jsx
-- app/pb_kits/playbook/pb_caption/docs/_caption_example.html.erb
-- app/pb_kits/playbook/pb_caption/docs/_caption_example.jsx
-- app/pb_kits/playbook/pb_caption/docs/_caption_example.md
+- app/pb_kits/playbook/pb_caption/docs/_caption_colors.html.erb
+- app/pb_kits/playbook/pb_caption/docs/_caption_colors.jsx
+- app/pb_kits/playbook/pb_caption/docs/_caption_colors.md
 - app/pb_kits/playbook/pb_caption/docs/_caption_light.html.erb
 - app/pb_kits/playbook/pb_caption/docs/_caption_light.jsx
-- app/pb_kits/playbook/pb_caption/docs/_caption_variants.html.erb
-- app/pb_kits/playbook/pb_caption/docs/_caption_variants.jsx
-- app/pb_kits/playbook/pb_caption/docs/_caption_variants.md
 - app/pb_kits/playbook/pb_caption/docs/_description.md
 - app/pb_kits/playbook/pb_caption/docs/_footer.md
 - app/pb_kits/playbook/pb_caption/docs/example.yml
@@ -528,6 +528,7 @@ files:
 - 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_colors.md
 - 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
@@ -940,6 +941,9 @@ files:
 - app/pb_kits/playbook/pb_form_pill/form_pill.rb
 - app/pb_kits/playbook/pb_gauge/_gauge.jsx
 - app/pb_kits/playbook/pb_gauge/_gauge.scss
+- app/pb_kits/playbook/pb_gauge/docs/_gauge_colors.html.erb
+- app/pb_kits/playbook/pb_gauge/docs/_gauge_colors.jsx
+- app/pb_kits/playbook/pb_gauge/docs/_gauge_colors.md
 - 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
@@ -1034,6 +1038,7 @@ files:
 - app/pb_kits/playbook/pb_icon_circle/docs/_footer.md
 - app/pb_kits/playbook/pb_icon_circle/docs/_icon_circle_color.html.erb
 - app/pb_kits/playbook/pb_icon_circle/docs/_icon_circle_color.jsx
+- app/pb_kits/playbook/pb_icon_circle/docs/_icon_circle_color.md
 - app/pb_kits/playbook/pb_icon_circle/docs/_icon_circle_default.html.erb
 - app/pb_kits/playbook/pb_icon_circle/docs/_icon_circle_default.jsx
 - app/pb_kits/playbook/pb_icon_circle/docs/_icon_circle_sizes.html.erb
@@ -1076,6 +1081,9 @@ files:
 - app/pb_kits/playbook/pb_image/docs/_description.md
 - app/pb_kits/playbook/pb_image/docs/_rounded_image.html.erb
 - app/pb_kits/playbook/pb_image/docs/_rounded_image.jsx
+- app/pb_kits/playbook/pb_image/docs/_transition_image.html.erb
+- app/pb_kits/playbook/pb_image/docs/_transition_image.jsx
+- app/pb_kits/playbook/pb_image/docs/_transition_image.md
 - app/pb_kits/playbook/pb_image/docs/example.yml
 - app/pb_kits/playbook/pb_image/docs/index.js
 - app/pb_kits/playbook/pb_image/image.html.erb
@@ -1160,6 +1168,25 @@ files:
 - app/pb_kits/playbook/pb_legend/docs/index.js
 - app/pb_kits/playbook/pb_legend/legend.html.erb
 - app/pb_kits/playbook/pb_legend/legend.rb
+- app/pb_kits/playbook/pb_lightbox/Carousel/Slide.jsx
+- app/pb_kits/playbook/pb_lightbox/Carousel/Slides.jsx
+- app/pb_kits/playbook/pb_lightbox/Carousel/Thumbnail.jsx
+- app/pb_kits/playbook/pb_lightbox/Carousel/Thumbnails.jsx
+- app/pb_kits/playbook/pb_lightbox/Carousel/index.jsx
+- app/pb_kits/playbook/pb_lightbox/Carousel/styles.scss
+- app/pb_kits/playbook/pb_lightbox/Carousel/useSlides.js
+- app/pb_kits/playbook/pb_lightbox/Carousel/useUnscrollableBody.js
+- app/pb_kits/playbook/pb_lightbox/_lightbox.jsx
+- app/pb_kits/playbook/pb_lightbox/docs/_lightbox_default.jsx
+- app/pb_kits/playbook/pb_lightbox/docs/_lightbox_default.md
+- app/pb_kits/playbook/pb_lightbox/docs/_lightbox_multiple.jsx
+- app/pb_kits/playbook/pb_lightbox/docs/example.yml
+- app/pb_kits/playbook/pb_lightbox/docs/index.js
+- app/pb_kits/playbook/pb_lightbox/hooks/useToggler.js
+- app/pb_kits/playbook/pb_lightbox/hooks/useVisibility.js
+- app/pb_kits/playbook/pb_lightbox/hooks/useWindowSize.js
+- app/pb_kits/playbook/pb_lightbox/lightbox.scss
+- app/pb_kits/playbook/pb_lightbox/lightbox.test.jsx
 - app/pb_kits/playbook/pb_line_graph/_line_graph.jsx
 - app/pb_kits/playbook/pb_line_graph/_line_graph.scss
 - app/pb_kits/playbook/pb_line_graph/docs/_description.md
@@ -1251,6 +1278,7 @@ files:
 - app/pb_kits/playbook/pb_multiple_users_stacked/docs/index.js
 - app/pb_kits/playbook/pb_multiple_users_stacked/multiple_users_stacked.html.erb
 - app/pb_kits/playbook/pb_multiple_users_stacked/multiple_users_stacked.rb
+- app/pb_kits/playbook/pb_nav/_bold_mixin.scss
 - app/pb_kits/playbook/pb_nav/_horizontal_nav.scss
 - app/pb_kits/playbook/pb_nav/_item.jsx
 - app/pb_kits/playbook/pb_nav/_nav.jsx
@@ -1261,6 +1289,10 @@ files:
 - app/pb_kits/playbook/pb_nav/docs/_block_nav.jsx
 - app/pb_kits/playbook/pb_nav/docs/_block_no_title_nav.html.erb
 - app/pb_kits/playbook/pb_nav/docs/_block_no_title_nav.jsx
+- app/pb_kits/playbook/pb_nav/docs/_bold_horizontal_nav.html.erb
+- app/pb_kits/playbook/pb_nav/docs/_bold_horizontal_nav.jsx
+- app/pb_kits/playbook/pb_nav/docs/_bold_vertical_nav.html.erb
+- app/pb_kits/playbook/pb_nav/docs/_bold_vertical_nav.jsx
 - app/pb_kits/playbook/pb_nav/docs/_borderless_nav.html.erb
 - app/pb_kits/playbook/pb_nav/docs/_borderless_nav.jsx
 - app/pb_kits/playbook/pb_nav/docs/_default_nav.html.erb
@@ -1851,15 +1883,17 @@ files:
 - app/pb_kits/playbook/pb_title/_title.scss
 - app/pb_kits/playbook/pb_title/_title_mixin.scss
 - app/pb_kits/playbook/pb_title/docs/_description.md
+- app/pb_kits/playbook/pb_title/docs/_title_colors.html.erb
+- app/pb_kits/playbook/pb_title/docs/_title_colors.jsx
+- app/pb_kits/playbook/pb_title/docs/_title_colors.md
 - app/pb_kits/playbook/pb_title/docs/_title_light.html.erb
 - app/pb_kits/playbook/pb_title/docs/_title_light.jsx
-- app/pb_kits/playbook/pb_title/docs/_title_variants.html.erb
-- app/pb_kits/playbook/pb_title/docs/_title_variants.jsx
-- app/pb_kits/playbook/pb_title/docs/_title_variants.md
+- app/pb_kits/playbook/pb_title/docs/_title_light.md
 - app/pb_kits/playbook/pb_title/docs/example.yml
 - app/pb_kits/playbook/pb_title/docs/index.js
 - app/pb_kits/playbook/pb_title/title.html.erb
 - app/pb_kits/playbook/pb_title/title.rb
+- app/pb_kits/playbook/pb_title/title.test.js
 - app/pb_kits/playbook/pb_title_count/_title_count.jsx
 - app/pb_kits/playbook/pb_title_count/_title_count.scss
 - app/pb_kits/playbook/pb_title_count/docs/_description.md
@@ -2033,6 +2067,9 @@ files:
 - app/pb_kits/playbook/types.js
 - app/pb_kits/playbook/utilities/_background_colors.scss
 - app/pb_kits/playbook/utilities/_colors.scss
+- app/pb_kits/playbook/utilities/_cursor.scss
+- app/pb_kits/playbook/utilities/_display.scss
+- app/pb_kits/playbook/utilities/_line_height.scss
 - app/pb_kits/playbook/utilities/_max_width.scss
 - app/pb_kits/playbook/utilities/_number_spacing.scss
 - app/pb_kits/playbook/utilities/_positioning.scss
@@ -2047,6 +2084,8 @@ files:
 - fonts/regular-min.js
 - lib/playbook.rb
 - lib/playbook/classnames.rb
+- lib/playbook/cursor.rb
+- lib/playbook/display.rb
 - lib/playbook/engine.rb
 - lib/playbook/forms.rb
 - lib/playbook/forms/builder.rb
@@ -2059,6 +2098,7 @@ files:
 - lib/playbook/forms/builder/typeahead_field.rb
 - lib/playbook/kit_base.rb
 - lib/playbook/kit_resolver.rb
+- lib/playbook/line_height.rb
 - lib/playbook/markdown.rb
 - lib/playbook/markdown/helper.rb
 - lib/playbook/markdown/template_handler.rb
@@ -2101,9 +2141,9 @@ required_ruby_version: !ruby/object:Gem::Requirement
       version: '0'
 required_rubygems_version: !ruby/object:Gem::Requirement
   requirements:
-  - - ">="
+  - - ">"
     - !ruby/object:Gem::Version
-      version: '0'
+      version: 1.3.1
 requirements: []
 rubygems_version: 3.1.6
 signing_key:

data/app/pb_kits/playbook/pb_caption/docs/_caption_example.html.erb

@@ -1,3 +0,0 @@
-<%= pb_rails("caption", props: { color: "default", text: "text default" }) %>
-<%= pb_rails("caption", props: { color: "light", text: "text light" }) %> 
-<%= pb_rails("caption", props: { color: "link", text: "text link" }) %>

data/app/pb_kits/playbook/pb_caption/docs/_caption_example.jsx

@@ -1,27 +0,0 @@
-
-import React from 'react'
-import Caption from '../_caption'
-
-const CaptionExample = (props) => {
-  return (
-    <div>
-      <Caption
-          color="default"
-          text="text default"
-          {...props}
-      />
-      <Caption
-          color="light"
-          text="text light"
-          {...props}
-      />
-      <Caption
-          color="link"
-          text="text link"
-          {...props}
-      />
-    </div>
-  )
-}
-
-export default CaptionExample

data/app/pb_kits/playbook/pb_caption/docs/_caption_example.md

@@ -1 +0,0 @@
-The above examples accept different prop values for color. Those can be `default`,`link` and `light`.  Passing the `light` color prop is optional as it will apply this color when no prop is being passed. The same applies to any of the variations on the Caption kit.

data/app/pb_kits/playbook/pb_caption/docs/_caption_variants.html.erb

@@ -1 +0,0 @@
-<%= pb_rails("caption", props: { text: "Subcaption (link)", size: 'xs', variant: "link" }) %>

data/app/pb_kits/playbook/pb_caption/docs/_caption_variants.jsx

@@ -1,17 +0,0 @@
-import React from 'react'
-import { Caption } from '../../'
-
-const CaptionVariants = (props) => {
-  return (
-    <div>
-      <Caption
-          size="xs"
-          text="Subcaption (link)"
-          variant="link"
-          {...props}
-      />
-    </div>
-  )
-}
-
-export default CaptionVariants

data/app/pb_kits/playbook/pb_caption/docs/_caption_variants.md

@@ -1,3 +0,0 @@
-Wrap anchor tags around the kit to make it clickable.
-
-Link variant can only be applied to size `xs`.

data/app/pb_kits/playbook/pb_title/docs/_title_variants.html.erb

@@ -1 +0,0 @@
-<%= pb_rails("title", props: { text: "Title 4 (link)", tag: "h4", size: 4, variant: "link" }) %> 

data/app/pb_kits/playbook/pb_title/docs/_title_variants.jsx

@@ -1,19 +0,0 @@
-import React from 'react'
-
-import Title from '../_title'
-
-const TitleVariants = (props) => {
-  return (
-    <div>
-      <Title
-          size={4}
-          tag="h4"
-          text="Title 4 (link)"
-          variant="link"
-          {...props}
-      />
-    </div>
-  )
-}
-
-export default TitleVariants

data/app/pb_kits/playbook/pb_title/docs/_title_variants.md

@@ -1,3 +0,0 @@
-Wrap anchor tags around the kit to make it clickable.
-
-Link variant can only be applied to size `4`.