@frontify/guideline-blocks-settings 0.32.1 → 0.33.0

package/src/components/BlockItemWrapper/Toolbar/ToolbarButtonTooltip.tsx

@@ -0,0 +1,25 @@
+/* (c) Copyright Frontify Ltd., all rights reserved. */
+
+import { LegacyTooltip as Tooltip, TooltipPosition } from '@frontify/fondue';
+import { ReactElement, ReactNode } from 'react';
+
+type ToolbarButtonTooltipProps = {
+    content: ReactNode;
+    children: ReactElement;
+    open?: boolean;
+    disabled?: boolean;
+};
+
+export const ToolbarButtonTooltip = ({ open, content, children, disabled }: ToolbarButtonTooltipProps) => (
+    <Tooltip
+        withArrow
+        hoverDelay={0}
+        enterDelay={300}
+        open={open}
+        disabled={disabled}
+        position={TooltipPosition.Top}
+        content={<div>{content}</div>}
+        triggerElement={children}
+        data-test-id="toolbar-button-tooltip"
+    />
+);

package/src/components/BlockItemWrapper/Toolbar/context/DragPreviewContext.tsx

@@ -0,0 +1,15 @@
+/* (c) Copyright Frontify Ltd., all rights reserved. */
+
+import { type ReactNode, createContext, useContext } from 'react';
+
+const DragPreviewContext = createContext(false);
+
+export const DragPreviewContextProvider = ({
+    children,
+    isDragPreview,
+}: {
+    children: ReactNode;
+    isDragPreview: boolean;
+}) => <DragPreviewContext.Provider value={isDragPreview}>{children}</DragPreviewContext.Provider>;
+
+export const useDragPreviewContext = () => useContext(DragPreviewContext);

package/src/components/BlockItemWrapper/Toolbar/context/MultiFlyoutContext.tsx

@@ -0,0 +1,25 @@
+/* (c) Copyright Frontify Ltd., all rights reserved. */
+
+import { Dispatch, ReactNode, SetStateAction, createContext, useContext, useMemo } from 'react';
+
+export type MultiFlyoutContextType = {
+    openFlyoutIds: string[];
+    setOpenFlyoutIds: Dispatch<SetStateAction<string[]>>;
+};
+
+const MultiFlyoutContext = createContext<MultiFlyoutContextType>({
+    openFlyoutIds: [],
+    setOpenFlyoutIds: () => console.error('No MultiFlyoutContext Provider found'),
+});
+
+export const MultiFlyoutContextProvider = ({
+    children,
+    openFlyoutIds,
+    setOpenFlyoutIds,
+}: { children: ReactNode } & MultiFlyoutContextType) => {
+    const memoizedContext = useMemo(() => ({ openFlyoutIds, setOpenFlyoutIds }), [openFlyoutIds, setOpenFlyoutIds]);
+
+    return <MultiFlyoutContext.Provider value={memoizedContext}>{children}</MultiFlyoutContext.Provider>;
+};
+
+export const useMultiFlyoutContext = () => useContext(MultiFlyoutContext);

package/src/components/BlockItemWrapper/Toolbar/context/index.ts

@@ -0,0 +1,4 @@
+/* (c) Copyright Frontify Ltd., all rights reserved. */
+
+export * from './DragPreviewContext';
+export * from './MultiFlyoutContext';

package/src/components/BlockItemWrapper/Toolbar/helpers.ts

@@ -25,7 +25,7 @@ export const getToolbarButtonClassNames = (cursor: 'grab' | 'pointer', forceActi
         classNames.push(
             'hover:tw-bg-box-neutral-hover active:tw-bg-box-neutral-pressed',
             'tw-text-text-weak hover:tw-text-box-neutral-inverse-hover active:tw-text-box-neutral-inverse-pressed',
-            cursor === 'grab' ? 'tw-cursor-grab active:tw-cursor-grabbing' : 'tw-cursor-pointer',
+            cursor === 'grab' ? '!tw-cursor-grab active:tw-cursor-grabbing' : 'tw-cursor-pointer',
         );
     }
 

