playbook_ui 7.1.1.pre.alpha1 → 7.1.1

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 595c0820f16b2b3e0946f41382f7a3668b23852960c36a3e910f7a220dc4681a
-  data.tar.gz: 39a721f24fa92d169e229c89920d12603c6758fc462633336fb105cce690c6c2
+  metadata.gz: a771d897c0c6e10fcc255e3894b2d3fb52905310dcc4d8c6d9a4adad11cbc155
+  data.tar.gz: acd8f6f824a1e5c8c4c673584c736c34a00531504dd11225100dacfbb01a044d
 SHA512:
-  metadata.gz: 825198798b8e0409757b0fc9cbca50e78cc7181cbfce089d986b086dd9ecd91e292f30d16b0c461e49010845d2451b946e5a916e5b36cb72793cba55b5c83e2a
-  data.tar.gz: da7db430a98af504a913692fa19aa894968b0bc8f9eb8e70fe06fc39cf143ff650ebd896e1a27a3a041146405c2e805028811224fdfe14347d875b27cbd1ef69
+  metadata.gz: 2f3c5511a7201ed2a88404ec8bfe1060cc327ebed3b3df0e3377841211e339575f46b737bc5b035978bade433f71be2357ec8976e0b199431d65f449c7242465
+  data.tar.gz: 68714996046e532d347151d7df34f0726812a09fa8285878c3e2176528d564776c06d2d24a1a1f167469db639f6791a971c05b24be91d72c77fb1d0dd0b00381

data/app/pb_kits/playbook/_playbook.scss

@@ -83,4 +83,3 @@
 @import 'pb_time_stacked/time_stacked';
 @import 'pb_weekday_stacked/weekday_stacked';
 @import './utilities/spacing';
-

data/app/pb_kits/playbook/data/menu.yml

@@ -7,7 +7,6 @@ samples:
 kits:
   - avatar
   - avatar_action_button
-  - background
   - buttons:
     - button
     - button_toolbar
@@ -21,6 +20,7 @@ kits:
     - gauge
     - legend
     - line_graph
+
   - filter
   - fixed_confirmation_toast
   - flex

data/app/pb_kits/playbook/index.js

@@ -5,7 +5,6 @@ import 'lazysizes'
 // React Component JSX Imports from the React Kits
 export Avatar from './pb_avatar/_avatar.jsx'
 export AvatarActionButton from './pb_avatar_action_button/_avatar_action_button.jsx'
-export Background from 'pb_background/_background.jsx'
 export Badge from './pb_badge/_badge.jsx'
 export BarGraph from './pb_bar_graph/_bar_graph.jsx'
 export Body from './pb_body/_body.jsx'

data/lib/playbook/version.rb

@@ -1,4 +1,4 @@
 # frozen_string_literal: true
 module Playbook
-  VERSION = "7.1.1.pre.alpha1"
+  VERSION = "7.1.1"
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: playbook_ui
 version: !ruby/object:Gem::Version
-  version: 7.1.1.pre.alpha1
+  version: 7.1.1
 platform: ruby
 authors:
 - Power UX
@@ -445,14 +445,6 @@ files:
 - app/pb_kits/playbook/pb_avatar_action_button/docs/_avatar_action_button_tooltip.html.erb
 - app/pb_kits/playbook/pb_avatar_action_button/docs/example.yml
 - app/pb_kits/playbook/pb_avatar_action_button/docs/index.js
-- app/pb_kits/playbook/pb_background/_background.html.erb
-- app/pb_kits/playbook/pb_background/_background.jsx
-- app/pb_kits/playbook/pb_background/_background.scss
-- app/pb_kits/playbook/pb_background/background.rb
-- app/pb_kits/playbook/pb_background/docs/_background_default.html.erb
-- app/pb_kits/playbook/pb_background/docs/_background_default.jsx
-- app/pb_kits/playbook/pb_background/docs/example.yml
-- app/pb_kits/playbook/pb_background/docs/index.js
 - app/pb_kits/playbook/pb_badge/_badge.html.erb
 - app/pb_kits/playbook/pb_badge/_badge.jsx
 - app/pb_kits/playbook/pb_badge/_badge.scss
@@ -1863,9 +1855,9 @@ required_ruby_version: !ruby/object:Gem::Requirement
       version: '0'
 required_rubygems_version: !ruby/object:Gem::Requirement
   requirements:
-  - - ">"
+  - - ">="
     - !ruby/object:Gem::Version
-      version: 1.3.1
+      version: '0'
 requirements: []
 rubygems_version: 3.1.4
 signing_key: 

data/app/pb_kits/playbook/pb_background/_background.html.erb

@@ -1,14 +0,0 @@
-<%= content_tag(object.tag,
-    aria: object.aria,
-    data: object.data,
-    id: object.id) do %>
-    <% if object.image_url.present? %>
-      <div class="<%= object.classname %>" style="background-image: url(<%= object.image_url %>); background-size: cover">
-        <%= capture(&object.children) %>
-      </div>
-    <% else %>
-      <div class="<%= object.classname %>">
-        <%= capture(&object.children) %>
-      </div>
-  <% end %>
-<% end %>

data/app/pb_kits/playbook/pb_background/_background.jsx

@@ -1,64 +0,0 @@
-/* @flow */
-
-import React from 'react'
-import classnames from 'classnames'
-import { buildAriaProps, buildCss, buildDataProps } from '../utilities/props'
-import { globalProps } from '../utilities/globalProps.js'
-
-type BackgroundProps = {
-  aria?: object,
-  backgroundColor?: 'gradient' | 'dark' | 'light' | 'white',
-  children?: array<React.ReactNode> | React.ReactNode,
-  className?: string,
-  data?: object,
-  id?: string,
-  imageUrl?: string,
-  padding?: 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl',
-  tag?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'p' | 'span' | 'div',
-}
-
-const Background = (props: BackgroundProps) => {
-  const {
-    aria = {},
-    backgroundColor = 'light',
-    children,
-    className,
-    data = {},
-    id,
-    imageUrl = '',
-    padding = 'md',
-    tag = 'div',
-  } = props
-
-  const ariaProps = buildAriaProps(aria)
-  const dataProps = buildDataProps(data)
-  const classes = classnames(buildCss('pb_background_kit'), className, globalProps(props, { padding }))
-  const Tag = `${tag}`
-  const backgroundStyle = {
-    backgroundImage: `url(${imageUrl})`,
-    backgroundSize: 'cover',
-  }
-
-  return (
-    <Tag
-        {...ariaProps}
-        {...dataProps}
-        id={id}
-    >
-      <If condition={imageUrl}>
-        <div
-            className={classes + 'lazyload blur_up'}
-            style={backgroundStyle}
-        >
-          { children }
-        </div>
-        <Else />
-        <div className={classes + `bg_${backgroundColor}`}>
-          { children }
-        </div>
-      </If>
-    </Tag>
-  )
-}
-
-export default Background

data/app/pb_kits/playbook/pb_background/_background.scss

@@ -1,15 +0,0 @@
-[class^=pb_background_kit] {
-  max-width: 100%;
-  max-height: 100%;
-
-  .blur_up {
-    -webkit-filter: blur(6px);
-    filter: blur(6px);
-    transition: filter 550ms, -webkit-filter 550ms;
-  }
-
-  .blur_up.lazyloaded {
-    -webkit-filter: blur(0);
-    filter: blur(0);
-  }
-}

data/app/pb_kits/playbook/pb_background/background.rb

@@ -1,36 +0,0 @@
-# frozen_string_literal: true
-
-module Playbook
-  module PbBackground
-    class Background
-      include Playbook::Props
-
-      partial "pb_background/background"
-
-      prop :background_color, type: Playbook::Props::Enum,
-                              values: %w[gradient dark light white],
-                              default: "light"
-      prop :image_url
-      prop :padding, type: Playbook::Props::Enum,
-                     values: %w[none xs sm md lg xl],
-                     default: "md"
-      prop :tag, type: Playbook::Props::Enum,
-                 values: %w[h1 h2 h3 h4 h5 h6 p div span],
-                 default: "div"
-
-      def classname
-        generate_classname("pb_background_kit", image_classname, background_color_classname, padding, separator: " ")
-      end
-
-    private
-
-      def image_classname
-        image_url.present? ? "lazyload blur_up" : ""
-      end
-
-      def background_color_classname
-        !image_url.present? ? "bg_#{background_color}" : ""
-      end
-    end
-  end
-end

data/app/pb_kits/playbook/pb_background/docs/_background_default.html.erb

