playbook_ui 11.5.0.pre.alpha.fontawesome → 11.5.0.pre.alpha.pre.rubocop

data/lib/playbook/version.rb

@@ -2,5 +2,5 @@
 
 module Playbook
   PREVIOUS_VERSION = "11.5.0"
-  VERSION = "11.5.0.pre.alpha.fontawesome"
+  VERSION = "11.5.0.pre.alpha-rubocop"
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: playbook_ui
 version: !ruby/object:Gem::Version
-  version: 11.5.0.pre.alpha.fontawesome
+  version: 11.5.0.pre.alpha.pre.rubocop
 platform: ruby
 authors:
 - Power UX
@@ -9,7 +9,7 @@ authors:
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2022-09-27 00:00:00.000000000 Z
+date: 2022-09-15 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: actionpack
@@ -348,7 +348,6 @@ files:
 - app/pb_kits/playbook/pb_badge/_badge.tsx
 - app/pb_kits/playbook/pb_badge/badge.html.erb
 - app/pb_kits/playbook/pb_badge/badge.rb
-- app/pb_kits/playbook/pb_badge/badge.test.js
 - app/pb_kits/playbook/pb_badge/docs/_badge_colors.html.erb
 - app/pb_kits/playbook/pb_badge/docs/_badge_colors.jsx
 - app/pb_kits/playbook/pb_badge/docs/_badge_default.html.erb
@@ -418,7 +417,6 @@ files:
 - app/pb_kits/playbook/pb_button/docs/_button_accessibility.jsx
 - app/pb_kits/playbook/pb_button/docs/_button_block_content.html.erb
 - app/pb_kits/playbook/pb_button/docs/_button_block_content.jsx
-- app/pb_kits/playbook/pb_button/docs/_button_block_content.md
 - app/pb_kits/playbook/pb_button/docs/_button_default.html.erb
 - app/pb_kits/playbook/pb_button/docs/_button_default.jsx
 - app/pb_kits/playbook/pb_button/docs/_button_default.md
@@ -427,9 +425,6 @@ files:
 - app/pb_kits/playbook/pb_button/docs/_button_full_width.html.erb
 - app/pb_kits/playbook/pb_button/docs/_button_full_width.jsx
 - app/pb_kits/playbook/pb_button/docs/_button_full_width.md
-- app/pb_kits/playbook/pb_button/docs/_button_icon_options.html.erb
-- app/pb_kits/playbook/pb_button/docs/_button_icon_options.jsx
-- app/pb_kits/playbook/pb_button/docs/_button_icon_options.md
 - app/pb_kits/playbook/pb_button/docs/_button_link.html.erb
 - app/pb_kits/playbook/pb_button/docs/_button_link.jsx
 - app/pb_kits/playbook/pb_button/docs/_button_loading.html.erb
@@ -876,9 +871,6 @@ files:
 - app/pb_kits/playbook/pb_filter/docs/_filter_no_sort.md
 - app/pb_kits/playbook/pb_filter/docs/_filter_only.html.erb
 - app/pb_kits/playbook/pb_filter/docs/_filter_only.jsx
-- app/pb_kits/playbook/pb_filter/docs/_filter_placement.html.erb
-- app/pb_kits/playbook/pb_filter/docs/_filter_placement.jsx
-- app/pb_kits/playbook/pb_filter/docs/_filter_placement.md
 - app/pb_kits/playbook/pb_filter/docs/_filter_single.html.erb
 - app/pb_kits/playbook/pb_filter/docs/_filter_single.jsx
 - app/pb_kits/playbook/pb_filter/docs/_sort_only.html.erb
@@ -887,7 +879,6 @@ files:
 - 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/filter.test.js
 - app/pb_kits/playbook/pb_fixed_confirmation_toast/_fixed_confirmation_toast.scss
 - app/pb_kits/playbook/pb_fixed_confirmation_toast/_fixed_confirmation_toast.tsx
 - app/pb_kits/playbook/pb_fixed_confirmation_toast/docs/_description.md
