playbook_ui 13.33.0.pre.alpha.PLAY14143305 → 13.33.0.pre.alpha.PLAY14143312

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 8c0a7d03d3b88b066c0a2f3a223c3aaa25f224e2f6d7a9e85c49450fbd0897f7
-  data.tar.gz: 007c77d46cc0a5f65733e807a3c6494823b832cd02fafe3ac3d688b7d99eebc6
+  metadata.gz: 7e0ec858e48a23db2f65ce9adc3e9ea73672441254de598f04dabe1110b1c9ed
+  data.tar.gz: d79a3c3a07992fa489f37d795e46f7a5251b20442018c8c774cdf2d4cc209bb9
 SHA512:
-  metadata.gz: f9164cdc6f789bc6edd9fad7970df81ca1c3366c428d18345edcd86dd556f628075afa1d8db686405dd16d0cc79d6940b1adbc283cefae335c5e09f3fe678374
-  data.tar.gz: cbda7ddce7bcbb9325266ec487db4d90617b1f4ccf8a32e1c5638a6c5159b703cebfeb5701bc512ac88522ca03627f562ea32bc4672aa4cb72093164819ba542
+  metadata.gz: 1c7eb00dd898d2ccde7f471c27afa8c07b0a73f3f9714ab7285bacfe32242fbab4f589e1db10739bdfa0f3f069614ebc90168ae45b6718676bc8a78327d7fe90
+  data.tar.gz: c71099228d3030f93e8b99eae8b03c35c24bcaacf0554b4d1115aced7fe99fea31e33ce3d7ffff285369ac6993343861fa2c126cc851983fc3c5ac0a907895dc

data/app/pb_kits/playbook/pb_advanced_table/Components/CustomCell.tsx

@@ -5,7 +5,9 @@ import { GenericObject } from "../../types"
 
 import { GlobalProps } from "../../utilities/globalProps"
 
-import { Flex, FlexItem, Icon } from "playbook-ui"
+import Flex from "../../pb_flex/_flex"
+import FlexItem from "../../pb_flex/_flex_item"
+import Icon from "../../pb_icon/_icon"
 
 import AdvancedTableContext from "../Context/AdvancedTableContext"
 

data/app/pb_kits/playbook/pb_advanced_table/Components/SortIconButton.tsx

@@ -3,7 +3,7 @@ import { Header } from "@tanstack/react-table"
 
 import { GenericObject } from "../../types"
 
-import { Icon } from "playbook-ui"
+import Icon from "../../pb_icon/_icon"
 
 import { displayIcon } from "../Utilities/IconHelpers"
 

data/app/pb_kits/playbook/pb_advanced_table/Components/SubRowHeaderRow.tsx

@@ -5,7 +5,8 @@ import { GenericObject } from "../../types"
 
 import { GlobalProps } from "../../utilities/globalProps"
 
-import { Caption, Flex } from "playbook-ui"
+import Flex from "../../pb_flex/_flex"
+import Caption from "../../pb_caption/_caption"
 
 import { ToggleIconButton } from "./ToggleIconButton"
 import { renderCollapsibleTrail } from "./CollapsibleTrail"

data/app/pb_kits/playbook/pb_advanced_table/Components/TableHeaderCell.tsx

@@ -6,7 +6,7 @@ import { GenericObject } from "../../types"
 
 import { GlobalProps } from "../../utilities/globalProps"
 
-import { Flex } from "playbook-ui"
+import Flex from "../../pb_flex/_flex"
 
 import { SortIconButton } from "./SortIconButton"
 import { ToggleIconButton } from "./ToggleIconButton"

data/app/pb_kits/playbook/pb_advanced_table/Components/ToggleIconButton.tsx

@@ -3,7 +3,7 @@ import { Row } from "@tanstack/react-table"
 
 import { GenericObject } from "../../types"
 
-import { Icon } from "playbook-ui"
+import Icon from "../../pb_icon/_icon"
 
 import { displayIcon } from "../Utilities/IconHelpers"
 

data/app/pb_kits/playbook/pb_advanced_table/SubKits/TableBody.tsx

@@ -8,7 +8,7 @@ import { buildCss } from "../../utilities/props"
 import { globalProps } from "../../utilities/globalProps"
 import { isChrome } from "../Utilities/BrowserCheck"
 
