playbook_ui 14.12.0.pre.alpha.play1887homeaddressfix5910 → 14.12.0.pre.alpha.playrailsinputmaskissue5775

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: f334463a8c895b5718c4265377f2c1a031eb85ab2107c42b20bb126aa1a8db7b
-  data.tar.gz: 58c22a6fe27363f7dcbd5c189c10c225730fd4cec1676dabe044ecd9be51f4d2
+  metadata.gz: de7208175abf0a46f5e58efc8312394ab84fc8f454a224f8045676d48208a40a
+  data.tar.gz: 7b857a0d2a20366771b4847913b7839bc8e9d193bc02b3194e6a5cd506a7458a
 SHA512:
-  metadata.gz: bafe3f9038a558afdee04a9e66544653dc4f0ae651663d1843c6cfb9d2cd9165822a4c24aeeba845ecf708f155c7d6b69cebcab421f0bd213501544b0e8eb654
-  data.tar.gz: e18f1d32c6be05479b91f897076a680501a35818b8d9acf4ea5ca44fa29392875d436ac65eff3db9f27fa01516345982be900d4fcfcf5218b1ad8732567a4aa9
+  metadata.gz: cbf931fe07a9c9aaeea6298d2ad681d1f9cec77bb92602b0b2f687acc4c07acae6cb744fbea44b211edb5c154bc52a025c95bbda18f5d333d2c1755732015d8f
+  data.tar.gz: 643b4e402cb2b9a4b11bd637740fcc197eeefbfbacf37410da46f9ab5b4cb047333bdcf8a72b112afc7717b6afc57bd84cf1cd1c59829843efff643a05d7a6c1

data/app/pb_kits/playbook/pb_avatar/_avatar.scss