@@ -1048,8 +1039,8 @@ files:
 - app/pb_kits/playbook/pb_highlight/docs/index.js
 - app/pb_kits/playbook/pb_highlight/highlight.html.erb
 - app/pb_kits/playbook/pb_highlight/highlight.rb
+- app/pb_kits/playbook/pb_home_address_street/_home_address_street.jsx
 - app/pb_kits/playbook/pb_home_address_street/_home_address_street.scss
-- app/pb_kits/playbook/pb_home_address_street/_home_address_street.tsx
 - app/pb_kits/playbook/pb_home_address_street/city_emphasis.html.erb
 - app/pb_kits/playbook/pb_home_address_street/city_emphasis.rb
 - app/pb_kits/playbook/pb_home_address_street/docs/_description.md
@@ -1069,7 +1060,6 @@ files:
 - app/pb_kits/playbook/pb_home_address_street/docs/index.js
 - app/pb_kits/playbook/pb_home_address_street/home_address_street.html.erb
 - app/pb_kits/playbook/pb_home_address_street/home_address_street.rb
-- app/pb_kits/playbook/pb_home_address_street/home_adress_street.test.js
 - app/pb_kits/playbook/pb_home_address_street/street_emphasis.html.erb
 - app/pb_kits/playbook/pb_home_address_street/street_emphasis.rb
 - app/pb_kits/playbook/pb_icon/_icon.scss
@@ -1114,8 +1104,8 @@ files:
 - app/pb_kits/playbook/pb_icon_circle/docs/index.js
 - app/pb_kits/playbook/pb_icon_circle/icon_circle.html.erb
 - app/pb_kits/playbook/pb_icon_circle/icon_circle.rb
+- app/pb_kits/playbook/pb_icon_stat_value/_icon_stat_value.jsx
 - app/pb_kits/playbook/pb_icon_stat_value/_icon_stat_value.scss
-- app/pb_kits/playbook/pb_icon_stat_value/_icon_stat_value.tsx
 - app/pb_kits/playbook/pb_icon_stat_value/docs/_icon_stat_value_color.html.erb
 - app/pb_kits/playbook/pb_icon_stat_value/docs/_icon_stat_value_color.jsx
 - app/pb_kits/playbook/pb_icon_stat_value/docs/_icon_stat_value_default.html.erb
@@ -1128,9 +1118,8 @@ files:
 - app/pb_kits/playbook/pb_icon_stat_value/docs/index.js
 - app/pb_kits/playbook/pb_icon_stat_value/icon_stat_value.html.erb
 - app/pb_kits/playbook/pb_icon_stat_value/icon_stat_value.rb
-- app/pb_kits/playbook/pb_icon_stat_value/icon_stat_value.test.js
+- app/pb_kits/playbook/pb_icon_value/_icon_value.jsx
 - app/pb_kits/playbook/pb_icon_value/_icon_value.scss
-- app/pb_kits/playbook/pb_icon_value/_icon_value.tsx
 - app/pb_kits/playbook/pb_icon_value/docs/_description.md
 - app/pb_kits/playbook/pb_icon_value/docs/_icon_value_align.html.erb
 - app/pb_kits/playbook/pb_icon_value/docs/_icon_value_align.jsx
@@ -1140,7 +1129,6 @@ files:
 - app/pb_kits/playbook/pb_icon_value/docs/index.js
 - app/pb_kits/playbook/pb_icon_value/icon_value.html.erb
 - app/pb_kits/playbook/pb_icon_value/icon_value.rb
-- app/pb_kits/playbook/pb_icon_value/icon_value.test.js
 - app/pb_kits/playbook/pb_image/_image.scss
 - app/pb_kits/playbook/pb_image/_image.tsx
 - app/pb_kits/playbook/pb_image/docs/_custom_error_image.html.erb
@@ -1171,8 +1159,8 @@ files:
 - app/pb_kits/playbook/pb_label_pill/docs/index.js
 - app/pb_kits/playbook/pb_label_pill/label_pill.html.erb
 - app/pb_kits/playbook/pb_label_pill/label_pill.rb
