@frontify/guideline-blocks-settings 0.32.1 → 0.33.0

package/dist/components/Attachments/AttachmentsButtonTrigger.es.js

@@ -1,21 +1,29 @@
-import { jsxs as o, jsx as t } from "react/jsx-runtime";
-import { IconPaperclip16 as n, IconCaretDown12 as s } from "@frontify/fondue";
-import { joinClassNames as i } from "../../utilities/react/joinClassNames.es.js";
-const x = ({ children: e, isFlyoutOpen: r }) => /* @__PURE__ */ o(
-  "div",
+import { jsxs as s, jsx as t } from "react/jsx-runtime";
+import { IconPaperclip16 as a, IconCaretDown12 as i } from "@frontify/fondue";
+import { joinClassNames as w } from "../../utilities/react/joinClassNames.es.js";
+const b = ({
+  children: e,
+  isFlyoutOpen: r,
+  triggerProps: o,
+  triggerRef: n
+}) => /* @__PURE__ */ s(
+  "button",
   {
-    className: i([
+    className: w([
       "tw-flex tw-text-xs tw-font-body tw-items-center tw-gap-1 tw-rounded-full tw-outline tw-outline-1 tw-outline-offset-1 tw-p-1.5 tw-outline-line",
       r ? "tw-bg-box-neutral-pressed tw-text-box-neutral-inverse-pressed" : "tw-bg-base hover:tw-bg-box-neutral-hover active:tw-bg-box-neutral-pressed tw-text-box-neutral-inverse hover:tw-text-box-neutral-inverse-hover active:tw-text-box-neutral-inverse-pressed"
     ]),
+    ...o,
+    ref: n,
+    "data-test-id": "attachments-button-trigger",
     children: [
-      /* @__PURE__ */ t(n, {}),
+      /* @__PURE__ */ t(a, {}),
       e,
-      /* @__PURE__ */ t(s, {})
+      /* @__PURE__ */ t(i, {})
     ]
   }
 );
 export {
-  x as AttachmentsButtonTrigger
+  b as AttachmentsButtonTrigger
 };
 //# sourceMappingURL=AttachmentsButtonTrigger.es.js.map

package/dist/components/Attachments/AttachmentsButtonTrigger.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"AttachmentsButtonTrigger.es.js","sources":["../../../src/components/Attachments/AttachmentsButtonTrigger.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { IconCaretDown12, IconPaperclip16 } from '@frontify/fondue';\n\nimport { joinClassNames } from '../../utilities';\n\nimport { type AttachmentsTriggerProps } from './types';\n\nexport const AttachmentsButtonTrigger = ({ children, isFlyoutOpen }: AttachmentsTriggerProps) => (\n    <div\n        className={joinClassNames([\n            'tw-flex tw-text-xs tw-font-body tw-items-center tw-gap-1 tw-rounded-full tw-outline tw-outline-1 tw-outline-offset-1 tw-p-1.5 tw-outline-line',\n            isFlyoutOpen\n                ? 'tw-bg-box-neutral-pressed tw-text-box-neutral-inverse-pressed'\n                : 'tw-bg-base hover:tw-bg-box-neutral-hover active:tw-bg-box-neutral-pressed tw-text-box-neutral-inverse hover:tw-text-box-neutral-inverse-hover active:tw-text-box-neutral-inverse-pressed',\n        ])}\n    >\n        <IconPaperclip16 />\n        {children}\n        <IconCaretDown12 />\n    </div>\n);\n"],"names":["AttachmentsButtonTrigger","children","isFlyoutOpen","jsxs","joinClassNames","jsx","IconPaperclip16","IconCaretDown12"],"mappings":";;;AAQO,MAAMA,IAA2B,CAAC,EAAE,UAAAC,GAAU,cAAAC,EACjD,MAAA,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACG,WAAWC,EAAe;AAAA,MACtB;AAAA,MACAF,IACM,kEACA;AAAA,IAAA,CACT;AAAA,IAED,UAAA;AAAA,MAAA,gBAAAG,EAACC,GAAgB,EAAA;AAAA,MAChBL;AAAA,wBACAM,GAAgB,EAAA;AAAA,IAAA;AAAA,EAAA;AACrB;"}
+{"version":3,"file":"AttachmentsButtonTrigger.es.js","sources":["../../../src/components/Attachments/AttachmentsButtonTrigger.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { IconCaretDown12, IconPaperclip16 } from '@frontify/fondue';\n\nimport { joinClassNames } from '../../utilities';\n\nimport { type AttachmentsTriggerProps } from './types';\n\nexport const AttachmentsButtonTrigger = ({\n    children,\n    isFlyoutOpen,\n    triggerProps,\n    triggerRef,\n}: AttachmentsTriggerProps) => (\n    <button\n        className={joinClassNames([\n            'tw-flex tw-text-xs tw-font-body tw-items-center tw-gap-1 tw-rounded-full tw-outline tw-outline-1 tw-outline-offset-1 tw-p-1.5 tw-outline-line',\n            isFlyoutOpen\n                ? 'tw-bg-box-neutral-pressed tw-text-box-neutral-inverse-pressed'\n                : 'tw-bg-base hover:tw-bg-box-neutral-hover active:tw-bg-box-neutral-pressed tw-text-box-neutral-inverse hover:tw-text-box-neutral-inverse-hover active:tw-text-box-neutral-inverse-pressed',\n        ])}\n        {...triggerProps}\n        ref={triggerRef}\n        data-test-id=\"attachments-button-trigger\"\n    >\n        <IconPaperclip16 />\n        {children}\n        <IconCaretDown12 />\n    </button>\n);\n"],"names":["AttachmentsButtonTrigger","children","isFlyoutOpen","triggerProps","triggerRef","jsxs","joinClassNames","jsx","IconPaperclip16","IconCaretDown12"],"mappings":";;;AAQO,MAAMA,IAA2B,CAAC;AAAA,EACrC,UAAAC;AAAA,EACA,cAAAC;AAAA,EACA,cAAAC;AAAA,EACA,YAAAC;AACJ,MACI,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACG,WAAWC,EAAe;AAAA,MACtB;AAAA,MACAJ,IACM,kEACA;AAAA,IAAA,CACT;AAAA,IACA,GAAGC;AAAA,IACJ,KAAKC;AAAA,IACL,gBAAa;AAAA,IAEb,UAAA;AAAA,MAAA,gBAAAG,EAACC,GAAgB,EAAA;AAAA,MAChBP;AAAA,wBACAQ,GAAgB,EAAA;AAAA,IAAA;AAAA,EAAA;AACrB;"}

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

@@ -1,67 +1,61 @@
-import { jsx as o, Fragment as O, jsxs as b } from "react/jsx-runtime";
-import { useState as p, useRef as F } from "react";
-import { Toolbar as j } from "./Toolbar/Toolbar.es.js";
-import { joinClassNames as r } from "../../utilities/react/joinClassNames.es.js";
-const A = ({
+import { jsx as t, Fragment as y, jsxs as h } from "react/jsx-runtime";
+import { useState as x, useRef as g } from "react";
+import { DragPreviewContextProvider as b } from "./Toolbar/context/DragPreviewContext.es.js";
+import { MultiFlyoutContextProvider as F } from "./Toolbar/context/MultiFlyoutContext.es.js";
+import { DEFAULT_MENU_BUTTON_ID as N } from "./Toolbar/MenuToolbarButton/MenuToolbarButton.es.js";
+import { Toolbar as T } from "./Toolbar/Toolbar.es.js";
+import { joinClassNames as w } from "../../utilities/react/joinClassNames.es.js";
+const k = ({
   children: i,
-  toolbarFlyoutItems: w,
-  toolbarItems: t,
-  shouldHideWrapper: c,
-  shouldHideComponent: u = !1,
-  isDragging: f,
-  shouldFillContainer: m,
-  outlineOffset: e = 2,
-  shouldBeShown: n = !1,
-  showAttachments: y = !1
+  toolbarItems: e,
+  shouldHideWrapper: a,
+  shouldHideComponent: n = !1,
+  isDragging: p = !1,
+  shouldFillContainer: c,
+  outlineOffset: o = 2,
+  shouldBeShown: r = !1,
+  showAttachments: u = !1
 }) => {
-  const [s, h] = p(n), [l, d] = p(!1), x = F(null);
-  if (c)
-    return /* @__PURE__ */ o(O, { children: i });
-  const g = t == null ? void 0 : t.filter((v) => v !== void 0), a = s || l || n;
-  return /* @__PURE__ */ b(
+  const [l, f] = x(r ? [N] : []), m = g(null);
+  if (a)
+    return /* @__PURE__ */ t(y, { children: i });
+  const d = e == null ? void 0 : e.filter((v) => v !== void 0), s = l.length > 0 || r;
+  return /* @__PURE__ */ t(b, { isDragPreview: p, children: /* @__PURE__ */ t(F, { openFlyoutIds: l, setOpenFlyoutIds: f, children: /* @__PURE__ */ h(
     "div",
     {
-      ref: x,
+      ref: m,
       "data-test-id": "block-item-wrapper",
       style: {
-        outlineOffset: e
+        outlineOffset: o
       },
-      className: r([
+      className: w([
         "tw-relative tw-group tw-outline-1 tw-outline-box-selected-inverse",
-        m && "tw-flex-1 tw-h-full tw-w-full",
+        c && "tw-flex-1 tw-h-full tw-w-full",
         "hover:tw-outline focus-within:tw-outline",
-        a && "tw-outline",
-        u && "tw-opacity-0"
+        s && "tw-outline",
+        n && "tw-opacity-0"
       ]),
       children: [
-        /* @__PURE__ */ o(
+        /* @__PURE__ */ t(
           "div",
           {
             style: {
-              right: -1 - e,
-              bottom: `calc(100% - ${2 + e}px)`
+              right: -1 - o,
+              bottom: `calc(100% - ${2 + o}px)`
             },
-            className: r([
+            className: w([
               "tw-pointer-events-none tw-absolute tw-bottom-[calc(100%-4px)] tw-right-[-3px] tw-w-full tw-opacity-0 tw-z-[60]",
               "group-hover:tw-opacity-100 group-focus:tw-opacity-100 focus-within:tw-opacity-100",
               "tw-flex tw-justify-end",
-              a && "tw-opacity-100"
+              s && "tw-opacity-100"
             ]),
-            children: /* @__PURE__ */ o(
-              j,
+            children: /* @__PURE__ */ t(
+              T,
               {
-                flyoutMenu: {
-                  items: w,
-                  isOpen: s,
-                  onOpenChange: h
-                },
                 attachments: {
-                  isEnabled: y,
-                  isOpen: l,
-                  onOpenChange: d
+                  isEnabled: u
                 },
-                items: g,
-                isDragging: f
+                items: d
               }
             )
           }
@@ -69,9 +63,9 @@ const A = ({
         i
       ]
     }
-  );
+  ) }) });
 };
 export {
-  A as BlockItemWrapper
+  k as BlockItemWrapper
 };
 //# sourceMappingURL=BlockItemWrapper.es.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"BlockItemWrapper.es.js","sources":["../../../src/components/BlockItemWrapper/BlockItemWrapper.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type ReactElement, useRef, useState } from 'react';\n\nimport { joinClassNames } from '../../utilities';\n\nimport { Toolbar, type ToolbarItem } from './Toolbar';\nimport { type BlockItemWrapperProps } from './types';\n\nexport const BlockItemWrapper = ({\n    children,\n    toolbarFlyoutItems,\n    toolbarItems,\n    shouldHideWrapper,\n    shouldHideComponent = false,\n    isDragging,\n    shouldFillContainer,\n    outlineOffset = 2,\n    shouldBeShown = false,\n    showAttachments = false,\n}: BlockItemWrapperProps): ReactElement => {\n    const [isMenuFlyoutOpen, setIsMenuFlyoutOpen] = useState(shouldBeShown);\n    const [isAttachmentFlyoutOpen, setIsAttachmentFlyoutOpen] = useState(false);\n    const wrapperRef = useRef<HTMLDivElement>(null);\n\n    if (shouldHideWrapper) {\n        // eslint-disable-next-line react/jsx-no-useless-fragment\n        return <>{children}</>;\n    }\n\n    const items = toolbarItems?.filter((item): item is ToolbarItem => item !== undefined);\n\n    const shouldToolbarBeVisible = isMenuFlyoutOpen || isAttachmentFlyoutOpen || shouldBeShown;\n\n    return (\n        <div\n            ref={wrapperRef}\n            data-test-id=\"block-item-wrapper\"\n            style={{\n                outlineOffset,\n            }}\n            className={joinClassNames([\n                'tw-relative tw-group tw-outline-1 tw-outline-box-selected-inverse',\n                shouldFillContainer && 'tw-flex-1 tw-h-full tw-w-full',\n                'hover:tw-outline focus-within:tw-outline',\n                shouldToolbarBeVisible && 'tw-outline',\n                shouldHideComponent && 'tw-opacity-0',\n            ])}\n        >\n            <div\n                style={{\n                    right: -1 - outlineOffset,\n                    bottom: `calc(100% - ${2 + outlineOffset}px)`,\n                }}\n                className={joinClassNames([\n                    'tw-pointer-events-none tw-absolute tw-bottom-[calc(100%-4px)] tw-right-[-3px] tw-w-full tw-opacity-0 tw-z-[60]',\n                    'group-hover:tw-opacity-100 group-focus:tw-opacity-100 focus-within:tw-opacity-100',\n                    'tw-flex tw-justify-end',\n                    shouldToolbarBeVisible && 'tw-opacity-100',\n                ])}\n            >\n                <Toolbar\n                    flyoutMenu={{\n                        items: toolbarFlyoutItems,\n                        isOpen: isMenuFlyoutOpen,\n                        onOpenChange: setIsMenuFlyoutOpen,\n                    }}\n                    attachments={{\n                        isEnabled: showAttachments,\n                        isOpen: isAttachmentFlyoutOpen,\n                        onOpenChange: setIsAttachmentFlyoutOpen,\n                    }}\n                    items={items}\n                    isDragging={isDragging}\n                />\n            </div>\n            {children}\n        </div>\n    );\n};\n"],"names":["BlockItemWrapper","children","toolbarFlyoutItems","toolbarItems","shouldHideWrapper","shouldHideComponent","isDragging","shouldFillContainer","outlineOffset","shouldBeShown","showAttachments","isMenuFlyoutOpen","setIsMenuFlyoutOpen","useState","isAttachmentFlyoutOpen","setIsAttachmentFlyoutOpen","wrapperRef","useRef","items","item","shouldToolbarBeVisible","jsxs","joinClassNames","jsx","Toolbar"],"mappings":";;;;AASO,MAAMA,IAAmB,CAAC;AAAA,EAC7B,UAAAC;AAAA,EACA,oBAAAC;AAAA,EACA,cAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,qBAAAC,IAAsB;AAAA,EACtB,YAAAC;AAAA,EACA,qBAAAC;AAAA,EACA,eAAAC,IAAgB;AAAA,EAChB,eAAAC,IAAgB;AAAA,EAChB,iBAAAC,IAAkB;AACtB,MAA2C;AACvC,QAAM,CAACC,GAAkBC,CAAmB,IAAIC,EAASJ,CAAa,GAChE,CAACK,GAAwBC,CAAyB,IAAIF,EAAS,EAAK,GACpEG,IAAaC,EAAuB,IAAI;AAE9C,MAAIb;AAEA,kCAAU,UAAAH,EAAS,CAAA;AAGvB,QAAMiB,IAAQf,KAAA,gBAAAA,EAAc,OAAO,CAACgB,MAA8BA,MAAS,SAErEC,IAAyBT,KAAoBG,KAA0BL;AAGzE,SAAA,gBAAAY;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,KAAKL;AAAA,MACL,gBAAa;AAAA,MACb,OAAO;AAAA,QACH,eAAAR;AAAA,MACJ;AAAA,MACA,WAAWc,EAAe;AAAA,QACtB;AAAA,QACAf,KAAuB;AAAA,QACvB;AAAA,QACAa,KAA0B;AAAA,QAC1Bf,KAAuB;AAAA,MAAA,CAC1B;AAAA,MAED,UAAA;AAAA,QAAA,gBAAAkB;AAAA,UAAC;AAAA,UAAA;AAAA,YACG,OAAO;AAAA,cACH,OAAO,KAAKf;AAAA,cACZ,QAAQ,eAAe,IAAIA,CAAa;AAAA,YAC5C;AAAA,YACA,WAAWc,EAAe;AAAA,cACtB;AAAA,cACA;AAAA,cACA;AAAA,cACAF,KAA0B;AAAA,YAAA,CAC7B;AAAA,YAED,UAAA,gBAAAG;AAAA,cAACC;AAAA,cAAA;AAAA,gBACG,YAAY;AAAA,kBACR,OAAOtB;AAAA,kBACP,QAAQS;AAAA,kBACR,cAAcC;AAAA,gBAClB;AAAA,gBACA,aAAa;AAAA,kBACT,WAAWF;AAAA,kBACX,QAAQI;AAAA,kBACR,cAAcC;AAAA,gBAClB;AAAA,gBACA,OAAAG;AAAA,gBACA,YAAAZ;AAAA,cAAA;AAAA,YACJ;AAAA,UAAA;AAAA,QACJ;AAAA,QACCL;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGb;"}
+{"version":3,"file":"BlockItemWrapper.es.js","sources":["../../../src/components/BlockItemWrapper/BlockItemWrapper.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type ReactElement, useRef, useState } from 'react';\n\nimport { joinClassNames } from '../../utilities';\n\nimport { DEFAULT_MENU_BUTTON_ID, Toolbar, type ToolbarItem } from './Toolbar';\nimport { type BlockItemWrapperProps } from './types';\nimport { DragPreviewContextProvider } from './Toolbar/context/DragPreviewContext';\nimport { MultiFlyoutContextProvider } from './Toolbar/context/MultiFlyoutContext';\n\nexport const BlockItemWrapper = ({\n    children,\n    toolbarItems,\n    shouldHideWrapper,\n    shouldHideComponent = false,\n    isDragging = false,\n    shouldFillContainer,\n    outlineOffset = 2,\n    shouldBeShown = false,\n    showAttachments = false,\n}: BlockItemWrapperProps): ReactElement => {\n    const [openFlyoutIds, setOpenFlyoutIds] = useState<string[]>(shouldBeShown ? [DEFAULT_MENU_BUTTON_ID] : []);\n    const wrapperRef = useRef<HTMLDivElement>(null);\n\n    if (shouldHideWrapper) {\n        // eslint-disable-next-line react/jsx-no-useless-fragment\n        return <>{children}</>;\n    }\n\n    const items = toolbarItems?.filter((item): item is ToolbarItem => item !== undefined);\n\n    const shouldToolbarBeVisible = openFlyoutIds.length > 0 || shouldBeShown;\n\n    return (\n        <DragPreviewContextProvider isDragPreview={isDragging}>\n            <MultiFlyoutContextProvider openFlyoutIds={openFlyoutIds} setOpenFlyoutIds={setOpenFlyoutIds}>\n                <div\n                    ref={wrapperRef}\n                    data-test-id=\"block-item-wrapper\"\n                    style={{\n                        outlineOffset,\n                    }}\n                    className={joinClassNames([\n                        'tw-relative tw-group tw-outline-1 tw-outline-box-selected-inverse',\n                        shouldFillContainer && 'tw-flex-1 tw-h-full tw-w-full',\n                        'hover:tw-outline focus-within:tw-outline',\n                        shouldToolbarBeVisible && 'tw-outline',\n                        shouldHideComponent && 'tw-opacity-0',\n                    ])}\n                >\n                    <div\n                        style={{\n                            right: -1 - outlineOffset,\n                            bottom: `calc(100% - ${2 + outlineOffset}px)`,\n                        }}\n                        className={joinClassNames([\n                            'tw-pointer-events-none tw-absolute tw-bottom-[calc(100%-4px)] tw-right-[-3px] tw-w-full tw-opacity-0 tw-z-[60]',\n                            'group-hover:tw-opacity-100 group-focus:tw-opacity-100 focus-within:tw-opacity-100',\n                            'tw-flex tw-justify-end',\n                            shouldToolbarBeVisible && 'tw-opacity-100',\n                        ])}\n                    >\n                        <Toolbar\n                            attachments={{\n                                isEnabled: showAttachments,\n                            }}\n                            items={items}\n                        />\n                    </div>\n                    {children}\n                </div>\n            </MultiFlyoutContextProvider>\n        </DragPreviewContextProvider>\n    );\n};\n"],"names":["BlockItemWrapper","children","toolbarItems","shouldHideWrapper","shouldHideComponent","isDragging","shouldFillContainer","outlineOffset","shouldBeShown","showAttachments","openFlyoutIds","setOpenFlyoutIds","useState","DEFAULT_MENU_BUTTON_ID","wrapperRef","useRef","items","item","shouldToolbarBeVisible","DragPreviewContextProvider","jsx","MultiFlyoutContextProvider","jsxs","joinClassNames","Toolbar"],"mappings":";;;;;;;AAWO,MAAMA,IAAmB,CAAC;AAAA,EAC7B,UAAAC;AAAA,EACA,cAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,qBAAAC,IAAsB;AAAA,EACtB,YAAAC,IAAa;AAAA,EACb,qBAAAC;AAAA,EACA,eAAAC,IAAgB;AAAA,EAChB,eAAAC,IAAgB;AAAA,EAChB,iBAAAC,IAAkB;AACtB,MAA2C;AACjC,QAAA,CAACC,GAAeC,CAAgB,IAAIC,EAAmBJ,IAAgB,CAACK,CAAsB,IAAI,CAAA,CAAE,GACpGC,IAAaC,EAAuB,IAAI;AAE9C,MAAIZ;AAEA,kCAAU,UAAAF,EAAS,CAAA;AAGvB,QAAMe,IAAQd,KAAA,gBAAAA,EAAc,OAAO,CAACe,MAA8BA,MAAS,SAErEC,IAAyBR,EAAc,SAAS,KAAKF;AAE3D,2BACKW,GAA2B,EAAA,eAAed,GACvC,UAAC,gBAAAe,EAAAC,GAAA,EAA2B,eAAAX,GAA8B,kBAAAC,GACtD,UAAA,gBAAAW;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,KAAKR;AAAA,MACL,gBAAa;AAAA,MACb,OAAO;AAAA,QACH,eAAAP;AAAA,MACJ;AAAA,MACA,WAAWgB,EAAe;AAAA,QACtB;AAAA,QACAjB,KAAuB;AAAA,QACvB;AAAA,QACAY,KAA0B;AAAA,QAC1Bd,KAAuB;AAAA,MAAA,CAC1B;AAAA,MAED,UAAA;AAAA,QAAA,gBAAAgB;AAAA,UAAC;AAAA,UAAA;AAAA,YACG,OAAO;AAAA,cACH,OAAO,KAAKb;AAAA,cACZ,QAAQ,eAAe,IAAIA,CAAa;AAAA,YAC5C;AAAA,YACA,WAAWgB,EAAe;AAAA,cACtB;AAAA,cACA;AAAA,cACA;AAAA,cACAL,KAA0B;AAAA,YAAA,CAC7B;AAAA,YAED,UAAA,gBAAAE;AAAA,cAACI;AAAA,cAAA;AAAA,gBACG,aAAa;AAAA,kBACT,WAAWf;AAAA,gBACf;AAAA,gBACA,OAAAO;AAAA,cAAA;AAAA,YACJ;AAAA,UAAA;AAAA,QACJ;AAAA,QACCf;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA,EAET,CAAA,EACJ,CAAA;AAER;"}

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

@@ -0,0 +1,33 @@
+import { jsx as h } from "react/jsx-runtime";
+import { useMemoizedId as A } from "@frontify/fondue";
+import { useMultiFlyoutState as l } from "../hooks/useMultiFlyoutState.es.js";
+import { AttachmentsToolbarButtonTrigger as d } from "./AttachmentsToolbarButtonTrigger.es.js";
+import { useDragPreviewContext as u } from "../context/DragPreviewContext.es.js";
+import { useAttachmentsContext as T } from "../../../../hooks/useAttachments.es.js";
+import { Attachments as g } from "../../../Attachments/Attachments.es.js";
+const f = "attachments", U = ({
+  flyoutId: o = f
+}) => {
+  const n = A(o), { appBridge: r, attachments: m, onAttachmentsAdd: t, onAttachmentDelete: s, onAttachmentReplace: e, onAttachmentsSorted: a } = T(), { isOpen: i, onOpenChange: c } = l(n), p = u();
+  return /* @__PURE__ */ h(
+    g,
+    {
+      onUpload: t,
+      onDelete: s,
+      onReplaceWithBrowse: e,
+      onReplaceWithUpload: e,
+      onSorted: a,
+      onBrowse: t,
+      items: m,
+      appBridge: r,
+      triggerComponent: d,
+      isOpen: i && !p,
+      onOpenChange: c
+    }
+  );
+};
+export {
+  U as AttachmentsToolbarButton,
+  f as DEFAULT_ATTACHMENTS_BUTTON_ID
+};
+//# sourceMappingURL=AttachmentsToolbarButton.es.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"AttachmentsToolbarButton.es.js","sources":["../../../../../src/components/BlockItemWrapper/Toolbar/AttachmentsToolbarButton/AttachmentsToolbarButton.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { useMemoizedId } from '@frontify/fondue';\n\nimport { useAttachmentsContext } from '../../../../hooks';\nimport { Attachments } from '../../../Attachments';\nimport { useMultiFlyoutState } from '../hooks/useMultiFlyoutState';\n\nimport { AttachmentsToolbarButtonTrigger } from './AttachmentsToolbarButtonTrigger';\nimport { useDragPreviewContext } from '../context/DragPreviewContext';\n\nexport const DEFAULT_ATTACHMENTS_BUTTON_ID = 'attachments';\n\ntype AttachmentsToolbarButtonProps = { flyoutId?: string };\n\nexport const AttachmentsToolbarButton = ({\n    flyoutId = DEFAULT_ATTACHMENTS_BUTTON_ID,\n}: AttachmentsToolbarButtonProps) => {\n    const id = useMemoizedId(flyoutId);\n\n    const { appBridge, attachments, onAttachmentsAdd, onAttachmentDelete, onAttachmentReplace, onAttachmentsSorted } =\n        useAttachmentsContext();\n\n    const { isOpen, onOpenChange } = useMultiFlyoutState(id);\n    const isDragPreview = useDragPreviewContext();\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={AttachmentsToolbarButtonTrigger}\n            isOpen={isOpen && !isDragPreview}\n            onOpenChange={onOpenChange}\n        />\n    );\n};\n"],"names":["DEFAULT_ATTACHMENTS_BUTTON_ID","AttachmentsToolbarButton","flyoutId","id","useMemoizedId","appBridge","attachments","onAttachmentsAdd","onAttachmentDelete","onAttachmentReplace","onAttachmentsSorted","useAttachmentsContext","isOpen","onOpenChange","useMultiFlyoutState","isDragPreview","useDragPreviewContext","jsx","Attachments","AttachmentsToolbarButtonTrigger"],"mappings":";;;;;;;AAWO,MAAMA,IAAgC,eAIhCC,IAA2B,CAAC;AAAA,EACrC,UAAAC,IAAWF;AACf,MAAqC;AAC3B,QAAAG,IAAKC,EAAcF,CAAQ,GAE3B,EAAE,WAAAG,GAAW,aAAAC,GAAa,kBAAAC,GAAkB,oBAAAC,GAAoB,qBAAAC,GAAqB,qBAAAC,MACvFC,KAEE,EAAE,QAAAC,GAAQ,cAAAC,EAAa,IAAIC,EAAoBX,CAAE,GACjDY,IAAgBC;AAGlB,SAAA,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACG,UAAUX;AAAA,MACV,UAAUC;AAAA,MACV,qBAAqBC;AAAA,MACrB,qBAAqBA;AAAA,MACrB,UAAUC;AAAA,MACV,UAAUH;AAAA,MACV,OAAOD;AAAA,MACP,WAAAD;AAAA,MACA,kBAAkBc;AAAA,MAClB,QAAQP,KAAU,CAACG;AAAA,MACnB,cAAAF;AAAA,IAAA;AAAA,EAAA;AAGZ;"}

package/dist/components/BlockItemWrapper/Toolbar/AttachmentsToolbarButton/AttachmentsToolbarButtonTrigger.es.js

@@ -0,0 +1,26 @@
+import { jsxs as n, jsx as t } from "react/jsx-runtime";
+import { IconPaperclip16 as c, IconCaretDown12 as i } from "@frontify/fondue";
+import { BaseToolbarButton as m } from "../BaseToolbarButton.es.js";
+const f = ({
+  children: o,
+  isFlyoutOpen: r,
+  triggerProps: e,
+  triggerRef: a
+}) => /* @__PURE__ */ n(
+  m,
+  {
+    forceActiveStyle: r,
+    "data-test-id": "attachments-toolbar-button-trigger",
+    ...e,
+    ref: a,
+    children: [
+      /* @__PURE__ */ t(c, {}),
+      o,
+      /* @__PURE__ */ t(i, {})
+    ]
+  }
+);
+export {
+  f as AttachmentsToolbarButtonTrigger
+};
+//# sourceMappingURL=AttachmentsToolbarButtonTrigger.es.js.map

package/dist/components/BlockItemWrapper/Toolbar/AttachmentsToolbarButton/AttachmentsToolbarButtonTrigger.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AttachmentsToolbarButtonTrigger.es.js","sources":["../../../../../src/components/BlockItemWrapper/Toolbar/AttachmentsToolbarButton/AttachmentsToolbarButtonTrigger.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { IconCaretDown12, IconPaperclip16 } from '@frontify/fondue';\nimport { type AttachmentsTriggerProps } from '../../../Attachments/types';\n\nimport { BaseToolbarButton } from '../BaseToolbarButton';\n\nexport const AttachmentsToolbarButtonTrigger = ({\n    children,\n    isFlyoutOpen,\n    triggerProps,\n    triggerRef,\n}: AttachmentsTriggerProps) => (\n    <BaseToolbarButton\n        forceActiveStyle={isFlyoutOpen}\n        data-test-id=\"attachments-toolbar-button-trigger\"\n        {...triggerProps}\n        ref={triggerRef}\n    >\n        <IconPaperclip16 />\n        {children}\n        <IconCaretDown12 />\n    </BaseToolbarButton>\n);\n"],"names":["AttachmentsToolbarButtonTrigger","children","isFlyoutOpen","triggerProps","triggerRef","jsxs","BaseToolbarButton","jsx","IconPaperclip16","IconCaretDown12"],"mappings":";;;AAOO,MAAMA,IAAkC,CAAC;AAAA,EAC5C,UAAAC;AAAA,EACA,cAAAC;AAAA,EACA,cAAAC;AAAA,EACA,YAAAC;AACJ,MACI,gBAAAC;AAAA,EAACC;AAAA,EAAA;AAAA,IACG,kBAAkBJ;AAAA,IAClB,gBAAa;AAAA,IACZ,GAAGC;AAAA,IACJ,KAAKC;AAAA,IAEL,UAAA;AAAA,MAAA,gBAAAG,EAACC,GAAgB,EAAA;AAAA,MAChBP;AAAA,wBACAQ,GAAgB,EAAA;AAAA,IAAA;AAAA,EAAA;AACrB;"}

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

@@ -0,0 +1,28 @@
+import { jsx as b } from "react/jsx-runtime";
+import { forwardRef as i } from "react";
+import { getToolbarButtonClassNames as l } from "./helpers.es.js";
+const n = i(
+  ({
+    onClick: t,
+    children: o,
+    forceActiveStyle: a,
+    cursor: r = "pointer",
+    "data-test-id": s = "base-toolbar-button",
+    ...e
+  }, m) => /* @__PURE__ */ b(
+    "button",
+    {
+      onClick: t,
+      className: l(r, a),
+      "data-test-id": s,
+      ...e,
+      ref: m,
+      children: o
+    }
+  )
+);
+n.displayName = "BaseToolbarButton";
+export {
+  n as BaseToolbarButton
+};
+//# sourceMappingURL=BaseToolbarButton.es.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"BaseToolbarButton.es.js","sources":["../../../../src/components/BlockItemWrapper/Toolbar/BaseToolbarButton.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type HTMLAttributes, type ReactNode, forwardRef } from 'react';\nimport { getToolbarButtonClassNames } from './helpers';\n\ntype BaseToolbarButtonProps = {\n    children: ReactNode;\n    forceActiveStyle?: boolean;\n    cursor?: 'pointer' | 'grab';\n    'data-test-id'?: string;\n} & HTMLAttributes<HTMLButtonElement>;\n\nexport const BaseToolbarButton = forwardRef<HTMLButtonElement, BaseToolbarButtonProps>(\n    (\n        {\n            onClick,\n            children,\n            forceActiveStyle,\n            cursor = 'pointer',\n            'data-test-id': dataTestId = 'base-toolbar-button',\n            ...props\n        },\n        ref,\n    ) => (\n        <button\n            onClick={onClick}\n            className={getToolbarButtonClassNames(cursor, forceActiveStyle)}\n            data-test-id={dataTestId}\n            {...props}\n            ref={ref}\n        >\n            {children}\n        </button>\n    ),\n);\n\nBaseToolbarButton.displayName = 'BaseToolbarButton';\n"],"names":["BaseToolbarButton","forwardRef","onClick","children","forceActiveStyle","cursor","dataTestId","props","ref","jsx","getToolbarButtonClassNames"],"mappings":";;;AAYO,MAAMA,IAAoBC;AAAA,EAC7B,CACI;AAAA,IACI,SAAAC;AAAA,IACA,UAAAC;AAAA,IACA,kBAAAC;AAAA,IACA,QAAAC,IAAS;AAAA,IACT,gBAAgBC,IAAa;AAAA,IAC7B,GAAGC;AAAA,KAEPC,MAEA,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,SAAAP;AAAA,MACA,WAAWQ,EAA2BL,GAAQD,CAAgB;AAAA,MAC9D,gBAAcE;AAAA,MACb,GAAGC;AAAA,MACJ,KAAAC;AAAA,MAEC,UAAAL;AAAA,IAAA;AAAA,EACL;AAER;AAEAH,EAAkB,cAAc;"}

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

@@ -0,0 +1,35 @@
+import { jsx as r } from "react/jsx-runtime";
+import { DEFAULT_DRAGGING_TOOLTIP as a, DEFAULT_DRAG_TOOLTIP as l } from "../../constants.es.js";
+import { useDragPreviewContext as m } from "../context/DragPreviewContext.es.js";
+import { BaseToolbarButton as c } from "../BaseToolbarButton.es.js";
+import { ToolbarButtonTooltip as p } from "../ToolbarButtonTooltip.es.js";
+const D = ({
+  tooltip: t,
+  icon: e,
+  setActivatorNodeRef: i,
+  draggableProps: n
+}) => {
+  const o = m();
+  return /* @__PURE__ */ r(
+    p,
+    {
+      open: o,
+      content: /* @__PURE__ */ r("div", { children: o ? a : t ?? l }),
+      children: /* @__PURE__ */ r(
+        c,
+        {
+          ref: i,
+          "data-test-id": "block-item-wrapper-toolbar-btn",
+          forceActiveStyle: o,
+          cursor: "grab",
+          ...n,
+          children: e
+        }
+      )
+    }
+  );
+};
+export {
+  D as DragHandleToolbarButton
+};
+//# sourceMappingURL=DragHandleToolbarButton.es.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"DragHandleToolbarButton.es.js","sources":["../../../../../src/components/BlockItemWrapper/Toolbar/DragHandleToolbarButton/DragHandleToolbarButton.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { ReactNode } from 'react';\nimport { DEFAULT_DRAGGING_TOOLTIP, DEFAULT_DRAG_TOOLTIP } from '../../constants';\nimport { useDragPreviewContext } from '../context/DragPreviewContext';\nimport { BaseToolbarButton } from '../BaseToolbarButton';\nimport { ToolbarButtonTooltip } from '../ToolbarButtonTooltip';\n\nexport type DragHandleToolbarButtonProps = {\n    icon?: ReactNode;\n    tooltip?: string;\n    draggableProps: Record<string, unknown>;\n    setActivatorNodeRef?: (node: HTMLElement | null) => void;\n};\n\nexport const DragHandleToolbarButton = ({\n    tooltip,\n    icon,\n    setActivatorNodeRef,\n    draggableProps,\n}: DragHandleToolbarButtonProps) => {\n    const isDragPreview = useDragPreviewContext();\n\n    return (\n        <ToolbarButtonTooltip\n            open={isDragPreview}\n            content={<div>{isDragPreview ? DEFAULT_DRAGGING_TOOLTIP : tooltip ?? DEFAULT_DRAG_TOOLTIP}</div>}\n        >\n            <BaseToolbarButton\n                ref={setActivatorNodeRef}\n                data-test-id=\"block-item-wrapper-toolbar-btn\"\n                forceActiveStyle={isDragPreview}\n                cursor=\"grab\"\n                {...draggableProps}\n            >\n                {icon}\n            </BaseToolbarButton>\n        </ToolbarButtonTooltip>\n    );\n};\n"],"names":["DragHandleToolbarButton","tooltip","icon","setActivatorNodeRef","draggableProps","isDragPreview","useDragPreviewContext","jsx","ToolbarButtonTooltip","DEFAULT_DRAGGING_TOOLTIP","DEFAULT_DRAG_TOOLTIP","BaseToolbarButton"],"mappings":";;;;;AAeO,MAAMA,IAA0B,CAAC;AAAA,EACpC,SAAAC;AAAA,EACA,MAAAC;AAAA,EACA,qBAAAC;AAAA,EACA,gBAAAC;AACJ,MAAoC;AAChC,QAAMC,IAAgBC;AAGlB,SAAA,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACG,MAAMH;AAAA,MACN,SAAU,gBAAAE,EAAA,OAAA,EAAK,UAAgBF,IAAAI,IAA2BR,KAAWS,GAAqB;AAAA,MAE1F,UAAA,gBAAAH;AAAA,QAACI;AAAA,QAAA;AAAA,UACG,KAAKR;AAAA,UACL,gBAAa;AAAA,UACb,kBAAkBE;AAAA,UAClB,QAAO;AAAA,UACN,GAAGD;AAAA,UAEH,UAAAF;AAAA,QAAA;AAAA,MACL;AAAA,IAAA;AAAA,EAAA;AAGZ;"}

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

@@ -0,0 +1,44 @@
+import { jsx as t } from "react/jsx-runtime";
+import { useDragPreviewContext as u } from "../context/DragPreviewContext.es.js";
+import { ToolbarButtonTooltip as p } from "../ToolbarButtonTooltip.es.js";
+import { useMemoizedId as h, Flyout as g, FlyoutPlacement as w } from "@frontify/fondue";
+import { BaseToolbarButton as x } from "../BaseToolbarButton.es.js";
+import { useMultiFlyoutState as y } from "../hooks/useMultiFlyoutState.es.js";
+const O = ({
+  content: r,
+  icon: i,
+  tooltip: l,
+  flyoutId: n,
+  flyoutFooter: a,
+  flyoutHeader: s
+}) => {
+  const m = h(n), { isOpen: e, onOpenChange: f } = y(m), o = u();
+  return /* @__PURE__ */ t(p, { disabled: o || e, content: l, children: /* @__PURE__ */ t("div", { className: "tw-flex tw-flex-shrink-0 tw-flex-1 tw-h-6 tw-relative", children: /* @__PURE__ */ t(
+    g,
+    {
+      isOpen: e && !o,
+      legacyFooter: !1,
+      fixedFooter: a,
+      fixedHeader: s,
+      fitContent: !0,
+      hug: !1,
+      placement: w.BottomRight,
+      onOpenChange: f,
+      trigger: (c, d) => /* @__PURE__ */ t(
+        x,
+        {
+          "data-test-id": "block-item-wrapper-toolbar-flyout",
+          forceActiveStyle: e && !o,
+          ...c,
+          ref: d,
+          children: i
+        }
+      ),
+      children: r
+    }
+  ) }) });
+};
+export {
+  O as FlyoutToolbarButton
+};
+//# sourceMappingURL=FlyoutToolbarButton.es.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"FlyoutToolbarButton.es.js","sources":["../../../../../src/components/BlockItemWrapper/Toolbar/FlyoutToolbarButton/FlyoutToolbarButton.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type MutableRefObject, type ReactNode } from 'react';\nimport { useDragPreviewContext } from '../context/DragPreviewContext';\nimport { ToolbarButtonTooltip } from '../ToolbarButtonTooltip';\nimport { Flyout, FlyoutPlacement, useMemoizedId } from '@frontify/fondue';\nimport { BaseToolbarButton } from '../BaseToolbarButton';\nimport { useMultiFlyoutState } from '../hooks/useMultiFlyoutState';\n\nexport type FlyoutToolbarButtonProps = {\n    content: ReactNode;\n    icon: ReactNode;\n    tooltip: ReactNode;\n    flyoutId: string;\n    flyoutFooter?: ReactNode;\n    flyoutHeader?: ReactNode;\n};\n\nexport const FlyoutToolbarButton = ({\n    content,\n    icon,\n    tooltip,\n    flyoutId,\n    flyoutFooter,\n    flyoutHeader,\n}: FlyoutToolbarButtonProps) => {\n    const id = useMemoizedId(flyoutId);\n\n    const { isOpen, onOpenChange } = useMultiFlyoutState(id);\n\n    const isDragPreview = useDragPreviewContext();\n\n    return (\n        <ToolbarButtonTooltip disabled={isDragPreview || isOpen} content={tooltip}>\n            <div className=\"tw-flex tw-flex-shrink-0 tw-flex-1 tw-h-6 tw-relative\">\n                <Flyout\n                    isOpen={isOpen && !isDragPreview}\n                    legacyFooter={false}\n                    fixedFooter={flyoutFooter}\n                    fixedHeader={flyoutHeader}\n                    fitContent\n                    hug={false}\n                    placement={FlyoutPlacement.BottomRight}\n                    onOpenChange={onOpenChange}\n                    trigger={(triggerProps, triggerRef) => (\n                        <BaseToolbarButton\n                            data-test-id=\"block-item-wrapper-toolbar-flyout\"\n                            forceActiveStyle={isOpen && !isDragPreview}\n                            {...triggerProps}\n                            ref={triggerRef as MutableRefObject<HTMLButtonElement>}\n                        >\n                            {icon}\n                        </BaseToolbarButton>\n                    )}\n                >\n                    {content}\n                </Flyout>\n            </div>\n        </ToolbarButtonTooltip>\n    );\n};\n"],"names":["FlyoutToolbarButton","content","icon","tooltip","flyoutId","flyoutFooter","flyoutHeader","id","useMemoizedId","isOpen","onOpenChange","useMultiFlyoutState","isDragPreview","useDragPreviewContext","jsx","ToolbarButtonTooltip","Flyout","FlyoutPlacement","triggerProps","triggerRef","BaseToolbarButton"],"mappings":";;;;;;AAkBO,MAAMA,IAAsB,CAAC;AAAA,EAChC,SAAAC;AAAA,EACA,MAAAC;AAAA,EACA,SAAAC;AAAA,EACA,UAAAC;AAAA,EACA,cAAAC;AAAA,EACA,cAAAC;AACJ,MAAgC;AACtB,QAAAC,IAAKC,EAAcJ,CAAQ,GAE3B,EAAE,QAAAK,GAAQ,cAAAC,EAAa,IAAIC,EAAoBJ,CAAE,GAEjDK,IAAgBC;AAGlB,SAAA,gBAAAC,EAACC,GAAqB,EAAA,UAAUH,KAAiBH,GAAQ,SAASN,GAC9D,UAAA,gBAAAW,EAAC,OAAI,EAAA,WAAU,yDACX,UAAA,gBAAAA;AAAA,IAACE;AAAA,IAAA;AAAA,MACG,QAAQP,KAAU,CAACG;AAAA,MACnB,cAAc;AAAA,MACd,aAAaP;AAAA,MACb,aAAaC;AAAA,MACb,YAAU;AAAA,MACV,KAAK;AAAA,MACL,WAAWW,EAAgB;AAAA,MAC3B,cAAAP;AAAA,MACA,SAAS,CAACQ,GAAcC,MACpB,gBAAAL;AAAA,QAACM;AAAA,QAAA;AAAA,UACG,gBAAa;AAAA,UACb,kBAAkBX,KAAU,CAACG;AAAA,UAC5B,GAAGM;AAAA,UACJ,KAAKC;AAAA,UAEJ,UAAAjB;AAAA,QAAA;AAAA,MACL;AAAA,MAGH,UAAAD;AAAA,IAAA;AAAA,EAAA,EAET,CAAA,EACJ,CAAA;AAER;"}

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

@@ -0,0 +1,25 @@
+import { jsx as o } from "react/jsx-runtime";
+import { useMemoizedId as m, IconDotsHorizontal16 as e } from "@frontify/fondue";
+import { ToolbarFlyoutMenu as i } from "./ToolbarFlyoutMenu.es.js";
+import { FlyoutToolbarButton as l } from "../FlyoutToolbarButton/FlyoutToolbarButton.es.js";
+const s = "menu", d = ({
+  items: n,
+  flyoutId: r = s,
+  tooltip: u = "Options"
+}) => {
+  const t = m(r);
+  return /* @__PURE__ */ o(
+    l,
+    {
+      icon: /* @__PURE__ */ o(e, {}),
+      tooltip: u,
+      flyoutId: t,
+      content: /* @__PURE__ */ o(i, { items: n, flyoutId: t })
+    }
+  );
+};
+export {
+  s as DEFAULT_MENU_BUTTON_ID,
+  d as MenuToolbarButton
+};
+//# sourceMappingURL=MenuToolbarButton.es.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"MenuToolbarButton.es.js","sources":["../../../../../src/components/BlockItemWrapper/Toolbar/MenuToolbarButton/MenuToolbarButton.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { IconDotsHorizontal16, useMemoizedId } from '@frontify/fondue';\nimport { ToolbarFlyoutMenu, ToolbarFlyoutMenuItem } from './ToolbarFlyoutMenu';\nimport { FlyoutToolbarButton } from '../FlyoutToolbarButton/FlyoutToolbarButton';\n\nexport const DEFAULT_MENU_BUTTON_ID = 'menu';\n\nexport type MenuToolbarButtonProps = {\n    items: ToolbarFlyoutMenuItem[][];\n    flyoutId?: string;\n    tooltip?: string;\n};\n\nexport const MenuToolbarButton = ({\n    items,\n    flyoutId = DEFAULT_MENU_BUTTON_ID,\n    tooltip = 'Options',\n}: MenuToolbarButtonProps) => {\n    const id = useMemoizedId(flyoutId);\n\n    return (\n        <FlyoutToolbarButton\n            icon={<IconDotsHorizontal16 />}\n            tooltip={tooltip}\n            flyoutId={id}\n            content={<ToolbarFlyoutMenu items={items} flyoutId={id} />}\n        />\n    );\n};\n"],"names":["DEFAULT_MENU_BUTTON_ID","MenuToolbarButton","items","flyoutId","tooltip","id","useMemoizedId","jsx","FlyoutToolbarButton","IconDotsHorizontal16","ToolbarFlyoutMenu"],"mappings":";;;;AAMO,MAAMA,IAAyB,QAQzBC,IAAoB,CAAC;AAAA,EAC9B,OAAAC;AAAA,EACA,UAAAC,IAAWH;AAAA,EACX,SAAAI,IAAU;AACd,MAA8B;AACpB,QAAAC,IAAKC,EAAcH,CAAQ;AAG7B,SAAA,gBAAAI;AAAA,IAACC;AAAA,IAAA;AAAA,MACG,wBAAOC,GAAqB,EAAA;AAAA,MAC5B,SAAAL;AAAA,MACA,UAAUC;AAAA,MACV,SAAS,gBAAAE,EAACG,GAAkB,EAAA,OAAAR,GAAc,UAAUG,GAAI;AAAA,IAAA;AAAA,EAAA;AAGpE;"}

package/dist/components/BlockItemWrapper/Toolbar/MenuToolbarButton/ToolbarFlyoutMenu.es.js

@@ -0,0 +1,29 @@
+import { jsx as e } from "react/jsx-runtime";
+import { ActionMenu as m, MenuItemContentSize as s } from "@frontify/fondue";
+import { useMultiFlyoutState as u } from "../hooks/useMultiFlyoutState.es.js";
+const d = ({ items: n, flyoutId: i }) => {
+  const { onOpenChange: r } = u(i);
+  return /* @__PURE__ */ e(
+    m,
+    {
+      menuBlocks: n.map((l, o) => ({
+        id: o.toString(),
+        menuItems: l.map((t, a) => ({
+          id: o.toString() + a.toString(),
+          size: s.XSmall,
+          title: t.title,
+          style: t.style,
+          onClick: () => {
+            r(!1), t.onClick();
+          },
+          initialValue: !0,
+          decorator: /* @__PURE__ */ e("div", { className: "tw-mr-2", children: t.icon })
+        }))
+      }))
+    }
+  );
+};
+export {
+  d as ToolbarFlyoutMenu
+};
+//# sourceMappingURL=ToolbarFlyoutMenu.es.js.map

package/dist/components/BlockItemWrapper/Toolbar/MenuToolbarButton/ToolbarFlyoutMenu.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToolbarFlyoutMenu.es.js","sources":["../../../../../src/components/BlockItemWrapper/Toolbar/MenuToolbarButton/ToolbarFlyoutMenu.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { ActionMenu, MenuItemContentSize, MenuItemStyle } from '@frontify/fondue';\nimport { useMultiFlyoutState } from '../hooks/useMultiFlyoutState';\n\nexport type ToolbarFlyoutMenuItem = {\n    title: string;\n    onClick: () => void;\n    icon: JSX.Element;\n    style?: MenuItemStyle;\n};\n\nexport type ToolbarFlyoutMenuProps = {\n    items: ToolbarFlyoutMenuItem[][];\n    flyoutId: string;\n};\n\nexport const ToolbarFlyoutMenu = ({ items, flyoutId }: ToolbarFlyoutMenuProps) => {\n    const { onOpenChange } = useMultiFlyoutState(flyoutId);\n\n    return (\n        <ActionMenu\n            menuBlocks={items.map((block, blockIndex) => ({\n                id: blockIndex.toString(),\n                menuItems: block.map((item, itemIndex) => ({\n                    id: blockIndex.toString() + itemIndex.toString(),\n                    size: MenuItemContentSize.XSmall,\n                    title: item.title,\n                    style: item.style,\n                    onClick: () => {\n                        onOpenChange(false);\n                        item.onClick();\n                    },\n                    initialValue: true,\n                    decorator: <div className=\"tw-mr-2\">{item.icon}</div>,\n                })),\n            }))}\n        />\n    );\n};\n"],"names":["ToolbarFlyoutMenu","items","flyoutId","onOpenChange","useMultiFlyoutState","jsx","ActionMenu","block","blockIndex","item","itemIndex","MenuItemContentSize"],"mappings":";;;AAiBO,MAAMA,IAAoB,CAAC,EAAE,OAAAC,GAAO,UAAAC,QAAuC;AAC9E,QAAM,EAAE,cAAAC,EAAA,IAAiBC,EAAoBF,CAAQ;AAGjD,SAAA,gBAAAG;AAAA,IAACC;AAAA,IAAA;AAAA,MACG,YAAYL,EAAM,IAAI,CAACM,GAAOC,OAAgB;AAAA,QAC1C,IAAIA,EAAW,SAAS;AAAA,QACxB,WAAWD,EAAM,IAAI,CAACE,GAAMC,OAAe;AAAA,UACvC,IAAIF,EAAW,aAAaE,EAAU,SAAS;AAAA,UAC/C,MAAMC,EAAoB;AAAA,UAC1B,OAAOF,EAAK;AAAA,UACZ,OAAOA,EAAK;AAAA,UACZ,SAAS,MAAM;AACX,YAAAN,EAAa,EAAK,GAClBM,EAAK,QAAQ;AAAA,UACjB;AAAA,UACA,cAAc;AAAA,UACd,WAAY,gBAAAJ,EAAA,OAAA,EAAI,WAAU,WAAW,YAAK,MAAK;AAAA,QAAA,EACjD;AAAA,MAAA,EACJ;AAAA,IAAA;AAAA,EAAA;AAGd;"}

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

@@ -1,123 +1,22 @@
-import { jsxs as p, jsx as e } from "react/jsx-runtime";
-import { LegacyTooltip as a, TooltipPosition as s, Flyout as h, IconDotsHorizontal16 as b, ActionMenu as O, MenuItemContentSize as T } from "@frontify/fondue";
-import { DEFAULT_DRAGGING_TOOLTIP as v, DEFAULT_DRAG_TOOLTIP as f } from "../constants.es.js";
-import { ToolbarSegment as c } from "./ToolbarSegment.es.js";
-import { ToolbarAttachments as C } from "./ToolbarAttachments.es.js";
-import { getToolbarButtonClassNames as d } from "./helpers.es.js";
-const y = ({ items: m, flyoutMenu: r, attachments: l, isDragging: o }) => /* @__PURE__ */ p(
+import { jsxs as n, jsx as t } from "react/jsx-runtime";
+import { ToolbarSegment as r } from "./ToolbarSegment.es.js";
+import { AttachmentsToolbarButton as a } from "./AttachmentsToolbarButton/AttachmentsToolbarButton.es.js";
+import { DragHandleToolbarButton as p } from "./DragHandleToolbarButton/DragHandleToolbarButton.es.js";
+import { MenuToolbarButton as d } from "./MenuToolbarButton/MenuToolbarButton.es.js";
+import { FlyoutToolbarButton as i } from "./FlyoutToolbarButton/FlyoutToolbarButton.es.js";
+import { ToolbarButton as s } from "./ToolbarButton/ToolbarButton.es.js";
+const g = ({ items: e, attachments: l }) => /* @__PURE__ */ n(
   "div",
   {
     "data-test-id": "block-item-wrapper-toolbar",
     className: "tw-rounded-md tw-bg-base tw-border tw-border-line-strong tw-divide-x tw-divide-line-strong tw-shadow-lg tw-flex tw-flex-none tw-items-center tw-isolate",
     children: [
-      l.isEnabled && /* @__PURE__ */ e(c, { children: /* @__PURE__ */ e(
-        C,
-        {
-          isOpen: l.isOpen && !o,
-          onOpenChange: l.onOpenChange
-        }
-      ) }),
-      /* @__PURE__ */ p(c, { children: [
-        m.map(
-          (t, n) => "draggableProps" in t ? /* @__PURE__ */ e(
-            a,
-            {
-              withArrow: !0,
-              hoverDelay: 0,
-              enterDelay: 300,
-              open: o,
-              position: s.Top,
-              content: /* @__PURE__ */ e("div", { children: o ? v : t.tooltip ?? f }),
-              triggerElement: /* @__PURE__ */ e(
-                "button",
-                {
-                  ref: t.setActivatorNodeRef,
-                  "data-test-id": "block-item-wrapper-toolbar-btn",
-                  ...t.draggableProps,
-                  className: d("grab", o),
-                  children: t.icon
-                }
-              )
-            },
-            n
-          ) : /* @__PURE__ */ e(
-            a,
-            {
-              withArrow: !0,
-              enterDelay: 300,
-              hoverDelay: 0,
-              disabled: o,
-              position: s.Top,
-              content: /* @__PURE__ */ e("div", { children: t.tooltip ?? "" }),
-              triggerElement: /* @__PURE__ */ e(
-                "button",
-                {
-                  "data-test-id": "block-item-wrapper-toolbar-btn",
-                  onClick: t.onClick,
-                  className: d("pointer"),
-                  children: t.icon
-                }
-              )
-            },
-            n
-          )
-        ),
-        r.items.length > 0 && /* @__PURE__ */ e(
-          a,
-          {
-            withArrow: !0,
-            hoverDelay: 0,
-            enterDelay: 300,
-            disabled: o || r.isOpen,
-            position: s.Top,
-            content: /* @__PURE__ */ e("div", { children: "Options" }),
-            triggerElement: /* @__PURE__ */ e("div", { className: "tw-flex tw-flex-shrink-0 tw-flex-1 tw-h-6 tw-relative", children: /* @__PURE__ */ e(
-              h,
-              {
-                isOpen: r.isOpen && !o,
-                legacyFooter: !1,
-                fitContent: !0,
-                hug: !1,
-                onOpenChange: r.onOpenChange,
-                trigger: /* @__PURE__ */ e(
-                  "div",
-                  {
-                    "data-test-id": "block-item-wrapper-toolbar-flyout",
-                    className: d(
-                      "pointer",
-                      r.isOpen && !o
-                    ),
-                    children: /* @__PURE__ */ e(b, {})
-                  }
-                ),
-                children: /* @__PURE__ */ e(
-                  O,
-                  {
-                    menuBlocks: r.items.map((t, n) => ({
-                      id: n.toString(),
-                      menuItems: t.map((i, w) => ({
-                        id: n.toString() + w.toString(),
-                        size: T.XSmall,
-                        title: i.title,
-                        style: i.style,
-                        onClick: () => {
-                          r.onOpenChange(!1), i.onClick();
-                        },
-                        initialValue: !0,
-                        decorator: /* @__PURE__ */ e("div", { className: "tw-mr-2", children: i.icon })
-                      }))
-                    }))
-                  }
-                )
-              }
-            ) })
-          }
-        )
-      ] })
+      l.isEnabled && /* @__PURE__ */ t(r, { children: /* @__PURE__ */ t(a, {}) }),
+      /* @__PURE__ */ t(r, { children: e.map((o) => o.type === "dragHandle" ? /* @__PURE__ */ t(p, { ...o }, o.tooltip + o.type) : o.type === "menu" ? /* @__PURE__ */ t(d, { ...o }, o.tooltip + o.type) : o.type === "flyout" ? /* @__PURE__ */ t(i, { ...o }, o.tooltip + o.type) : /* @__PURE__ */ t(s, { ...o }, o.tooltip + o.type)) })
     ]
   }
 );
 export {
-  y as Toolbar
+  g as Toolbar
 };
 //# sourceMappingURL=Toolbar.es.js.map