playbook_ui 7.16.0.pre.alpha2 → 8.0.0.pre.alpha1

data/lib/playbook/version.rb

@@ -1,5 +1,5 @@
 # frozen_string_literal: true
 
 module Playbook
-  VERSION = "7.16.0.pre.alpha2"
+  VERSION = "8.0.0.pre.alpha1"
 end

data/lib/playbook/z_index.rb

@@ -0,0 +1,31 @@
+# frozen_string_literal: true
+
+module Playbook
+  module ZIndex
+    def self.included(base)
+      base.prop :z_index
+    end
+
+  private
+
+    def z_index_props
+      selected_index_props = z_index_options.keys.select { |sk| try(sk) }
+      return nil unless selected_index_props.present?
+
+      selected_index_props.map do |k|
+        index_value = send(k)
+        "z_index_#{index_value}" if z_index_values.include? index_value
+      end.compact.join(" ")
+    end
+
+    def z_index_options
+      {
+        z_index: "z-index",
+      }
+    end
+
+    def z_index_values
+      %w[1 2 3 4 5 6 7 8 9 10]
+    end
+  end
+end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: playbook_ui
 version: !ruby/object:Gem::Version
-  version: 7.16.0.pre.alpha2
+  version: 8.0.0.pre.alpha1
 platform: ruby
 authors:
 - Power UX
@@ -9,7 +9,7 @@ authors:
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2021-02-16 00:00:00.000000000 Z
+date: 2021-02-19 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: actionpack
@@ -426,10 +426,6 @@ files:
 - app/helpers/playbook/pb_sample_helper.rb
 - app/helpers/playbook/redcarpet_helper.rb
 - app/pb_kits/playbook/_playbook.scss
-- app/pb_kits/playbook/config/_kit_example.html.erb
-- app/pb_kits/playbook/config/_kit_samples_list.html.erb
-- app/pb_kits/playbook/config/_kit_ui.html.erb
-- app/pb_kits/playbook/config/_pb_kit_api.html.erb
 - app/pb_kits/playbook/data/menu.yml
 - app/pb_kits/playbook/index.js
 - app/pb_kits/playbook/pb_avatar/_avatar.jsx
@@ -866,7 +862,6 @@ files:
 - app/pb_kits/playbook/pb_filter/Filter/ResultsCount.jsx
 - app/pb_kits/playbook/pb_filter/Filter/SortMenu.jsx
 - app/pb_kits/playbook/pb_filter/Filter/index.jsx
-- app/pb_kits/playbook/pb_filter/_filter.html.erb
 - app/pb_kits/playbook/pb_filter/_filter.jsx
 - app/pb_kits/playbook/pb_filter/_filter.scss
 - app/pb_kits/playbook/pb_filter/docs/_description.md
@@ -890,9 +885,8 @@ files:
 - app/pb_kits/playbook/pb_filter/docs/_sort_only.jsx
 - app/pb_kits/playbook/pb_filter/docs/example.yml
 - app/pb_kits/playbook/pb_filter/docs/index.js
+- app/pb_kits/playbook/pb_filter/filter.html.erb
 - app/pb_kits/playbook/pb_filter/filter.rb
-- app/pb_kits/playbook/pb_filter/templates/_core.html.erb
-- app/pb_kits/playbook/pb_filter/templates/_default.html.erb
 - app/pb_kits/playbook/pb_fixed_confirmation_toast/_fixed_confirmation_toast.jsx
 - app/pb_kits/playbook/pb_fixed_confirmation_toast/_fixed_confirmation_toast.scss
 - app/pb_kits/playbook/pb_fixed_confirmation_toast/docs/_description.md
@@ -947,8 +941,6 @@ files:
 - app/pb_kits/playbook/pb_flex/flex_item.html.erb
 - app/pb_kits/playbook/pb_flex/flex_item.rb
 - app/pb_kits/playbook/pb_form/_form.scss
-- app/pb_kits/playbook/pb_form/_form_form_with.html.erb
-- app/pb_kits/playbook/pb_form/_form_simple_form.html.erb
 - app/pb_kits/playbook/pb_form/docs/_description.md
 - app/pb_kits/playbook/pb_form/docs/_footer.md
 - app/pb_kits/playbook/pb_form/docs/_form_form_with.html.erb
