playbook_ui 9.19.0.pre.alpha.pre.fonts2 → 9.19.0.pre.alphafonts

data/app/pb_kits/playbook/pb_list/docs/_list_layout_left.jsx

@@ -1,9 +1,6 @@
 import React from 'react'
 
-import List from '../_list'
-import ListItem from '../_list_item'
-import Currency from '../../pb_currency/_currency'
-import Title from '../../pb_title/_title'
+import { Currency, List, ListItem, Title } from '../../'
 
 const ListLayoutLeft = (props) => {
   return (

data/app/pb_kits/playbook/pb_list/docs/_list_layout_right.jsx

@@ -1,10 +1,6 @@
 import React from 'react'
 
-import List from '../_list'
-import ListItem from '../_list_item'
-
-import Currency from '../../pb_currency/_currency'
-import Title from '../../pb_title/_title'
+import { Currency, List, ListItem, Title } from '../../'
 
 const ListLayoutRight = (props) => {
   return (

data/app/pb_kits/playbook/pb_list/docs/_list_lg.jsx

@@ -1,7 +1,6 @@
 import React from 'react'
 
-import List from '../_list'
-import ListItem from '../_list_item'
+import { List, ListItem } from '../../'
 
 const ListLg = (props) => {
   return (

data/app/pb_kits/playbook/pb_list/docs/_list_ordered.jsx

@@ -1,7 +1,6 @@
 import React from 'react'
 
-import List from '../_list'
-import ListItem from '../_list_item'
+import { List, ListItem } from '../../'
 
 const ListOrdered = (props) => {
   return (

data/app/pb_kits/playbook/pb_list/docs/_list_xpadding.jsx

@@ -1,7 +1,6 @@
 import React from 'react'
 
-import List from '../_list'
-import ListItem from '../_list_item'
+import { List, ListItem } from '../../'
 
 const ListXpadding = (props) => {
   return (

data/app/pb_kits/playbook/pb_loading_inline/_loading_inline.jsx

@@ -2,11 +2,10 @@
 
 import React from 'react'
 import classnames from 'classnames'
+import { Body, Icon } from '../'
 
-import { globalProps } from '../utilities/globalProps'
+import { globalProps } from '../utilities/globalProps.js'
 
-import Body from '../pb_body/_body'
-import Icon from '../pb_icon/_icon'
 type LoadingInlineProps = {
   align?: "left" | "center" | "right",
   className?: string,

data/app/pb_kits/playbook/pb_loading_inline/docs/_loading_inline_light.jsx

@@ -1,6 +1,5 @@
 import React from 'react'
-
-import LoadingInline from '../_loading_inline'
+import { LoadingInline } from '../../'
 
 const LoadingInlineLight = (props) => {
   return (

data/app/pb_kits/playbook/pb_logistic/_logistic.jsx

@@ -2,15 +2,10 @@
 
 import React from 'react'
 import classnames from 'classnames'
-
 import DateTime from '../pb_kit/dateTime.js'
 import { buildAriaProps, buildCss, buildDataProps } from '../utilities/props'
-import { globalProps } from '../utilities/globalProps'
-
-import Body from '../pb_body/_body'
-import Caption from '../pb_caption/_caption'
-import Icon from '../pb_icon/_icon'
-import Title from '../pb_title/_title'
+import { Body, Caption, Icon, Title } from '../'
+import { globalProps } from '../utilities/globalProps.js'
 
 const dateString = (value: DateTime) => {
   const month = value.toMonthNum()

data/app/pb_kits/playbook/pb_message/_message.jsx

@@ -1,16 +1,10 @@
 /* @flow */
 
 import React from 'react'
+import { Avatar, Body, Flex, Timestamp, Title } from '../'
 import classnames from 'classnames'
-
 import { buildAriaProps, buildCss, buildDataProps } from '../utilities/props'
-import { globalProps } from '../utilities/globalProps'
-
-import Avatar from '../pb_avatar/_avatar'
-import Body from '../pb_body/_body'
-import Flex from '../pb_flex/_flex'
-import Timestamp from '../pb_timestamp/_timestamp'
-import Title from '../pb_title/_title'
+import { globalProps } from '../utilities/globalProps.js'
 
 type MessageProps = {
   aria: object,

data/app/pb_kits/playbook/pb_message/docs/_message_default.jsx

@@ -1,6 +1,5 @@
 import React from 'react'
-
-import Message from '../_message'
+import { Message } from '../../'
 
 const MessageDefault = (props) => {
   return (

data/app/pb_kits/playbook/pb_multiple_users/_multiple_users.jsx

@@ -2,12 +2,10 @@
 
 import React from 'react'
 import classnames from 'classnames'
-
 import { buildAriaProps, buildCss, buildDataProps } from '../utilities/props'
+import { Avatar } from '../'
 import { globalProps } from '../utilities/globalProps.js'
 
-import Avatar from '../pb_avatar/_avatar'
-
 type MultipleUsersProps = {
   aria?: object,
   className?: string,

data/app/pb_kits/playbook/pb_multiple_users_stacked/_multiple_users_stacked.jsx

@@ -3,13 +3,11 @@
 
 import React from 'react'
 import classnames from 'classnames'
+import { globalProps } from '../utilities/globalProps.js'
+import { Avatar, Badge } from '../'
 
-import { globalProps } from '../utilities/globalProps'
 import { buildAriaProps, buildCss, buildDataProps } from '../utilities/props'
 
-import Avatar from '../pb_avatar/_avatar'
-import Badge from '../pb_badge/_badge'
-
 type MultipleUsersStackedProps = {
   aria?: object,
   className?: string,

data/app/pb_kits/playbook/pb_multiple_users_stacked/docs/_multiple_users_stacked_default.jsx

@@ -1,6 +1,5 @@
 import React from 'react'
-
-import MultipleUsersStacked from '../_multiple_users_stacked'
+import { MultipleUsersStacked } from '../../'
 
 const MultipleUsersStackedDefault = (props) => {
   return (

data/app/pb_kits/playbook/pb_nav/_item.jsx

@@ -2,12 +2,9 @@
 
 import React from 'react'
 import classnames from 'classnames'
-
+import { Icon, Image } from '../'
 import { buildAriaProps, buildCss, buildDataProps } from '../utilities/props'
-import { globalProps } from '../utilities/globalProps'
-
-import Icon from '../pb_icon/_icon'
-import Image from '../pb_image/_image'
+import { globalProps } from '../utilities/globalProps.js'
 
 type NavItemProps = {
   active?: boolean,

data/app/pb_kits/playbook/pb_nav/_nav.jsx

@@ -2,11 +2,9 @@
 
 import React from 'react'
 import classnames from 'classnames'
-
 import { buildAriaProps, buildCss, buildDataProps } from '../utilities/props'
-import { globalProps } from '../utilities/globalProps'
-
-import Caption from '../pb_caption/_caption'
+import { Caption } from '../'
+import { globalProps } from '../utilities/globalProps.js'
 
 type NavProps = {
   aria?: object,

data/app/pb_kits/playbook/pb_nav/_vertical_nav.scss

@@ -3,8 +3,8 @@
 @import "../tokens/border_radius";
 @import "../tokens/animation-curves";
 @import "../tokens/typography";
-@import "../tokens/titles";
 @import "../pb_body/body_mixins";
+@import "../pb_title/title_mixin";
 @import "./subtle_mixin";
 
 $selector: ".pb_nav_list";
@@ -134,7 +134,7 @@ $selector: ".pb_nav_list";
       border-bottom: 0;
     }
   }
-
+  
 }
 
 //Image Wrapper

data/app/pb_kits/playbook/pb_nav/docs/_block_nav.jsx

@@ -1,8 +1,6 @@
 import React from 'react'
-
-import Nav from '../_nav'
-import NavItem from '../_item'
-import User from '../../pb_user/_user'
+import { Nav, User } from '../../'
+import NavItem from '../_item.jsx'
 
 const BlockNav = (props) => {
   return (

data/app/pb_kits/playbook/pb_nav/docs/_block_no_title_nav.jsx

@@ -1,7 +1,6 @@
 import React from 'react'
-
-import Nav from '../_nav'
-import NavItem from '../_item'
+import { Nav } from '../../'
+import NavItem from '../_item.jsx'
 
 const BlockNoTitleNav = (props) => {
   return (

data/app/pb_kits/playbook/pb_nav/docs/_borderless_nav.jsx

@@ -1,7 +1,6 @@
 import React from 'react'
-
-import Nav from '../_nav'
-import NavItem from '../_item'
+import { Nav } from '../../'
+import NavItem from '../_item.jsx'
 
 const BorderlessNav = (props) => {
   return (

data/app/pb_kits/playbook/pb_nav/docs/_default_nav.jsx

@@ -1,7 +1,6 @@
 import React from 'react'
-
-import Nav from '../_nav'
-import NavItem from '../_item'
+import { Nav } from '../../'
+import NavItem from '../_item.jsx'
 
 const DefaultNav = (props) => (
   <Nav

data/app/pb_kits/playbook/pb_nav/docs/_horizontal_nav.jsx

@@ -1,7 +1,6 @@
 import React from 'react'
-
-import Nav from '../_nav'
-import NavItem from '../_item'
+import { Nav } from '../../'
+import NavItem from '../_item.jsx'
 
 const HorizontalNav = (props) => {
   return (

data/app/pb_kits/playbook/pb_nav/docs/_new_tab.jsx

@@ -1,7 +1,6 @@
 import React from 'react'
-
-import Nav from '../_nav'
-import NavItem from '../_item'
+import { Nav } from '../../'
+import NavItem from '../_item.jsx'
 
 const NewTab = (props) => (
   <Nav

data/app/pb_kits/playbook/pb_nav/docs/_no_highlight_nav.jsx

@@ -1,7 +1,6 @@
 import React from 'react'
-
-import Nav from '../_nav'
-import NavItem from '../_item'
+import { Nav } from '../../'
+import NavItem from '../_item.jsx'
 
 const NoHighlightNav = (props) => {
   return (

data/app/pb_kits/playbook/pb_nav/docs/_subtle_horizontal_nav.jsx

@@ -1,7 +1,6 @@
 import React from 'react'
-
-import Nav from '../_nav'
-import NavItem from '../_item'
+import { Nav } from '../../'
+import NavItem from '../_item.jsx'
 
 const SubtleHorizontalNav = (props) => {
   return (

data/app/pb_kits/playbook/pb_nav/docs/_subtle_nav.jsx

@@ -1,7 +1,6 @@
 import React from 'react'
-
-import Nav from '../_nav'
-import NavItem from '../_item'
+import { Nav } from '../../'
+import NavItem from '../_item.jsx'
 
 const SubtleNav = (props) => {
   return (

data/app/pb_kits/playbook/pb_nav/docs/_subtle_no_highlight_nav.jsx

@@ -1,7 +1,6 @@
 import React from 'react'
-
-import Nav from '../_nav'
-import NavItem from '../_item'
+import { Nav } from '../../'
+import NavItem from '../_item.jsx'
 
 const SubtleNoHighlightNav = (props) => {
   return (

data/app/pb_kits/playbook/pb_nav/docs/_subtle_with_icons_nav.jsx

@@ -1,7 +1,6 @@
 import React from 'react'
-
-import Nav from '../_nav'
-import NavItem from '../_item'
+import { Nav } from '../../'
+import NavItem from '../_item.jsx'
 
 const SubtleWithIconsNav = (props) => {
   return (

data/app/pb_kits/playbook/pb_nav/docs/_with_icons_nav.jsx

@@ -1,7 +1,6 @@
 import React from 'react'
-
-import Nav from '../_nav'
-import NavItem from '../_item'
+import { Nav } from '../../'
+import NavItem from '../_item.jsx'
 
 const WithIconsNav = (props) => {
   return (

data/app/pb_kits/playbook/pb_nav/docs/_with_img_nav.jsx

@@ -1,7 +1,6 @@
 import React from 'react'
-
-import Nav from '../_nav'
-import NavItem from '../_item'
+import { Nav } from '../../'
+import NavItem from '../_item.jsx'
 
 const WithImageNav = (props) => {
   return (

data/app/pb_kits/playbook/pb_online_status/docs/_online_status_default.jsx

@@ -1,6 +1,5 @@
 import React from 'react'
-
-import OnlineStatus from '../_online_status'
+import { OnlineStatus } from '../../'
 
 const OnlineStatusDefault = (props) => (
   <>

data/app/pb_kits/playbook/pb_passphrase/_passphrase.jsx

@@ -1,22 +1,13 @@
+
 /* @flow */
 
 import React, { useCallback, useEffect, useMemo, useState } from 'react'
 import classnames from 'classnames'
-
 import { buildAriaProps, buildCss, buildDataProps } from '../utilities/props'
 import { globalProps } from '../utilities/globalProps.js'
-
 import useZxcvbn from './useZxcvbn'
 import useHaveIBeenPwned from './useHaveIBeenPwned'
-
-import Body from '../pb_body/_body'
-import Caption from '../pb_caption/_caption'
-import CircleIconButton from '../pb_circle_icon_button/_circle_icon_button'
-import Flex from '../pb_flex/_flex'
-import Icon from '../pb_icon/_icon'
-import PbReactPopover from '../pb_popover/_popover'
-import ProgressSimple from '../pb_progress_simple/_progress_simple'
-import TextInput from '../pb_text_input/_text_input'
+import { Body, Caption, CircleIconButton, Flex, Icon, PbReactPopover, ProgressSimple, TextInput } from '../'
 
 type PassphraseProps = {
   aria?: object,

data/app/pb_kits/playbook/pb_passphrase/docs/_passphrase_breached.jsx

@@ -1,6 +1,5 @@
 import React, { useState } from 'react'
-
-import Passphrase from '../_passphrase'
+import { Passphrase } from '../../'
 
 const PassphraseBreached = (props) => {
   const [input, setInput] = useState('')

data/app/pb_kits/playbook/pb_passphrase/docs/_passphrase_common.jsx

@@ -1,7 +1,5 @@
 import React, { useState } from 'react'
-
-import Passphrase from '../_passphrase'
-import Body from '../../pb_body/_body'
+import { Body, Passphrase } from '../../'
 
 const PassphraseCommon = (props) => {
   const [input, setInput] = useState('')

data/app/pb_kits/playbook/pb_passphrase/docs/_passphrase_default.jsx

@@ -1,6 +1,5 @@
 import React, { useState } from 'react'
-
-import Passphrase from '../_passphrase'
+import { Passphrase } from '../../'
 
 const PassphraseDefault = (props) => {
   const [input, setInput] = useState('')

data/app/pb_kits/playbook/pb_passphrase/docs/_passphrase_input_props.jsx

@@ -1,6 +1,5 @@
 import React, { useState } from 'react'
-
-import Passphrase from '../../pb_passphrase/_passphrase'
+import { Passphrase } from '../../'
 
 const PassphraseInputProps = (props) => {
   const [input, setInput] = useState('')

data/app/pb_kits/playbook/pb_passphrase/docs/_passphrase_meter_settings.jsx

@@ -1,8 +1,5 @@
 import React, { useState } from 'react'
-
-import Body from '../../pb_body/_body'
-import Passphrase from '../../pb_passphrase/_passphrase'
-import TextInput from '../../pb_text_input/_text_input'
+import { Body, Passphrase, TextInput } from '../../'
 
 const PassphraseMeterSettings = (props) => {
   const [input, setInput] = useState('')

data/app/pb_kits/playbook/pb_passphrase/docs/_passphrase_strength_change.jsx

@@ -1,8 +1,5 @@
 import React, { useState } from 'react'
-
-import Passphrase from '../_passphrase'
-
-import TextInput from '../../pb_text_input/_text_input'
+import { Passphrase, TextInput } from '../../'
 
 const PassphraseStrengthChange = (props) => {
   const [input, setInput] = useState('')

data/app/pb_kits/playbook/pb_passphrase/docs/_passphrase_tips.jsx

@@ -1,6 +1,5 @@
 import React, { useState } from 'react'
-
-import Passphrase from '../_passphrase'
+import { Passphrase } from '../../'
 
 const PassphraseTips = (props) => {
   const [input, setInput] = useState('')

data/app/pb_kits/playbook/pb_person/_person.jsx

@@ -2,16 +2,15 @@
 
 import React from 'react'
 import classnames from 'classnames'
+import { globalProps } from '../utilities/globalProps.js'
 
-import { globalProps } from '../utilities/globalProps'
 import {
   buildAriaProps,
   buildCss,
   buildDataProps,
 } from '../utilities/props'
 
-import Body from '../pb_body/_body'
-import Title from '../pb_title/_title'
+import { Body, Title } from '../'
 
 type PersonProps = {
   aria?: object,

data/app/pb_kits/playbook/pb_person/docs/_person_default.jsx

@@ -1,6 +1,5 @@
 import React from 'react'
-
-import Person from '../_person'
+import { Person } from '../../'
 
 const PersonDefault = (props) => {
   return (

data/app/pb_kits/playbook/pb_person_contact/_person_contact.jsx

@@ -3,12 +3,15 @@
 import React from 'react'
 import classnames from 'classnames'
 
-import { buildAriaProps, buildCss, buildDataProps } from '../utilities/props'
-import { globalProps } from '../utilities/globalProps'
+import {
+  buildAriaProps,
+  buildCss,
+  buildDataProps,
+} from '../utilities/props'
 
-import Caption from '../pb_caption/_caption'
-import Contact from '../pb_contact/_contact'
-import Person from '../pb_person/_person'
+import { globalProps } from '../utilities/globalProps.js'
+
+import { Caption, Contact, Person } from '../'
 
 type ContactItem = {
   contactType: string,

data/app/pb_kits/playbook/pb_person_contact/docs/_person_contact_default.jsx

@@ -1,6 +1,5 @@
 import React from 'react'
-
-import PersonContact from '../_person_contact'
+import { PersonContact } from '../../'
 
 const PersonContactDefault = (props) => {
   return (

data/app/pb_kits/playbook/pb_person_contact/docs/_person_contact_multiple.jsx

@@ -1,6 +1,5 @@
 import React from 'react'
-
-import PersonContact from '../_person_contact'
+import { PersonContact } from '../../'
 
 const PersonContactMultiple = (props) => {
   return (

data/app/pb_kits/playbook/pb_person_contact/docs/_person_contact_with_detail.jsx

@@ -1,6 +1,5 @@
 import React from 'react'
-
-import PersonContact from '../_person_contact'
+import { PersonContact } from '../../'
 
 const PersonContactWithDetail = (props) => {
   return (

data/app/pb_kits/playbook/pb_person_contact/docs/_person_contact_with_wrong_numbers.jsx

@@ -1,6 +1,5 @@
 import React from 'react'
-
-import PersonContact from '../_person_contact'
+import { PersonContact } from '../../'
 
 const PersonContactWithWrongNumbers = (props) => {
   return (

data/app/pb_kits/playbook/pb_progress_pills/_progress_pills.jsx

@@ -1,13 +1,16 @@
 /* @flow */
 
 import React from 'react'
+import { Body, Title } from '../'
 import classnames from 'classnames'
 
-import { buildAriaProps, buildCss, buildDataProps } from '../utilities/props'
-import { globalProps } from '../utilities/globalProps'
+import {
+  buildAriaProps,
+  buildCss,
+  buildDataProps,
+} from '../utilities/props'
 
-import Body from '../pb_body/_body'
-import Title from '../pb_title/_title'
+import { globalProps } from '../utilities/globalProps.js'
 
 type ProgressPillsProps = {
   active?: number,

data/app/pb_kits/playbook/pb_progress_step/_progress_step_item.jsx

@@ -2,10 +2,8 @@
 
 import React from 'react'
 import classnames from 'classnames'
-
 import { buildCss } from '../utilities/props'
-
-import Icon from '../pb_icon/_icon'
+import { Icon } from '..'
 
 type ProgressStepItemProps = {
   className?: string,

data/app/pb_kits/playbook/pb_progress_step/docs/_progress_step_default.jsx

@@ -1,5 +1,4 @@
 import React from 'react'
-
 import ProgressStep from '../_progress_step.jsx'
 import ProgressStepItem from '../_progress_step_item.jsx'
 

data/app/pb_kits/playbook/pb_progress_step/docs/_progress_step_tracker.jsx

@@ -1,10 +1,7 @@
 import React from 'react'
-
 import ProgressStep from '../_progress_step.jsx'
-import ProgressStepItem from '../_progress_step_item'
-
-import Caption from '../../pb_caption/_caption'
-
+import ProgressStepItem from '../_progress_step_item.jsx'
+import { Caption } from '../../'
 const ProgressStepTracker = (props) => (
   <div>
     <br />

data/app/pb_kits/playbook/pb_progress_step/docs/_progress_step_tracker_click_events.jsx

@@ -1,11 +1,7 @@
 import React, { useState } from 'react'
-
 import ProgressStep from '../_progress_step.jsx'
-import ProgressStepItem from '../_progress_step_item'
-
-import Caption from '../../pb_caption/_caption'
-import Button from '../../pb_button/_button'
-
+import ProgressStepItem from '../_progress_step_item.jsx'
+import { Button, Caption } from '../../'
 const ProgressStepTrackerClickEvents = (props) => {
   const [warning, setWarning] = useState(false)
   const showWarning = warning == true

data/app/pb_kits/playbook/pb_progress_step/docs/_progress_step_vertical.jsx

@@ -1,5 +1,4 @@
 import React from 'react'
-
 import ProgressStep from '../_progress_step.jsx'
 import ProgressStepItem from '../_progress_step_item.jsx'