package/src/components/BlockItemWrapper/Toolbar/hooks/index.ts

@@ -0,0 +1,3 @@
+/* (c) Copyright Frontify Ltd., all rights reserved. */
+
+export * from './useMultiFlyoutState';

package/src/components/BlockItemWrapper/Toolbar/hooks/useMultiFlyoutState.spec.tsx

@@ -0,0 +1,59 @@
+/* (c) Copyright Frontify Ltd., all rights reserved. */
+
+import { renderHook } from '@testing-library/react';
+import { describe, expect, it, vi } from 'vitest';
+import { useMultiFlyoutState } from './useMultiFlyoutState';
+import { MultiFlyoutContextProvider, MultiFlyoutContextType } from '../context/MultiFlyoutContext';
+
+const FLYOUT_ID = 'flyout';
+
+const renderMultiFlyoutState = ({ openFlyoutIds, setOpenFlyoutIds }: MultiFlyoutContextType) =>
+    renderHook(() => useMultiFlyoutState(FLYOUT_ID), {
+        wrapper: ({ children }) => (
+            <MultiFlyoutContextProvider openFlyoutIds={openFlyoutIds} setOpenFlyoutIds={setOpenFlyoutIds}>
+                {children}
+            </MultiFlyoutContextProvider>
+        ),
+    });
+
+describe('useMultiFlyoutState', () => {
+    it('should be open when flyout id in context array', () => {
+        const { result } = renderMultiFlyoutState({ openFlyoutIds: [FLYOUT_ID], setOpenFlyoutIds: vi.fn() });
+        expect(result.current.isOpen).toEqual(true);
+    });
+
+    it('should be closed when flyout id is not in context array', () => {
+        const { result } = renderMultiFlyoutState({ openFlyoutIds: [], setOpenFlyoutIds: vi.fn() });
+        expect(result.current.isOpen).toEqual(false);
+    });
+
+    it('should add id to array when opening', () => {
+        const setOpenFlyoutIdsStub = vi.fn();
+        const { result } = renderMultiFlyoutState({ openFlyoutIds: [], setOpenFlyoutIds: setOpenFlyoutIdsStub });
+
+        result.current.onOpenChange(true);
+        const dispatchedResult = setOpenFlyoutIdsStub.mock.lastCall[0]([]);
+
+        expect(dispatchedResult).toEqual([FLYOUT_ID]);
+    });
+
+    it('should remove id from array when closing', () => {
+        const setOpenFlyoutIdsStub = vi.fn();
+        const { result } = renderMultiFlyoutState({ openFlyoutIds: [], setOpenFlyoutIds: setOpenFlyoutIdsStub });
+
+        result.current.onOpenChange(false);
+        const dispatchedResult = setOpenFlyoutIdsStub.mock.lastCall[0]([FLYOUT_ID]);
+
+        expect(dispatchedResult).toEqual([]);
+    });
+
+    it('should remove duplicates from array', () => {
+        const setOpenFlyoutIdsStub = vi.fn();
+        const { result } = renderMultiFlyoutState({ openFlyoutIds: [], setOpenFlyoutIds: setOpenFlyoutIdsStub });
+
+        result.current.onOpenChange(true);
+        const dispatchedResult = setOpenFlyoutIdsStub.mock.lastCall[0]([FLYOUT_ID, FLYOUT_ID, FLYOUT_ID]);
+
+        expect(dispatchedResult).toEqual([FLYOUT_ID]);
+    });
+});

package/src/components/BlockItemWrapper/Toolbar/hooks/useMultiFlyoutState.ts

