playbook_ui 7.6.2.pre.alpha1 → 7.6.2

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 1d8276e5efd84c6c73212b72adf10a80814e22d0093b730c53abd32253536dce
-  data.tar.gz: '08c66668a20b92f1b125564e583a7378796eb3dbd7b6a4b26c0a8912f58f4424'
+  metadata.gz: b124452c10f7f722f9d15d662527e76ae235356edb7398a90e2bfcff89205fec
+  data.tar.gz: 8e8ed4219d374e3168265e2aefb514556c8ad0c80f8621081b7e9c41f53f63bf
 SHA512:
-  metadata.gz: 9142a13e427313917314ad4429f09e26e8c64149fc7d044e364bfa29a2ded5832b4e779a6089f97249edf844458bc3d5f7c6cadd0b1bd22671c42138b0fbf175
-  data.tar.gz: f75d162c03bdad07f27791ec047bb48dba310adb11ca2eb1b4d98e02d4e3697d9a339ad7344b655ad0c5de9abe0edefd53dd4524bfcc34797246d072af848d85
+  metadata.gz: 1cc1adf796061cd899d8386c3a16b5c1c7fce37ebda42f22e6cde607045d330daedfd6726c38322068de0763f268c44c8f46c30f10316151fdf101547799cf29
+  data.tar.gz: 46ab1fb6a46fb339dd98a7d21736baacbfe9feabfce2168aafba85fd072a46c34a4e38c9518ce325d65c1211b2db5dcb0dc0344781d571ca54021ef7109866c5

data/app/controllers/playbook/application_controller.rb

@@ -8,4 +8,6 @@ module Playbook
     helper Playbook::PbSampleHelper
     append_view_path Playbook::Engine.root + "app/pb_kits"
   end
+
+  
 end

data/app/pb_kits/playbook/_playbook.scss

@@ -29,7 +29,6 @@
 @import 'pb_filter/filter';
 @import 'pb_fixed_confirmation_toast/fixed_confirmation_toast';
 @import 'pb_form/form';
-@import 'pb_form_group/form_group';
 @import 'pb_form_pill/form_pill';
 @import 'pb_flex/flex';
 @import 'pb_gauge/gauge';
@@ -87,3 +86,4 @@
 @import 'pb_time_stacked/time_stacked';
 @import 'pb_weekday_stacked/weekday_stacked';
 @import './utilities/spacing';
+

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

@@ -22,7 +22,6 @@ kits:
     - date_picker
     - file_upload
     - form
-    - form_group
     - form_pill
     - radio
     - select

data/app/pb_kits/playbook/index.js

@@ -33,7 +33,6 @@ export Filter from './pb_filter/_filter.jsx'
 export FixedConfirmationToast from './pb_fixed_confirmation_toast/_fixed_confirmation_toast.jsx'
 export Flex from './pb_flex/_flex.jsx'
 export FlexItem from './pb_flex/_flex_item.jsx'
-export FormGroup from './pb_form_group/_form_group.jsx'
 export FormPill from './pb_form_pill/_form_pill.jsx'
 export Gauge from './pb_gauge/_gauge.jsx'
 export Hashtag from './pb_hashtag/_hashtag.jsx'

data/lib/playbook/version.rb

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

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: playbook_ui
 version: !ruby/object:Gem::Version
-  version: 7.6.2.pre.alpha1
+  version: 7.6.2
 platform: ruby
 authors:
 - Power UX
@@ -9,7 +9,7 @@ authors:
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2020-11-10 00:00:00.000000000 Z
+date: 2020-11-09 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: actionpack
@@ -940,26 +940,6 @@ files:
 - 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/pb_form_validation.js
