playbook_ui 18.0.1.pre.rc.0 → 18.1.0.pre.rc.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 4f7783b8463c90951131604bdf5eac75eb7fff9767a5c356de003e2eec536569
-  data.tar.gz: 99211c843243aa798424571effdacca18bc2a7bb5aab3bd3fb0f7934dd58a4b8
+  metadata.gz: 73aa2379cffe56b84ee997cf41ef0b64612bfe0d9759f98dc44b2ced32b2ec10
+  data.tar.gz: 3b9a750583ef9058572ea2490712624b6cd1a69ece3435388fd55bcd88259820
 SHA512:
-  metadata.gz: a19623f9af10397c92244acd88d1e80773655bb988c7b7ed8a9472ee0b018ab53514430911f3b6a0ea3a146ba54534a28704f9d13b010746445591d6f46c941f
-  data.tar.gz: c3ef61f6dadfcfcf8c07f757596816573834536e757bab91a2f85e886692e3cf3db7b8633e957b032c776b2422fd20d3a7245f0b6b58fc4be14f4a60c5c43e42
+  metadata.gz: 76deee8035672747d6d959b378ab0f04f6c10bbf4eb7029ad346977b1d1b687b3560ebd6707e4daf978a2c4b8069834f9017842da346afb92ca258232d68230b
+  data.tar.gz: 8f1d3ea325d14bd6fdb3f179d818c44fe016535608370bb838620ed958ad8a0d7b26b5319e9021416b2e6eb4b08414bf933dd634a957543556b1254467a75c85

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

@@ -4,6 +4,5 @@ examples:
   - form_defaults: Defaults
   - form_validation: Validation and Error Messages
   - form_default_values: Default Values
-  - form_model_values: Model Values + Errors
   - form_loading: Loading
   - form_multi_column: Multi-Column Layout

data/app/pb_kits/playbook/pb_multi_level_select/_helper_functions.tsx

