Merge release/v3.1.2 into main branch (#1236)

Author: github-actions[bot]

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@user-interviews/ui-design-system",
-  "version": "3.1.1",
+  "version": "3.1.2",
   "dependencies": {
     "@tiptap/core": "^2.3.1",
     "@tiptap/extension-bold": "^2.3.1",

src/Avatar/Avatar.tsx

@@ -16,18 +16,27 @@ type AvatarProps = {
   url?: string;
 };
 
-function Avatar(props: AvatarProps) {
+function Avatar({
+  ariaHidden,
+  colorId,
+  image,
+  initials,
+  large,
+  name = '',
+  showAlert,
+  url,
+}: AvatarProps) {
   const [imageLoadFailed, setImageLoadFailed] = useState(false);
 
   function onImageLoadError() {
     setImageLoadFailed(true);
   }
 
   function wrapIfUrlPresent(content) {
-    if (props.url) {
+    if (url) {
       return (
         <a
-          href={props.url}
+          href={url}
           rel="noopener noreferrer"
           target="_blank"
         >
@@ -38,36 +47,36 @@ function Avatar(props: AvatarProps) {
     return content;
   }
 
-  const displayImage = props.image && !imageLoadFailed;
+  const displayImage = image && !imageLoadFailed;
   const content = displayImage ? (
     <img
-      alt={props.name}
-      src={props.image}
+      alt={name}
+      src={image}
       onError={onImageLoadError}
     />
   ) : (
     <span className="Avatar__circle__initials">
-      {props.initials}
+      {initials}
     </span>
   );
 
   return (
     <div
-      aria-hidden={props.ariaHidden}
+      aria-hidden={ariaHidden}
       className={classNames(
         'Avatar',
-        { 'Avatar--large': props.large },
+        { 'Avatar--large': large },
       )}
     >
       <div
         className={classNames([
           'Avatar__circle',
-          { [uiModClassName(props.colorId)]: !!props.colorId },
+          { [uiModClassName(colorId)]: !!colorId },
         ])}
       >
         {wrapIfUrlPresent(content)}
       </div>
-      {props.showAlert && (
+      {showAlert && (
         <div className="Avatar__alert" />
       )}
     </div>

src/Container/Col.tsx

@@ -63,7 +63,7 @@ export const Col = ({
   xl,
   xs,
   xxl,
-  bsPrefix,
+  bsPrefix = 'col',
   ...props
 }: ColProps) => (
   <ReactBootstrapCol

src/Container/Container.tsx

@@ -27,7 +27,7 @@ export const Container = ({
   children,
   className,
   fluid,
-  bsPrefix,
+  bsPrefix = 'container',
   ...props
 }: ContainerProps) => (
   <ReactBootstrapContainer

src/Container/Row.tsx

@@ -63,7 +63,7 @@ export const Row = ({
   xl,
   xs,
   xxl,
-  bsPrefix,
+  bsPrefix = 'row',
   ...props
 }: RowProps) => (
   <ReactBootstrapRow

src/CopyToClipboardButton/CopyToClipboardButton.tsx

@@ -24,7 +24,7 @@ type CopyToClipboardButtonProps = {
 
 function CopyToClipboardButton({
   copyText = '',
-  displayText = undefined,
+  displayText,
   trackingEvent,
   variant = ButtonVariants.NEUTRAL,
 }: CopyToClipboardButtonProps) {

src/Drawer/Drawer.tsx

@@ -39,7 +39,7 @@ type DrawerProps = {
 
 const Drawer = ({
   behindNav = true,
-  children = undefined,
+  children,
   className = '',
   defaultExpanded = false,
   expandable = false,

src/Drawer/DrawerHeader.tsx

@@ -18,7 +18,7 @@ type DrawerHeaderProps = {
 };
 
 const DrawerHeader = ({
-  bordered,
+  bordered = true,
   title,
   onRequestClose,
 }: DrawerHeaderProps) => {

src/Dropdown/Dropdown.tsx

@@ -65,19 +65,19 @@ type DropdownProps = {
 } & RBDropdownProps;
 
 const Dropdown = ({
-  align,
+  align = 'start',
   as,
-  autoClose,
+  autoClose = true,
+  bsPrefix = 'dropdown',
   children,
   className,
   drop,
   flip,
   focusFirstItemOnShow,
-  navbar,
+  navbar = false,
   onSelect,
   onToggle,
   show,
-  bsPrefix,
   ...props
 }: DropdownProps) => (
   <RBDropdown

src/Dropdown/DropdownDivider.tsx

@@ -21,8 +21,8 @@ type DropdownDividerProps = {
 };
 
 const DropdownDivider = ({
-  as,
-  bsPrefix,
+  as = 'hr',
+  bsPrefix = 'dropdown',
   className,
 }: DropdownDividerProps) => (
   <RBDropdown.Divider