-- app/pb_kits/playbook/pb_form_group/_form_group.html.erb
-- 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
-- app/pb_kits/playbook/pb_form_group/docs/_form_group_button.jsx
-- app/pb_kits/playbook/pb_form_group/docs/_form_group_date_picker.html.erb
-- app/pb_kits/playbook/pb_form_group/docs/_form_group_date_picker.jsx
-- app/pb_kits/playbook/pb_form_group/docs/_form_group_default.html.erb
-- app/pb_kits/playbook/pb_form_group/docs/_form_group_default.jsx
-- app/pb_kits/playbook/pb_form_group/docs/_form_group_select.html.erb
-- app/pb_kits/playbook/pb_form_group/docs/_form_group_select.jsx
-- app/pb_kits/playbook/pb_form_group/docs/_form_group_selectable_card.html.erb
-- app/pb_kits/playbook/pb_form_group/docs/_form_group_selectable_card.jsx
-- app/pb_kits/playbook/pb_form_group/docs/_form_group_selectable_card_icon.html.erb
-- app/pb_kits/playbook/pb_form_group/docs/_form_group_selectable_card_icon.jsx
-- app/pb_kits/playbook/pb_form_group/docs/_form_group_typeahead.html.erb
-- app/pb_kits/playbook/pb_form_group/docs/_form_group_typeahead.jsx
-- app/pb_kits/playbook/pb_form_group/docs/example.yml
-- app/pb_kits/playbook/pb_form_group/docs/index.js
-- app/pb_kits/playbook/pb_form_group/form_group.rb
 - app/pb_kits/playbook/pb_form_pill/_form_pill.html.erb
 - app/pb_kits/playbook/pb_form_pill/_form_pill.jsx
 - app/pb_kits/playbook/pb_form_pill/_form_pill.scss
@@ -1961,11 +1941,12 @@ 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
+rubyforge_project:
+rubygems_version: 2.7.3
 signing_key:
 specification_version: 4
 summary: Playbook Design System

data/app/pb_kits/playbook/pb_form_group/_form_group.html.erb

@@ -1,7 +0,0 @@
-<%= content_tag(:div,
-    aria: object.aria,
-    class: object.classname,
-    data: object.data,
-    id: object.id) do %>
-    <%= capture(&object.children) %>
-<% end %>

data/app/pb_kits/playbook/pb_form_group/_form_group.jsx

@@ -1,41 +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 FormGroupProps = {
-  aria?: object,
-  children?: Node,
-  className?: string,
-  data?: object,
-  id?: string
-}
-
-const FormGroup = (props: FormGroupProps) => {
-  const {
-    aria = {},
-    className,
-    data = {},
-    id,
-    children,
-  } = props
-
-  const ariaProps = buildAriaProps(aria)
-  const dataProps = buildDataProps(data)
-  const classes = classnames(buildCss('pb_form_group_kit'), globalProps(props), className)
-
-  return (
-    <div
-        {...ariaProps}
-        {...dataProps}
-        className={classes}
-        id={id}
-    >
-      {children}
-    </div>
-  )
-}
-
-export default FormGroup

data/app/pb_kits/playbook/pb_form_group/_form_group.scss