@@ -958,20 +950,22 @@ files:
 - app/pb_kits/playbook/pb_form/docs/_form_simple_form_validate.html.erb
 - app/pb_kits/playbook/pb_form/docs/_form_simple_form_validate.md
 - app/pb_kits/playbook/pb_form/docs/example.yml
+- app/pb_kits/playbook/pb_form/form.html.erb
 - app/pb_kits/playbook/pb_form/form.rb
-- app/pb_kits/playbook/pb_form/form/form_with_form.rb
-- app/pb_kits/playbook/pb_form/form/simple_form_form.rb
 - app/pb_kits/playbook/pb_form/form_builder.rb
+- app/pb_kits/playbook/pb_form/form_builder/action_area.html.erb
 - app/pb_kits/playbook/pb_form/form_builder/action_area.rb
 - app/pb_kits/playbook/pb_form/form_builder/checkbox_field.rb
 - app/pb_kits/playbook/pb_form/form_builder/collection_select_field.rb
 - app/pb_kits/playbook/pb_form/form_builder/date_picker_field.rb
 - app/pb_kits/playbook/pb_form/form_builder/form_field_builder.rb
-- app/pb_kits/playbook/pb_form/form_builder/form_with_form_builder.rb
 - app/pb_kits/playbook/pb_form/form_builder/select_field.rb
-- app/pb_kits/playbook/pb_form/form_builder/simple_form_builder.rb
 - app/pb_kits/playbook/pb_form/form_builder/typeahead_field.rb
+- app/pb_kits/playbook/pb_form/form_with.html.erb
+- app/pb_kits/playbook/pb_form/form_with.rb
 - app/pb_kits/playbook/pb_form/pb_form_validation.js
+- app/pb_kits/playbook/pb_form/simple_form.html.erb
+- app/pb_kits/playbook/pb_form/simple_form.rb
 - app/pb_kits/playbook/pb_form_group/_form_group.jsx
 - app/pb_kits/playbook/pb_form_group/_form_group.scss
 - app/pb_kits/playbook/pb_form_group/docs/_form_group_button.html.erb
@@ -1142,7 +1136,6 @@ files:
 - app/pb_kits/playbook/pb_image/image.html.erb
 - app/pb_kits/playbook/pb_image/image.rb
 - app/pb_kits/playbook/pb_image/image.test.js
-- app/pb_kits/playbook/pb_kit/base.rb
 - app/pb_kits/playbook/pb_kit/dateTime.js
 - app/pb_kits/playbook/pb_kit/pb_date_time.rb
 - app/pb_kits/playbook/pb_label_pill/_label_pill.jsx
@@ -1172,7 +1165,6 @@ files:
 - app/pb_kits/playbook/pb_label_value/docs/index.js
 - app/pb_kits/playbook/pb_label_value/label_value.html.erb
 - app/pb_kits/playbook/pb_label_value/label_value.rb
-- app/pb_kits/playbook/pb_layout/_item.html.erb
 - app/pb_kits/playbook/pb_layout/_layout.jsx
 - app/pb_kits/playbook/pb_layout/_layout.scss
 - app/pb_kits/playbook/pb_layout/_layout_mixin.scss
@@ -1205,6 +1197,7 @@ files:
 - app/pb_kits/playbook/pb_layout/footer.rb
 - app/pb_kits/playbook/pb_layout/header.html.erb
 - app/pb_kits/playbook/pb_layout/header.rb
+- app/pb_kits/playbook/pb_layout/item.html.erb
 - app/pb_kits/playbook/pb_layout/item.rb
 - app/pb_kits/playbook/pb_layout/layout.html.erb
 - app/pb_kits/playbook/pb_layout/layout.rb
@@ -2017,8 +2010,10 @@ files:
 - fonts/fontawesome-min.js
 - fonts/regular-min.js
 - lib/playbook.rb
+- lib/playbook/classnames.rb
 - lib/playbook/engine.rb
 - lib/playbook/kit_base.rb