@@ -0,0 +1,24 @@
+/* (c) Copyright Frontify Ltd., all rights reserved. */
+
+import { useCallback } from 'react';
+import { useMultiFlyoutContext } from '../context/MultiFlyoutContext';
+
+export const useMultiFlyoutState = (flyoutId: string) => {
+    const { openFlyoutIds, setOpenFlyoutIds } = useMultiFlyoutContext();
+
+    const onOpenChange = useCallback(
+        (isFlyoutOpen: boolean) => {
+            setOpenFlyoutIds((currentIds) => {
+                const filteredIds = currentIds.filter((id) => id !== flyoutId);
+                if (!isFlyoutOpen) {
+                    return filteredIds;
+                } else {
+                    return [...filteredIds, flyoutId];
+                }
+            });
+        },
+        [flyoutId, setOpenFlyoutIds],
+    );
+
+    return { isOpen: openFlyoutIds.includes(flyoutId), onOpenChange };
+};

package/src/components/BlockItemWrapper/Toolbar/index.ts

@@ -1,4 +1,10 @@
 /* (c) Copyright Frontify Ltd., all rights reserved. */
 
+export * from './context';
+export * from './hooks';
 export * from './Toolbar';
+export * from './AttachmentsToolbarButton';
+export * from './DragHandleToolbarButton';
+export * from './FlyoutToolbarButton';
+export * from './MenuToolbarButton';
 export * from './types';

package/src/components/BlockItemWrapper/Toolbar/types.ts

@@ -1,38 +1,18 @@
 /* (c) Copyright Frontify Ltd., all rights reserved. */
 
-import { type MenuItemStyle } from '@frontify/fondue';
+import { type ToolbarButtonProps } from './ToolbarButton';
+import { type DragHandleToolbarButtonProps } from './DragHandleToolbarButton';
+import { type FlyoutToolbarButtonProps } from './FlyoutToolbarButton';
+import { type MenuToolbarButtonProps } from './MenuToolbarButton';
 
 export type ToolbarProps = {
     items: ToolbarItem[];
-    flyoutMenu: ToolbarFlyoutState & { items: FlyoutToolbarItem[][] };
-    attachments: ToolbarFlyoutState & { isEnabled: boolean };
-    isDragging?: boolean;
+    attachments: { isEnabled: boolean };
 };
 
-export type ToolbarFlyoutState = {
-    isOpen: boolean;
-    onOpenChange: (isOpen: boolean) => void;
-};
-
-type BaseToolbarItem = {
-    icon: JSX.Element;
-    tooltip?: string;
-};
-
-type DraghandleToolbarItem = BaseToolbarItem & {
-    draggableProps: Record<string, unknown>;
-    setActivatorNodeRef?: (node: HTMLElement | null) => void;
-};
+export type DragHandleToolbarItem = { type: 'dragHandle' } & DragHandleToolbarButtonProps;
+export type ButtonToolbarItem = { type: 'button' } & ToolbarButtonProps;
+export type FlyoutToolbarItem = { type: 'flyout' } & FlyoutToolbarButtonProps;
+export type MenuToolbarItem = { type: 'menu' } & MenuToolbarButtonProps;
 
-type ButtonToolbarItem = BaseToolbarItem & {
-    onClick: () => void;
-};
-
-export type ToolbarItem = DraghandleToolbarItem | ButtonToolbarItem;
-
-export type FlyoutToolbarItem = {
-    title: string;
-    onClick: () => void;
-    icon: JSX.Element;
-    style?: MenuItemStyle;
-};
+export type ToolbarItem = DragHandleToolbarItem | ButtonToolbarItem | FlyoutToolbarItem | MenuToolbarItem;

package/src/components/BlockItemWrapper/types.ts

@@ -4,14 +4,13 @@ import { type ReactNode } from 'react';
 
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
 import { type AttachmentsProvider, type withAttachmentsProvider } from '../../hooks/useAttachments';