@@ -1,115 +0,0 @@
-[class^=pb_form_group_kit] {
-  display: inline-flex;
-  flex-direction: row;
-  align-items: flex-end;
-  justify-content: flex-start;
-
-  & [class^=pb_text_input_kit] .text_input_wrapper,
-  & [class^=pb_date_picker_kit] .input_wrapper,
-  & [class^=pb_select] {
-    margin-bottom: 0;
-  }
-
-  & > [class^=pb_text_input_kit]:not(:last-child) {
-    .text_input_wrapper input, [class^=pb_text_input_kit] .text_input_wrapper .text_input {
-      border-bottom-right-radius: 0;
-      border-top-right-radius: 0;
-      border-right-width: 0;
-    }
-  }
-
-  & > [class^=pb_text_input_kit]:not(:first-child) {
-    .text_input_wrapper input, [class^=pb_text_input_kit] .text_input_wrapper .text_input {
-      border-bottom-left-radius: 0;
-      border-top-left-radius: 0;
-    }
-  }
-
-  & > [class^=pb_button_kit]:not(:last-child) {
-    border-bottom-right-radius: 0;
-    border-top-right-radius: 0;
-    min-height: 45px;
-  }
-
-  & > [class^=pb_button_kit]:not(:first-child) {
-    border-bottom-left-radius: 0;
-    border-top-left-radius: 0;
-    border-left-width: 0;
-    min-height: 45px;
-  }
-
-  & > [class^=pb_date_picker_kit]:not(:last-child) {
-    .text_input_wrapper input, [class^=pb_text_input_kit] .text_input_wrapper .flatpickr-wrapper {
-      border-bottom-right-radius: 0;
-      border-top-right-radius: 0;
-      border-right-width: 0;
-    }
-  }
-
-  & > [class^=pb_date_picker_kit]:not(:first-child) {
-    .text_input_wrapper input, [class^=pb_text_input_kit] .text_input_wrapper .flatpickr-wrapper {
-      border-bottom-left-radius: 0;
-      border-top-left-radius: 0;
-    }
-  }
-
-  & > [class^=pb_select]:not(:last-child) {
-    margin-bottom: 0px;
-    .pb_select_kit_wrapper select {
-      border-bottom-right-radius: 0;
-      border-top-right-radius: 0;
-      border-right-width: 0;
-    }
-  }
-
-  & > [class^=pb_select]:not(:first-child) {
-    margin-bottom: 0px;
-    .pb_select_kit_wrapper select {
-      border-bottom-left-radius: 0;
-      border-top-left-radius: 0;
-    }
-  }
-
-  & > [class^=pb_selectable_card_kit]:not(:last-child) label {
-    border-bottom-right-radius: 0;
-    border-top-right-radius: 0;
-    border-right-width: 0;
-  }
-
-  & > [class^=pb_selectable_card_kit]:not(:first-child) label {
-    border-bottom-left-radius: 0;
-    border-top-left-radius: 0;
-  }
-
-  & > [class^=pb_selectable_card_icon_kit]:not(:last-child) [class^=pb_selectable_card_kit] label {
-      border-bottom-right-radius: 0;
-      border-top-right-radius: 0;
-  }
-
-  & > [class^=pb_selectable_card_icon_kit]:not(:first-child) [class^=pb_selectable_card_kit] label {
-    border-bottom-left-radius: 0;
-    border-top-left-radius: 0;
-  }
-
-  & > [class^=pb_selectable_card_icon_kit]:not(:last-child) {
-    [class^=pb_selectable_card_kit] input[type="checkbox"]:not(:checked) ~ label, [class^=pb_selectable_card_kit] input[type="radio"]:not(:checked)~ label {
-      border-right-width: 0;
-    }
-  }
-
-  & > [class^=pb_typeahead_kit]:not(:last-child) {
-    [class^=pb_text_input_kit] .text_input_wrapper input, [class^=pb_text_input_kit] .text_input_wrapper .text_input {
-      border-bottom-right-radius: 0;
-      border-top-right-radius: 0;
-      border-right-width: 0;
-      min-height: 26px;
-    }
-  }
-
-  & > [class^=pb_typeahead_kit]:not(:first-child) {
-    [class^=pb_text_input_kit] .text_input_wrapper input, [class^=pb_text_input_kit] .text_input_wrapper .text_input {
-      border-bottom-left-radius: 0;
-      border-top-left-radius: 0;
-    }
-  }
-}

data/app/pb_kits/playbook/pb_form_group/docs/_form_group_button.html.erb

@@ -1,12 +0,0 @@
-<div>
-  <%= pb_rails("form_group") do %>
-    <%= pb_rails("text_input", props: { label: "with label", placeholder: "Search" }) %>
-    <%= pb_rails("button", props: { text: "Submit", variant: "secondary" }) %>
-  <% end %>
-  <br/>
-  <br/>
-  <%= pb_rails("form_group") do %>
-    <%= pb_rails("text_input", props: { placeholder: "Search" }) %>
-    <%= pb_rails("button", props: { text: "Submit", variant: "secondary" }) %>
-  <% end %>
-</div>