+- app/pb_kits/playbook/pb_label_value/_label_value.jsx
 - app/pb_kits/playbook/pb_label_value/_label_value.scss
-- app/pb_kits/playbook/pb_label_value/_label_value.tsx
 - app/pb_kits/playbook/pb_label_value/docs/_description.md
 - app/pb_kits/playbook/pb_label_value/docs/_footer.md
 - app/pb_kits/playbook/pb_label_value/docs/_label_value_default.html.erb
@@ -1187,7 +1175,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_label_value/label_value.test.js
 - app/pb_kits/playbook/pb_layout/_layout.scss
 - app/pb_kits/playbook/pb_layout/_layout.tsx
 - app/pb_kits/playbook/pb_layout/_layout_mixin.scss
@@ -2301,7 +2288,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
     - !ruby/object:Gem::Version
       version: 1.3.1
 requirements: []
-rubygems_version: 3.3.21
+rubygems_version: 3.3.7
 signing_key:
 specification_version: 4
 summary: Playbook Design System

data/app/pb_kits/playbook/pb_badge/badge.test.js

@@ -1,80 +0,0 @@
-import React from 'react'
-import { cleanup, render, screen } from '../utilities/test-utils'
-
-import Badge from './_badge'
-
-const testId = "badge"
-
-test('default class name', () => {
-  render(
-    <Badge
-        data={{ testid: testId }}
-        text="+1"
-    />
-  )
-
-  const kit = screen.getByTestId(testId)
-
-  expect(kit).toHaveClass('pb_badge_kit_neutral')
-})
-
-test('primary class name', () => {
-  render(
-    <Badge
-        data={{ testid: testId }}
-        text="+1"
-        variant="primary"
-    />
-  )
-
-  const kit = screen.getByTestId(testId)
-
-  expect(kit).toHaveClass('pb_badge_kit_primary')
-})
-
-test('displays text content', () => {
-  render(
-    <Badge
-        text="+1"
-        variant="primary"
-    />
-  )
-
-  const text = screen.getByText("+1")
-  expect(text).toBeInTheDocument()
-})
-
-test('displays rounded corners', () => {
-  render(
-    <Badge
-        data={{ testid: testId }}
-        rounded
-        text="+1"
-        variant="primary"
-    />
-  )
-
-  const kit = screen.getByTestId(testId)
-  expect(kit).toHaveClass('pb_badge_kit_primary_rounded')
-})
-
-test('displays color variants', () => {
-  [
-    "success",
-    "warning",
-    "error",
-    "info"
-  ].forEach((colorVariant) => {
-    render(
-      <Badge
-          data={{ testid: testId }}
-          text={colorVariant}
-          variant={colorVariant}
-      />
-    )
-    const kit = screen.getByTestId(testId)
-    expect(kit).toHaveClass(`pb_badge_kit_${colorVariant}`)
-
-    cleanup()
-  })
-})

data/app/pb_kits/playbook/pb_button/docs/_button_block_content.md

@@ -1 +0,0 @@
-Used when the user wants to display custom content within a button instead of passing in text or props to the kit itself. In this example the button is using the Pill kit and a `<span>` element inside the button.

data/app/pb_kits/playbook/pb_button/docs/_button_icon_options.html.erb

@@ -1,2 +0,0 @@
-<%= pb_rails("button", props: { icon: "plus", text: "Icon on Left" }) %>
-<%= pb_rails("button", props: { icon: "chevron-right", icon_right: true, text: "Icon on Right" }) %>

data/app/pb_kits/playbook/pb_button/docs/_button_icon_options.jsx

@@ -1,23 +0,0 @@
-import React from 'react'
-import { Button } from '../../'
-
-const ButtonIconOptions = (props) => (
-    <div>
-      <Button
-          fixedWidth
-          icon='plus'
-          text="Icon on Left"
-          {...props}
-      />
-      {' '}
-      <Button
-          fixedWidth
-          icon='chevron-right'
-          iconRight
-          text="Icon on Right"
-          {...props}
-      />
-    </div>
-  )
-  
-  export default ButtonIconOptions

