playbook_ui 16.9.0.pre.alpha.PLAY2967borderglobalprop17223 → 16.9.0.pre.alpha.PLAY3001updateviewcomponent16983

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 45c8f4e78857f203bf34eca0156fd8a925407342da220841b70b25a53b417252
-  data.tar.gz: d1204dce47513e932fe3d370cb361ff2e7fa5250fd91e385db49d599260d127c
+  metadata.gz: f9bb2201c216204c6c7425175feb07d6a529fd72d0a8712bf5f868eb4a224625
+  data.tar.gz: 44272337d42fc1e45929881d14908c4d3083d5abf5d5b8f1c2d809ada8d14349
 SHA512:
-  metadata.gz: f47ffd3a07d882ea18a28cdf963a87aed422e9ce86ed784f8ad23d55e51df8722552f512e3a192cc744532180b4b41d6f0737a14e00b8e1f8c5d09c4a3a3c6bb
-  data.tar.gz: a7153499da64bc8fc30d6e770ba678c1a8017e10d094876ed8ad4642f1d75037786833ce2a3ba4060c476c432c1f662056c150c6fac4e1a2e3cac51d57fb1e4e
+  metadata.gz: eb3ae8f97aea18135d2b3a1b4a951134c1550de03b444fc13df179c4db8904364fec786c7d7f3502b7e5efd2ef48153e36c47753d8ae37f18b493f027269f434
+  data.tar.gz: 491df3c6334edced277137a264ccb82664a6e05043bac4ca2c103e5c3b4890a22fce6435149c25e4da7472796e08a3a39a9440ad5758c5d8a1ca12e68d2bc742

data/app/pb_kits/playbook/_playbook.scss

@@ -128,4 +128,3 @@
 @import 'utilities/vertical_align';
 @import 'utilities/height';
 @import 'utilities/gap';
-@import 'utilities/border';

data/app/pb_kits/playbook/pb_badge/kit.schema.json