@@ -1,41 +0,0 @@
-<%= pb_rails("background", props: { background_color: "gradient" }) do %>
-  Background Kit Gradient Color
-<% end %>
-
-<%= pb_rails("background", props: { background_color: "dark" }) do %>
-  <%= pb_rails("flex", props: { horizontal: "center"}) do %>
-    <%= pb_rails("flex/flex_item") do %>
-      <%= pb_rails("title", props: { dark: true, size: 2, text: "Background Kit Dark" })%>
-    <% end %>
-  <% end %>
-<% end %>
-
-<%= pb_rails("background", props: { background_color: "light", padding: "xl" }) do %>
-  <%= pb_rails("flex", props: { horizontal: "right"}) do %>
-    <%= pb_rails("flex/flex_item") do %>
-      <%= pb_rails("body", props: { text: "Background Kit Light" })%>
-    <% end %>
-  <% end %>
-<% end %>
-
-<%= pb_rails("background", props: { background_color: "white", padding: "lg" }) do %>
-  <%= pb_rails("flex") do %>
-    <%= pb_rails("flex/flex_item") do %>
-      <%= pb_rails("title", props: { size: 3, text: "Background Kit White" })%>
-    <% end %>
-  <% end %>
-<% end %>
-
-<%= pb_rails("background", props: { image_url: "https://images.unsplash.com/photo-1528459801416-a9e53bbf4e17?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1000&q=80", padding: "lg" }) do %>
-  <%= pb_rails("flex", props: { horizontal: "center", orientation: "column" }) do %>
-    <%= pb_rails("flex/flex_item") do %>
-      <%= pb_rails("title", props: { dark: true, size: 1, text: "Background Kit Image" })%>
-    <% end %>
-    <%= pb_rails("flex/flex_item", props: { padding: "lg" }) do %>
-      <%= pb_rails("card", props: { shadow: "deepest" }) do %>
-        We cannot seek achievement for ourselves and forget about progress and prosperity for our community... Our ambitions must be broad enough to include the aspirations and needs of others, for their sakes and for our own.
-        -Cesar Chavez
-      <% end %>
-    <% end %>
-  <% end %>
-<% end %>

data/app/pb_kits/playbook/pb_background/docs/_background_default.jsx

@@ -1,75 +0,0 @@
-import React from 'react'
-import { Background } from '../../'
-import { Body, Card, Flex, FlexItem, Title } from '../../'
-
-const BackgroundDefault = () => (
-  <div>
-    <Background
-        backgroundColor="gradient"
-    >
-      {'Background Kit Gradient Color'}
-    </Background>
-    <Background
-        backgroundColor="dark"
-    >
-      <Flex
-          horizontal="center"
-          orientation="row"
-      >
-        <FlexItem>
-          <Title
-              dark
-              size={2}
-              text="Background Kit Dark"
-          />
-        </FlexItem>
-      </Flex>
-    </Background>
-    <Background
-        backgroundColor="light"
-        padding="xl"
-    >
-      <Flex
-          horizontal="right"
-          orientation="row"
-      >
-        <FlexItem>
-          <Body
-              text="Background Kit Light"
-          />
-        </FlexItem>
-      </Flex>
-    </Background>
-    <Background
-        backgroundColor="white"
-        padding="lg"
-    >
-      <Title
-          size={3}
-          text="Background Kit White"
-      />
-    </Background>
-    <Background imageUrl="https://images.unsplash.com/photo-1528459801416-a9e53bbf4e17?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1000&q=80">
-      <Flex
-          orientation="column"
-          vertical="center"
-      >
-        <FlexItem>
-          <Title
-              dark
-              padding="lg"
-              size={1}
-              text="Background Kit Image"
-          />
-        </FlexItem>
-        <FlexItem padding="lg">
-          <Card shadow="deepest">
-            {'We cannot seek achievement for ourselves and forget about progress and prosperity for our community... Our ambitions must be broad enough to include the aspirations and needs of others, for their sakes and for our own. - Cesar Chavez'}
-          </Card>
-        </FlexItem>
-      </Flex>
-    </Background>
-  </div>
-)
-
-export default BackgroundDefault

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

@@ -1,8 +0,0 @@
-examples:
-
-  rails:
-  - background_default: Default
-
-  react:
-  - background_default: Default
-

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

@@ -1 +0,0 @@
-export { default as BackgroundDefault } from './_background_default.jsx'