-import { type FlyoutToolbarItem, type ToolbarItem } from './Toolbar';
+import { type ToolbarItem } from './Toolbar';
 
 export type BlockItemWrapperProps = {
     children: ReactNode;
     shouldHideWrapper?: boolean;
     shouldHideComponent?: boolean;
     toolbarItems: (ToolbarItem | undefined)[];
-    toolbarFlyoutItems: FlyoutToolbarItem[][];
     isDragging?: boolean;
     shouldFillContainer?: boolean;
     outlineOffset?: number;

package/src/helpers/mapColorPalettes.spec.ts

@@ -2,6 +2,7 @@
 
 import { describe, expect, it } from 'vitest';
 import { mapAppBridgeColorPalettesToFonduePalettes } from './mapColorPalettes';
+import { ColorDummy } from '@frontify/app-bridge';
 
 describe('mapAppBridgeColorPalettesToFonduePalettes', () => {
     it('should map app bridge color palette to fondue palette', () => {
@@ -10,107 +11,7 @@ describe('mapAppBridgeColorPalettesToFonduePalettes', () => {
                 id: 19,
                 name: 'Awesome color palette',
                 description: 'This is an awesome color palette',
-                colors: [
-                    {
-                        id: 6,
-                        name: 'Tarawera',
-                        sort: 1,
-                        nameCss: 'tarawera',
-                        hex: '0b486b',
-                        red: 11,
-                        green: 72,
-                        blue: 107,
-                        alpha: 255,
-                        hue: 202,
-                        saturation: 81,
-                        lightness: 23,
-                        c: 90,
-                        m: 33,
-                        y: 0,
-                        k: 58,
-                        pantone: null,
-                        ral: null,
-                        oracal: null,
-                        pantoneCoated: null,
-                        pantoneUncoated: null,
-                        cmykCoated: null,
-                        cmykUncoated: null,
-                        cmykNewspaper: null,
-                        ncs: null,
-                        pantoneCp: null,
-                        pantonePlastics: null,
-                        pantoneTextile: null,
-                        hks: null,
-                        threeM: null,
-                        lab: null,
-                    },
-                    {
-                        id: 7,
-                        name: 'Oracle',
-                        sort: 2,
-                        nameCss: 'oracle',
-                        hex: '3b8686',
-                        red: 59,
-                        green: 134,
-                        blue: 134,
-                        alpha: 255,
-                        hue: 180,
-                        saturation: 39,
-                        lightness: 38,
-                        c: 56,
-                        m: 0,
-                        y: 0,
-                        k: 47,
-                        pantone: null,
-                        ral: null,
-                        oracal: null,
-                        pantoneCoated: null,
-                        pantoneUncoated: null,
-                        cmykCoated: null,
-                        cmykUncoated: null,
-                        cmykNewspaper: null,
-                        ncs: null,
-                        pantoneCp: null,
-                        pantonePlastics: null,
-                        pantoneTextile: null,
-                        hks: null,
-                        threeM: null,
-                        lab: null,
-                    },
-                    {
-                        id: 8,
-                        name: 'Silver Tree',
-                        sort: 3,
-                        nameCss: 'silver-tree',
-                        hex: '79bd9a',
-                        red: 121,
-                        green: 189,
-                        blue: 154,
-                        alpha: 255,
-                        hue: 149,
-                        saturation: 34,
-                        lightness: 61,
-                        c: 36,
-                        m: 0,
-                        y: 19,
-                        k: 26,
-                        pantone: null,
-                        ral: null,
-                        oracal: null,
-                        pantoneCoated: null,
-                        pantoneUncoated: null,
-                        cmykCoated: null,
-                        cmykUncoated: null,
-                        cmykNewspaper: null,
-                        ncs: null,
-                        pantoneCp: null,
-                        pantonePlastics: null,
-                        pantoneTextile: null,
-                        hks: null,
-                        threeM: null,
-                        lab: null,
-                    },
-                ],
+                colors: [ColorDummy.green(), ColorDummy.yellow(), ColorDummy.red()],
             },
         ]);
         expect(result).toEqual([
@@ -120,24 +21,24 @@ describe('mapAppBridgeColorPalettesToFonduePalettes', () => {
                 colors: [
                     {
                         alpha: 1,
-                        red: 11,
-                        green: 72,
-                        blue: 107,
-                        name: 'Tarawera',
+                        blue: 0,
+                        green: 255,
+                        red: 0,
+                        name: 'Green',
                     },
                     {
                         alpha: 1,
-                        red: 59,
-                        green: 134,
-                        blue: 134,
-                        name: 'Oracle',
+                        blue: 0,
+                        green: 255,
+                        red: 255,
+                        name: 'Yellow',
                     },
                     {
                         alpha: 1,
-                        red: 121,
-                        green: 189,
-                        blue: 154,
-                        name: 'Silver Tree',
+                        blue: 0,
+                        green: 0,
+                        red: 255,
+                        name: 'Red',
                     },
                 ],
             },

package/src/helpers/mapColorPalettes.ts

@@ -3,20 +3,63 @@
 import { ColorPalette } from '@frontify/app-bridge';
 import { Palette } from '@frontify/fondue';
 
+type Nullable<T> = T | null;
+
+type V3Color = {
+    id: number;
+    name: Nullable<string>;
+    red: Nullable<number>;
+    green: Nullable<number>;
+    blue: Nullable<number>;
+    alpha: Nullable<number>;
+};
+
+type V4Color = {
+    id: number;
+    title: Nullable<string>;
+    revision: {
+        rgba: {
+            red: Nullable<number>;
+            green: Nullable<number>;
+            blue: Nullable<number>;
+            alpha: Nullable<number>;
+        };
+    };
+};
+
+type Color = V3Color | V4Color;
+
 export const mapAppBridgeColorPalettesToFonduePalettes = (colorPalettes: ColorPalette[]): Palette[] => {
     return colorPalettes.map(mapAppBridgeColorPaletteToFonduePalette);
 };
-
 export const mapAppBridgeColorPaletteToFonduePalette = (colorPalette: ColorPalette): Palette => {
     return {
         id: colorPalette.id,
         title: colorPalette.name,
-        colors: colorPalette.colors.map((color) => ({
-            alpha: color.alpha ? color.alpha / 255 : 1,
-            red: color.red ?? 0,
-            green: color.green ?? 0,
-            blue: color.blue ?? 0,
-            name: color.name ?? '',
-        })),
+        colors: colorPalette.colors.map(mapColor),
+    };
+};
+
+const isV4Color = (color: Color): color is V4Color => {
+    return 'revision' in color;
+};
+
+const mapColor = (color: Color) => {
+    if (isV4Color(color)) {
+        const { title, revision } = color;
+        return {
+            alpha: revision.rgba.alpha ? revision.rgba.alpha / 255 : 1,
+            red: revision.rgba.red ?? 0,
+            green: revision.rgba.green ?? 0,
+            blue: revision.rgba.blue ?? 0,
+            name: title ?? '',
+        };
+    }
+    return {
+        alpha: color.alpha ? color.alpha / 255 : 1,
+        red: color.red ?? 0,
+        green: color.green ?? 0,
+        blue: color.blue ?? 0,
+        name: color.name ?? '',
     };
 };

package/src/hooks/useAttachments.spec.tsx

@@ -26,6 +26,7 @@ describe('useAttachments', async () => {
         const STUB_WITH_THREE_ASSETS = getAppBridgeBlockStub({
             blockId: 2,
             blockAssets: { [MOCK_SETTINGS_ID]: [AssetDummy.with(1), AssetDummy.with(2), AssetDummy.with(3)] },
+            editorState: true,
         });
         const { result } = renderHook(() => useAttachments(STUB_WITH_THREE_ASSETS, MOCK_SETTINGS_ID));
 

package/tsconfig.json

@@ -22,6 +22,6 @@
         "skipLibCheck": true,
         "types": ["cypress", "node", "cypress-real-events"]
     },
-    "include": ["src/**/*"],
+    "include": ["src/**/*", "./setupTests.ts"],
     "exclude": ["node_modules", "dist"]
 }

package/dist/components/BlockItemWrapper/Toolbar/ToolbarAttachments.es.js

@@ -1,27 +0,0 @@
-import { jsx as s } from "react/jsx-runtime";
-import { ToolbarAttachmentsTrigger as p } from "./ToolbarAttachmentsTrigger.es.js";
-import { useAttachmentsContext as h } from "../../../hooks/useAttachments.es.js";
-import { Attachments as i } from "../../Attachments/Attachments.es.js";
-const f = ({ isOpen: o, onOpenChange: n }) => {
-  const { appBridge: r, attachments: m, onAttachmentsAdd: t, onAttachmentDelete: a, onAttachmentReplace: e, onAttachmentsSorted: c } = h();
-  return /* @__PURE__ */ s(
-    i,
-    {
-      onUpload: t,
-      onDelete: a,
-      onReplaceWithBrowse: e,
-      onReplaceWithUpload: e,
-      onSorted: c,
-      onBrowse: t,
-      items: m,
-      appBridge: r,
-      triggerComponent: p,
-      isOpen: o,
-      onOpenChange: n
-    }
-  );
-};
-export {
-  f as ToolbarAttachments
-};
-//# sourceMappingURL=ToolbarAttachments.es.js.map

package/dist/components/BlockItemWrapper/Toolbar/ToolbarAttachments.es.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ToolbarAttachments.es.js","sources":["../../../../src/components/BlockItemWrapper/Toolbar/ToolbarAttachments.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { Attachments } from '../../Attachments';\nimport { useAttachmentsContext } from '../../../hooks';\n\nimport { type ToolbarFlyoutState } from './types';\n\nimport { ToolbarAttachmentsTrigger } from './ToolbarAttachmentsTrigger';\n\nexport const ToolbarAttachments = ({ isOpen, onOpenChange }: ToolbarFlyoutState) => {\n    const { appBridge, attachments, onAttachmentsAdd, onAttachmentDelete, onAttachmentReplace, onAttachmentsSorted } =\n        useAttachmentsContext();\n\n    return (\n        <Attachments\n            onUpload={onAttachmentsAdd}\n            onDelete={onAttachmentDelete}\n            onReplaceWithBrowse={onAttachmentReplace}\n            onReplaceWithUpload={onAttachmentReplace}\n            onSorted={onAttachmentsSorted}\n            onBrowse={onAttachmentsAdd}\n            items={attachments}\n            appBridge={appBridge}\n            triggerComponent={ToolbarAttachmentsTrigger}\n            isOpen={isOpen}\n            onOpenChange={onOpenChange}\n        />\n    );\n};\n"],"names":["ToolbarAttachments","isOpen","onOpenChange","appBridge","attachments","onAttachmentsAdd","onAttachmentDelete","onAttachmentReplace","onAttachmentsSorted","useAttachmentsContext","jsx","Attachments","ToolbarAttachmentsTrigger"],"mappings":";;;;AASO,MAAMA,IAAqB,CAAC,EAAE,QAAAC,GAAQ,cAAAC,QAAuC;AAC1E,QAAA,EAAE,WAAAC,GAAW,aAAAC,GAAa,kBAAAC,GAAkB,oBAAAC,GAAoB,qBAAAC,GAAqB,qBAAAC,MACvFC;AAGA,SAAA,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACG,UAAUN;AAAA,MACV,UAAUC;AAAA,MACV,qBAAqBC;AAAA,MACrB,qBAAqBA;AAAA,MACrB,UAAUC;AAAA,MACV,UAAUH;AAAA,MACV,OAAOD;AAAA,MACP,WAAAD;AAAA,MACA,kBAAkBS;AAAA,MAClB,QAAAX;AAAA,MACA,cAAAC;AAAA,IAAA;AAAA,EAAA;AAGZ;"}

package/dist/components/BlockItemWrapper/Toolbar/ToolbarAttachmentsTrigger.es.js

@@ -1,12 +0,0 @@
-import { jsxs as e, jsx as o } from "react/jsx-runtime";
-import { IconPaperclip16 as s, IconCaretDown12 as a } from "@frontify/fondue";
-import { getToolbarButtonClassNames as m } from "./helpers.es.js";
-const p = ({ children: r, isFlyoutOpen: t }) => /* @__PURE__ */ e("div", { className: m("pointer", t), children: [
-  /* @__PURE__ */ o(s, {}),
-  r,
-  /* @__PURE__ */ o(a, {})
-] });
-export {
-  p as ToolbarAttachmentsTrigger
-};
-//# sourceMappingURL=ToolbarAttachmentsTrigger.es.js.map

package/dist/components/BlockItemWrapper/Toolbar/ToolbarAttachmentsTrigger.es.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ToolbarAttachmentsTrigger.es.js","sources":["../../../../src/components/BlockItemWrapper/Toolbar/ToolbarAttachmentsTrigger.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { IconCaretDown12, IconPaperclip16 } from '@frontify/fondue';\nimport { type AttachmentsTriggerProps } from '../../Attachments/types';\n\nimport { getToolbarButtonClassNames } from './helpers';\n\nexport const ToolbarAttachmentsTrigger = ({ children, isFlyoutOpen }: AttachmentsTriggerProps) => (\n    <div className={getToolbarButtonClassNames('pointer', isFlyoutOpen)}>\n        <IconPaperclip16 />\n        {children}\n        <IconCaretDown12 />\n    </div>\n);\n"],"names":["ToolbarAttachmentsTrigger","children","isFlyoutOpen","jsxs","getToolbarButtonClassNames","jsx","IconPaperclip16","IconCaretDown12"],"mappings":";;;AAOO,MAAMA,IAA4B,CAAC,EAAE,UAAAC,GAAU,cAAAC,EAAa,MAC9D,gBAAAC,EAAA,OAAA,EAAI,WAAWC,EAA2B,WAAWF,CAAY,GAC9D,UAAA;AAAA,EAAA,gBAAAG,EAACC,GAAgB,EAAA;AAAA,EAChBL;AAAA,oBACAM,GAAgB,EAAA;AAAA,EACrB,CAAA;"}

package/src/components/BlockItemWrapper/Toolbar/ToolbarAttachments.tsx

@@ -1,29 +0,0 @@
-/* (c) Copyright Frontify Ltd., all rights reserved. */
-
-import { Attachments } from '../../Attachments';
-import { useAttachmentsContext } from '../../../hooks';
-
-import { type ToolbarFlyoutState } from './types';
-
-import { ToolbarAttachmentsTrigger } from './ToolbarAttachmentsTrigger';
-
-export const ToolbarAttachments = ({ isOpen, onOpenChange }: ToolbarFlyoutState) => {
-    const { appBridge, attachments, onAttachmentsAdd, onAttachmentDelete, onAttachmentReplace, onAttachmentsSorted } =
-        useAttachmentsContext();
-
-    return (
-        <Attachments
-            onUpload={onAttachmentsAdd}
-            onDelete={onAttachmentDelete}
-            onReplaceWithBrowse={onAttachmentReplace}
-            onReplaceWithUpload={onAttachmentReplace}
-            onSorted={onAttachmentsSorted}
-            onBrowse={onAttachmentsAdd}
-            items={attachments}
-            appBridge={appBridge}
-            triggerComponent={ToolbarAttachmentsTrigger}
-            isOpen={isOpen}
-            onOpenChange={onOpenChange}
-        />
-    );
-};

package/src/components/BlockItemWrapper/Toolbar/ToolbarAttachmentsTrigger.tsx

@@ -1,14 +0,0 @@
-/* (c) Copyright Frontify Ltd., all rights reserved. */
-
-import { IconCaretDown12, IconPaperclip16 } from '@frontify/fondue';
-import { type AttachmentsTriggerProps } from '../../Attachments/types';
-
-import { getToolbarButtonClassNames } from './helpers';
-
-export const ToolbarAttachmentsTrigger = ({ children, isFlyoutOpen }: AttachmentsTriggerProps) => (
-    <div className={getToolbarButtonClassNames('pointer', isFlyoutOpen)}>
-        <IconPaperclip16 />
-        {children}
-        <IconCaretDown12 />
-    </div>
-);