data/app/pb_kits/playbook/pb_form_group/docs/_form_group_button.jsx

@@ -1,37 +0,0 @@
-import React from 'react'
-import { Button, FormGroup, TextInput } from '../../'
-
-const FormGroupButton = (props) => (
-  <div>
-    <div>
-      <FormGroup>
-        <TextInput
-            label="With Label"
-            placeholder="Search"
-        />
-        <Button
-            onClick={() => alert('Button Clicked!')}
-            text="Submit"
-            variant="secondary"
-            {...props}
-        />
-      </FormGroup>
-    </div>
-    <br />
-    <div>
-      <FormGroup>
-        <TextInput
-            placeholder="Search"
-        />
-        <Button
-            onClick={() => alert('Button Clicked!')}
-            text="Submit"
-            variant="secondary"
-            {...props}
-        />
-      </FormGroup>
-    </div>
-  </div>
-)
-
-export default FormGroupButton

data/app/pb_kits/playbook/pb_form_group/docs/_form_group_date_picker.html.erb

@@ -1,6 +0,0 @@
-<div>
-  <%= pb_rails("form_group") do %>
-    <%= pb_rails("text_input", props: { label: "Event", placeholder: "Event Name" }) %>
-    <%= pb_rails("date_picker", props: { label: "Event Date", picker_id: "date-picker-default" }) %>
-  <% end %>
-</div>

data/app/pb_kits/playbook/pb_form_group/docs/_form_group_date_picker.jsx

@@ -1,19 +0,0 @@
-import React from 'react'
-import { DatePicker, FormGroup, TextInput } from '../../'
-
-const FormGroupDatePicker = () => (
-  <div>
-    <FormGroup>
-      <TextInput
-          label="Event"
-          placeholder="Event Name"
-      />
-      <DatePicker
-          label="event date"
-          pickerId="date-picker-default"
-      />
-    </FormGroup>
-  </div>
-)
-
-export default FormGroupDatePicker

data/app/pb_kits/playbook/pb_form_group/docs/_form_group_default.html.erb

@@ -1,7 +0,0 @@
-<div>
-  <%= pb_rails("form_group") do %>
-    <%= pb_rails("text_input", props: { label: "First Name", placeholder: "Enter First Name" }) %>
-    <%= pb_rails("text_input", props: { label: "Middle Intial", placeholder: "Enter Middle Initial" }) %>
-    <%= pb_rails("text_input", props: { label: "Last Name", placeholder: "Enter Last Name" }) %>
-  <% end %>
-</div>

data/app/pb_kits/playbook/pb_form_group/docs/_form_group_default.jsx

@@ -1,23 +0,0 @@
-import React from 'react'
-import { FormGroup, TextInput } from '../../'
-
-const FormGroupDefault = () => (
-  <div>
-    <FormGroup>
-      <TextInput
-          label="First Name"
-          placeholder="Enter First Name"
-      />
-      <TextInput
-          label="Middle Intial"
-          placeholder="Enter Middle Initial"
-      />
-      <TextInput
-          label="Last Name"
-          placeholder="Enter Last Name"
-      />
-    </FormGroup>
-  </div>
-)
-
-export default FormGroupDefault

data/app/pb_kits/playbook/pb_form_group/docs/_form_group_select.html.erb

@@ -1,19 +0,0 @@
-<div>
-  <%= pb_rails("form_group") do %>
-    <%= pb_rails("text_input", props: { label: "Artist", placeholder: "Enter Artist Name" }) %>
-    <%= pb_rails("select", props: {
-      blank_selection: "Select Genre",
-      options: [
-        { value: "Country" },
-        { value: "Pop" },
-        { value: "Rock" },
-        { value: "Hip-Hop/Rap" },
-        { value: "Classical" },
-        { value: "Gospel" },
-        { value: "Alternative" },
-        { value: "Indie" },
-        { value: "Other" },
-      ]
-    }) %>
-  <% end %>
-</div>

