chore(fondue): bump fondue to rc.12 (#1383)

* chore(fondue): bump fondue to rc.12

* add changeset

Author: ragi96

.changeset/yummy-rings-fix.md

@@ -0,0 +1,5 @@
+---
+"@frontify/guideline-blocks-settings": patch
+---
+
+chore: bump fondue to latest rc

package.json

@@ -30,7 +30,7 @@
         "@changesets/changelog-github": "^0.5.2",
         "@changesets/cli": "^2.29.8",
         "@cypress/vite-dev-server": "^7.0.1",
-        "@frontify/fondue": "^13.0.0-rc.11",
+        "@frontify/fondue": "^13.0.0-rc.12",
         "@types/react": "^18.3.27",
         "@vitejs/plugin-react": "^5.1.1",
         "cypress": "^15.7.1",

packages/guideline-blocks-settings/package.json

@@ -50,7 +50,7 @@
         "@dnd-kit/core": "^6.3.1",
         "@dnd-kit/modifiers": "^9.0.0",
         "@dnd-kit/sortable": "^10.0.0",
-        "@frontify/fondue": "^13.0.0-rc.11",
+        "@frontify/fondue": "^13.0.0-rc.12",
         "@frontify/sidebar-settings": "workspace:^",
         "@react-aria/focus": "^3.21.2",
         "@react-stately/overlays": "^3.6.20",

packages/guideline-blocks-settings/src/components/Attachments/AttachmentItem.tsx

@@ -2,7 +2,6 @@
 
 import { useSortable } from '@dnd-kit/sortable';
 import { type Asset, useAssetUpload, useFileInput } from '@frontify/app-bridge';
-import { FOCUS_STYLE } from '@frontify/fondue';
 import { LoadingCircle, Dropdown, Button } from '@frontify/fondue/components';
 import {
     IconArrowCircleUp,
@@ -75,6 +74,7 @@ export const AttachmentItem = forwardRef<HTMLButtonElement, AttachmentItemProps>
 
         return (
             <button
+                type="button"
                 aria-label="Download attachment"
                 data-test-id="attachments-item"
                 onClick={() => !selectedAsset && onDownload?.()}
@@ -107,6 +107,7 @@ export const AttachmentItem = forwardRef<HTMLButtonElement, AttachmentItemProps>
                         ])}
                     >
                         <button
+                            type="button"
                             {...focusProps}
                             {...draggableProps}
                             aria-label="Drag attachment"
@@ -115,7 +116,8 @@ export const AttachmentItem = forwardRef<HTMLButtonElement, AttachmentItemProps>
                                 isDragging || isOverlay
                                     ? 'tw-cursor-grabbing tw-bg-button-background-pressed hover:tw-bg-button-background-pressed'
                                     : 'tw-cursor-grab hover:tw-bg-button-background-hover',
-                                isFocusVisible && FOCUS_STYLE,
+                                isFocusVisible &&
+                                    'tw-ring-4 tw-ring-blue tw-ring-offset-2 dark:tw-ring-offset-black tw-outline-none',
                                 isFocusVisible && 'tw-z-[2]',
                             ])}
                         >

packages/guideline-blocks-settings/src/components/DownloadButton/DownloadButton.tsx

@@ -1,6 +1,5 @@
 /* (c) Copyright Frontify Ltd., all rights reserved. */
 
-import { FOCUS_STYLE } from '@frontify/fondue';
 import { Tooltip } from '@frontify/fondue/components';
 import { IconArrowCircleDown } from '@frontify/fondue/icons';
 import { useFocusRing } from '@react-aria/focus';
@@ -16,10 +15,15 @@ export const DownloadButton = ({ onDownload, ariaLabel }: DownloadButtonProps) =
         <Tooltip.Root enterDelay={500}>
             <Tooltip.Trigger asChild>
                 <button
+                    type="button"
                     tabIndex={0}
                     aria-label={ariaLabel ?? 'Download'}
                     {...focusProps}
-                    className={joinClassNames(['tw-outline-none tw-rounded', isFocused && FOCUS_STYLE])}
+                    className={joinClassNames([
+                        'tw-outline-none tw-rounded',
+                        isFocused &&
+                            'tw-ring-4 tw-ring-blue tw-ring-offset-2 dark:tw-ring-offset-black tw-outline-none',
+                    ])}
                     onClick={onDownload}
                     onPointerDown={(e) => e.preventDefault()}
                     data-test-id="download-button"