+- lib/playbook/kit_resolver.rb
 - lib/playbook/markdown/template_handler.rb
 - lib/playbook/pb_kit_helper.rb
 - lib/playbook/props.rb
@@ -2035,7 +2030,9 @@ files:
 - lib/playbook/props/percentage.rb
 - lib/playbook/props/proc.rb
 - lib/playbook/props/string.rb
+- lib/playbook/spacing.rb
 - lib/playbook/version.rb
+- lib/playbook/z_index.rb
 - lib/playbook_ui.rb
 homepage: http://playbook.powerapp.cloud
 licenses:
@@ -2056,7 +2053,8 @@ required_rubygems_version: !ruby/object:Gem::Requirement
     - !ruby/object:Gem::Version
       version: 1.3.1
 requirements: []
-rubygems_version: 3.1.4
+rubyforge_project:
+rubygems_version: 2.7.3
 signing_key:
 specification_version: 4
 summary: Playbook Design System

data/app/pb_kits/playbook/config/_kit_example.html.erb

@@ -1,23 +0,0 @@
-<%if !@kit_examples[:examples].nil? %>
-  <% if @limit_examples %>
-    <% @kit_examples[:examples].each_with_index do |kit_example, index| %>
-      <% kit_example.each do |key, item| %>
-        <% if index == 0 %>
-          <%= pb_rails("card", props: { classname: "pb--doc", padding:"none" }) do %>
-            <%= render partial: "config/kit_ui", locals: { key: key, type: @type, item: item, show_code: @show_code } %>
-          <% end %>
-        <% elsif index > 0 %>
-          <% break %>
-        <% end %>
-      <% end %>
-    <% end %>
-  <% else %>
-    <% @kit_examples[:examples].each do |kit_example| %>
-      <% kit_example.each do |key, item| %>
-        <%= pb_rails("card", props: { classname: "pb--doc", padding:"none" }) do %>
-          <%= render partial: "config/kit_ui", locals: { key: key, type: @type, item: item, show_code: @show_code } %>
-        <% end %>
-      <% end %>
-    <% end %>
-  <% end %>
-<% end %>

data/app/pb_kits/playbook/config/_kit_samples_list.html.erb

@@ -1,3 +0,0 @@
-<div>
-    Flexbox list of thumbnail previews. 
-</div>

data/app/pb_kits/playbook/config/_kit_ui.html.erb

@@ -1,43 +0,0 @@
-
-<% type ||= "rails" %>
-
-<% if type == "react" %>
-  <% contents = File.read("#{Playbook::Engine.root}/app/pb_kits/playbook/pb_#{@kit_examples[:kit]}/docs/_#{key}.jsx") %>
-<% else %>
-  <% contents = File.read("#{Playbook::Engine.root}/app/pb_kits/playbook/pb_#{@kit_examples[:kit]}/docs/_#{key}.html.erb") %>
-<% end %>
-
-<div class="pb--kit-example">
-  <%= pb_rails("caption", props: { text: item }) %>
-  <br>
-  <% if type == "rails" %>
-    <%= render partial: "pb_#{@kit_examples[:kit]}/docs/#{key}" %>
-  <% elsif type == "react" %>
-    <%= pb_react(key.camelize) %>
-  <% end %>
-  <br>
-</div>
-
-<% if @show_code %>
-  <div class="markdown pb--kit-example-markdown <%= cookies[:dark_mode] == "true" ? "dark" : "" %>">
-    <%= markdown(get_per_sample_descriptions(@kit_examples[:kit], key)) %>
-  </div>
-  <div id="code-wrapper">
-    <div class="pb--codeControls">
-      <ul>
-        <li>
-          <a href="#" id="toggle-open" data-toggle="code_example">Code Example</a>
-        </li>
-      </ul>
-    </div>
-    <div class="pb--codeCopy" data-action="toggle" data-togglable="code_example" style="display: none" >
-      <%= pb_rails("section_separator")%>
-      <a href="#" id="toggle-close" data-toggle="false" class="pb--close-toggle">Close</a>
-      <% if type == "rails" %>
-        <pre class="highlight"><%= raw rouge(contents, "erb") %></pre>
-      <% elsif type == "react" %>
-        <pre class="highlight"><%= raw rouge(contents, "react")%></pre>
-      <% end %>
-    </div>
-  </div>
-<% end %>