data/app/pb_kits/playbook/pb_form_group/docs/_form_group_select.jsx

@@ -1,33 +0,0 @@
-import React from 'react'
-import { FormGroup, Select, TextInput } from '../../'
-
-const FormGroupSelect = () => {
-  const options = [
-    { value: 'Country' },
-    { value: 'Pop' },
-    { value: 'Rock' },
-    { value: 'Hip-Hop/Rap' },
-    { value: 'Classical' },
-    { value: 'Gospel' },
-    { value: 'Alternative' },
-    { value: 'Indie' },
-    { value: 'Other' },
-  ]
-
-  return (
-    <div>
-      <FormGroup>
-        <TextInput
-            label="Artist"
-            placeholder="Enter Artist Name"
-        />
-        <Select
-            blankSelection="Select Genre"
-            options={options}
-        />
-      </FormGroup>
-    </div>
-  )
-}
-
-export default FormGroupSelect

data/app/pb_kits/playbook/pb_form_group/docs/_form_group_selectable_card.html.erb

@@ -1,21 +0,0 @@
-<div>
-  <%= pb_rails("form_group") do %>
-    <%= pb_rails("selectable_card", props: {
-        input_id: "cat1",
-        name: "animal",
-        value: "cat",
-        multi: false
-      }) do %>
-        Cat
-      <% end %>
-
-    <%= pb_rails("selectable_card", props: {
-      input_id: "dog1",
-      name: "animal",
-      value: "dog",
-      multi: false
-    }) do %>
-      Dog
-    <% end %>
-  <% end %>
-</div>

data/app/pb_kits/playbook/pb_form_group/docs/_form_group_selectable_card.jsx

@@ -1,40 +0,0 @@
-import React, { useState } from 'react'
-import { FormGroup, SelectableCard } from '../../'
-
-const FormGroupSelectableCard = () => {
-  const [value, setValue] = useState('')
-
-  const handleSelect = (event) => {
-    setValue(event.target.value)
-  }
-
-  return (
-    <div>
-      <FormGroup>
-        <SelectableCard
-            checked={value === 'cat'}
-            inputId="cat1"
-            multi={false}
-            name="animal"
-            onChange={handleSelect}
-            value="cat"
-        >
-          {'Cat'}
-        </SelectableCard>
-
-        <SelectableCard
-            checked={value === 'dog'}
-            inputId="dog1"
-            multi={false}
-            name="animal"
-            onChange={handleSelect}
-            value="dog"
-        >
-          {'Dog'}
-        </SelectableCard>
-      </FormGroup>
-    </div>
-  )
-}
-
-export default FormGroupSelectableCard

data/app/pb_kits/playbook/pb_form_group/docs/_form_group_selectable_card_icon.html.erb

@@ -1,19 +0,0 @@
-<div>
-  <%= pb_rails("form_group") do %>
-    <%= pb_rails("selectable_card_icon", props: {
-      icon: "basketball-ball",
-      title_text: "Basketball",
-      input_id: 7,
-      multi: false,
-      name: "select",
-    }) %>
-
-    <%= pb_rails("selectable_card_icon", props: {
-      icon: "football-ball",
-      title_text: "Football",
-      input_id: 8,
-      multi: false,
-      name: "select",
-    }) %>
-  <% end %>
-</div>

data/app/pb_kits/playbook/pb_form_group/docs/_form_group_selectable_card_icon.jsx