@@ -1,14 +1,3 @@
-// selected_ids / tree_data ids may be strings or numbers; includes() is strict.
-export const selectedIdsInclude = (
-  selectedIds: Array<string | number> | null | undefined,
-  id: string | number
-): boolean => {
-  if (!selectedIds || !selectedIds.length) return false
-
-  const target = String(id)
-  return selectedIds.some((selectedId) => String(selectedId) === target)
-};
-
 // Function is going over formattedData and returning all objects that match the
 // ID of the clicked item from the dropdown
 export const filterFormattedDataById = (
@@ -171,7 +160,7 @@ export const getExpandedItems = (
 
       // Only expand based on selected items if showCheckedChildren is true
       if (showCheckedChildren) {
-        if (selectedIdsInclude(selectedIds, item.id)) {
+        if (selectedIds && selectedIds.length && selectedIds.includes(item.id)) {
           expandedItems.push(...itemAncestors.map((ancestor: any) => ancestor.id));
         }
         if (Array.isArray(item.children)) {

data/app/pb_kits/playbook/pb_multi_level_select/_multi_level_select.tsx

@@ -32,7 +32,6 @@ import {
   getDefaultCheckedItems,
   recursiveCheckParent,
   getExpandedItems,
-  selectedIdsInclude,
 } from "./_helper_functions";
 
 import { DialogContext } from "../pb_dialog/_dialog_context";
@@ -249,7 +248,9 @@ const MultiLevelSelect = forwardRef<HTMLInputElement, MultiLevelSelectProps>(
         const isDisabled =
           item.disabled || (parentDisabled && !returnAllSelected);
 
-          const explicitlySelected = selectedIdsInclude(selectedIds, item.id);
+          const explicitlySelected = Boolean(
+            selectedIds && selectedIds?.length && selectedIds.includes(item.id)
+          );
 
           const checked =
           !isDisabled &&

data/app/pb_kits/playbook/pb_multi_level_select/multi_level_select.test.jsx

@@ -546,32 +546,6 @@ describe('MultiLevelSelect tree_helpers', () => {
       expect(formatted[0].children[1].checked).toBe(false)
     })
 
-    test('matches selected ids when selected_ids are numbers and tree ids are strings', () => {
-      const numericTree = [
-        {
-          id: '101',
-          label: 'Parent',
-          children: [{ id: '102', label: 'Child' }],
-        },
-      ]
-      const formatted = addCheckedAndParentProperty(cloneTree(numericTree), [102])
-      expect(formatted[0].children[0].checked).toBe(true)
-      expect(formatted[0].checked).toBe(false)
-    })
-
-    test('matches selected ids when selected_ids are strings and tree ids are numbers', () => {
-      const numericTree = [
-        {
-          id: 101,
-          label: 'Parent',
-          children: [{ id: 102, label: 'Child' }],
-        },
-      ]
-      const formatted = addCheckedAndParentProperty(cloneTree(numericTree), ['102'])
-      expect(formatted[0].children[0].checked).toBe(true)
-      expect(formatted[0].checked).toBe(false)
-    })
-
     test('cascades checked state to children in default multi mode', () => {
       const formatted = addCheckedAndParentProperty(cloneTree(helperTree), ['parent'])
       expect(formatted[0].checked).toBe(true)

data/app/pb_kits/playbook/pb_multi_level_select/tree_helpers.js

@@ -1,13 +1,5 @@
 export const cloneTree = (value) => JSON.parse(JSON.stringify(value))
 
-// selected_ids / tree_data ids may be strings or numbers; includes() is strict.
-export const selectedIdsInclude = (selectedIds, id) => {
-  if (!selectedIds || !selectedIds.length) return false
-
-  const target = String(id)
-  return selectedIds.some((selectedId) => String(selectedId) === target)
-}
-
 export const filterFormattedDataById = (formattedData, id) => {
   const matched = []
   const recursiveSearch = (data, term) => {
@@ -146,7 +138,7 @@ export const getExpandedItems = (
       }
 
       if (showCheckedChildren) {
-        if (selectedIdsInclude(selectedIds, item.id)) {
+        if (selectedIds && selectedIds.length && selectedIds.includes(item.id)) {
           expandedItems.push(...itemAncestors.map((ancestor) => ancestor.id))
         }
         if (Array.isArray(item.children)) {
@@ -201,7 +193,9 @@ export const addCheckedAndParentProperty = (
     const isDisabled =
       item.disabled || (parentDisabled && !returnAllSelected)
 
-    const explicitlySelected = selectedIdsInclude(selectedIds, item.id)
+    const explicitlySelected = Boolean(
+      selectedIds && selectedIds.length && selectedIds.includes(item.id)
+    )
 
     const checked =
       !isDisabled &&

data/app/pb_kits/playbook/pb_pill/_pill.test.jsx

@@ -1,7 +1,6 @@
 import React from 'react'
 import { render, screen } from '../utilities/test-utils'
 import Pill from './_pill'
-import Icon from '../pb_icon/_icon'
 
 const testId = 'pill'
 
@@ -17,48 +16,6 @@ test('should render classname', () => {
   expect(kit).toHaveClass('pb_pill_kit_neutral_lowercase')
 })
 
-test('displays children when text is omitted', () => {
-  render(
-    <Pill data={{ testid: testId }}>
-      <span>icon</span>
-    </Pill>
-  )
-
-  expect(screen.getByText('icon')).toBeInTheDocument()
-})
-
-test('displays an icon passed as children', () => {
-  render(
-    <Pill
-        data={{ testid: testId }}
-        variant="success"
-    >
-      <Icon
-          data={{ testid: 'pill-icon' }}
-          icon="check"
-      />
-    </Pill>
-  )
-
-  const kit = screen.getByTestId(testId)
-  expect(kit).toContainElement(screen.getByTestId('pill-icon'))
-  expect(kit.querySelector('.pb_pill_text')).not.toBeInTheDocument()
-})
-
-test('text takes precedence over children', () => {
-  render(
-    <Pill
-        data={{ testid: testId }}
-        text="label"
-    >
-      <span>icon</span>
-    </Pill>
-  )
-
-  expect(screen.getByText('label')).toBeInTheDocument()
-  expect(screen.queryByText('icon')).not.toBeInTheDocument()
-})
-
 test('displays text content', () => {
   render(
     <Pill

data/app/pb_kits/playbook/pb_pill/_pill.tsx

@@ -8,7 +8,6 @@ import { GlobalProps, globalProps } from '../utilities/globalProps'
 type PillProps = {
   aria?: {[key: string]: string},
   className?: string,
-  children?: React.ReactNode,
   data?: {[key: string]: string},
   htmlOptions?: {[key: string]: string | number | boolean | (() => void)},
   id?: string,
@@ -23,7 +22,6 @@ const Pill = (props: PillProps) => {
   const {
     aria = {},
     className,
-    children,
     data = {},
     htmlOptions = {},
     id,
@@ -48,16 +46,12 @@ const Pill = (props: PillProps) => {
         className={classes}
         id={id}
     >
-      {
-        text ?
-          <Title
-              className="pb_pill_text"
-              size={4}
-              tag="div"
-              text={text}
-          />
-        : children
-      }
+      <Title
+          className="pb_pill_text"
+          size={4}
+          tag="div"
+          text={text}
+      />
     </div>
   )
 }

data/app/pb_kits/playbook/pb_pill/docs/_playground.json

@@ -9,7 +9,7 @@
   },
   "children": {
     "editable": true,
-    "default": "<Flex alignItems=\"center\">\n  <Title color=\"success\" size={4} tag=\"div\" text=\"Complete\" />\n  <Icon color=\"success\" icon=\"check\" size=\"sm\" />\n</Flex>",
+    "default": "Pill content",
     "hideWhenPropSet": [
       "text"
     ]
@@ -87,14 +87,6 @@
         "textTransform": "none"
       },
       "children": ""
-    },
-    {
-      "name": "Children",
-      "props": {
-        "variant": "success",
-        "textTransform": "none"
-      },
-      "children": "<Flex alignItems=\"center\">\n  <Title color=\"success\" size={4} tag=\"div\" text=\"Complete\" />\n  <Icon color=\"success\" icon=\"check\" size=\"sm\" />\n</Flex>"
     }
   ],
   "conditionals": {},
@@ -109,11 +101,6 @@
       "message": "notification uses a solid primary fill by default. set variant to error for the red treatment.",
       "type": "info"
     },
-    "text": {
-      "presetName": "Children",
-      "message": "Clear text to render children. Passing text replaces children.",
-      "type": "info"
-    },
     "text_transform": {
       "presetName": "Preserve Casing",
       "message": "Set textTransform to none when the label includes meaningful casing, versions, or abbreviations.",

data/app/pb_kits/playbook/pb_pill/docs/_playground.overrides.json

@@ -1,8 +1,4 @@
 {
-  "children": {
-    "editable": true,
-    "default": "<Flex alignItems=\"center\">\n  <Title color=\"success\" size={4} tag=\"div\" text=\"Complete\" />\n  <Icon color=\"success\" icon=\"check\" size=\"sm\" />\n</Flex>"
-  },
   "defaults": {
     "text": "neutral",
     "variant": "neutral",
@@ -74,14 +70,6 @@
         "textTransform": "none"
       },
       "children": ""
-    },
-    {
-      "name": "Children",
-      "props": {
-        "variant": "success",
-        "textTransform": "none"
-      },
-      "children": "<Flex alignItems=\"center\">\n  <Title color=\"success\" size={4} tag=\"div\" text=\"Complete\" />\n  <Icon color=\"success\" icon=\"check\" size=\"sm\" />\n</Flex>"
     }
   ],
   "conditionals": {},
@@ -96,11 +84,6 @@
       "message": "notification uses a solid primary fill by default. set variant to error for the red treatment.",
       "type": "info"
     },
-    "text": {
-      "presetName": "Children",
-      "message": "Clear text to render children. Passing text replaces children.",
-      "type": "info"
-    },
     "text_transform": {
       "presetName": "Preserve Casing",
       "message": "Set textTransform to none when the label includes meaningful casing, versions, or abbreviations.",

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

@@ -5,7 +5,6 @@ examples:
   - pill_variants: Variants
   - pill_size: Size
   - pill_notification: Notification
-  - pill_children: Children
   - pill_example: Example
  
   
@@ -15,7 +14,6 @@ examples:
   - pill_variants: Variants
   - pill_size: Size
   - pill_notification: Notification
-  - pill_children: Children
   - pill_example: Example
 
   swift:

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

@@ -3,4 +3,3 @@ export { default as PillVariants } from './_pill_variants.jsx'
 export { default as PillExample } from './_pill_example.jsx'
 export { default as PillSize } from './_pill_size.jsx'
 export { default as PillNotification } from './_pill_notification.jsx'
-export { default as PillChildren } from './_pill_children.jsx'

data/app/pb_kits/playbook/pb_pill/pill.html.erb

@@ -1,7 +1,3 @@
 <%= pb_content_tag do %>
-  <% if object.text %>
-    <%= pb_rails("title", props: { text: object.display_text, tag: "div", size: 4, classname: "pb_pill_text" }) %>
-  <% else %>
-    <%= content.presence %>
-  <% end %>
+  <%= pb_rails("title", props: { text: object.display_text, tag: "div", size: 4, classname: "pb_pill_text" }) %>
 <% end %>