data/app/pb_kits/playbook/config/_pb_kit_api.html.erb

@@ -1,16 +0,0 @@
-<% if defined?(@kit_api) && @kit_api.present? %>
-
-  <div data-action="toggle" data-togglable="prop_example" class="pb--propsTable">
-  <%= pb_rails("title", props:{text: "Available Props", size:3, margin_bottom:"sm"}) %>
-    <%= pb_rails("card",props:{padding:"none"})do%>
-      <%= pb_rails("list",props: {xpadding:true})do%>
-        <% @kit_api.each_with_index do |(key,value),index| %>
-            <%= pb_rails("list/item") do %>
-              <%= key %>
-            <% end %>
-        <% end %>
-      <% end %>
-    <% end %>
-  </div>
-  
-<% end %>

data/app/pb_kits/playbook/pb_filter/_filter.html.erb

@@ -1,6 +0,0 @@
-<%= content_tag(:div,
-    id: object.id,
-    data: object.data,
-    class: object.classname) do %>
-    <%= render partial: "pb_filter/templates/default", locals: {object: object, min_width: object.min_width}%>
-<% end %>

data/app/pb_kits/playbook/pb_filter/templates/_core.html.erb

@@ -1,67 +0,0 @@
-
-<%= pb_rails("flex", props: {orientation: "row", padding_right: "lg", vertical: "center"}) do %>
-
-    <% if (object.template != "sort_only") %>
-      <%= pb_rails("circle_icon_button", props: { variant: "secondary", icon: "filter", id:"filter#{object.id}"}) %>
-      <div class="maskContainer">
-        <div class="filters">
-          <div class="left_gradient"></div>
-            <% object.filters.each do |filter| %>
-              <% if filter[:name]== "" %>
-                  <div>
-                    <%= pb_rails("body", props: {
-                      color: "light",
-                      padding_left: "xs",
-                      size: 4,
-                      tag:"h4",
-                      text: "No Filter Selected"
-                    }) %>
-                  </div>
-              <% else %>
-                  <div class="filter">
-                    <%= pb_rails("caption", props: { text: filter[:name]}) %>
-                    <%= pb_rails("title", props: { size: 4, tag:"h4", text: filter[:value]}) %>
-                  </div>
-              <% end %>
-            <% end %>
-          <div class="right_gradient"></div>
-        </div>
-      </div>
-      <% if (object.template != "default") %>
-        <%= pb_rails("caption", props: {text: object.result_text, size:"xs", classname:"filter-results"})%>
-      <% end %>
-    <% end %>
-
-    <% if (object.template == "single" ) || (object.template == "sort_only") %>
-      <% unless object.sort_menu == [{}] %>
-        <%= pb_rails("button", props: {variant: "link",id: "sort-button#{object.id}",padding_right: "none"}) do %>
-          <% object.sort_menu.each do |item| %>
-            <% if item[:active] == true %>
-              <%= item[:item] %>
-              <%= pb_rails("icon", props: { icon: object.sort_icon(item[:direction]), fixed_width: true }) %>
-            <% end %>
-          <% end %>
-        <% end %>
-      <% end %>
-    <% end %>
-
-
-<% end %>
-
-<% if (object.template == "default")%>
-  <%= pb_rails("section_separator") %>
-  <%= pb_rails("flex", props: {orientation: "row", vertical: "center", spacing: "between", classname: "filter-bottom"}) do %>
-    <%= pb_rails("title_count", props: {title: "Results:",count: object.results, align:"center"}) %>
-      <%= pb_rails("flex", props: {orientation: "row", vertical: "center"}) do %>
-        <%= pb_rails("caption", props: { text: "sort by:"}) %>
-        <%= pb_rails("button", props: {variant: "link", padding_right: "none", id: "sort-button#{object.id}"}) do %>
-          <% object.sort_menu.each do |item| %>
-            <% if item[:active] == true %>
-              <%= item[:item] %>
-              <%= pb_rails("icon", props: { icon: object.sort_icon(item[:direction]), fixed_width: true }) %>
-            <% end %>
-          <% end %>
-        <% end %>
-      <% end %>
-  <% end %>
-<% end %>