@@ -1,33 +0,0 @@
-import React, { useState } from 'react'
-import { FormGroup, SelectableCardIcon } from '../../'
-
-const FormGroupSelectableCardIcon = () => {
-  const [selectedFormat, toggleFormat] = useState(null)
-
-  return (
-    <div>
-      <FormGroup>
-        <SelectableCardIcon
-            checked={selectedFormat === 'basketball'}
-            icon="basketball-ball"
-            inputId={7}
-            name="select"
-            onChange={() => toggleFormat('basketball')}
-            titleText="Basketball"
-            value="basketball"
-        />
-        <SelectableCardIcon
-            checked={selectedFormat === 'football'}
-            icon="football-ball"
-            inputId={8}
-            name="select"
-            onChange={() => toggleFormat('football')}
-            titleText="Football"
-            value="football"
-        />
-      </FormGroup>
-    </div>
-  )
-}
-
-export default FormGroupSelectableCardIcon

data/app/pb_kits/playbook/pb_form_group/docs/_form_group_typeahead.html.erb

@@ -1,14 +0,0 @@
-<div>
-  <%= pb_rails("form_group") do %>
-    <%= pb_rails("typeahead", props: {
-      label: "Products",
-      options: [
-        { label: 'Windows', value: 'windows' },
-        { label: 'Roof', value: 'roof' },
-        { label: 'Siding', value: 'siding' },
-        { label: 'Doors', value: 'doors' },
-      ]
-    }) %>
-    <%= pb_rails("button", props: { text: "Add", variant: "secondary" }) %>
-  <% end %>
-</div>

data/app/pb_kits/playbook/pb_form_group/docs/_form_group_typeahead.jsx

@@ -1,30 +0,0 @@
-import React from 'react'
-import { Button, FormGroup, Typeahead } from '../../'
-
-const FormGroupTypeahead = (props) => {
-  const options = [
-    { label: 'Windows', value: 'windows' },
-    { label: 'Roof', value: 'roof' },
-    { label: 'Siding', value: 'siding' },
-    { label: 'Doors', value: 'doors' },
-  ]
-
-  return (
-    <div>
-      <FormGroup>
-        <Typeahead
-            label="Products"
-            options={options}
-        />
-        <Button
-            onClick={() => alert('Button Clicked!')}
-            text="Add"
-            variant="secondary"
-            {...props}
-        />
-      </FormGroup>
-    </div>
-  )
-}
-
-export default FormGroupTypeahead

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

@@ -1,20 +0,0 @@
-examples:
-
-  rails:
-  - form_group_default: Default
-  - form_group_button: Button
-  - form_group_date_picker: Date Picker
-  - form_group_typeahead: Typeahead
-  - form_group_select: Select
-  - form_group_selectable_card: Selectable Card
-  - form_group_selectable_card_icon: Selectable Card Icon
-
-
-  react:
-  - form_group_default: Default
-  - form_group_button: Button
-  - form_group_date_picker: Date Picker
-  - form_group_typeahead: Typeahead
-  - form_group_select: Select
-  - form_group_selectable_card: Selectable Card
-  - form_group_selectable_card_icon: Selectable Card Icon

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

@@ -1,7 +0,0 @@
-export { default as FormGroupDefault } from './_form_group_default.jsx'
-export { default as FormGroupButton } from './_form_group_button.jsx'
-export { default as FormGroupDatePicker } from './_form_group_date_picker.jsx'
-export { default as FormGroupTypeahead } from './_form_group_typeahead.jsx'
-export { default as FormGroupSelect } from './_form_group_select.jsx'
-export { default as FormGroupSelectableCard } from './_form_group_selectable_card.jsx'
-export { default as FormGroupSelectableCardIcon } from './_form_group_selectable_card_icon.jsx'

data/app/pb_kits/playbook/pb_form_group/form_group.rb

@@ -1,15 +0,0 @@
-# frozen_string_literal: true
-
-module Playbook
-  module PbFormGroup
-    class FormGroup
-      include Playbook::Props
-
-      partial "pb_form_group/form_group"
-
-      def classname
-        generate_classname("pb_form_group_kit")
-      end
-    end
-  end
-end