data/app/pb_kits/playbook/pb_button/docs/_button_icon_options.md

@@ -1 +0,0 @@
-Icons can also be added to a button if needed. By default, the icon will be displayed on the left of the text. To display the icon on the right, use the optional prop of `iconRight` in react or `icon_right` in rails.

data/app/pb_kits/playbook/pb_filter/docs/_filter_placement.html.erb

@@ -1,34 +0,0 @@
-<%=
-  pb_rails("filter", props: {
-    id: "pla",
-    filters: [
-      { name: "name", value: "John Wick" }
-    ],
-    placement: "right",
-    template:"filter_only",
-  }) do
-%>
-  <%
-    example_collection = [
-      OpenStruct.new(name: "Alabama", value: 1),
-      OpenStruct.new(name: "Alaska", value: 2),
-      OpenStruct.new(name: "Arizona", value: 3),
-      OpenStruct.new(name: "Arkansas", value: 4),
-      OpenStruct.new(name: "California", value: 5),
-      OpenStruct.new(name: "Colorado", value: 6),
-      OpenStruct.new(name: "Connecticut", value: 7),
-      OpenStruct.new(name: "Delaware", value: 8),
-      OpenStruct.new(name: "Florida", value: 9),
-      OpenStruct.new(name: "Georgia", value: 10),
-    ]
-  %>
-  <%= pb_rails("form", props: { form_system_options: { scope: :example, method: :get } }) do |form| %>
-    <%= form.text_field :example_text_field, props: { label: true } %>
-    <%= form.collection_select :example_collection_select, example_collection, :value, :name, props: { label: true } %>
-
-    <%= form.actions do |action| %>
-      <%= action.submit props: { text: "Apply", data: { disable_with: "<i class='far fa-spinner fa-spin mr-3'></i>Searching...".html_safe },}%>
-      <%= action.button props: { type: "reset", text: "Clear", variant: "secondary" } %>
-    <% end %>
-  <% end %>
-<% end %>

data/app/pb_kits/playbook/pb_filter/docs/_filter_placement.jsx

@@ -1,66 +0,0 @@
-import React from 'react'
-import { Button, Filter, Flex, Select, TextInput } from '../..'
-
-const SortingChangeCallback = (sortOptions) => {
-  alert(JSON.stringify(sortOptions[0]))
-}
-
-const FilterPlacement = (props) => {
-  const options = [
-    { value: 'USA' },
-    { value: 'Canada' },
-    { value: 'Brazil' },
-    { value: 'Philippines' },
-    { value: 'A Galaxy Far Far Away Like Really Far Away' },
-  ]
-  return (
-
-    <>
-      <Filter
-          double
-          onSortChange={SortingChangeCallback}
-          placement={"right"}
-          results={1}
-          sortOptions={{
-            popularity: 'Popularity',
-            // eslint-disable-next-line
-            manager_title: 'Manager\'s Title',
-            // eslint-disable-next-line
-            manager_name: 'Manager\'s Name',
-          }}
-          sortValue={[{ name: 'popularity', dir: 'desc' }]}
-          {...props}
-      >
-        <TextInput
-            label="Example Text Field"
-            placeholder="Enter Text"
-            {...props}
-        />
-
-        <Select
-            blankSelection="Select One..."
-            label="Example Collection Select"
-            name="Collection Select"
-            options={options}
-            {...props}
-        />
-        <Flex
-            spacing="between"
-            {...props}
-        >
-          <Button
-              text="Apply"
-              {...props}
-          />
-          <Button
-              text="Clear"
-              variant="secondary"
-              {...props}
-          />
-        </Flex>
-      </Filter>
-    </>
-  )
-}
-
-export default FilterPlacement

data/app/pb_kits/playbook/pb_filter/docs/_filter_placement.md

