playbook_ui 13.20.0.pre.alpha.PBNTR225advancedtablefeedback2375 → 13.20.0.pre.alpha.play1247htmloptions2403

data/lib/playbook/bottom.rb

@@ -0,0 +1,33 @@
+# frozen_string_literal: true
+
+module Playbook
+  module Bottom
+    def self.included(base)
+      base.prop :bottom
+    end
+
+    def bottom_values
+      %w[0 xxs xs sm md lg xl auto initial inherit]
+    end
+
+    def bottom_options
+      {
+        bottom: "bottom",
+      }
+    end
+
+  private
+
+    def bottom_props
+      selected_props = bottom_options.keys.select { |sk| try(sk) }
+      return nil unless selected_props.present?
+
+      selected_props.map do |k|
+        value = send(k)
+        return nil unless bottom_values.include? value
+
+        "bottom_#{value}"
+      end.compact.join(" ")
+    end
+  end
+end

data/lib/playbook/classnames.rb

@@ -37,6 +37,10 @@ module Playbook
         text_align_props,
         overflow_props,
         truncate_props,
+        left_props,
+        top_props,
+        right_props,
+        bottom_props,
       ].compact.join(" ")
     end
 

data/lib/playbook/kit_base.rb

@@ -25,6 +25,10 @@ require "playbook/border_radius"
 require "playbook/text_align"
 require "playbook/overflow"
 require "playbook/truncate"
+require "playbook/left"
+require "playbook/top"
+require "playbook/right"
+require "playbook/bottom"
 
 module Playbook
   class KitBase < ViewComponent::Base
@@ -55,14 +59,36 @@ module Playbook
     include Playbook::TextAlign
     include Playbook::Overflow
     include Playbook::Truncate
+    include Playbook::Left
+    include Playbook::Top
+    include Playbook::Right
+    include Playbook::Bottom
 
     prop :id
     prop :data, type: Playbook::Props::HashProp, default: {}
     prop :aria, type: Playbook::Props::HashProp, default: {}
+    prop :html_options, type: Playbook::Props::HashProp, default: {}
     prop :children, type: Playbook::Props::Proc
 
     def object
       self
     end
+
+    def combined_html_options
+      default_html_options.merge(html_options.deep_merge(data_attributes))
+    end
+
+  private
+
+    def default_html_options
+      {}
+    end
+
+    def data_attributes
+      {
+        data: data,
+        aria: aria,
+      }.transform_keys { |key| key.to_s.gsub("_", "-") }
+    end
   end
 end

data/lib/playbook/left.rb

@@ -0,0 +1,33 @@
+# frozen_string_literal: true
+
+module Playbook
+  module Left
+    def self.included(base)
+      base.prop :left
+    end
+
+    def left_values
+      %w[0 xxs xs sm md lg xl auto initial inherit]
+    end
+
+    def left_options
+      {
+        left: "left",
+      }
+    end
+
+  private
+
+    def left_props
+      selected_props = left_options.keys.select { |sk| try(sk) }
+      return nil unless selected_props.present?
+
+      selected_props.map do |k|
+        value = send(k)
+        return nil unless left_values.include? value
+
+        "left_#{value}"
+      end.compact.join(" ")
+    end
+  end
+end

data/lib/playbook/right.rb

@@ -0,0 +1,33 @@
+# frozen_string_literal: true
+
+module Playbook
+  module Right
+    def self.included(base)
+      base.prop :right
+    end
+
+    def right_values
+      %w[0 xxs xs sm md lg xl auto initial inherit]
+    end
+
+    def right_options
+      {
+        right: "right",
+      }
+    end
+
+  private
+
+    def right_props
+      selected_props = right_options.keys.select { |sk| try(sk) }
+      return nil unless selected_props.present?
+
+      selected_props.map do |k|
+        value = send(k)
+        return nil unless right_values.include? value
+
+        "right_#{value}"
+      end.compact.join(" ")
+    end
+  end
+end

data/lib/playbook/top.rb