@@ -27,9 +27,6 @@ $avatar-sizes: (
       flex-basis: $size;
 
       & > [class^=pb_flex_kit] {
-        [class^=pb_card_kit] {
-          padding: 2px;
-        }
         [class^=pb_card_kit].overlay_bottom_center,
         [class^=pb_card_kit].overlay_top_center {
           left: 50%;
@@ -55,10 +52,6 @@ $avatar-sizes: (
         flex-grow: 0;
         flex-basis: $size;
 
-        .dark & {
-          background: $text_dk_light;
-        }
-
         &::before {
           content: attr(data-initials);
           width: 100%;
@@ -85,11 +78,9 @@ $avatar-sizes: (
       }
     }
   }
-
   &.dark {
     [class^=pb_card_kit] {
       position: absolute;
-      padding: 2px;
     }
   }
 }

data/app/pb_kits/playbook/pb_avatar/_avatar.tsx

@@ -23,8 +23,8 @@ export type AvatarProps = {
     variant?: string,
     icon?: string
   },
-  dark?: boolean,
   data?: {[key: string]: string},
+  dark?: boolean,
   htmlOptions?: {[key: string]: string | number | boolean | (() => void)},
   id?: string,
   imageAlt?: string,
@@ -71,13 +71,13 @@ const Avatar = (props: AvatarProps): React.ReactElement => {
 
   const canShowImage = imageUrl && !error
 
-  const onlineStatusSize =
+  const onlineStatusSize = 
     ['xxs', 'xs'].includes(size) ? 'sm' :
       ['sm', 'md'].includes(size) ? 'md' :
         ['lg', 'xl'].includes(size) ? 'lg' :
           'sm';
 
-  const onlineStatusPositionProps = (["xxs", "xs", "sm"].includes(size)) ?
+  const onlineStatusPositionProps = (["xxs", "xs", "sm"].includes(size)) ? 
     {
       top: { inset: true, value: "0" },
       right: { inset: false, value: "xxs" }
@@ -96,10 +96,10 @@ const Avatar = (props: AvatarProps): React.ReactElement => {
         id={id}
     >
       {componentOverlay ? (
-        <Flex display="display_inline_block"
+        <Flex display="display_inline_block" 
             position="relative"
         >
-          <div className="avatar_wrapper"
+          <div className="avatar_wrapper" 
               data-initials={initials}
           >
             {canShowImage && (
@@ -115,14 +115,12 @@ const Avatar = (props: AvatarProps): React.ReactElement => {
              <Card
                  borderNone
                  borderRadius="rounded"
-                 dark={dark}
                  padding="none"
                  position="absolute"
                  {...getPlacementProps(componentOverlay.placement, size)}
              >
-
+    
             <Badge
-                dark={dark}
                 rounded
                 text={componentOverlay.text}
                 variant={componentOverlay.variant as "error" | "info" | "neutral" | "primary" | "success" | "warning" | "notification"}
@@ -133,13 +131,11 @@ const Avatar = (props: AvatarProps): React.ReactElement => {
             <Card
                 borderNone
                 borderRadius="rounded"
-                dark={dark}
                 htmlOptions={{style: {padding:"2px"}}}
                 position="absolute"
                 {...getPlacementProps(componentOverlay.placement, size)}
             >
               <IconCircle
-                  dark={dark}
                   icon={componentOverlay.icon}
                   size="xxs"
                   variant={componentOverlay.variant as "default" | "royal" | "blue" | "purple" | "teal" | "red" | "yellow" | "orange" | "green"}
@@ -149,7 +145,7 @@ const Avatar = (props: AvatarProps): React.ReactElement => {
         </Flex>
       ) : (
         <>
-          <div className="avatar_wrapper"
+          <div className="avatar_wrapper" 
               data-initials={initials}
           >
             {canShowImage && (

data/app/pb_kits/playbook/pb_avatar/avatar.html.erb

@@ -1,22 +1,22 @@
 
 <%= object.pb_content_tag(:div, data: object.data.merge(initials: object.initials)) do %>
   <% if object.component_overlay && object.component_overlay[:component] == "icon_circle" %>
-    <%= pb_rails("flex", props: { display: "display_inline_block", position: "relative" }) do %>
+    <%= pb_rails("flex", props: {display: "display_inline_block", position: "relative" }) do %>
       <%= content_tag(:div, data: { initials: object.initials }, class: "avatar_wrapper") do %>
         <%= pb_rails("image", props: { alt: object.alt_text, url: object.image_url, on_error: object.handle_img_error }) if object.image_url.present? %>
       <% end %>
-      <%= pb_rails("card", props: { border_none: true, border_radius: "rounded", dark: object.dark, position: "absolute" }.merge(specific_placement_style)) do %>
+      <%= pb_rails("card", props: { border_none: true, border_radius: "rounded", html_options: { style: "padding: 2px" }, position: "absolute" }.merge(specific_placement_style)) do %>
         
-        <%= pb_rails("icon_circle", props: { dark: object.dark, size: "xxs", icon: object.component_overlay[:icon], variant: object.component_overlay[:variant] }) %>
+        <%= pb_rails("icon_circle", props: { size: "xxs", icon: object.component_overlay[:icon], variant: object.component_overlay[:variant] }) %>
       <% end %>  
   <% end %>
   <% elsif object.component_overlay && object.component_overlay[:component] == "badge" %>
-  <%= pb_rails("flex", props: { display: "display_inline_block", position: "relative" }) do %>
+  <%= pb_rails("flex", props: {display: "display_inline_block", position: "relative" }) do %>
     <%= content_tag(:div, data: { initials: object.initials }, class: "avatar_wrapper") do %>
       <%= pb_rails("image", props: { alt: object.alt_text, url: object.image_url, on_error: object.handle_img_error }) if object.image_url.present? %>
     <% end %>
-    <%= pb_rails("card", props: { border_none: true, border_radius: "rounded", dark: object.dark, padding: "none", position: "absolute" }.merge(specific_placement_style)) do %>
-    <%= pb_rails("badge", props: { dark: object.dark, rounded: true, text: object.component_overlay[:text], variant: object.component_overlay[:variant] }) %>
+    <%= pb_rails("card", props: { border_none: true, border_radius: "rounded", padding: "none", position: "absolute" }.merge(specific_placement_style)) do %>
+    <%= pb_rails("badge", props: { rounded: true, text: object.component_overlay[:text], variant: object.component_overlay[:variant] }) %>
     <% end %>
     <% end %>
   <% else %>
@@ -26,3 +26,4 @@
     <%= pb_rails("online_status", props: object.online_status_props) if object.status %>
   <% end %>
 <% end %>
+

data/app/pb_kits/playbook/pb_avatar/docs/_avatar_badge_component_overlay.jsx

@@ -1,19 +1,18 @@
 import React from "react";
 import { Avatar } from 'playbook-ui'
 
-const AvatarBadgeComponentOverlay = (props) => {
+const AvatarBadgeComponentOverlay = () => {
     return (
         <div>
             <Avatar
                 componentOverlay={{
                     component: "badge",
                     placement: "bottom-right",
-                    text: "12",
+                    text: "12"
                 }}
                 imageUrl="https://randomuser.me/api/portraits/men/44.jpg"
                 marginBottom="sm"
                 size="sm"
-                {...props}
             />
 
             <Avatar
@@ -25,8 +24,6 @@ const AvatarBadgeComponentOverlay = (props) => {
                 imageUrl="https://randomuser.me/api/portraits/men/44.jpg"
                 marginBottom="sm"
                 size="md"
-                {...props}
-
             />
 
             <Avatar
@@ -39,8 +36,6 @@ const AvatarBadgeComponentOverlay = (props) => {
                 imageUrl="https://randomuser.me/api/portraits/men/44.jpg"
                 marginBottom="sm"
                 size="lg"
-                {...props}
-
             />
 
             <Avatar
@@ -53,8 +48,7 @@ const AvatarBadgeComponentOverlay = (props) => {
                 imageUrl="https://randomuser.me/api/portraits/men/44.jpg"
                 marginBottom="sm"
                 size="xl"
-                {...props}
-            />
+            /> 
         </div>
     )
 }

data/app/pb_kits/playbook/pb_avatar/docs/_avatar_circle_icon_component_overlay.jsx

@@ -1,7 +1,7 @@
 import React from "react";
 import { Avatar } from 'playbook-ui'
 
-const AvatarCircleIconComponentOverlay = (props) => {
+const AvatarCircleIconComponentOverlay = () => {
     return (
         <div>
         <Avatar
@@ -14,7 +14,6 @@ const AvatarCircleIconComponentOverlay = (props) => {
             imageUrl="https://randomuser.me/api/portraits/men/44.jpg"
             marginBottom="sm"
             size="sm"
-            {...props}
         />
 
         <Avatar
@@ -27,7 +26,6 @@ const AvatarCircleIconComponentOverlay = (props) => {
             imageUrl="https://randomuser.me/api/portraits/men/44.jpg"
             marginBottom="sm"
             size="md"
-            {...props}
         />
 
         <Avatar
@@ -40,7 +38,6 @@ const AvatarCircleIconComponentOverlay = (props) => {
             imageUrl="https://randomuser.me/api/portraits/men/44.jpg"
             marginBottom="sm"
             size="lg"
-            {...props}
         />
 
         <Avatar
@@ -53,8 +50,7 @@ const AvatarCircleIconComponentOverlay = (props) => {
             imageUrl="https://randomuser.me/api/portraits/men/44.jpg"
             marginBottom="sm"
             size="xl"
-            {...props}
-        />
+        /> 
     </div>
     )
 }

data/app/pb_kits/playbook/pb_button/button.rb

@@ -65,7 +65,7 @@ module Playbook
       end
 
       def tag
-        link && !disabled ? "a" : "button"
+        link ? "a" : "button"
       end
 
       def valid_emoji(icon)

data/app/pb_kits/playbook/pb_copy_button/_copy_button.scss

@@ -1,4 +1,3 @@
 .pb_copy_button_kit {
-  width: fit-content;
-  height: fit-content;
+
 }

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

@@ -1,8 +1,8 @@
 examples:
-  rails:
-  - copy_button_default: Default
-  - copy_button_from: Copy From
+  
   
   react:
   - copy_button_default: Default
   - copy_button_from: Copy From
+  
+  

data/app/pb_kits/playbook/pb_file_upload/file_upload.html.erb

@@ -1,4 +1,9 @@
-<%= pb_content_tag(:div) do %>
+<%= content_tag("div",
+    aria: object.aria,
+    class: object.classname,
+    data: object.data,
+    id: object.id,
+    **combined_html_options) do %>
       <%= pb_rails("form_group", props: {cursor: "pointer", full_width: object.full_width}) do %>
         <label
           for="upload-<%= object.id %>"

data/app/pb_kits/playbook/pb_filter/filter.html.erb

@@ -1,4 +1,8 @@
-<%= pb_content_tag(:div) do %>
+<%= content_tag(:div,
+    id: object.id,
+    data: object.data,
+    class: object.classname,
+    **combined_html_options) do %>
     <%= object.wrapper do %>
       <%= pb_rails("flex", props: { orientation: "row", padding_right: "lg", vertical: "center" }) do %>
         <% if (object.template != "sort_only") %>

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

@@ -5,7 +5,6 @@ examples:
   - fixed_confirmation_toast_multi_line: Multi Line
   - fixed_confirmation_toast_close: Click to Close
   - fixed_confirmation_toast_positions: Click to Show Positions
-  - fixed_confirmation_toast_auto_close: Click to Show Auto Close
   - fixed_confirmation_toast_children: Children
   - fixed_confirmation_toast_custom_icon: Custom Icon
   

data/app/pb_kits/playbook/pb_fixed_confirmation_toast/index.js

@@ -2,18 +2,16 @@ import PbEnhancedElement from '../pb_enhanced_element'
 
 export default class PbFixedConfirmationToast extends PbEnhancedElement {
   static get selector() {
-    return '[class*="pb_fixed_confirmation_toast_kit"]'
+    return '.remove_toast'
   }
 
   connect() {
     this.self = this.element
     this.autoCloseToast(this.self)
 
-    if (this.self.classList.contains('remove_toast')) {
-      this.self.addEventListener('click', () => {
-        this.removeToast(this.self)
-      })
-    }
+    this.self.addEventListener('click', () => {
+      this.removeToast(this.self)
+    })
   }
 
   removeToast(elem) {
@@ -34,4 +32,4 @@ export default class PbFixedConfirmationToast extends PbEnhancedElement {
       }, autoCloseIntValue)
     }
   }
-}
+}

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

@@ -1,3 +1,8 @@
-<%= pb_content_tag(:div) do %>
+<%= content_tag(:div,
+    aria: object.aria,
+    class: object.classname,
+    data: object.data,
+    id: object.id,
+    **combined_html_options) do %>
   <%= content.presence %>
 <% end %>

data/app/pb_kits/playbook/pb_form_pill/form_pill.html.erb

@@ -1,4 +1,4 @@
-<%= pb_content_tag(:div, class: object.classname + object.size_class, tabindex: object.tabindex) do %>
+<%= content_tag(:div, id: object.id, data: object.data, class: object.classname + object.size_class, tabindex: object.tabindex, **combined_html_options) do %>
   <% if object.name.present? %>
     <%= pb_rails("avatar", props: { name: object.name, image_url: object.avatar_url, size: "xxs" }) %>
     <% if object.truncate %>

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

@@ -18,7 +18,6 @@ type HomeAddressStreetProps = {
   className?: string,
   data?: { [key: string]: string },
   dark?: boolean,
-  preserveCase?: boolean,
   emphasis: "street" | "city" | "none",
   htmlOptions?: {[key: string]: string | number | boolean | (() => void)},
   homeId: string,
@@ -44,7 +43,6 @@ const HomeAddressStreet = (props: HomeAddressStreetProps): React.ReactElement =>
     htmlOptions = {},
     homeId,
     homeUrl,
-    preserveCase = false,
     target,
     newWindow,
     houseStyle,
@@ -79,8 +77,6 @@ const HomeAddressStreet = (props: HomeAddressStreetProps): React.ReactElement =>
     return null
   }
 
-  const formatStreetAdr = (address: string): string => preserveCase ? address : titleize(address)
-
   return (
     <div
         className={classes(className, dark)}
@@ -95,7 +91,7 @@ const HomeAddressStreet = (props: HomeAddressStreetProps): React.ReactElement =>
               dark={dark}
               size={4}
           >
-            {joinPresent([formatStreetAdr(address), houseStyle], ' · ')}
+            {joinPresent([titleize(address), houseStyle], ' · ')}
           </Title>
           <Title
               className="pb_home_address_street_address"
@@ -105,14 +101,14 @@ const HomeAddressStreet = (props: HomeAddressStreetProps): React.ReactElement =>
             {titleize(addressCont)}
           </Title>
           <Body color="light">
-            {`${titleize(city)}, ${state.toUpperCase()} ${zipcode}`}
+            {`${titleize(city)}, ${state} ${zipcode}`}
           </Body>
         </div>
       }
       {emphasis == 'city' &&
         <div>
           <Body color="light">
-            {joinPresent([formatStreetAdr(address), houseStyle], ' · ')}
+            {joinPresent([titleize(address), houseStyle], ' · ')}
           </Body>
           <Body color="light">{titleize(addressCont)}</Body>
           <div>
@@ -122,7 +118,7 @@ const HomeAddressStreet = (props: HomeAddressStreetProps): React.ReactElement =>
                 size={4}
                 tag="span"
             >
-              {`${titleize(city)}, ${state.toUpperCase()}`}
+              {`${titleize(city)}, ${state}`}
             </Title>
             <Body
                 color="light"
@@ -136,15 +132,15 @@ const HomeAddressStreet = (props: HomeAddressStreetProps): React.ReactElement =>
       {emphasis == 'none' &&
         <div>
           <Body dark={dark}>
-            {joinPresent([formatStreetAdr(address), houseStyle], ' · ')}
+            {joinPresent([titleize(address), houseStyle], ' · ')}
           </Body>
-          <Body dark={dark}>{formatStreetAdr(addressCont)}</Body>
+          <Body dark={dark}>{titleize(addressCont)}</Body>
           <div>
             <Body
                 color="light"
                 dark={dark}
               >
-            {`${titleize(city)}, ${state.toUpperCase()} ${zipcode}`}
+            {`${titleize(city)}, ${state} ${zipcode}`}
           </Body>
           </div>
         </div>

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

@@ -5,14 +5,12 @@ examples:
   - home_address_street_emphasis: Emphasis
   - home_address_street_modified: Modified
   - home_address_street_link: Link
-  - home_address_street_formatting: Formatting
 
   react:
   - home_address_street_default: Default
   - home_address_street_emphasis: Emphasis
   - home_address_street_modified: Modified
   - home_address_street_link: Link
-  - home_address_street_formatting: Formatting
 
   swift:
   - home_address_street_default_swift: Default

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

@@ -2,4 +2,3 @@ export { default as HomeAddressStreetDefault } from './_home_address_street_defa
 export { default as HomeAddressStreetEmphasis } from './_home_address_street_emphasis.jsx'
 export { default as HomeAddressStreetModified } from './_home_address_street_modified.jsx'
 export { default as HomeAddressStreetLink } from './_home_address_street_link.jsx'
-export { default as HomeAddressStreetFormatting } from './_home_address_street_formatting.jsx'

data/app/pb_kits/playbook/pb_home_address_street/home_address_street.rb

@@ -18,7 +18,6 @@ module Playbook
       prop :state
       prop :zipcode
       prop :territory
-      prop :preserve_case, default: false
       prop :dark, type: Playbook::Props::Boolean, default: false
 
       def classname
@@ -30,7 +29,7 @@ module Playbook
       end
 
       def city_state
-        [city&.titleize, state&.upcase].join(", ")
+        [city&.titleize, state].join(", ")
       end
 
       def zip
@@ -38,7 +37,7 @@ module Playbook
       end
 
       def address_house_style
-        [format_street_address, house_style].join(separator)
+        [address&.titleize, house_style].join(separator)
       end
 
       def address_house_style2
@@ -49,16 +48,6 @@ module Playbook
         house_style ? " \u00b7 " : ""
       end
 
-      def format_street_address
-        preserve_case ? address : custom_titleize(address)
-      end
-
-      def custom_titleize(str)
-        return "" if str.nil?
-
-        str.split(" ").map(&:capitalize).join(" ")
-      end
-
       def city_emphasis_props
         {
           address_house_style: address_house_style,

data/app/pb_kits/playbook/pb_link/_link.tsx

@@ -19,9 +19,7 @@ type LinkProps = {
   icon?: string,
   iconRight?: string,
   id?: string,
-  tabIndex?: number,
   tag?: 'a' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'p' | 'span' | 'div',
-  target?: string,
   text?: string,
   underline?: boolean,
 } & GlobalProps
@@ -39,9 +37,7 @@ const Link = (props: LinkProps): React.ReactElement => {
     icon = '',
     iconRight = '',
     id = '',
-    tabIndex,
     tag = 'a',
-    target = '',
     text = '',
     underline = false,
   } = props
@@ -56,14 +52,6 @@ const Link = (props: LinkProps): React.ReactElement => {
   )
   const Tag = tag as keyof JSX.IntrinsicElements
 
-  const getTargetAttribute = () => {
-    if (target && href) {
-      return target
-    }
-
-    return undefined
-  }
-
   const renderContent = () => (
     <>
       {icon && (
@@ -99,9 +87,6 @@ const Link = (props: LinkProps): React.ReactElement => {
       <a
           {...commonProps}
           href={href}
-          rel={target !== 'child' ? 'noreferrer' : undefined}
-          tabIndex={tabIndex}
-          target={getTargetAttribute()}
       >
         {renderContent()}
       </a>
@@ -111,9 +96,6 @@ const Link = (props: LinkProps): React.ReactElement => {
       <a
           {...commonProps}
           href={href}
-          rel={target !== 'child' ? 'noreferrer' : undefined}
-          tabIndex={tabIndex}
-          target={getTargetAttribute()}
       >
         <Tag>{renderContent()}</Tag>
       </a>

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

@@ -1,18 +1,16 @@
 examples:
-
+  
   rails:
   - link_color: Color
   - link_underline: Underline
   - link_icon: Icon
   - link_disabled: Disabled
   - link_tag: Tag
-  - link_target: Target
-
-
+  
+  
   react:
   - link_color: Color
   - link_underline: Underline
   - link_icon: Icon
   - link_disabled: Disabled
   - link_tag: Tag
-  - link_target: Target

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

@@ -2,5 +2,4 @@ export { default as LinkColor } from './_link_color.jsx'
 export { default as LinkUnderline } from './_link_underline.jsx'
 export { default as LinkIcon } from './_link_icon.jsx'
 export { default as LinkDisabled } from './_link_disabled.jsx'
-export { default as LinkTag } from './_link_tag.jsx'
-export { default as LinkTarget } from './_link_target.jsx'
+export { default as LinkTag } from './_link_tag.jsx'

data/app/pb_kits/playbook/pb_link/link.html.erb

@@ -9,7 +9,7 @@
 <% end %>
 
 <% if object.tag == "a" %>
-  <%= pb_content_tag(object.tag, { href: object.href, target: object.target }) do %>
+  <%= pb_content_tag(object.tag, { href: object.href }) do %>
     <%= link_content.call %>
   <% end %>
 <% else %>

data/app/pb_kits/playbook/pb_link/link.rb

@@ -11,11 +11,9 @@ module Playbook
       prop :href
       prop :icon
       prop :icon_right
-      prop :tabindex
       prop :tag, type: Playbook::Props::Enum,
                  values: %w[a h1 h2 h3 h4 h5 h6 p span div],
                  default: "a"
-      prop :target
       prop :text
       prop :underline, type: Playbook::Props::Boolean,
                        default: false
@@ -28,10 +26,6 @@ module Playbook
         text
       end
 
-      def target_attribute
-        target if target && href
-      end
-
     private
 
       def color_class

data/app/pb_kits/playbook/pb_link/link.test.jsx

@@ -90,33 +90,3 @@ test('adds icon right', () => {
   const icon = kit.querySelector('.pb_icon_kit')
   expect(icon).toBeInTheDocument();
 })
-
-test('should render target prop', () => {
-  render(
-      <Link
-          data={{ testid: 'target-test' }}
-          href="https://playbook.powerapp.cloud/"
-          target="blank"
-      />
-  )
-
-  const kit = screen.getByTestId('target-test')
-
-  expect(kit).toHaveAttribute('target', 'blank')
-})
-
-
-test('should render child target prop', () => {
-  render(
-      <Link
-          data={{ testid: 'target-test' }}
-          href="https://playbook.powerapp.cloud/"
-          tabIndex={0}
-          target="child"
-      />
-  )
-
-  const kit = screen.getByTestId('target-test')
-
-  expect(kit).toHaveAttribute('target', 'child')
-})