@@ -1,4 +0,0 @@
-Click the filter buttom above to toggle the popover.
-
-To change the filter's popover position, use the `placement` prop with one of the positions: 
-`"top" | "right" | "bottom" | "left" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end"`

data/app/pb_kits/playbook/pb_filter/filter.test.js

@@ -1,76 +0,0 @@
-import React from "react";
-import {
-  render,
-  screen,
-  fireEvent,
-} from "../utilities/test-utils";
-import { Button, Filter, Flex, Select, TextInput } from "..";
-
-function FilterTest(props) {
-  const SortingChangeCallback = (sortOptions) => {
-    alert(JSON.stringify(sortOptions[0]));
-  };
-
-  const options = [
-    { value: "USA" },
-    { value: "Canada" },
-    { value: "Brazil" },
-    { value: "Philippines" },
-    { value: "A Galaxy Far Far Away Like Really Far Away" },
-  ];
-  return (
-    <Filter
-        onSortChange={SortingChangeCallback}
-        results={1}
-        sortOptions={{
-        popularity: "Popularity",
-        // eslint-disable-next-line
-        manager_title: "Manager's Title",
-        // eslint-disable-next-line
-        manager_name: "Manager's Name",
-      }}
-        sortValue={[{ name: "popularity", dir: "desc" }]}
-        {...props}
-    >
-      <TextInput
-          label="Example Text Field"
-          placeholder="Enter Text"
-          {...props}
-      />
-
-      <Select
-          blankSelection="Select One..."
-          label="Example Collection Select"
-          name="Collection Select"
-          options={options}
-          {...props}
-      />
-      <Flex spacing="between"
-          {...props}>
-        <Button text="Apply"
-            {...props} />
-        <Button text="Clear"
-            variant="secondary"
-            {...props} />
-      </Flex>
-    </Filter>
-  );
-}
-
-test("triggers popover on filter button click", () => {
-  render(<FilterTest data={{ testid: "render-test" }}/>);
-
-  const btn = screen.getAllByRole("button")[0];
-
-  // checks if the sort menu rendered
-  expect(screen.getByLabelText("sort-amount-down icon")).toBeInTheDocument()
-  expect(screen.getByText('Popularity')).toBeInTheDocument() // check if filter/sort is rendered 
-
-  // hits the filter button and triggers popover
-  fireEvent.click(btn);
-
-  // check if popover displays correctly by checking its tet
-  expect(screen.getByText("Example Text Field")).toBeInTheDocument() 
-
-
-});

data/app/pb_kits/playbook/pb_home_address_street/_home_address_street.tsx