@@ -0,0 +1,33 @@
+# frozen_string_literal: true
+
+module Playbook
+  module Top
+    def self.included(base)
+      base.prop :top
+    end
+
+    def top_values
+      %w[0 xxs xs sm md lg xl auto initial inherit]
+    end
+
+    def top_options
+      {
+        top: "top",
+      }
+    end
+
+  private
+
+    def top_props
+      selected_props = top_options.keys.select { |sk| try(sk) }
+      return nil unless selected_props.present?
+
+      selected_props.map do |k|
+        value = send(k)
+        return nil unless top_values.include? value
+
+        "top_#{value}"
+      end.compact.join(" ")
+    end
+  end
+end

data/lib/playbook/version.rb

@@ -2,5 +2,5 @@
 
 module Playbook
   PREVIOUS_VERSION = "13.20.0"
-  VERSION = "13.20.0.pre.alpha.PBNTR225advancedtablefeedback2375"
+  VERSION = "13.20.0.pre.alpha.play1247htmloptions2403"
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: playbook_ui
 version: !ruby/object:Gem::Version
-  version: 13.20.0.pre.alpha.PBNTR225advancedtablefeedback2375
+  version: 13.20.0.pre.alpha.play1247htmloptions2403
 platform: ruby
 authors:
 - Power UX
@@ -9,7 +9,7 @@ authors:
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2024-03-15 00:00:00.000000000 Z
+date: 2024-03-19 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: actionpack
@@ -312,7 +312,6 @@ files:
 - app/pb_kits/playbook/pb_advanced_table/docs/_mock_data_inline_loading.js
 - app/pb_kits/playbook/pb_advanced_table/docs/example.yml
 - app/pb_kits/playbook/pb_advanced_table/docs/index.js
-- app/pb_kits/playbook/pb_advanced_table/scss_partials/_chrome_styles.scss
 - app/pb_kits/playbook/pb_advanced_table/scss_partials/_loading.scss
 - app/pb_kits/playbook/pb_advanced_table/scss_partials/_pseudo_states.scss
 - app/pb_kits/playbook/pb_avatar/_avatar.scss
@@ -2223,7 +2222,6 @@ files:
 - app/pb_kits/playbook/pb_stat_value/stat_value.test.js
 - app/pb_kits/playbook/pb_table/_table.scss
 - app/pb_kits/playbook/pb_table/_table.tsx
-- app/pb_kits/playbook/pb_table/_table_row.tsx
 - app/pb_kits/playbook/pb_table/docs/_description.md
 - app/pb_kits/playbook/pb_table/docs/_table_action_middle.html.erb
 - app/pb_kits/playbook/pb_table/docs/_table_action_middle.jsx
@@ -2290,10 +2288,13 @@ files:
 - app/pb_kits/playbook/pb_table/docs/_table_vertical_border.jsx
 - app/pb_kits/playbook/pb_table/docs/_table_with_background_kit.html.erb
 - app/pb_kits/playbook/pb_table/docs/_table_with_background_kit.jsx
-- app/pb_kits/playbook/pb_table/docs/_table_with_subcomponents.html.erb
+- app/pb_kits/playbook/pb_table/docs/_table_with_subcomponents.jsx
 - app/pb_kits/playbook/pb_table/docs/_table_with_subcomponents.md
 - app/pb_kits/playbook/pb_table/docs/_table_with_subcomponents_as_divs.html.erb
+- app/pb_kits/playbook/pb_table/docs/_table_with_subcomponents_as_divs.jsx
 - app/pb_kits/playbook/pb_table/docs/_table_with_subcomponents_as_divs.md
+- app/pb_kits/playbook/pb_table/docs/_table_with_subcomponents_rails.html.erb
+- app/pb_kits/playbook/pb_table/docs/_table_with_subcomponents_rails.md
 - app/pb_kits/playbook/pb_table/docs/example.yml
 - app/pb_kits/playbook/pb_table/docs/index.js
 - app/pb_kits/playbook/pb_table/index.ts