-import { LoadingInline } from "playbook-ui"
+import LoadingInline from "../../pb_loading_inline/_loading_inline"
 
 import { SubRowHeaderRow } from "../Components/SubRowHeaderRow"
 import { LoadingCell } from "../Components/LoadingCell"

data/app/pb_kits/playbook/pb_collapsible/child_kits/CollapsibleIcon.tsx

@@ -1,6 +1,5 @@
 import React from "react";
-import { IconSizes } from "../../pb_icon/_icon";
-import { Icon } from "playbook-ui";
+import Icon, { IconSizes } from "../../pb_icon/_icon";
 
 type IconColors =
   | "default"

data/app/pb_kits/playbook/pb_collapsible/child_kits/CollapsibleMain.tsx

@@ -2,13 +2,12 @@
 
 import classnames from 'classnames'
 import React, { useContext } from 'react'
-import { Flex, FlexItem } from 'playbook-ui'
-
 import { buildCss } from '../../utilities/props'
 import { globalProps } from '../../utilities/globalProps'
 
-import { IconSizes } from "../../pb_icon/_icon";
-
+import Flex from '../../pb_flex/_flex'
+import FlexItem from '../../pb_flex/_flex_item'
+import { IconSizes } from "../../pb_icon/_icon"
 import CollapsibleContext from '../context'
 import CollapsibleIcon from './CollapsibleIcon'
 

data/app/pb_kits/playbook/pb_dialog/child_kits/_dialog_footer.tsx

@@ -4,7 +4,9 @@ import classnames from 'classnames'
 import { buildCss, buildHtmlProps } from '../../utilities/props'
 import { GlobalProps, globalProps } from '../../utilities/globalProps'
 