@@ -20,7 +20,7 @@
       ]
     },
     "removeOnClick": {
-      "type": "function",
+      "type": "ReactNode",
       "platforms": [
         "react"
       ]

data/app/pb_kits/playbook/pb_button_toolbar/kit.schema.json

@@ -8,7 +8,7 @@
   ],
   "props": {
     "onClick": {
-      "type": "function",
+      "type": "ReactNode",
       "platforms": [
         "react"
       ]

data/app/pb_kits/playbook/pb_card/docs/_card_light.html.erb

@@ -1,339 +1,4 @@
-<%
-dropdown_options = [
-  { label: "Option 1", value: "1", id: "1" },
-  { label: "Option 2", value: "2", id: "2" },
-  { label: "Option 3", value: "3", id: "3" },
-]
-typeahead_options = [
-    { label: "Orange", value: "#FFA500" },
-    { label: "Blue", value: "#0000FF" },
-  ]
-%>
-
-<%= pb_rails("title", props: {
-  text: "Border Utilities",
-  size: 3,
-  margin_bottom: "md"
-}) %>
-
-<%= pb_rails("title", props: {
-  text: "Border Variants",
-  size: 4,
-  margin_bottom: "sm"
-}) %>
-
-<%= pb_rails("flex", props: { gap: "md", wrap: true }) do %>
-  <%= pb_rails("card", props: { border: "default", padding: "sm" }) do %>
-    default
-  <% end %>
-
-  <%= pb_rails("card", props: { border: "active", padding: "sm" }) do %>
-    active
-  <% end %>
-
-  <%= pb_rails("card", props: { border: "default_thick", padding: "sm" }) do %>
-    default_thick
-  <% end %>
-
-  <%= pb_rails("card", props: { border: "active_thick", padding: "sm" }) do %>
-    active_thick
-  <% end %>
-
-  <%= pb_rails("card", props: { border: "default_thicker", padding: "sm" }) do %>
-    default_thicker
-  <% end %>
-
-  <%= pb_rails("card", props: { border: "active_thicker", padding: "sm" }) do %>
-    active_thicker
-  <% end %>
+<%= pb_rails("card", props: {
+})  do %>
+  Card content
 <% end %>
-
-<%= pb_rails("title", props: {
-  text: "Border Width Comparison",
-  size: 4,
-  margin_top: "md",
-  margin_bottom: "sm"
-}) %>
-
-<%= pb_rails("flex", props: { gap: "md", wrap: true }) do %>
-  <%= pb_rails("card", props: { border: "default", padding: "sm" }) do %>
-    1px
-  <% end %>
-
-  <%= pb_rails("card", props: { border: "default_thick", padding: "sm" }) do %>
-    2px
-  <% end %>
-
-  <%= pb_rails("card", props: { border: "default_thicker", padding: "sm" }) do %>
-    4px
-  <% end %>
-<% end %>
-
-<%= pb_rails("title", props: {
-  text: "Directional Borders",
-  size: 4,
-  margin_top: "md",
-  margin_bottom: "sm"
-}) %>
-
-<%= pb_rails("flex", props: { gap: "md", wrap: true }) do %>
-  <%= pb_rails("card", props: { border_top: "active", padding: "sm" }) do %>
-    Top
-  <% end %>
-
-  <%= pb_rails("card", props: { border_bottom: "active", padding: "sm" }) do %>
-    Bottom
-  <% end %>
-
-  <%= pb_rails("card", props: { border_left: "active", padding: "sm" }) do %>
-    Left
-  <% end %>
-
-  <%= pb_rails("card", props: { border_right: "active", padding: "sm" }) do %>
-    Right
-  <% end %>
-
-  <%= pb_rails("card", props: { border_x: "active_thick", padding: "sm" }) do %>
-    X Axis
-  <% end %>
-
-  <%= pb_rails("card", props: { border_y: "active_thicker", padding: "sm" }) do %>
-    Y Axis
-  <% end %>
-<% end %>
-
-<%= pb_rails("title", props: {
-  text: "Border + Radius",
-  size: 4,
-  margin_top: "md",
-  margin_bottom: "sm"
-}) %>
-
-<%= pb_rails("flex", props: { gap: "md", wrap: true }) do %>
-  <%= pb_rails("flex", props: {
-    border: "default",
-    border_radius: "none",
-    padding: "md"
-  }) do %>
-    radius="none"
-  <% end %>
-
-  <%= pb_rails("flex", props: {
-    border: "active",
-    border_radius: "md",
-    padding: "md"
-  }) do %>
-    radius="md"
-  <% end %>
-
-  <%= pb_rails("flex", props: {
-    border: "default_thick",
-    border_radius: "lg",
-    padding: "md"
-  }) do %>
-    radius="lg"
-  <% end %>
-
-  <%= pb_rails("flex", props: {
-    border: "active_thicker",
-    border_radius: "rounded",
-    padding: "md"
-  }) do %>
-    radius="rounded"
-  <% end %>
-<% end %>
-
-<%= pb_rails("title", props: {
-  text: "Buttons & Icons",
-  size: 4,
-  margin_top: "md",
-  margin_bottom: "sm"
-}) %>
-
-<%= pb_rails("flex", props: {
-  gap: "md",
-  wrap: true,
-}) do %>
-
-  <%= pb_rails("button", props: {
-    border: "default",
-    text: "Default",
-    variant: "secondary"
-  }) %>
-
-  <%= pb_rails("button", props: {
-    border: "active",
-    text: "Active",
-    variant: "secondary"
-  }) %>
-
-  <%= pb_rails("button", props: {
-    border: "default_thick",
-    text: "Thick",
-    variant: "secondary"
-  }) %>
-
-  <%= pb_rails("button", props: {
-    border: "active_thicker",
-    text: "Thicker",
-    variant: "secondary"
-  }) %>
-
-  <%= pb_rails("circle_icon_button", props: {
-    icon: "star",
-    border: "active",
-    variant: "secondary"
-  }) %>
-
-  <%= pb_rails("icon", props: {
-    icon: "user",
-    border: "default"
-  }) %>
-
-  <%= pb_rails("icon", props: {
-    icon: "user",
-    border: "active"
-  }) %>
-
-  <%= pb_rails("icon", props: {
-    icon: "user",
-    border: "default_thick"
-  }) %>
-
-  <%= pb_rails("icon", props: {
-    icon: "user",
-    border: "active_thick"
-  }) %>
-
-  <%= pb_rails("icon", props: {
-    icon: "user",
-    border: "default_thicker"
-  }) %>
-
-  <%= pb_rails("icon", props: {
-    icon: "user",
-    border: "active_thicker"
-  }) %>
-
-<%= pb_rails("icon", props: {
-    icon: "rocket",
-    border: true
-  }) %>
-<% end %>
-
-<%= pb_rails("title", props: {
-  text: "Form Components",
-  size: 4,
-  margin_top: "md",
-  margin_bottom: "sm"
-}) %>
-
-<%= pb_rails("flex", props: {
-  gap: "lg",
-  wrap: true
-}) do %>
-
-  <%= pb_rails("dropdown", props: {
-    label: "Dropdown",
-    options: dropdown_options,
-    border: "default"
-  }) %>
-
-  <%= pb_rails("typeahead", props: {
-    id: "border-utils-typeahead",
-    label: "Typeahead",
-    options: typeahead_options,
-    border: "active",
-    is_multi: false
-  }) %>
-
-  <%= pb_rails("date_picker", props: {
-    picker_id: "border-utils-datepicker",
-    name: "border_utils_date",
-    label: "Date Picker",
-    border: "active_thick"
-  }) %>
-
-<% end %>
-
-
-<%= pb_rails("title", props: {
-  text: "Containers",
-  size: 4,
-  margin_top: "md",
-  margin_bottom: "sm"
-}) %>
-
-<%= pb_rails("flex", props: {
-  gap: "md",
-  wrap: true
-}) do %>
-
-  <%= pb_rails("background", props: {
-    background_color: "neutral_subtle",
-    border: "default",
-    border_radius: "md",
-    padding: "md"
-  }) do %>
-    Default Border
-  <% end %>
-
-  <%= pb_rails("background", props: {
-    background_color: "neutral_subtle",
-    border: "active_thick",
-    border_radius: "lg",
-    padding: "md"
-  }) do %>
-    Active Thick Border
-  <% end %>
-
-<% end %>
-
-<%= pb_rails("title", props: {
-  text: "Dark Mode",
-  size: 4,
-  margin_top: "md",
-  margin_bottom: "sm"
-}) %>
-
-<%= pb_rails("background", props: {
-  background_color: "dark",
-  padding: "lg"
-}) do %>
-
-  <%= pb_rails("flex", props: {
-    gap: "md"
-  }) do %>
-
-    <%= pb_rails("card", props: {
-      dark: true,
-      border: "default",
-      padding: "sm"
-    }) do %>
-      default
-    <% end %>
-
-    <%= pb_rails("card", props: {
-      dark: true,
-      border: "active",
-      padding: "sm"
-    }) do %>
-      active
-    <% end %>
-
-    <%= pb_rails("flex", props: {
-      border: "default_thicker",
-      border_radius: "lg",
-      padding: "md"
-    }) do %>
-      default_thicker + radius
-    <% end %>
-
-    <%= pb_rails("button", props: {
-      border: "active_thick",
-      text: "Button",
-      variant: "secondary"
-    }) %>
-  <% end %>
-
-<% end %>