data/app/pb_kits/playbook/pb_filter/templates/_default.html.erb

@@ -1,23 +0,0 @@
-<% if object.background %>
-  <%= pb_rails("card",props: {padding:"none"}) do%>
-    <%= render partial: 'pb_filter/templates/core', locals: {object: object} %>
-  <% end %> 
-<% else %>
- <%= render partial: 'pb_filter/templates/core', locals: { object: object} %>
-<% end %>
-
-<% if object.template != "sort_only"%>
-  <%= pb_rails("popover", props: {min_width: object.min_width, close_on_click: "outside", trigger_element_id: "filter#{object.id}", tooltip_id: "filter-form#{object.id}", position: 'bottom'}) do %>
-    <%= capture(&object.children) %>
-  <% end %>
-<%end%>
-
-<% if object.template != "filter_only"%>
-  <%= pb_rails("popover", props: {classname: "pb_filter_sort_menu", close_on_click: "outside", trigger_element_id: "sort-button#{object.id}", tooltip_id: "sort-filter-btn-tooltip#{object.id}", position: 'bottom', padding: 'none'}) do %>
-      <%= pb_rails("list") do %>
-        <% object.sort_menu.each do |item| %>
-          <%= pb_rails("list/item") do%> <%= pb_rails("button", props: {variant: "link" ,classname: "p-0", text: item[:item], link: item[:link]}) %><% end %>
-        <% end %> 
-      <% end %>
-  <% end %>
-<% end %>

data/app/pb_kits/playbook/pb_form/_form_form_with.html.erb

@@ -1,13 +0,0 @@
-<%= form_with object.merged_form_system_options do |form| %>
-  <% instance_exec form, &object.children %>
-
-  <% if object.validate %>
-    <% content_for :pb_js do %>
-      <%= javascript_tag do %>
-        window.addEventListener('DOMContentLoaded', function() {
-          PbFormValidation.start()
-        })
-      <% end %>
-    <% end %>
-  <% end %>
-<% end %>

data/app/pb_kits/playbook/pb_form/form/form_with_form.rb

@@ -1,39 +0,0 @@
-# frozen_string_literal: true
-
-module Playbook
-  module PbForm
-    class Form
-      class FormWithForm
-        def initialize(form)
-          self.form = form
-        end
-
-        def to_partial_path
-          "pb_form/form_form_with"
-        end
-
-        def merged_form_system_options
-          Hash(form_system_options).merge(
-            class: merged_class,
-            data: { "pb-form-validation": validate }.merge(Hash(form_system_options).fetch(:data, {})),
-            builder: form_builder
-          )
-        end
-
-      private
-
-        attr_accessor :form
-
-        delegate_missing_to :form
-
-        def merged_class
-          "pb-form #{Hash(form_system_options)[:class]}".strip
-        end
-
-        def form_builder
-          FormBuilder::FormWithFormBuilder
-        end
-      end
-    end
-  end
-end

data/app/pb_kits/playbook/pb_form/form/simple_form_form.rb

@@ -1,46 +0,0 @@
-# frozen_string_literal: true
-
-module Playbook
-  module PbForm
-    class Form
-      class SimpleFormForm
-        def initialize(form)
-          self.form = form
-        end
-
-        def to_partial_path
-          "pb_form/form_simple_form"
-        end
-
-        def merged_form_system_options
-          [
-            Array(form_system_options)[0],
-            Hash(Array(form_system_options)[1]).merge(
-              data: { "pb-form-validation": validate }.merge((form_system_options&.last || {}).fetch(:data, {})),
-              html: merged_html,
-              builder: form_builder
-            ),
-          ]
-        end
-
-      private
-
-        attr_accessor :form
-
-        delegate_missing_to :form
-
-        def merged_html
-          html_options = Hash(Array(form_system_options)[1])[:html] || {}
-          html_class = html_options[:class]
-          html_options[:class] = "pb-form #{html_class}".strip
-
-          html_options
-        end
-
-        def form_builder
-          FormBuilder::SimpleFormBuilder
-        end
-      end
-    end
-  end
-end