<% if !local_prop_data.present? %>
<%= pb_rails("title", props: { text: "Available Props", size: 3, margin_bottom: "sm", dark: dark }) %>
<%= pb_rails("card", props: { padding: "none", dark: dark }) do %>
<%= pb_rails("card/card_body", props: { padding: "sm" }) do %>
<%= pb_rails("nav", props: { orientation: "horizontal", variant: "subtle", dark: dark }) do %>
<%= pb_rails("nav/item", props: { text: "Global Props", link: "#", active: true, dark: dark }) %>
<% end %>
<% end %>
<%= pb_rails("section_separator", dark: dark) %>
<%= pb_rails("card/card_body", props: {}) do %>
<%= pb_rails("table", props: {container: false, disable_hover: true, dark: dark }) do %>
| Props |
Type |
Values |
<% global_prop_data.each do |key, value|%>
|
<%= pb_rails("title", props: { text: key, tag: "h4", size: 4, dark: dark }) %>
|
<%= pb_rails("card", props: {
classname: "card",
padding: "xxs",
background: dark ? "dark" : "light",
border_none: true,
border_radius: "sm"
}) do %>
<%= pb_rails("body", props: {
classname: "kearning",
dark: dark
}) do %>
<% if key =~ /^padding|^margin/ %>
<%= "array" %>
<% else %>
<%= value[:type].to_s.downcase %>
<% end %>
<% end %>
<% end %>
|
<% if key =~ /^padding|^margin/ %>
<% padding_margin_values.each do |item| %>
<%= pb_rails("card", props: {
flex_direction: "row",
classname: "card",
padding: "xxs",
background: dark ? "dark" : "light",
border_none: true,
border_radius: "sm",
margin: "xxs"
}) do %>
<%= pb_rails("body", props: {
classname: "kearning",
dark: dark
}) do %>
<%= item %>
<% end %>
<% end %>
<% end %>
<% else %>
<% if value[:values].present? %>
<% value[:values].each do |item| %>
<% if item != nil %>
<%= pb_rails("card", props: {
flex_direction: "row",
classname: "card",
padding: "xxs",
background: dark ? "dark" : "light",
border_none: true,
border_radius: "sm",
margin: "xxs"
}) do %>
<%= pb_rails("body", props: {
classname: "kearning",
dark: dark
}) do %>
<%= item %>
<% end %>
<% end %>
<% end %>
<% end %>
<% end %>
<% end %>
|
<% end %>
<% end %>
<% end %>
<% end %>
<% else %>
<%= pb_rails("title", props: { text: "Available Props", size: 3, margin_bottom: "sm", dark: dark }) %>
<%= pb_rails("card", props: { padding: "none", dark: dark }) do %>
<%= pb_rails("card/card_body", props: { padding: "sm" }) do %>
<%= pb_rails("nav", props: { orientation: "horizontal", variant: "subtle", dark: dark }) do %>
<% if local_prop_data.present? %>
<%= pb_rails("nav/item", props: { text: "Kit Props", link: "#", active: true, id: "local-button-active", classname: "local-active", dark: dark }) %>
<% end %>
<% if local_prop_data.present? %>
<%= pb_rails("nav/item", props: { text: "Kit Props", link: "#", id: "local-button", classname: "global-active", dark: dark }) %>
<% end %>
<%= pb_rails("nav/item", props: { text: "Global Props", link: "#", active: true, id: "global-button-active", classname: "global-active", dark: dark }) %>
<%= pb_rails("nav/item", props: { text: "Global Props", link: "#", id: "global-button", classname: "local-active", dark: dark }) %>
<% end %>
<% end %>
<%= pb_rails("section_separator", props: { dark: dark }) %>
<%= pb_rails("card/card_body", props: { dark: dark }) do %>
<%= pb_rails("table", props: {container: false, disable_hover: true, id: "global-prop-table", classname: "global-active", dark: dark}) do %>
| Props |
Type |
Values |
<% global_prop_data.each do |key, value|%>
|
<%= pb_rails("title", props: { text: key, tag: "h4", size: 4, dark: dark }) %>
|
<%= pb_rails("card", props: {
classname: "card",
padding: "xxs",
background: dark ? "dark" : "light",
border_none: true,
border_radius: "sm"
}) do %>
<%= pb_rails("body", props: {
classname: "kearning",
dark: dark
}) do %>
<% if key =~ /^padding|^margin/ %>
<%= "array" %>
<% else %>
<%= value[:type].to_s.downcase %>
<% end %>
<% end %>
<% end %>
|
<% if key =~ /^padding|^margin/ %>
<% padding_margin_values.each do |item| %>
<%= pb_rails("card", props: {
flex_direction: "row",
classname: "card",
padding: "xxs",
background: dark ? "dark" : "light",
border_none: true,
border_radius: "sm",
margin: "xxs"
}) do %>
<%= pb_rails("body", props: {
classname: "kearning",
dark: dark
}) do %>
<%= item %>
<% end %>
<% end %>
<% end %>
<% else %>
<% if value[:values].present? %>
<% value[:values].each do |item| %>
<% if item != nil %>
<%= pb_rails("card", props: {
flex_direction: "row",
classname: "card",
padding: "xxs",
background: dark ? "dark" : "light",
border_none: true,
border_radius: "sm",
margin: "xxs"
}) do %>
<%= pb_rails("body", props: {
classname: "kearning",
dark: dark
}) do %>
<%= item %>
<% end %>
<% end %>
<% end %>
<% end %>
<% end %>
<% end %>
|
<% end %>
<% end %>
<%= pb_rails("table", props: {container: false, disable_hover: true, id: "local-prop-table", classname: "local-active", dark: dark }) do %>
| Props |
Type |
Values |
Default |
<% local_prop_data.each do |key, value|%>
|
<%= pb_rails("title", props: { text: key, tag: "h4", size: 4, dark: dark }) %>
|
<%= pb_rails("card", props: {
classname: "card",
dark: dark,
padding: "xxs",
background: dark ? "dark" : "light",
border_none: true,
border_radius: "sm"
}) do %>
<%= pb_rails("body", props: {
classname: "kearning",
dark: dark
}) do %>
<%= value[:type].downcase %>
<% end %>
<% end %>
|
<% if value[:values].present? %>
<% value[:values].each do |item| %>
<% if item != nil %>
<%= pb_rails("card", props: {
flex_direction: "row",
classname: "card",
padding: "xxs",
background: dark ? "dark" : "light",
border_none: true,
border_radius: "sm",
margin: "xxs"
}) do %>
<%= pb_rails("body", props: {
classname: "kearning",
dark: dark,
}) do %>
<%= item %>
<% end %>
<% end %>
<% end %>
<% end %>
<% end %>
|
<% if value[:default].present? || value[:default].is_a?(TrueClass) || value[:default].is_a?(FalseClass) %>
<%= pb_rails("card", props: {
classname: "card",
padding: "xxs",
background: dark ? "dark" : "light",
border_none: true,
border_radius: "sm"
}) do %>
<%= pb_rails("body", props: {
classname: "kearning",
dark: dark,
}) do %>
<%= value[:default] %>
<% end %>
<% end %>
<% end %>
|
<% end %>
<% end %>
<% end %>
<% end %>
<% end %>