-import { Flex, SectionSeparator } from 'playbook-ui'
+import Flex from '../../pb_flex/_flex'
+import SectionSeparator from '../../pb_section_separator/_section_separator'
+
 
 type DialogFooterProps = {
   aria?: {[key: string]: string},

data/app/pb_kits/playbook/pb_dialog/child_kits/_dialog_header.tsx

@@ -5,8 +5,8 @@ import { globalProps, GlobalProps } from '../../utilities/globalProps'
 
 import { CloseIcon } from '../_close_icon'
 import { DialogContext } from '../_dialog_context'
-
-import { Flex, SectionSeparator } from 'playbook-ui'
+import Flex from '../../pb_flex/_flex'
+import SectionSeparator from '../../pb_section_separator/_section_separator'
 
 type DialogHeaderProps = {
   aria?: {[key: string]: string},

data/app/pb_kits/playbook/pb_dropdown/subcomponents/DropdownContainer.tsx

@@ -10,7 +10,10 @@ import { globalProps } from "../../utilities/globalProps";
 
 import DropdownContext from "../context";
 
-import { Body, List, ListItem, TextInput } from "playbook-ui";
+import List from "../../pb_list/_list";
+import ListItem from "../../pb_list/_list_item";
+import TextInput from "../../pb_text_input/_text_input";
+import Body from "../../pb_body/_body";
 
 type DropdownContainerProps = {
   aria?: { [key: string]: string };

data/app/pb_kits/playbook/pb_dropdown/subcomponents/DropdownOption.tsx

@@ -1,7 +1,5 @@
 import React, { useContext } from "react";
 import classnames from "classnames";
-import { Body, ListItem } from "playbook-ui";
-
 import {
   buildAriaProps,
   buildCss,
@@ -11,6 +9,9 @@ import {
 import { globalProps, GlobalProps } from "../../utilities/globalProps";
 
 import DropdownContext from "../context";
+
+import Body from "../../pb_body/_body";
+import ListItem from "../../pb_list/_list_item";
 import { GenericObject } from "../../types";
 
 type DropdownOptionProps = {

data/app/pb_kits/playbook/pb_dropdown/subcomponents/DropdownTrigger.tsx

@@ -1,7 +1,5 @@
 import React, { useContext } from "react";
 import classnames from "classnames";
-import { Body, Icon, Flex, FlexItem } from "playbook-ui";
-
 import {
   buildAriaProps,
   buildCss,
@@ -13,6 +11,11 @@ import { useHandleOnKeyDown } from "../hooks/useHandleOnKeydown";
 
 import DropdownContext from "../context";
 
+import Body from "../../pb_body/_body";
+import Icon from "../../pb_icon/_icon";
+import Flex from "../../pb_flex/_flex";
+import FlexItem from "../../pb_flex/_flex_item";
+
 type DropdownTriggerProps = {
   aria?: { [key: string]: string };
   children?: React.ReactChild[] | React.ReactChild;

data/app/pb_kits/playbook/pb_filter/Filter/CurrentFilters.tsx

@@ -1,7 +1,9 @@
 import React from 'react'
 import { isEmpty, map, omitBy } from 'lodash'
 
-import { Body, Caption, Title } from 'playbook-ui'
+import Body from '../../pb_body/_body'
+import Caption from '../../pb_caption/_caption'
+import Title from '../../pb_title/_title'
 
 export type FilterDescription = {
   [key: string]: string | null | boolean,

data/app/pb_kits/playbook/pb_filter/Filter/FilterBackground.tsx

@@ -1,9 +1,10 @@
 import React from 'react'
 import classnames from 'classnames'
-import { Card } from 'playbook-ui'
 
 import { GlobalProps, globalProps } from '../../utilities/globalProps'
 
+import Card from '../../pb_card/_card'
+
 export type FilterBackgroundProps = {
   background: boolean,
   className: string,

data/app/pb_kits/playbook/pb_filter/Filter/FilterDouble.tsx

@@ -10,7 +10,9 @@ import SortMenu, {
   SortValue,
 } from './SortMenu'
 
-import { Caption, Flex, SectionSeparator } from 'playbook-ui'
+import Caption from '../../pb_caption/_caption'
+import Flex from '../../pb_flex/_flex'
+import SectionSeparator from '../../pb_section_separator/_section_separator'
 
 export type FilterDoubleProps = {
   children?: React.ReactChild[] | React.ReactChild,

data/app/pb_kits/playbook/pb_filter/Filter/FilterSingle.tsx

@@ -1,7 +1,7 @@
 import React from 'react'
 import { isEmpty } from 'lodash'
 
-import { Flex } from 'playbook-ui'
+import Flex from '../../pb_flex/_flex'
 
 import CurrentFilters, { FilterDescription } from './CurrentFilters'
 import FilterBackground, { FilterBackgroundProps } from './FilterBackground'

data/app/pb_kits/playbook/pb_filter/Filter/FiltersPopover.tsx

@@ -1,5 +1,7 @@
 import React, { ReactNode, useState } from 'react'
-import { CircleIconButton, PbReactPopover } from 'playbook-ui'
+
+import CircleIconButton from '../../pb_circle_icon_button/_circle_icon_button'
+import PbReactPopover from '../../pb_popover/_popover'
 
 type FiltersPopoverProps = {
   children?: React.ReactChild[] | React.ReactChild | (({closePopover}: {closePopover: () => void}) =>  ReactNode), 

data/app/pb_kits/playbook/pb_filter/Filter/ResultsCount.tsx

@@ -1,6 +1,7 @@
 import React from 'react'
 
-import { Caption, TitleCount } from 'playbook-ui'
+import Caption from '../../pb_caption/_caption'
+import TitleCount from '../../pb_title_count/_title_count'
 
 const resultsText = (results: number): string => results == 1 ? 'Result' : 'Results'
 

data/app/pb_kits/playbook/pb_filter/Filter/SortMenu.tsx

@@ -1,7 +1,11 @@
 import React, { useState } from 'react'
 import { find, map, partial } from 'lodash'
 
-import { Button, Icon, List, ListItem, PbReactPopover } from 'playbook-ui'
+import Button from '../../pb_button/_button'
+import Icon from '../../pb_icon/_icon'
+import List from '../../pb_list/_list'
+import ListItem from '../../pb_list/_list_item'
+import PbReactPopover from '../../pb_popover/_popover'
 
 export type Direction = 'asc' | 'desc'
 export type SortOptions = { [name: string]: string }

data/app/pb_kits/playbook/pb_lightbox/Carousel/Slide.tsx

@@ -1,7 +1,7 @@
 import React from 'react'
 import { noop } from 'lodash'
 import { TransformComponent, TransformWrapper } from 'react-zoom-pan-pinch'
-import { Image } from 'playbook-ui'
+import Image from '../../pb_image/_image'
 
 type SlideType = {
   alt?: string,

data/app/pb_kits/playbook/pb_lightbox/Carousel/Slides.tsx

@@ -1,6 +1,6 @@
 import { noop } from 'lodash'
 import React, { useState } from 'react'
-import { CircleIconButton } from 'playbook-ui'
+import CircleIconButton from '../../pb_circle_icon_button/_circle_icon_button'
 
 import Slide from './Slide'
 

data/app/pb_kits/playbook/pb_lightbox/Carousel/Thumbnail.tsx

@@ -1,6 +1,6 @@
 import React from 'react'
 import classnames from 'classnames'
-import { Image } from 'playbook-ui'
+import Image from '../../pb_image/_image'
 
 type ThumbnailType = {
   active?: boolean,

data/app/pb_kits/playbook/pb_lightbox/Header/_lightbox_header.tsx

@@ -10,7 +10,12 @@ import {
 import { globalProps, GlobalProps } from "../../utilities/globalProps";
 import { LightboxContext } from "../_lightbox_context";
 
-import { CircleIconButton, Caption, Flex, FlexItem, Title, Button } from "playbook-ui";
+import CircleIconButton from "../../pb_circle_icon_button/_circle_icon_button";
+import Caption from "../../pb_caption/_caption";
+import Flex from "../../pb_flex/_flex";
+import FlexItem from "../../pb_flex/_flex_item";
+import Title from "../../pb_title/_title";
+import Button from "../../pb_button/_button";
 
 type LightboxHeaderProps = {
   aria?: { [key: string]: string };

data/app/pb_kits/playbook/pb_rich_text_editor/TipTap/EditorButton.tsx

@@ -1,5 +1,9 @@
 import React from "react";
-import { Icon, Flex, Tooltip } from "playbook-ui";
+
+import Icon from "../../pb_icon/_icon";
+import Flex from "../../pb_flex/_flex";
+import Tooltip from "../../pb_tooltip/_tooltip";
+
 
 type EditorButtonProps = {
   classname?: string,

data/app/pb_kits/playbook/pb_rich_text_editor/TipTap/MoreExtensionsDropdown.tsx

@@ -1,6 +1,10 @@
 import React, { useState } from 'react'
 
-import { Flex, Icon, Nav, NavItem, PbReactPopover } from 'playbook-ui'
+import Flex from '../../pb_flex/_flex'
+import PbReactPopover from '../../pb_popover/_popover'
+import Icon from '../../pb_icon/_icon'
+import Nav from '../../pb_nav/_nav'
+import NavItem from '../../pb_nav/_item'
 
 const MoreExtensionsDropdown = ({extensions}: any) => {
   const [showPopover, setShowPopover] = useState(false)

data/app/pb_kits/playbook/pb_rich_text_editor/TipTap/Toolbar.tsx

@@ -1,6 +1,8 @@
 import React from "react";
-
-import { Background, Flex, FlexItem, SectionSeparator } from "playbook-ui";
+import Background from "../../pb_background/_background";
+import Flex from "../../pb_flex/_flex";
+import FlexItem from "../../pb_flex/_flex_item";
+import SectionSeparator from "../../pb_section_separator/_section_separator";
 
 import  EditorButton  from "./EditorButton";
 import ToolbarDropdown from "./ToolbarDropdown";

data/app/pb_kits/playbook/pb_rich_text_editor/TipTap/ToolbarDropdown.tsx

@@ -1,6 +1,11 @@
 import React, { useState } from 'react'
 
-import { Button, Flex, Icon, Nav, NavItem, PbReactPopover } from 'playbook-ui'
+import Flex from '../../pb_flex/_flex'
+import PbReactPopover from '../../pb_popover/_popover'
+import Button from '../../pb_button/_button'
+import Icon from '../../pb_icon/_icon'
+import Nav from '../../pb_nav/_nav'
+import NavItem from '../../pb_nav/_item'
 
 import { ToolbarTypes } from './EditorTypes'
 

data/app/pb_kits/playbook/pb_rich_text_editor/TipTap/ToolbarHistory.tsx

@@ -1,5 +1,5 @@
 import React from "react";
-import { FlexItem } from "playbook-ui";
+import FlexItem from "../../pb_flex/_flex_item";
 import EditorButton from "./EditorButton";
 import { ToolbarTypes } from "./EditorTypes";
 

data/app/pb_kits/playbook/pb_rich_text_editor/_rich_text_editor.tsx

@@ -1,19 +1,18 @@
 import React, { useEffect, useState } from 'react'
 import classnames from 'classnames'
+import Trix from "trix"
+import { TrixEditor } from "react-trix"
+
 import inlineFocus from './inlineFocus'
 import useFocus from './useFocus'
 import { globalProps, GlobalProps } from '../utilities/globalProps'
 import { buildAriaProps, buildDataProps, noop, buildHtmlProps } from '../utilities/props'
 
-try {
-  const Trix = require('trix')
-  Trix.config.textAttributes.inlineCode = {
-    tagName: 'code',
-    inheritable: true,
-  }
-} catch (_e) { /* do nothing */ }
+Trix.config.textAttributes.inlineCode = {
+  tagName: 'code',
+  inheritable: true,
+}
 
-import { TrixEditor } from "react-trix"
 import EditorToolbar from './TipTap/Toolbar'
 
 type Editor = {

data/app/pb_kits/playbook/pb_rich_text_editor/rich_text_editor.test.js

@@ -1,7 +1,7 @@
 import React from 'react'
 import { render, screen } from '../utilities/test-utils'
 
-import { RichTextEditor } from 'playbook-ui'
+import RichTextEditor from './_rich_text_editor'
 
 const testId = 'richtext-input1',
   kitClass = 'pb_rich_text_editor_kit'

data/app/pb_kits/playbook/pb_rich_text_editor/rich_text_editor_advanced.test.js

@@ -1,10 +1,11 @@
 import React from "react";
-import { RichTextEditor } from "playbook-ui";
 import { render } from "../utilities/test-utils";
 import { useEditor, EditorContent } from "@tiptap/react";
 import StarterKit from "@tiptap/starter-kit";
 import Link from "@tiptap/extension-link";
 
+import RichTextEditor from "./_rich_text_editor";
+
 const kitClass = "pb_rich_text_editor_advanced_container";
 
 const EditorTest = (props) => {

data/app/pb_kits/playbook/pb_typeahead/_typeahead.test.jsx

@@ -1,6 +1,6 @@
 import React from 'react'
 import { render, screen } from '../utilities/test-utils'
-import { Typeahead } from 'playbook-ui'
+import Typeahead from './_typeahead'
 
 const options = [
   { label: 'Orange', value: '#FFA500' },

data/app/pb_kits/playbook/pb_typeahead/components/Control.tsx

@@ -1,7 +1,8 @@
 import React from 'react'
 import { components } from 'react-select'
 
-import { Flex, TextInput } from 'playbook-ui'
+import Flex from '../../pb_flex/_flex'
+import TextInput from '../../pb_text_input/_text_input'
 
 type Props = {
   selectProps: {

data/app/pb_kits/playbook/pb_typeahead/components/MultiValue.tsx

@@ -1,7 +1,8 @@
 import React from 'react'
 import { components } from 'react-select'
-import { Badge, FormPill } from 'playbook-ui'
 
+import Badge from '../../pb_badge/_badge'
+import FormPill from '../../pb_form_pill/_form_pill'
 import { SelectValueType } from '../_typeahead'
 
 type Props = {

data/app/pb_kits/playbook/pb_typeahead/components/Option.tsx

@@ -1,7 +1,7 @@
 import React from 'react'
 import { components } from 'react-select'
 
-import { User } from 'playbook-ui'
+import User from '../../pb_user/_user'
 
 const Option = (props: any): React.ReactElement => {
   const {

data/app/pb_kits/playbook/pb_typeahead/components/Placeholder.tsx

@@ -1,7 +1,8 @@
 import React from 'react'
 import { components } from 'react-select'
 
-import { Flex, Icon } from 'playbook-ui'
+import Flex from '../../pb_flex/_flex'
+import Icon from '../../pb_icon/_icon'
 
 const Placeholder = (props: any): React.ReactElement => (
   <>

data/app/pb_kits/playbook/tokens/exports/exports.d.ts

@@ -1 +1,2 @@
+declare module "trix";
 declare module '*.scss';