@@ -2317,6 +2318,12 @@ files:
 - app/pb_kits/playbook/pb_table/styles/_tablet_collapse.scss
 - app/pb_kits/playbook/pb_table/styles/_variables.scss
 - app/pb_kits/playbook/pb_table/styles/_vertical_border.scss
+- app/pb_kits/playbook/pb_table/subcomponents/_table_body.tsx
+- app/pb_kits/playbook/pb_table/subcomponents/_table_cell.tsx
+- app/pb_kits/playbook/pb_table/subcomponents/_table_head.tsx
+- app/pb_kits/playbook/pb_table/subcomponents/_table_header.tsx
+- app/pb_kits/playbook/pb_table/subcomponents/_table_row.tsx
+- app/pb_kits/playbook/pb_table/subcomponents/index.tsx
 - app/pb_kits/playbook/pb_table/table.html.erb
 - app/pb_kits/playbook/pb_table/table.rb
 - app/pb_kits/playbook/pb_table/table.test.js
@@ -2803,6 +2810,7 @@ files:
 - lib/playbook/align_items.rb
 - lib/playbook/align_self.rb
 - lib/playbook/border_radius.rb
+- lib/playbook/bottom.rb
 - lib/playbook/classnames.rb
 - lib/playbook/cursor.rb
 - lib/playbook/display.rb
@@ -2828,6 +2836,7 @@ files:
 - lib/playbook/justify_self.rb
 - lib/playbook/kit_base.rb
 - lib/playbook/kit_resolver.rb
+- lib/playbook/left.rb
 - lib/playbook/line_height.rb
 - lib/playbook/number_spacing.rb
 - lib/playbook/order.rb
@@ -2852,9 +2861,11 @@ files:
 - lib/playbook/props/percentage.rb
 - lib/playbook/props/proc.rb
 - lib/playbook/props/string.rb
+- lib/playbook/right.rb
 - lib/playbook/shadow.rb
 - lib/playbook/spacing.rb
 - lib/playbook/text_align.rb
+- lib/playbook/top.rb
 - lib/playbook/truncate.rb
 - lib/playbook/version.rb
 - lib/playbook/z_index.rb

data/app/pb_kits/playbook/pb_advanced_table/scss_partials/_chrome_styles.scss

@@ -1,13 +0,0 @@
-@import "../../tokens/colors";
-
-@mixin chrome_styles($border-color) {
-  .chrome-styles:first-child {
-    border-right: $border-color;
-  }
-
-  .table-card {
-    .chrome-styles:first-child {
-      border-right: $transparent !important;
-    }
-  }
-}

data/app/pb_kits/playbook/pb_table/_table_row.tsx

@@ -1,47 +0,0 @@
-import React from 'react'
-import classnames from 'classnames'
-import { buildAriaProps, buildCss, buildDataProps, buildHtmlProps } from '../utilities/props'
-import { globalProps } from '../utilities/globalProps'
-
-type TableRowPropTypes = {
-  aria?: { [key: string]: string },
-  children: React.ReactNode[] | React.ReactNode,
-  className: string,
-  data?: { [key: string]: string },
-  htmlOptions?: {[key: string]: string | number | boolean | (() => void)},
-  id?: string,
-  sideHighlightColor: string,
-}
-
-const TableRow = (props: TableRowPropTypes) => {
-  const {
-    aria = {},
-    children,
-    className,
-    data = {},
-    htmlOptions = {},
-    id,
-    sideHighlightColor = 'windows',
-  } = props
-
-  const ariaProps = buildAriaProps(aria)
-  const dataProps = buildDataProps(data)
-  const htmlProps = buildHtmlProps(htmlOptions)
-  const sideHighlightClass =
-    sideHighlightColor != '' ? `side_highlight_${sideHighlightColor}` : null
-  const classes = classnames(buildCss('pb_table_row_kit', sideHighlightClass), globalProps(props), className)
-
-  return (
-    <tr
-      {...ariaProps}
-      {...dataProps}
-      {...htmlProps}
-      className={classes}
-      id={id}
-    >
-      {children}
-    </tr>
-  )
-}
-
-export default TableRow