playbook_ui 14.16.0.pre.alpha.PLAY1929bracketlayout6930 → 14.16.0.pre.alpha.play1756pbcontenttag6933

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: d9d5e98cc39044286ea907a7571c235705d22846b338d0cfd968cc240ea2cdc7
-  data.tar.gz: 0d0cfeb97e0db01704458b47c1f7625695185dc0515df7cd2f6342b7b131d33d
+  metadata.gz: 8a4ac3fbaa15f6adca7b726dd7f6657721f22bf831d7f0181b2eba4906173f97
+  data.tar.gz: 30ef3eb42bd42f91434da0020c6fe7e25274c8c1589240288f3183839b8a9a98
 SHA512:
-  metadata.gz: c21da69e3465628cdd5ed615ef5015bff969d5ee0bf183410f2603a33f00459cad63376c9fcc160052b29e5e94ee8cac73cf3129a22dbe1743d5c7523010453c
-  data.tar.gz: 74a02f7483b1d8ec893de6391285077011143c920a83e37811adb61f0b8673661d0d9d31aed053659aa650f8913428aa1cbe273cc74fa090ab7033e32655a7fb
+  metadata.gz: 859b0b40c1ab98b6fda5255a9d2901afc9af0fc324e4cd57d433927aa7503b9c8438e6eac49f3b18cd368108e942fafb7b755f8614f7ae79b716c8d75a6917f9
+  data.tar.gz: 249c3fae7f7766636796bd3ed40f2de2aec4e257fbc801f9fc1a194a905b6262c281a444bb7a41ad11fe2c0b1f0060873d336ff9bfe325c4553ded36d4dc8020

data/app/pb_kits/playbook/pb_layout/_layout.scss

@@ -10,8 +10,6 @@ $list-header-height: $space_lg;
 $list-footer-height: $space_lg;
 $list-border-radius: $border_rad_lighter;
 $card-border-radius: $border_rad_lightest;
-$bracket-connector-width: 45px;
-$bracket-border-width: 4px;
 
 
 [class^=pb_layout_kit] {
@@ -170,62 +168,6 @@ $bracket-border-width: 4px;
     }
   }
 
