playbook_ui 13.8.0 → 13.9.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: d2eca7c20f8832218f6db41d2723db43b2350e59a7aad8334da3931c3c0bbb1a
-  data.tar.gz: ebc310683144bfef85d081ceb97d118a34974f77e172999fdbb448abaf30291b
+  metadata.gz: 3913dffced512fb212f3b0a4e1037abbf10a28420af5f13f666b62ac4b4a385d
+  data.tar.gz: c254328bfcb08db335a4c1a376cfbd83fc7f9eb981749a2041f6fd0394ab3a36
 SHA512:
-  metadata.gz: bf3e81b0e87cdb87c08ccff73734d1f1f29eb854d1472fcbef22a366529a6a8c94c4fd0951d4d21f053b1114e84bad839bc90a062c30a15caa3c70f98185da1b
-  data.tar.gz: 160a1bcfea2ba6353e6d0469fb9884deb3d28628063fad41bb7e1a2c5e92bac0d7ee45e4e78ab27e14b4b6e5bd584cba1ff3134e74b444064624b25533a5c73b
+  metadata.gz: 76ad54d6d06215fcc8ed33cf0186f8c6b23d850b21a2f58e99f5761a8eb33dfb9a8e7280692962134b53a0cb475663eba34fe7029394cdfa9e56b6ea905ddf6c
+  data.tar.gz: e897dae13452e396a6efda42c0d2ddeee117413c7bb9c9778fd781a024302c7946f420631c1cd9d01181ed132dc419a949356cc5a9541b6cc540583f4566134b

data/app/pb_kits/playbook/pb_button/_button.tsx

@@ -2,6 +2,7 @@ import React from 'react'
 import classnames from 'classnames'
 import { buildAriaProps, buildDataProps } from '../utilities/props'
 import { GlobalProps, globalProps } from '../utilities/globalProps'
+import { isValidEmoji } from '../utilities/validEmojiChecker'
 
 import Icon from '../pb_icon/_icon'
 import Caption from "../pb_caption/_caption"
@@ -38,12 +39,6 @@ type ButtonPropTypes = {
   wrapperClass?: string,
 } & GlobalProps
 
-const isValidEmoji = (emoji: string) => {
-  // Using regular expression to check if the string is a valid emoji/emoji Unicode
-  const emojiRegex = /^(\p{Emoji}|\uFE0F)+$/u;
-  return emojiRegex.test(emoji);
-};
-
 const buttonClassName = (props: ButtonPropTypes) => {
   const {
     disabled = false,

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

@@ -1,5 +1,5 @@
 <%= pb_rails("button", props: { count: 153, highlight: false, icon: "&#127881;", classname: "count", id: "reaction-button-highlight", variant: "reaction" }) %>
-<%= pb_rails("button", props: { count: 5, icon: "😍", variant: "reaction", margin_left: "lg" }) %>
+<%= pb_rails("button", props: { count: 5, icon: "1️⃣", variant: "reaction", margin_left: "lg" }) %>
 <%= pb_rails("button", props: { variant: "reaction", margin_left: "lg" }) %>
 <%= pb_rails("button", props: { icon: "user", variant: "reaction", margin_left: "lg" }) %>
 

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

@@ -19,7 +19,7 @@ return (
     />
     <Button
         count={5}
-        icon="😍"
+        icon="1️⃣"
         marginLeft='lg'
         tabIndex={0}
         variant="reaction"

data/app/pb_kits/playbook/pb_icon/_icon.tsx

@@ -2,6 +2,7 @@ import React from 'react'
 import classnames from 'classnames'
 import { buildAriaProps, buildDataProps } from '../utilities/props'
 import { GlobalProps, globalProps } from '../utilities/globalProps'
+import { isValidEmoji } from '../utilities/validEmojiChecker'
 
 export type IconSizes = "lg"
 | "xs"
@@ -104,13 +105,6 @@ const Icon = (props: IconProps) => {
   const ariaProps: {[key: string]: any} = buildAriaProps(aria)
   const dataProps: {[key: string]: any} = buildDataProps(data)
 
-  const isValidEmoji = (emoji: string) => {
-    // Using regular expression to check if the string is a valid emoji/emoji Unicode
-    const emojiRegex = /^(\p{Emoji}|\uFE0F)+$/u;
-    return emojiRegex.test(emoji);
-  };
-
-
   // Add a conditional here to show only the SVG if custom
   const displaySVG = (customIcon: any) => {
     if (customIcon)

data/app/pb_kits/playbook/pb_message/_message_mixins.scss

@@ -6,6 +6,7 @@
 
   .content_wrapper {
     width: 100%;
+    font-size: $font_base - 1;
 
     .pull-left {
       margin-left: $space-xs;

data/app/pb_kits/playbook/utilities/validEmojiChecker.ts

@@ -0,0 +1,6 @@
+export const isValidEmoji = (emoji: string) => {
+    // Using regular expression to check if the string is a valid emoji/emoji Unicode
+    const emojiRegex = /^(\p{Emoji}|\uFE0F|\u200D|\u20E3)+$/u;
+    return emojiRegex.test(emoji);
+  };
+