@@ -1,129 +0,0 @@
-import React from 'react'
-import classnames from 'classnames'
-
-import { joinPresent, titleize } from '../utilities/text'
-import { globalProps } from '../utilities/globalProps'
-
-import Body from '../pb_body/_body'
-import Hashtag from '../pb_hashtag/_hashtag'
-import Title from '../pb_title/_title'
-import { buildAriaProps, buildDataProps } from '../utilities/props'
-
-type HomeAddressStreetProps = {
-  aria?: { [key: string]: string },
-  address: string,
-  addressCont: string,
-  city: string,
-  className?: string,
-  data?: { [key: string]: string },
-  dark?: boolean,
-  emphasis: "street" | "city",
-  homeId: string,
-  houseStyle: string,
-  homeUrl: string,
-  newWindow: boolean,
-  state: string,
-  zipcode: string,
-  territory: string,
-}
-
-const HomeAddressStreet = (props: HomeAddressStreetProps) => {
-  const {
-    address,
-    addressCont,
-    aria = {},
-    city,
-    className,
-    data = {},
-    dark = false,
-    emphasis = 'street',
-    homeId,
-    homeUrl,
-    newWindow,
-    houseStyle,
-    state,
-    zipcode,
-    territory,
-  } = props
-
-  const classes = (className: string, dark: boolean) =>
-    classnames(
-      {
-        'pb_home_address_street': !dark,
-        'pb_home_address_street_dark': dark,
-      },
-      globalProps(props),
-      className
-    )
-
-  const dataProps: { [key: string]: any } = buildDataProps(data)
-  const ariaProps: { [key: string]: any } = buildAriaProps(aria)
-  
-  return (
-    <div className={classes(className, dark)} {...ariaProps} {...dataProps}>
-      {emphasis == 'street' && 
-        <div>
-          <Title
-              className="pb_home_address_street_address"
-              dark={dark}
-              size={4}
-          >
-            {joinPresent([titleize(address), houseStyle], ' · ')}
-          </Title>
-          <Title
-              className="pb_home_address_street_address"
-              dark={dark}
-              size={4}
-          >
-            {titleize(addressCont)}
-          </Title>
-          <Body color="light">
-            {`${titleize(city)}, ${state} ${zipcode}`}
-          </Body>
-        </div>
-      }
-      {emphasis == 'city' &&
-        <div>
-          <Body color="light">
-            {joinPresent([titleize(address), houseStyle], ' · ')}
-          </Body>
-          <Body color="light">{titleize(addressCont)}</Body>
-          <div>
-            <Title
-                className="pb_home_address_street_address"
-                dark={dark}
-                size={4}
-                tag="span"
-            >
-              {`${titleize(city)}, ${state}`}
-            </Title>
-            <Body
-                color="light"
-                tag="span"
-            >
-              {` ${zipcode}`}
-            </Body>
-          </div>
-        </div>
-      }
-      {homeId &&
-        <Hashtag
-            classname="home-hashtag"
-            dark={dark}
-            newWindow={newWindow}
-            text={homeId}
-            type="home"
-            url={homeUrl || '#'}
-        />
-      }
-      <Body
-          color="light"
-          tag="span"
-      >
-        <small>{territory}</small>
-      </Body>
-    </div>
-  )
-}
-
-export default HomeAddressStreet

data/app/pb_kits/playbook/pb_home_address_street/home_adress_street.test.js

@@ -1,60 +0,0 @@
-import React from 'react'
-import { render, screen, cleanup } from "../utilities/test-utils";
-
-import { HomeAddressStreet } from "..";
-
-
-const testId = "primary-test"
-const address = "70 Prospect Ave"
-const city = "West Chester"
-const homeId = "8250263"
-
-function HomeAdressStreetTest(props) {
-    return (
-        <HomeAddressStreet
-            address={address}
-            addressCont="Apt M18"
-            city={city}
-            data={{ testid: testId }}
-            homeId={homeId}
-            homeUrl="https://powerhrg.com/"
-            houseStyle="Colonial"
-            state="PA"
-            territory="PHL"
-            zipcode="19382"
-            {...props}
-    />
-    );
-  }
-  
-  test("renders the component", () => {
-    render(<HomeAdressStreetTest />);
-    const kit = screen.getByTestId("primary-test");
-    expect(kit).toBeInTheDocument();
-    expect(kit).toHaveClass("pb_home_address_street");
-
-    cleanup()
-  });
-
-  test("emphasize street by not setting a prop", () => {
-    const { container } = render(<HomeAdressStreetTest />);
-    expect(container.getElementsByClassName("pb_title_kit_size_4 pb_home_address_street_address")[0]).toHaveTextContent(address);
-
-    cleanup()
-  });
-
-  test("emphasize city", () => {
-    const { container } = render(<HomeAdressStreetTest emphasis="city" />);
-    expect(container.getElementsByClassName("pb_title_kit_size_4 pb_home_address_street_address")[0]).toHaveTextContent(city);
-
-    cleanup()
-  });
-
-  test("renders the hashtag kit", () => {
-    const { container } = render(<HomeAdressStreetTest />);
-    expect(container.getElementsByClassName("pb_hashtag_kit")[0]).toBeInTheDocument;
-    expect(container.getElementsByClassName("pb_hashtag_kit")[0].firstChild).toHaveAttribute("href");
-    expect(container.getElementsByClassName("pb_hashtag_kit")[0].firstChild).toHaveTextContent(homeId);
-
-    cleanup()
-  });