-  &[class*=_bracket]{
-    display: flex;
-    overflow-x: scroll;
-
-    div.layout_round {
-      display: flex;
-      flex-direction: column;
-      justify-content: space-around;
-      flex-grow: 1;
-    }
-
-    .connector_container {
-      display: flex;
-      flex-direction: column;
-      justify-content: space-around;
-    }
-    .right_connector {
-      border-top: $bracket-border-width solid $border_light;
-      width: $bracket-connector-width;
-      margin-left: $bracket-connector-width;
-    }
-
-    .layout_round .layout_game {
-      position: relative;
-    }
-
-    .half_box {
-      content: '';
-      position: absolute;
-      top: calc(50% - $bracket-border-width / 2);
-      height: calc(100% + $bracket-border-width);
-      width: $bracket-connector-width;
-      right: -$bracket-connector-width;
-      border-top-right-radius: $border_radius_lg;
-      border-bottom-right-radius: $border_radius_lg;
-      border-top: $bracket-border-width solid $border_light;
-      border-bottom: $bracket-border-width solid $border_light;
-      border-right: $bracket-border-width solid $border_light;
-    }
-
-    .layout_round_label {
-      display: none;
-    }
-
-    @media (max-width: $screen-md-max) {
-      flex-direction: column;
-      .layout_round_label {
-        display: block;
-      }
-      .layout_round .layout_game::after,
-      .connector_container,
-      .half_box {
-        display: none !important;
-      }
-    }
-  }
 
   &[class*=_sidebar]{
     $layout_sizes: (

data/app/pb_kits/playbook/pb_layout/_layout.tsx

@@ -4,9 +4,6 @@ import { buildAriaProps, buildCss, buildDataProps, buildHtmlProps } from '../uti
 
 import { GlobalProps, globalProps, globalInlineProps } from '../utilities/globalProps'
 
-import { Round, RoundLabel } from "./subcomponents/_round";
-import Game from "./subcomponents/_game";
-
 type LayoutPropTypes = {
   aria?: {[key: string]: string},
   children?: React.ReactChild[] | React.ReactChild,
@@ -21,7 +18,7 @@ type LayoutPropTypes = {
   size?: "xs" | "sm" | "md" | "base" | "lg" | "xl",
   variant?: "light" | "dark" | "gradient",
   transparent?: boolean,
-  layout?: "sidebar" | "collection" | "kanban" | "content" | "masonry" | "bracket",
+  layout?: "sidebar" | "collection" | "kanban" | "content" | "masonry",
 } & GlobalProps
 
 type LayoutSideProps = {
@@ -143,7 +140,7 @@ const Layout = (props: LayoutPropTypes) => {
   const htmlProps = buildHtmlProps(htmlOptions)
 
   const layoutCss =
-    (layout == 'collection' || layout == 'bracket')
+    layout == 'collection'
       ? `pb_layout_kit_${layout}`
       : layout == 'kanban'
         ? `pb_layout_kit_${layout}${responsiveClass}`
@@ -154,9 +151,11 @@ const Layout = (props: LayoutPropTypes) => {
         })
 
   const layoutCollapseCss =
-    (layout == 'collection' || layout == 'kanban' || layout == 'bracket')
+    layout == 'collection'
       ? ''
-      : buildCss('layout', position, 'collapse', collapse)
+      : layout == 'kanban'
+        ? ''
+        : buildCss('layout', position, 'collapse', collapse)
 
   const layoutChildren = React.Children.toArray(children)
 
@@ -176,11 +175,6 @@ const Layout = (props: LayoutPropTypes) => {
     (child: React.ReactElement & {type: {displayName: string}}) => child.type?.displayName !== 'Side'
   )
 
-  const numberOfRounds = Array.isArray(nonSideChildren) ? nonSideChildren.filter((child: any) => child.type?.name === 'Round').length : 0
-  const bracketChildren = nonSideChildren.map(child =>
-    React.isValidElement(child) ? React.cloneElement(child, { numberOfRounds }) : child
-  )
-  
   const filteredProps = {...props}
   delete filteredProps?.position
 
@@ -202,7 +196,7 @@ const Layout = (props: LayoutPropTypes) => {
         style={dynamicInlineProps}
     >
       {subComponentTags('Side')}
-      {layout === 'bracket' ? bracketChildren : nonSideChildren}
+      {nonSideChildren}
     </div>
   )
 }
@@ -212,8 +206,5 @@ Layout.Body = Body
 Layout.Item = Item
 Layout.Header = Header
 Layout.Footer = Footer
-Layout.Round = Round
-Layout.Game = Game
-Layout.RoundLabel = RoundLabel
 
 export default Layout

data/app/pb_kits/playbook/pb_layout/docs/example.yml

@@ -18,5 +18,4 @@ examples:
   - layout_kanban: Kanban Layout
   - layout_content: Content Layout
   - layout_masonry: Masonry Layout
-  - layout_bracket: Bracket Layout
 

data/app/pb_kits/playbook/pb_layout/docs/index.js

@@ -7,5 +7,4 @@ export { default as LayoutKanbanResponsive } from './_layout_kanban_responsive.j
 export { default as LayoutCollectionDetail } from './_layout_collection_detail.jsx'
 export { default as LayoutContent } from './_layout_content.jsx'
 export { default as LayoutMasonry } from './_layout_masonry.jsx'
-export { default as LayoutBracket } from './_layout_bracket.jsx'
 

data/app/pb_kits/playbook/pb_layout/layout.test.js

@@ -82,10 +82,6 @@ test("render all layout variants", () => {
       layout: "masonry",
       expected: "pb_layout_kit_masonry_size_md_left_light",
     },
-    {
-      layout: "bracket",
-      expected: "pb_layout_kit_bracket",
-    },
   ]
 
   testValues.forEach(({ layout, expected }) => {

data/app/pb_kits/playbook/pb_tooltip/tooltip.html.erb

@@ -1,11 +1,8 @@
-<%= content_tag(:div,
-      id: object.id,
-      data: object.data,
-      class: object.classname,
+<%= pb_content_tag(:div,
       style: remove_height_properties(combined_html_options[:style]) || "",
       **combined_html_options.except(:style)) do %>
   <div class="tooltip_tooltip" id="<%= object.tooltip_id %>" role="tooltip" style="<%= object.height_and_width_helper %>">
     <%= content.presence %>
     <div class="arrow" id="<%= object.tooltip_id %>-arrow"></div>
   </div>
-<% end %>
+<% end %>

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

@@ -1,11 +1,8 @@
 <% if object.is_react? %>
   <%= react_component('Typeahead', object.typeahead_react_options) %>
 <% else %>
-  <%= content_tag(:div,
-                id: object.id,
-                data: object.data,
-                class: object.classname + object.inline_class,
-                **combined_html_options) do %>
+  <%= pb_content_tag(:div,
+                     class: object.classname + object.inline_class) do %>
     <div class="pb_typeahead_wrapper">
       <div class="pb_typeahead_loading_indicator" data-pb-typeahead-kit-loading-indicator>
         <%= pb_rails("icon", props: {

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

@@ -1,9 +1,4 @@
-<%= content_tag(:div,
-    aria: object.aria,
-    class: object.classname,
-    data: object.data,
-    id: object.id,
-    **combined_html_options) do %>
+<%= pb_content_tag do %>
   <% if object.avatar_url.present? || object.avatar %>
     <%= pb_rails("avatar", props: {
       name: object.name,

data/app/pb_kits/playbook/pb_user_badge/user_badge.html.erb

@@ -1,8 +1,3 @@
-<%= content_tag(:div,
-    aria: object.aria,
-    class: object.classname,
-    data: object.data,
-    id: object.id,
-    **combined_html_options) do %>
+<%= pb_content_tag do %>
   <%= content_tag(:div, object.display_badge, class: "pb_user_badge_wrapper") %>
 <% end %>