npm - @frontify/guideline-blocks-settings - Versions diffs - 1.0.3 → 1.0.4 - Mend

@frontify/guideline-blocks-settings 1.0.3 → 1.0.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (849) hide show

package/dist/components/Attachments/AttachmentItem.es.js CHANGED Viewed

@@ -1,11 +1,11 @@
-import { jsxs as i, jsx as o } from "react/jsx-runtime";
+import { jsx as o, jsxs as i } from "react/jsx-runtime";
 import { useSortable as z } from "@dnd-kit/sortable";
 import { useFileInput as R, useAssetUpload as A } from "@frontify/app-bridge";
-import { FOCUS_STYLE as $, IconGrabHandle20 as j, IconImage24 as D, IconPlayFrame24 as E, IconMusicNote24 as G, IconDocument24 as T } from "@frontify/fondue";
+import { IconGrabHandle20 as $, FOCUS_STYLE as j, IconImage24 as D, IconPlayFrame24 as E, IconMusicNote24 as G, IconDocument24 as T } from "@frontify/fondue";
 import { useFocusRing as U } from "@react-aria/focus";
 import { forwardRef as L, useState as B, useEffect as y } from "react";
 import { joinClassNames as g } from "../../utilities/react/joinClassNames.es.js";
-import { Button as H } from "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components6.es.js";
+import { Button as H } from "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components6.es.js";
 import "../../node_modules/.pnpm/@frontify_fondue-icons@0.17.0_react@18.3.1/node_modules/@frontify/fondue-icons/dist/fondue-icons4.es.js";
 import "../../node_modules/.pnpm/@frontify_fondue-icons@0.17.0_react@18.3.1/node_modules/@frontify/fondue-icons/dist/fondue-icons5.es.js";
 import "../../node_modules/.pnpm/@frontify_fondue-icons@0.17.0_react@18.3.1/node_modules/@frontify/fondue-icons/dist/fondue-icons6.es.js";
@@ -354,31 +354,31 @@ import "../../node_modules/.pnpm/@frontify_fondue-icons@0.17.0_react@18.3.1/node
 import "../../node_modules/.pnpm/@frontify_fondue-icons@0.17.0_react@18.3.1/node_modules/@frontify/fondue-icons/dist/fondue-icons349.es.js";
 import "../../node_modules/.pnpm/@frontify_fondue-icons@0.17.0_react@18.3.1/node_modules/@frontify/fondue-icons/dist/fondue-icons350.es.js";
 import "../../node_modules/.pnpm/@frontify_fondue-icons@0.17.0_react@18.3.1/node_modules/@frontify/fondue-icons/dist/fondue-icons351.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components5.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components7.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components8.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components9.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components10.es.js";
-import { Dropdown as m } from "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components11.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components12.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components13.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components14.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components15.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components16.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components17.es.js";
-import { LoadingCircle as Q } from "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components18.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components19.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components20.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components21.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components22.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components23.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components24.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components25.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components26.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components27.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components28.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components29.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components30.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components5.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components7.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components8.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components9.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components10.es.js";
+import { Dropdown as m } from "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components11.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components12.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components13.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components14.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components15.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components16.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components17.es.js";
+import { LoadingCircle as Q } from "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components18.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components19.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components20.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components21.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components22.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components23.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components24.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components25.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components26.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components27.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components28.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components29.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components30.es.js";
 const Y = (r) => r === "IMAGE" ? /* @__PURE__ */ o(D, {}) : r === "VIDEO" ? /* @__PURE__ */ o(E, {}) : r === "AUDIO" ? /* @__PURE__ */ o(G, {}) : /* @__PURE__ */ o(T, {}), S = L(
   ({
     item: r,
@@ -440,10 +440,10 @@ const Y = (r) => r === "IMAGE" ? /* @__PURE__ */ o(D, {}) : r === "VIDEO" ? /* @
                     className: g([
                       " tw-border-button-border tw-bg-button-background active:tw-bg-button-background-pressed tw-group tw-border tw-box-box tw-relative tw-flex tw-items-center tw-justify-center tw-outline-none tw-font-medium tw-rounded tw-h-9 tw-w-9 ",
                       p || a ? "tw-cursor-grabbing tw-bg-button-background-pressed hover:tw-bg-button-background-pressed" : "tw-cursor-grab hover:tw-bg-button-background-hover",
-                      v && $,
+                      v && j,
                       v && "tw-z-[2]"
                     ]),
-                    children: /* @__PURE__ */ o(j, {})
+                    children: /* @__PURE__ */ o($, {})
                   }
                 ),
                 /* @__PURE__ */ o("div", { "data-test-id": "attachments-actionbar-flyout", children: /* @__PURE__ */ i(

package/dist/components/Attachments/AttachmentItem.es.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AttachmentItem.es.js","sources":["../../../src/components/Attachments/AttachmentItem.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. /\n\nimport { useSortable } from '@dnd-kit/sortable';\nimport { type Asset, useAssetUpload, useFileInput } from '@frontify/app-bridge';\nimport {\n FOCUS_STYLE,\n IconDocument24,\n IconGrabHandle20,\n IconImage24,\n IconMusicNote24,\n IconPlayFrame24,\n} from '@frontify/fondue';\nimport { LoadingCircle, Dropdown, Button } from '@frontify/fondue/components';\nimport { IconArrowCircleUp, IconImageStack, IconPen, IconTrashBin } from '@frontify/fondue/icons';\nimport { useFocusRing } from '@react-aria/focus';\nimport { type MutableRefObject, forwardRef, useEffect, useState } from 'react';\n\nimport { joinClassNames } from '../../utilities';\n\nimport { type AttachmentItemProps, type SortableAttachmentItemProps } from './types';\n\nconst getDecorator = (type: string) => {\n if (type === 'IMAGE') {\n return <IconImage24 />;\n } else if (type === 'VIDEO') {\n return <IconPlayFrame24 />;\n } else if (type === 'AUDIO') {\n return <IconMusicNote24 />;\n } else {\n return <IconDocument24 />;\n }\n};\n\nexport const AttachmentItem = forwardRef<HTMLButtonElement, AttachmentItemProps>(\n (\n {\n item,\n isEditing,\n draggableProps,\n transformStyle,\n isDragging,\n isOverlay,\n isLoading,\n onDelete,\n onReplaceWithBrowse,\n onReplaceWithUpload,\n onDownload,\n },\n ref,\n ) => {\n const [selectedAsset, setSelectedAsset] = useState<Asset \| undefined>();\n const [openFileDialog, { selectedFiles }] = useFileInput({ multiple: true, accept: 'image/' });\n const [uploadFile, { results: uploadResults, doneAll }] = useAssetUpload();\n\n const { focusProps, isFocusVisible } = useFocusRing();\n\n useEffect(() => {\n if (selectedFiles) {\n uploadFile(selectedFiles[0]);\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [selectedFiles]);\n\n useEffect(() => {\n if (doneAll) {\n onReplaceWithUpload(uploadResults[0]);\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [doneAll, uploadResults]);\n\n const showLoadingCircle = isLoading \|\| (selectedFiles && !doneAll);\n\n return (\n <button\n aria-label=\"Download attachment\"\n data-test-id=\"attachments-item\"\n onClick={() => !selectedAsset && onDownload?.()}\n ref={ref}\n style={{\n ...transformStyle,\n opacity: isDragging && !isOverlay ? 0.3 : 1,\n fontFamily: 'var(-f-theme-settings-body-font-family)',\n }}\n className={joinClassNames([\n 'tw-cursor-pointer tw-text-left tw-w-full tw-relative tw-flex tw-gap-3 tw-px-5 tw-py-3 tw-items-center tw-group hover:tw-bg-box-neutral-hover',\n isDragging ? 'tw-bg-box-neutral-hover' : '',\n ])}\n >\n <div className=\"tw-text-text-weak group-hover:tw-text-box-neutral-inverse-hover\">\n {showLoadingCircle ? <LoadingCircle size=\"small\" /> : getDecorator(item.objectType)}\n </div>\n <div className=\"tw-text-s tw-flex-1 tw-min-w-0\">\n <div className=\"tw-whitespace-nowrap tw-overflow-hidden tw-text-ellipsis tw-font-bold tw-text-text-weak group-hover:tw-text-box-neutral-inverse-hover\">\n {item.title}\n </div>\n <div className=\"tw-text-text-weak\">{`${item.fileSizeHumanReadable} - ${item.extension}`}</div>\n </div>\n {isEditing && (\n <div\n data-test-id=\"attachments-actionbar\"\n className={joinClassNames([\n 'tw-flex tw-gap-0.5 group-focus:tw-opacity-100 focus-visible:tw-opacity-100 focus-within:tw-opacity-100 group-hover:tw-opacity-100',\n isOverlay \|\| selectedAsset?.id === item.id ? 'tw-opacity-100' : 'tw-opacity-0',\n ])}\n >\n <button\n {...focusProps}\n {...draggableProps}\n aria-label=\"Drag attachment\"\n className={joinClassNames([\n ' tw-border-button-border tw-bg-button-background active:tw-bg-button-background-pressed tw-group tw-border tw-box-box tw-relative tw-flex tw-items-center tw-justify-center tw-outline-none tw-font-medium tw-rounded tw-h-9 tw-w-9 ',\n isDragging \|\| isOverlay\n ? 'tw-cursor-grabbing tw-bg-button-background-pressed hover:tw-bg-button-background-pressed'\n : 'tw-cursor-grab hover:tw-bg-button-background-hover',\n isFocusVisible && FOCUS_STYLE,\n isFocusVisible && 'tw-z-[2]',\n ])}\n >\n <IconGrabHandle20 />\n </button>\n <div data-test-id=\"attachments-actionbar-flyout\">\n <Dropdown.Root\n open={selectedAsset?.id === item.id}\n onOpenChange={(isOpen) => setSelectedAsset(isOpen ? item : undefined)}\n >\n <Dropdown.Trigger>\n <Button\n aspect=\"square\"\n ref={ref as MutableRefObject<HTMLButtonElement>}\n onPress={(e) => {\n e?.stopPropagation();\n e?.preventDefault();\n }}\n emphasis=\"default\"\n >\n <IconPen size=\"20\" />\n </Button>\n </Dropdown.Trigger>\n <Dropdown.Content side=\"right\">\n <Dropdown.Group>\n <Dropdown.Item\n data-test-id=\"menu-item\"\n onSelect={(event) => {\n event?.stopPropagation();\n openFileDialog();\n setSelectedAsset(undefined);\n }}\n >\n <IconArrowCircleUp size=\"20\" />\n Replace with upload\n </Dropdown.Item>\n <Dropdown.Item\n onSelect={(event) => {\n event?.stopPropagation();\n onReplaceWithBrowse();\n setSelectedAsset(undefined);\n }}\n >\n <IconImageStack size=\"20\" />\n Replace with asset\n </Dropdown.Item>\n </Dropdown.Group>\n <Dropdown.Group>\n <Dropdown.Item\n emphasis=\"danger\"\n onSelect={(event) => {\n event?.stopPropagation();\n onDelete();\n setSelectedAsset(undefined);\n }}\n >\n <IconTrashBin size=\"20\" />\n Delete\n </Dropdown.Item>\n </Dropdown.Group>\n </Dropdown.Content>\n </Dropdown.Root>\n </div>\n </div>\n )}\n </button>\n );\n },\n);\n\nAttachmentItem.displayName = 'AttachmentItem';\n\nexport const SortableAttachmentItem = (props: SortableAttachmentItemProps) => {\n const { attributes, listeners, setNodeRef, transform, transition, isDragging } = useSortable({\n id: props.item.id,\n });\n\n const transformStyle = {\n transform: transform ? `translate(${transform.x}px, ${transform.y}px)` : '',\n transition,\n zIndex: isDragging ? 2 : 1,\n };\n\n const draggableProps = { ...attributes, ...listeners };\n\n return (\n <AttachmentItem\n ref={setNodeRef}\n isDragging={isDragging}\n transformStyle={transformStyle}\n draggableProps={draggableProps}\n {...props}\n />\n );\n};\n"],"names":["getDecorator","type","IconImage24","IconPlayFrame24","IconMusicNote24","IconDocument24","AttachmentItem","forwardRef","item","isEditing","draggableProps","transformStyle","isDragging","isOverlay","isLoading","onDelete","onReplaceWithBrowse","onReplaceWithUpload","onDownload","ref","selectedAsset","setSelectedAsset","useState","openFileDialog","selectedFiles","useFileInput","uploadFile","uploadResults","doneAll","useAssetUpload","focusProps","isFocusVisible","useFocusRing","useEffect","showLoadingCircle","jsxs","joinClassNames","jsx","LoadingCircle","FOCUS_STYLE","IconGrabHandle20","Dropdown","isOpen","Button","e","IconPen","event","IconArrowCircleUp","IconImageStack","IconTrashBin","SortableAttachmentItem","props","attributes","listeners","setNodeRef","transform","transition","useSortable"],"mappings":"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"}
1	+ {"version":3,"file":"AttachmentItem.es.js","sources":["../../../src/components/Attachments/AttachmentItem.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. /\n\nimport { useSortable } from '@dnd-kit/sortable';\nimport { type Asset, useAssetUpload, useFileInput } from '@frontify/app-bridge';\nimport {\n FOCUS_STYLE,\n IconDocument24,\n IconGrabHandle20,\n IconImage24,\n IconMusicNote24,\n IconPlayFrame24,\n} from '@frontify/fondue';\nimport { LoadingCircle, Dropdown, Button } from '@frontify/fondue/components';\nimport { IconArrowCircleUp, IconImageStack, IconPen, IconTrashBin } from '@frontify/fondue/icons';\nimport { useFocusRing } from '@react-aria/focus';\nimport { type MutableRefObject, forwardRef, useEffect, useState } from 'react';\n\nimport { joinClassNames } from '../../utilities';\n\nimport { type AttachmentItemProps, type SortableAttachmentItemProps } from './types';\n\nconst getDecorator = (type: string) => {\n if (type === 'IMAGE') {\n return <IconImage24 />;\n } else if (type === 'VIDEO') {\n return <IconPlayFrame24 />;\n } else if (type === 'AUDIO') {\n return <IconMusicNote24 />;\n } else {\n return <IconDocument24 />;\n }\n};\n\nexport const AttachmentItem = forwardRef<HTMLButtonElement, AttachmentItemProps>(\n (\n {\n item,\n isEditing,\n draggableProps,\n transformStyle,\n isDragging,\n isOverlay,\n isLoading,\n onDelete,\n onReplaceWithBrowse,\n onReplaceWithUpload,\n onDownload,\n },\n ref,\n ) => {\n const [selectedAsset, setSelectedAsset] = useState<Asset \| undefined>();\n const [openFileDialog, { selectedFiles }] = useFileInput({ multiple: true, accept: 'image/' });\n const [uploadFile, { results: uploadResults, doneAll }] = useAssetUpload();\n\n const { focusProps, isFocusVisible } = useFocusRing();\n\n useEffect(() => {\n if (selectedFiles) {\n uploadFile(selectedFiles[0]);\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [selectedFiles]);\n\n useEffect(() => {\n if (doneAll) {\n onReplaceWithUpload(uploadResults[0]);\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [doneAll, uploadResults]);\n\n const showLoadingCircle = isLoading \|\| (selectedFiles && !doneAll);\n\n return (\n <button\n aria-label=\"Download attachment\"\n data-test-id=\"attachments-item\"\n onClick={() => !selectedAsset && onDownload?.()}\n ref={ref}\n style={{\n ...transformStyle,\n opacity: isDragging && !isOverlay ? 0.3 : 1,\n fontFamily: 'var(-f-theme-settings-body-font-family)',\n }}\n className={joinClassNames([\n 'tw-cursor-pointer tw-text-left tw-w-full tw-relative tw-flex tw-gap-3 tw-px-5 tw-py-3 tw-items-center tw-group hover:tw-bg-box-neutral-hover',\n isDragging ? 'tw-bg-box-neutral-hover' : '',\n ])}\n >\n <div className=\"tw-text-text-weak group-hover:tw-text-box-neutral-inverse-hover\">\n {showLoadingCircle ? <LoadingCircle size=\"small\" /> : getDecorator(item.objectType)}\n </div>\n <div className=\"tw-text-s tw-flex-1 tw-min-w-0\">\n <div className=\"tw-whitespace-nowrap tw-overflow-hidden tw-text-ellipsis tw-font-bold tw-text-text-weak group-hover:tw-text-box-neutral-inverse-hover\">\n {item.title}\n </div>\n <div className=\"tw-text-text-weak\">{`${item.fileSizeHumanReadable} - ${item.extension}`}</div>\n </div>\n {isEditing && (\n <div\n data-test-id=\"attachments-actionbar\"\n className={joinClassNames([\n 'tw-flex tw-gap-0.5 group-focus:tw-opacity-100 focus-visible:tw-opacity-100 focus-within:tw-opacity-100 group-hover:tw-opacity-100',\n isOverlay \|\| selectedAsset?.id === item.id ? 'tw-opacity-100' : 'tw-opacity-0',\n ])}\n >\n <button\n {...focusProps}\n {...draggableProps}\n aria-label=\"Drag attachment\"\n className={joinClassNames([\n ' tw-border-button-border tw-bg-button-background active:tw-bg-button-background-pressed tw-group tw-border tw-box-box tw-relative tw-flex tw-items-center tw-justify-center tw-outline-none tw-font-medium tw-rounded tw-h-9 tw-w-9 ',\n isDragging \|\| isOverlay\n ? 'tw-cursor-grabbing tw-bg-button-background-pressed hover:tw-bg-button-background-pressed'\n : 'tw-cursor-grab hover:tw-bg-button-background-hover',\n isFocusVisible && FOCUS_STYLE,\n isFocusVisible && 'tw-z-[2]',\n ])}\n >\n <IconGrabHandle20 />\n </button>\n <div data-test-id=\"attachments-actionbar-flyout\">\n <Dropdown.Root\n open={selectedAsset?.id === item.id}\n onOpenChange={(isOpen) => setSelectedAsset(isOpen ? item : undefined)}\n >\n <Dropdown.Trigger>\n <Button\n aspect=\"square\"\n ref={ref as MutableRefObject<HTMLButtonElement>}\n onPress={(e) => {\n e?.stopPropagation();\n e?.preventDefault();\n }}\n emphasis=\"default\"\n >\n <IconPen size=\"20\" />\n </Button>\n </Dropdown.Trigger>\n <Dropdown.Content side=\"right\">\n <Dropdown.Group>\n <Dropdown.Item\n data-test-id=\"menu-item\"\n onSelect={(event) => {\n event?.stopPropagation();\n openFileDialog();\n setSelectedAsset(undefined);\n }}\n >\n <IconArrowCircleUp size=\"20\" />\n Replace with upload\n </Dropdown.Item>\n <Dropdown.Item\n onSelect={(event) => {\n event?.stopPropagation();\n onReplaceWithBrowse();\n setSelectedAsset(undefined);\n }}\n >\n <IconImageStack size=\"20\" />\n Replace with asset\n </Dropdown.Item>\n </Dropdown.Group>\n <Dropdown.Group>\n <Dropdown.Item\n emphasis=\"danger\"\n onSelect={(event) => {\n event?.stopPropagation();\n onDelete();\n setSelectedAsset(undefined);\n }}\n >\n <IconTrashBin size=\"20\" />\n Delete\n </Dropdown.Item>\n </Dropdown.Group>\n </Dropdown.Content>\n </Dropdown.Root>\n </div>\n </div>\n )}\n </button>\n );\n },\n);\n\nAttachmentItem.displayName = 'AttachmentItem';\n\nexport const SortableAttachmentItem = (props: SortableAttachmentItemProps) => {\n const { attributes, listeners, setNodeRef, transform, transition, isDragging } = useSortable({\n id: props.item.id,\n });\n\n const transformStyle = {\n transform: transform ? `translate(${transform.x}px, ${transform.y}px)` : '',\n transition,\n zIndex: isDragging ? 2 : 1,\n };\n\n const draggableProps = { ...attributes, ...listeners };\n\n return (\n <AttachmentItem\n ref={setNodeRef}\n isDragging={isDragging}\n transformStyle={transformStyle}\n draggableProps={draggableProps}\n {...props}\n />\n );\n};\n"],"names":["getDecorator","type","IconImage24","IconPlayFrame24","IconMusicNote24","IconDocument24","AttachmentItem","forwardRef","item","isEditing","draggableProps","transformStyle","isDragging","isOverlay","isLoading","onDelete","onReplaceWithBrowse","onReplaceWithUpload","onDownload","ref","selectedAsset","setSelectedAsset","useState","openFileDialog","selectedFiles","useFileInput","uploadFile","uploadResults","doneAll","useAssetUpload","focusProps","isFocusVisible","useFocusRing","useEffect","showLoadingCircle","jsxs","joinClassNames","jsx","LoadingCircle","FOCUS_STYLE","IconGrabHandle20","Dropdown","isOpen","Button","e","IconPen","event","IconArrowCircleUp","IconImageStack","IconTrashBin","SortableAttachmentItem","props","attributes","listeners","setNodeRef","transform","transition","useSortable"],"mappings":"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"}

package/dist/components/Attachments/Attachments.es.js CHANGED Viewed

@@ -7,7 +7,7 @@ import { AssetInput as ct, AssetInputSize as ut } from "@frontify/fondue";
 import { useState as e, useEffect as f } from "react";
 import { SortableAttachmentItem as ht } from "./AttachmentItem.es.js";
 import { AttachmentsButtonTrigger as gt } from "./AttachmentsButtonTrigger.es.js";
-import { Tooltip as w } from "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components30.es.js";
+import { Tooltip as w } from "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components30.es.js";
 import "../../node_modules/.pnpm/@frontify_fondue-icons@0.17.0_react@18.3.1/node_modules/@frontify/fondue-icons/dist/fondue-icons4.es.js";
 import "../../node_modules/.pnpm/@frontify_fondue-icons@0.17.0_react@18.3.1/node_modules/@frontify/fondue-icons/dist/fondue-icons5.es.js";
 import "../../node_modules/.pnpm/@frontify_fondue-icons@0.17.0_react@18.3.1/node_modules/@frontify/fondue-icons/dist/fondue-icons6.es.js";
@@ -356,31 +356,31 @@ import "../../node_modules/.pnpm/@frontify_fondue-icons@0.17.0_react@18.3.1/node
 import "../../node_modules/.pnpm/@frontify_fondue-icons@0.17.0_react@18.3.1/node_modules/@frontify/fondue-icons/dist/fondue-icons349.es.js";
 import "../../node_modules/.pnpm/@frontify_fondue-icons@0.17.0_react@18.3.1/node_modules/@frontify/fondue-icons/dist/fondue-icons350.es.js";
 import "../../node_modules/.pnpm/@frontify_fondue-icons@0.17.0_react@18.3.1/node_modules/@frontify/fondue-icons/dist/fondue-icons351.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components5.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components6.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components7.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components8.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components9.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components10.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components11.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components12.es.js";
-import { Flyout as y } from "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components13.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components14.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components15.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components16.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components17.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components18.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components19.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components20.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components21.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components22.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components23.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components24.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components25.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components26.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components27.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components28.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components29.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components5.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components6.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components7.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components8.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components9.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components10.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components11.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components12.es.js";
+import { Flyout as y } from "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components13.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components14.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components15.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components16.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components17.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components18.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components19.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components20.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components21.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components22.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components23.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components24.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components25.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components26.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components27.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components28.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components29.es.js";
 const xn = ({
   items: n = [],
   onDelete: O,
@@ -421,6 +421,7 @@ const xn = ({
     );
   }, J = (t) => {
     m(!1), x(
+      // eslint-disable-next-line @typescript-eslint/no-misused-promises
       async (o) => {
         m(!0), v(), d([...s, t.id]), await T(t, o[0]), d(s.filter((p) => p !== t.id));
       },

package/dist/components/Attachments/Attachments.es.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Attachments.es.js","sources":["../../../src/components/Attachments/Attachments.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport {\n DndContext,\n type DragEndEvent,\n type DragStartEvent,\n KeyboardSensor,\n PointerSensor,\n closestCenter,\n useSensor,\n useSensors,\n} from '@dnd-kit/core';\nimport { restrictToVerticalAxis } from '@dnd-kit/modifiers';\nimport { SortableContext, arrayMove, rectSortingStrategy } from '@dnd-kit/sortable';\nimport { type Asset, useAssetChooser, useAssetUpload, useEditorState } from '@frontify/app-bridge';\nimport { AssetInput, AssetInputSize } from '@frontify/fondue';\nimport { Tooltip, Flyout } from '@frontify/fondue/components';\nimport { useEffect, useState } from 'react';\n\nimport { SortableAttachmentItem } from './AttachmentItem';\nimport { AttachmentsButtonTrigger } from './AttachmentsButtonTrigger';\nimport { type AttachmentsProps } from './types';\n\nexport const Attachments = ({\n items = [],\n onDelete,\n onReplaceWithBrowse,\n onReplaceWithUpload,\n onBrowse,\n onUpload,\n onSorted,\n appBridge,\n triggerComponent: TriggerComponent = AttachmentsButtonTrigger,\n isOpen,\n onOpenChange,\n}: AttachmentsProps) => {\n const [internalItems, setInternalItems] = useState<Asset[]>(items);\n const [isFlyoutOpenInternal, setIsFlyoutOpenInternal] = useState(false);\n const sensors = useSensors(useSensor(PointerSensor), useSensor(KeyboardSensor));\n const [draggedAssetId, setDraggedAssetId] = useState<number \| undefined>(undefined);\n const [isUploadLoading, setIsUploadLoading] = useState(false);\n const [assetIdsLoading, setAssetIdsLoading] = useState<number[]>([]);\n const [selectedFiles, setSelectedFiles] = useState<FileList \| null>(null);\n const isEditing = useEditorState(appBridge);\n const { openAssetChooser, closeAssetChooser } = useAssetChooser(appBridge);\n const isControllingStateExternally = isOpen !== undefined;\n const isFlyoutOpen = isControllingStateExternally ? isOpen : isFlyoutOpenInternal;\n\n const draggedItem = internalItems?.find((item) => item.id === draggedAssetId);\n\n const [uploadFile, { results: uploadResults, doneAll }] = useAssetUpload({\n onUploadProgress: () => !isUploadLoading && setIsUploadLoading(true),\n });\n\n const handleFlyoutOpenChange = (isOpen: boolean) => {\n const stateSetter = isControllingStateExternally ? onOpenChange : setIsFlyoutOpenInternal;\n\n stateSetter?.(isOpen);\n };\n\n useEffect(() => {\n setInternalItems(items);\n }, [items]);\n\n useEffect(() => {\n if (selectedFiles) {\n setIsUploadLoading(true);\n uploadFile(selectedFiles);\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [selectedFiles]);\n\n useEffect(() => {\n const uploadDone = async () => {\n if (doneAll) {\n await onUpload(uploadResults);\n setIsUploadLoading(false);\n }\n };\n uploadDone();\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [doneAll, uploadResults]);\n\n const onOpenAssetChooser = () => {\n handleFlyoutOpenChange(false);\n openAssetChooser(\n (result: Asset[]) => {\n onBrowse(result);\n closeAssetChooser();\n handleFlyoutOpenChange(true);\n },\n {\n multiSelection: true,\n selectedValueIds: internalItems.map((internalItem) => internalItem.id),\n },\n );\n };\n\n const onReplaceItemWithBrowse = (toReplace: Asset) => {\n handleFlyoutOpenChange(false);\n openAssetChooser(\n async (result: Asset[]) => {\n handleFlyoutOpenChange(true);\n closeAssetChooser();\n setAssetIdsLoading([...assetIdsLoading, toReplace.id]);\n await onReplaceWithBrowse(toReplace, result[0]);\n setAssetIdsLoading(assetIdsLoading.filter((id) => id !== toReplace.id));\n },\n {\n multiSelection: false,\n selectedValueIds: internalItems.map((internalItem) => internalItem.id),\n },\n );\n };\n\n const onReplaceItemWithUpload = async (toReplace: Asset, uploadedAsset: Asset) => {\n setAssetIdsLoading([...assetIdsLoading, toReplace.id]);\n await onReplaceWithUpload(toReplace, uploadedAsset);\n setAssetIdsLoading(assetIdsLoading.filter((id) => id !== toReplace.id));\n };\n\n const handleDragStart = (event: DragStartEvent) => {\n const { active } = event;\n setDraggedAssetId(active.id as number);\n };\n\n const handleDragEnd = (event: DragEndEvent) => {\n const { active, over } = event;\n if (over && active.id !== over.id && internalItems) {\n const oldIndex = internalItems.findIndex((i) => i.id === active.id);\n const newIndex = internalItems.findIndex((i) => i.id === over.id);\n const sortedItems = arrayMove(internalItems, oldIndex, newIndex);\n setInternalItems(sortedItems);\n onSorted(sortedItems);\n }\n setDraggedAssetId(undefined);\n };\n\n const autoFocusModifier = {\n onOpenAutoFocus: (event: Event) => {\n event.preventDefault();\n },\n onEscapeKeyDown: (event: Event) => {\n event.stopPropagation();\n handleFlyoutOpenChange(false);\n },\n };\n\n return isEditing \|\| (internalItems?.length ?? 0) > 0 ? (\n <div data-test-id=\"attachments-flyout-button\">\n <Flyout.Root\n open={isFlyoutOpen}\n onOpenChange={(isOpen) => handleFlyoutOpenChange(draggedItem ? true : isOpen)}\n >\n <Tooltip.Root enterDelay={500}>\n <Tooltip.Trigger asChild>\n <Flyout.Trigger asChild data-test-id=\"attachments-button-trigger\">\n <TriggerComponent isFlyoutOpen={isFlyoutOpen}>\n <div>{items.length > 0 ? items.length : 'Add'}</div>\n </TriggerComponent>\n </Flyout.Trigger>\n </Tooltip.Trigger>\n <Flyout.Content side=\"bottom\" align=\"end\" {...autoFocusModifier}>\n <div className=\"tw-w-[300px]\" data-test-id=\"attachments-flyout-content\">\n {internalItems.length > 0 && (\n <DndContext\n sensors={sensors}\n collisionDetection={closestCenter}\n onDragStart={handleDragStart}\n onDragEnd={handleDragEnd}\n modifiers={[restrictToVerticalAxis]}\n >\n <SortableContext items={internalItems} strategy={rectSortingStrategy}>\n <div className=\"tw-border-b tw-border-b-line tw-relative\">\n {internalItems.map((item) => (\n <SortableAttachmentItem\n isEditing={isEditing}\n isLoading={assetIdsLoading.includes(item.id)}\n key={item.id}\n item={item}\n onDelete={() => onDelete(item)}\n onReplaceWithBrowse={() => onReplaceItemWithBrowse(item)}\n onReplaceWithUpload={(uploadedAsset: Asset) =>\n onReplaceItemWithUpload(item, uploadedAsset)\n }\n onDownload={() =>\n appBridge.dispatch({\n name: 'downloadAsset',\n payload: item,\n })\n }\n />\n ))}\n </div>\n </SortableContext>\n </DndContext>\n )}\n {isEditing && (\n <div className=\"tw-px-5 tw-py-3\">\n <div className=\"tw-font-body tw-font-medium tw-text-text tw-text-s tw-my-4\">\n Add attachments\n </div>\n <AssetInput\n isLoading={isUploadLoading}\n size={AssetInputSize.Small}\n onUploadClick={(fileList) => setSelectedFiles(fileList)}\n onLibraryClick={onOpenAssetChooser}\n />\n </div>\n )}\n </div>\n </Flyout.Content>\n <Tooltip.Content side=\"top\">Attachments</Tooltip.Content>\n </Tooltip.Root>\n </Flyout.Root>\n </div>\n ) : null;\n};\n"],"names":["Attachments","items","onDelete","onReplaceWithBrowse","onReplaceWithUpload","onBrowse","onUpload","onSorted","appBridge","TriggerComponent","AttachmentsButtonTrigger","isOpen","onOpenChange","internalItems","setInternalItems","useState","isFlyoutOpenInternal","setIsFlyoutOpenInternal","sensors","useSensors","useSensor","PointerSensor","KeyboardSensor","draggedAssetId","setDraggedAssetId","isUploadLoading","setIsUploadLoading","assetIdsLoading","setAssetIdsLoading","selectedFiles","setSelectedFiles","isEditing","useEditorState","openAssetChooser","closeAssetChooser","useAssetChooser","isControllingStateExternally","isFlyoutOpen","draggedItem","item","uploadFile","uploadResults","doneAll","useAssetUpload","handleFlyoutOpenChange","stateSetter","useEffect","onOpenAssetChooser","result","internalItem","onReplaceItemWithBrowse","toReplace","id","onReplaceItemWithUpload","uploadedAsset","handleDragStart","event","active","handleDragEnd","over","oldIndex","i","newIndex","sortedItems","arrayMove","autoFocusModifier","jsx","Flyout","jsxs","Tooltip","DndContext","closestCenter","restrictToVerticalAxis","SortableContext","rectSortingStrategy","SortableAttachmentItem","AssetInput","AssetInputSize","fileList"],"mappings":"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"}
1	+ {"version":3,"file":"Attachments.es.js","sources":["../../../src/components/Attachments/Attachments.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport {\n DndContext,\n type DragEndEvent,\n type DragStartEvent,\n KeyboardSensor,\n PointerSensor,\n closestCenter,\n useSensor,\n useSensors,\n} from '@dnd-kit/core';\nimport { restrictToVerticalAxis } from '@dnd-kit/modifiers';\nimport { SortableContext, arrayMove, rectSortingStrategy } from '@dnd-kit/sortable';\nimport { type Asset, useAssetChooser, useAssetUpload, useEditorState } from '@frontify/app-bridge';\nimport { AssetInput, AssetInputSize } from '@frontify/fondue';\nimport { Tooltip, Flyout } from '@frontify/fondue/components';\nimport { useEffect, useState } from 'react';\n\nimport { SortableAttachmentItem } from './AttachmentItem';\nimport { AttachmentsButtonTrigger } from './AttachmentsButtonTrigger';\nimport { type AttachmentsProps } from './types';\n\nexport const Attachments = ({\n items = [],\n onDelete,\n onReplaceWithBrowse,\n onReplaceWithUpload,\n onBrowse,\n onUpload,\n onSorted,\n appBridge,\n triggerComponent: TriggerComponent = AttachmentsButtonTrigger,\n isOpen,\n onOpenChange,\n}: AttachmentsProps) => {\n const [internalItems, setInternalItems] = useState<Asset[]>(items);\n const [isFlyoutOpenInternal, setIsFlyoutOpenInternal] = useState(false);\n const sensors = useSensors(useSensor(PointerSensor), useSensor(KeyboardSensor));\n const [draggedAssetId, setDraggedAssetId] = useState<number \| undefined>(undefined);\n const [isUploadLoading, setIsUploadLoading] = useState(false);\n const [assetIdsLoading, setAssetIdsLoading] = useState<number[]>([]);\n const [selectedFiles, setSelectedFiles] = useState<FileList \| null>(null);\n const isEditing = useEditorState(appBridge);\n const { openAssetChooser, closeAssetChooser } = useAssetChooser(appBridge);\n const isControllingStateExternally = isOpen !== undefined;\n const isFlyoutOpen = isControllingStateExternally ? isOpen : isFlyoutOpenInternal;\n\n const draggedItem = internalItems?.find((item) => item.id === draggedAssetId);\n\n const [uploadFile, { results: uploadResults, doneAll }] = useAssetUpload({\n onUploadProgress: () => !isUploadLoading && setIsUploadLoading(true),\n });\n\n const handleFlyoutOpenChange = (isOpen: boolean) => {\n const stateSetter = isControllingStateExternally ? onOpenChange : setIsFlyoutOpenInternal;\n\n stateSetter?.(isOpen);\n };\n\n useEffect(() => {\n setInternalItems(items);\n }, [items]);\n\n useEffect(() => {\n if (selectedFiles) {\n setIsUploadLoading(true);\n uploadFile(selectedFiles);\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [selectedFiles]);\n\n useEffect(() => {\n const uploadDone = async () => {\n if (doneAll) {\n await onUpload(uploadResults);\n setIsUploadLoading(false);\n }\n };\n uploadDone();\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [doneAll, uploadResults]);\n\n const onOpenAssetChooser = () => {\n handleFlyoutOpenChange(false);\n openAssetChooser(\n (result: Asset[]) => {\n onBrowse(result);\n closeAssetChooser();\n handleFlyoutOpenChange(true);\n },\n {\n multiSelection: true,\n selectedValueIds: internalItems.map((internalItem) => internalItem.id),\n },\n );\n };\n\n const onReplaceItemWithBrowse = (toReplace: Asset) => {\n handleFlyoutOpenChange(false);\n openAssetChooser(\n // eslint-disable-next-line @typescript-eslint/no-misused-promises\n async (result: Asset[]) => {\n handleFlyoutOpenChange(true);\n closeAssetChooser();\n setAssetIdsLoading([...assetIdsLoading, toReplace.id]);\n await onReplaceWithBrowse(toReplace, result[0]);\n setAssetIdsLoading(assetIdsLoading.filter((id) => id !== toReplace.id));\n },\n {\n multiSelection: false,\n selectedValueIds: internalItems.map((internalItem) => internalItem.id),\n },\n );\n };\n\n const onReplaceItemWithUpload = async (toReplace: Asset, uploadedAsset: Asset) => {\n setAssetIdsLoading([...assetIdsLoading, toReplace.id]);\n await onReplaceWithUpload(toReplace, uploadedAsset);\n setAssetIdsLoading(assetIdsLoading.filter((id) => id !== toReplace.id));\n };\n\n const handleDragStart = (event: DragStartEvent) => {\n const { active } = event;\n setDraggedAssetId(active.id as number);\n };\n\n const handleDragEnd = (event: DragEndEvent) => {\n const { active, over } = event;\n if (over && active.id !== over.id && internalItems) {\n const oldIndex = internalItems.findIndex((i) => i.id === active.id);\n const newIndex = internalItems.findIndex((i) => i.id === over.id);\n const sortedItems = arrayMove(internalItems, oldIndex, newIndex);\n setInternalItems(sortedItems);\n onSorted(sortedItems);\n }\n setDraggedAssetId(undefined);\n };\n\n const autoFocusModifier = {\n onOpenAutoFocus: (event: Event) => {\n event.preventDefault();\n },\n onEscapeKeyDown: (event: Event) => {\n event.stopPropagation();\n handleFlyoutOpenChange(false);\n },\n };\n\n return isEditing \|\| (internalItems?.length ?? 0) > 0 ? (\n <div data-test-id=\"attachments-flyout-button\">\n <Flyout.Root\n open={isFlyoutOpen}\n onOpenChange={(isOpen) => handleFlyoutOpenChange(draggedItem ? true : isOpen)}\n >\n <Tooltip.Root enterDelay={500}>\n <Tooltip.Trigger asChild>\n <Flyout.Trigger asChild data-test-id=\"attachments-button-trigger\">\n <TriggerComponent isFlyoutOpen={isFlyoutOpen}>\n <div>{items.length > 0 ? items.length : 'Add'}</div>\n </TriggerComponent>\n </Flyout.Trigger>\n </Tooltip.Trigger>\n <Flyout.Content side=\"bottom\" align=\"end\" {...autoFocusModifier}>\n <div className=\"tw-w-[300px]\" data-test-id=\"attachments-flyout-content\">\n {internalItems.length > 0 && (\n <DndContext\n sensors={sensors}\n collisionDetection={closestCenter}\n onDragStart={handleDragStart}\n onDragEnd={handleDragEnd}\n modifiers={[restrictToVerticalAxis]}\n >\n <SortableContext items={internalItems} strategy={rectSortingStrategy}>\n <div className=\"tw-border-b tw-border-b-line tw-relative\">\n {internalItems.map((item) => (\n <SortableAttachmentItem\n isEditing={isEditing}\n isLoading={assetIdsLoading.includes(item.id)}\n key={item.id}\n item={item}\n onDelete={() => onDelete(item)}\n onReplaceWithBrowse={() => onReplaceItemWithBrowse(item)}\n onReplaceWithUpload={(uploadedAsset: Asset) =>\n onReplaceItemWithUpload(item, uploadedAsset)\n }\n onDownload={() =>\n appBridge.dispatch({\n name: 'downloadAsset',\n payload: item,\n })\n }\n />\n ))}\n </div>\n </SortableContext>\n </DndContext>\n )}\n {isEditing && (\n <div className=\"tw-px-5 tw-py-3\">\n <div className=\"tw-font-body tw-font-medium tw-text-text tw-text-s tw-my-4\">\n Add attachments\n </div>\n <AssetInput\n isLoading={isUploadLoading}\n size={AssetInputSize.Small}\n onUploadClick={(fileList) => setSelectedFiles(fileList)}\n onLibraryClick={onOpenAssetChooser}\n />\n </div>\n )}\n </div>\n </Flyout.Content>\n <Tooltip.Content side=\"top\">Attachments</Tooltip.Content>\n </Tooltip.Root>\n </Flyout.Root>\n </div>\n ) : null;\n};\n"],"names":["Attachments","items","onDelete","onReplaceWithBrowse","onReplaceWithUpload","onBrowse","onUpload","onSorted","appBridge","TriggerComponent","AttachmentsButtonTrigger","isOpen","onOpenChange","internalItems","setInternalItems","useState","isFlyoutOpenInternal","setIsFlyoutOpenInternal","sensors","useSensors","useSensor","PointerSensor","KeyboardSensor","draggedAssetId","setDraggedAssetId","isUploadLoading","setIsUploadLoading","assetIdsLoading","setAssetIdsLoading","selectedFiles","setSelectedFiles","isEditing","useEditorState","openAssetChooser","closeAssetChooser","useAssetChooser","isControllingStateExternally","isFlyoutOpen","draggedItem","item","uploadFile","uploadResults","doneAll","useAssetUpload","handleFlyoutOpenChange","stateSetter","useEffect","onOpenAssetChooser","result","internalItem","onReplaceItemWithBrowse","toReplace","id","onReplaceItemWithUpload","uploadedAsset","handleDragStart","event","active","handleDragEnd","over","oldIndex","i","newIndex","sortedItems","arrayMove","autoFocusModifier","jsx","Flyout","jsxs","Tooltip","DndContext","closestCenter","restrictToVerticalAxis","SortableContext","rectSortingStrategy","SortableAttachmentItem","AssetInput","AssetInputSize","fileList"],"mappings":"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"}

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

	@@ -1 +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';\nimport { forwardRef } from 'react';\n\nimport { joinClassNames } from '../../utilities';\n\nimport { type AttachmentsTriggerProps } from './types';\n\nexport const AttachmentsButtonTrigger = forwardRef<HTMLButtonElement, AttachmentsTriggerProps>(\n ({ children, isFlyoutOpen, ...props }, ref) => (\n <button\n ref={ref}\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 data-test-id=\"attachments-button-trigger\"\n {...props}\n >\n <IconPaperclip16 />\n {children}\n <IconCaretDown12 />\n </button>\n ),\n);\n\nAttachmentsButtonTrigger.displayName = 'AttachmentsButtonTrigger';\n"],"names":["AttachmentsButtonTrigger","forwardRef","children","isFlyoutOpen","props","ref","jsxs","joinClassNames","jsx","IconPaperclip16","IconCaretDown12"],"mappings":";;;;AASO,MAAMA,IAA2BC;AAAA,EACpC,CAAC,EAAE,UAAAC,GAAU,cAAAC,GAAc,GAAGC,~~KAASC~~,MACnC,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,KAAAD;AAAA,MACA,WAAWE,EAAe;AAAA,QACtB;AAAA,QACAJ,IACM,kEACA;AAAA,MAAA,CACT;AAAA,MACD,gBAAa;AAAA,MACZ,GAAGC;AAAA,MAEJ,UAAA;AAAA,QAAA,gBAAAI,EAACC,~~GAAgB~~,~~EAAA~~;AAAA,QAChBP;AAAA,0BACAQ,~~GAAgB~~,~~EAAA~~;AAAA,MAAA;AAAA,IAAA;AAAA,~~EACrB~~;~~AAER~~;AAEAV,EAAyB,cAAc;"}
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';\nimport { forwardRef } from 'react';\n\nimport { joinClassNames } from '../../utilities';\n\nimport { type AttachmentsTriggerProps } from './types';\n\nexport const AttachmentsButtonTrigger = forwardRef<HTMLButtonElement, AttachmentsTriggerProps>(\n ({ children, isFlyoutOpen, ...props }, ref) => (\n <button\n ref={ref}\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 data-test-id=\"attachments-button-trigger\"\n {...props}\n >\n <IconPaperclip16 />\n {children}\n <IconCaretDown12 />\n </button>\n ),\n);\n\nAttachmentsButtonTrigger.displayName = 'AttachmentsButtonTrigger';\n"],"names":["AttachmentsButtonTrigger","forwardRef","children","isFlyoutOpen","props","ref","jsxs","joinClassNames","jsx","IconPaperclip16","IconCaretDown12"],"mappings":";;;;AASO,MAAMA,IAA2BC;AAAA,EACpC,CAAC,EAAE,UAAAC,GAAU,cAAAC,GAAc,GAAGC,EAAA,GAASC,MACnC,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,KAAAD;AAAA,MACA,WAAWE,EAAe;AAAA,QACtB;AAAA,QACAJ,IACM,kEACA;AAAA,MAAA,CACT;AAAA,MACD,gBAAa;AAAA,MACZ,GAAGC;AAAA,MAEJ,UAAA;AAAA,QAAA,gBAAAI,EAACC,GAAA,EAAgB;AAAA,QAChBP;AAAA,0BACAQ,GAAA,CAAA,CAAgB;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAG7B;AAEAV,EAAyB,cAAc;"}

package/dist/components/BlockInjectButton/BlockInjectButton.es.js CHANGED Viewed

@@ -351,32 +351,32 @@ import "../../node_modules/.pnpm/@frontify_fondue-icons@0.17.0_react@18.3.1/node
 import "../../node_modules/.pnpm/@frontify_fondue-icons@0.17.0_react@18.3.1/node_modules/@frontify/fondue-icons/dist/fondue-icons349.es.js";
 import "../../node_modules/.pnpm/@frontify_fondue-icons@0.17.0_react@18.3.1/node_modules/@frontify/fondue-icons/dist/fondue-icons350.es.js";
 import "../../node_modules/.pnpm/@frontify_fondue-icons@0.17.0_react@18.3.1/node_modules/@frontify/fondue-icons/dist/fondue-icons351.es.js";
-import { LoadingCircle as J } from "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components18.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components5.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components6.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components7.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components8.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components9.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components10.es.js";
-import { Dropdown as d } from "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components11.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components12.es.js";
-import { Flyout as j } from "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components13.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components14.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components15.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components16.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components17.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components19.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components20.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components21.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components22.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components23.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components24.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components25.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components26.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components27.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components28.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components29.es.js";
-import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontify_fond_2ljulupxsngf67kv3awqop75em/node_modules/@frontify/fondue-components/dist/fondue-components30.es.js";
+import { LoadingCircle as J } from "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components18.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components5.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components6.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components7.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components8.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components9.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components10.es.js";
+import { Dropdown as d } from "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components11.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components12.es.js";
+import { Flyout as j } from "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components13.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components14.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components15.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components16.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components17.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components19.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components20.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components21.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components22.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components23.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components24.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components25.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components26.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components27.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components28.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components29.es.js";
+import "../../node_modules/.pnpm/@frontify_fondue-components@19.2.0_@frontify_fondue-icons@0.17.0_react@18.3.1__@frontif_edefda44b2073e780abae6da5d9e9016/node_modules/@frontify/fondue-components/dist/fondue-components30.es.js";
 const _e = ({
   onDrop: e,
   label: c,

package/dist/components/BlockInjectButton/BlockInjectButton.es.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"BlockInjectButton.es.js","sources":["../../../src/components/BlockInjectButton/BlockInjectButton.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. /\n\nimport { type FileExtension, FileExtensionSets } from '@frontify/app-bridge';\nimport { IconExclamationMarkTriangle } from '@frontify/fondue';\nimport { Dropdown, Flyout, LoadingCircle } from '@frontify/fondue/components';\nimport { IconArrowCircleUp, IconImageStack } from '@frontify/fondue/icons';\nimport { type DragEventHandler, type MouseEventHandler, useCallback, useMemo, useRef, useState } from 'react';\n\nimport { joinClassNames } from '../../utilities/react/joinClassNames';\n\nimport { type BlockInjectButtonProps } from './types';\n\nexport const BlockInjectButton = ({\n onDrop,\n label,\n icon,\n secondaryLabel,\n isLoading,\n fillParentContainer,\n onAssetChooseClick,\n onUploadClick,\n withMenu = true,\n onClick,\n validFileType,\n verticalLayout,\n}: BlockInjectButtonProps) => {\n const [isDraggingOver, setIsDraggingOver] = useState(false);\n const [menuPosition, setMenuPosition] = useState<[number, number] \| undefined>();\n const buttonRef = useRef<HTMLButtonElement>(null);\n const [errorMsg, setErrorMsg] = useState<string \| undefined>(undefined);\n\n const handleDrop: DragEventHandler<HTMLButtonElement> = (event) => {\n event.preventDefault();\n setIsDraggingOver(false);\n if (!isValidAsset(event.dataTransfer.files)) {\n setErrorMsg('Invalid');\n setTimeout(() => {\n setErrorMsg(undefined);\n }, 1000);\n return;\n }\n onDrop?.(event.dataTransfer.files);\n };\n\n const isValidAsset = (files: FileList) => {\n if (!validFileType) {\n return true;\n }\n for (let i = 0; i < files.length; i++) {\n const droppedFileExtension = (files[i].name.split('.').pop() ?? '') as FileExtension;\n if (!FileExtensionSets[validFileType].includes(droppedFileExtension)) {\n return false;\n }\n }\n return true;\n };\n\n const openMenu: MouseEventHandler<HTMLButtonElement> = (event) => {\n if (!buttonRef.current \|\| isLoading) {\n return;\n }\n const { clientX, clientY } = event;\n const isKeyboardEvent = clientX === 0 && clientY === 0;\n const { left, top, width, height } = buttonRef.current.getBoundingClientRect();\n const XInsideComponent = !isKeyboardEvent ? clientX - left : width / 2;\n const YInsideComponent = !isKeyboardEvent ? clientY - top : height / 2;\n setMenuPosition([XInsideComponent, YInsideComponent]);\n };\n\n const onItemClick = useCallback((callback: () => unknown) => {\n callback();\n setMenuPosition(undefined);\n }, []);\n\n const menuItems = useMemo(() => {\n const items = [];\n if (onUploadClick) {\n items.push({\n onSelect: () => onItemClick(onUploadClick),\n title: 'Upload asset',\n icon: <IconArrowCircleUp size=\"20\" />,\n });\n }\n if (onAssetChooseClick) {\n items.push({\n onSelect: () => onItemClick(onAssetChooseClick),\n title: 'Browse asset',\n icon: <IconImageStack size=\"20\" />,\n });\n }\n return items;\n }, [onAssetChooseClick, onUploadClick, onItemClick]);\n return (\n <button\n ref={buttonRef}\n data-test-id=\"block-inject-button\"\n className={joinClassNames([\n 'tw-font-body tw-relative tw-text-sm tw-leading-4 tw-border tw-flex tw-items-center tw-justify-center tw-cursor-pointer tw-gap-3 tw-w-full first:tw-rounded-tl last:tw-rounded-br',\n verticalLayout\n ? '[&:not(:first-child)]:tw-border-t-0 first:tw-rounded-tr last:tw-rounded-bl'\n : '[&:not(:first-child)]:tw-border-l-0 first:tw-rounded-bl last:tw-rounded-tr',\n fillParentContainer ? 'tw-h-full' : 'tw-h-[72px]',\n isDraggingOver && !isLoading ? 'tw-border-dashed' : 'tw-border-solid',\n menuPosition && 'tw-bg-blank-state-pressed-inverse',\n isDraggingOver && 'tw-bg-blank-state-weak-inverse',\n errorMsg ? '!tw-border-red-50 !tw-cursor-not-allowed' : ' tw-border-blank-state-line',\n isLoading \|\| menuPosition \|\| isDraggingOver \|\| errorMsg\n ? ''\n : 'tw-text-text-weak hover:tw-text-blank-state-hover hover:tw-bg-blank-state-hover-inverse hover:tw-border-blank-state-line-hover active:tw-text-blank-state-pressed active:tw-bg-blank-state-pressed-inverse active:tw-border-blank-state-line-hover',\n (isDraggingOver \|\| !!menuPosition) && !errorMsg\n ? '[&>]:tw-pointer-events-none tw-border-blank-state-line-hover'\n : 'tw-bg-blank-state-shaded-inverse tw-text-blank-state-shaded',\n ])}\n onDragEnter={\n onDrop\n ? (event) => {\n setIsDraggingOver(true);\n // is now only used for images, can be adapted if needed\n if (validFileType === 'Images') {\n for (const item of Array.from(event.dataTransfer.items)) {\n if (!item?.type?.startsWith('image/')) {\n setErrorMsg('Invalid');\n } else {\n setErrorMsg(undefined);\n }\n }\n }\n }\n : undefined\n }\n onDragLeave={\n onDrop\n ? () => {\n setIsDraggingOver(false);\n setErrorMsg(undefined);\n }\n : undefined\n }\n onDrop={onDrop ? handleDrop : undefined}\n onClick={(event) => {\n withMenu && !menuPosition && openMenu(event);\n onClick?.();\n }}\n >\n {isLoading ? (\n <LoadingCircle />\n ) : errorMsg ? (\n <div className=\" tw-flex tw-items-center tw-justify-center tw-text-red-60 tw-font-medium\">\n <IconExclamationMarkTriangle />\n {errorMsg}\n </div>\n ) : (\n <>\n {icon && <div>{icon}</div>}\n {(label \|\| secondaryLabel) && (\n <div className=\"tw-flex tw-flex-col tw-items-start\">\n {label && <div className=\"tw-font-medium\">{label}</div>}\n {secondaryLabel && <div className=\"tw-font-normal\">{secondaryLabel}</div>}\n </div>\n )}\n </>\n )}\n {menuPosition && (\n <div\n className=\"tw-absolute tw-left-0 tw-top-full tw-z-20\"\n style={{\n left: menuPosition[0],\n top: menuPosition[1],\n }}\n >\n <Flyout.Root open onOpenChange={(isOpen) => !isOpen && setMenuPosition(undefined)}>\n <Flyout.Trigger>\n <div />\n </Flyout.Trigger>\n <Flyout.Content triggerOffset=\"compact\">\n <Dropdown.Root open>\n <Dropdown.Trigger>\n <div />\n </Dropdown.Trigger>\n <Dropdown.Content triggerOffset=\"compact\">\n {menuItems.map((item) => (\n <Dropdown.Item key={item.title} onSelect={item.onSelect}>\n {item.icon}\n {item.title}\n </Dropdown.Item>\n ))}\n </Dropdown.Content>\n </Dropdown.Root>\n </Flyout.Content>\n </Flyout.Root>\n </div>\n )}\n </button>\n );\n};\n"],"names":["BlockInjectButton","onDrop","label","icon","secondaryLabel","isLoading","fillParentContainer","onAssetChooseClick","onUploadClick","withMenu","onClick","validFileType","verticalLayout","isDraggingOver","setIsDraggingOver","useState","menuPosition","setMenuPosition","buttonRef","useRef","errorMsg","setErrorMsg","handleDrop","event","isValidAsset","files","i","droppedFileExtension","FileExtensionSets","openMenu","clientX","clientY","isKeyboardEvent","left","top","width","height","XInsideComponent","YInsideComponent","onItemClick","useCallback","callback","menuItems","useMemo","items","jsx","IconArrowCircleUp","IconImageStack","jsxs","joinClassNames","item","_a","LoadingCircle","IconExclamationMarkTriangle","Fragment","Flyout","isOpen","Dropdown"],"mappings":"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"}
1	+ {"version":3,"file":"BlockInjectButton.es.js","sources":["../../../src/components/BlockInjectButton/BlockInjectButton.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. /\n\nimport { type FileExtension, FileExtensionSets } from '@frontify/app-bridge';\nimport { IconExclamationMarkTriangle } from '@frontify/fondue';\nimport { Dropdown, Flyout, LoadingCircle } from '@frontify/fondue/components';\nimport { IconArrowCircleUp, IconImageStack } from '@frontify/fondue/icons';\nimport { type DragEventHandler, type MouseEventHandler, useCallback, useMemo, useRef, useState } from 'react';\n\nimport { joinClassNames } from '../../utilities/react/joinClassNames';\n\nimport { type BlockInjectButtonProps } from './types';\n\nexport const BlockInjectButton = ({\n onDrop,\n label,\n icon,\n secondaryLabel,\n isLoading,\n fillParentContainer,\n onAssetChooseClick,\n onUploadClick,\n withMenu = true,\n onClick,\n validFileType,\n verticalLayout,\n}: BlockInjectButtonProps) => {\n const [isDraggingOver, setIsDraggingOver] = useState(false);\n const [menuPosition, setMenuPosition] = useState<[number, number] \| undefined>();\n const buttonRef = useRef<HTMLButtonElement>(null);\n const [errorMsg, setErrorMsg] = useState<string \| undefined>(undefined);\n\n const handleDrop: DragEventHandler<HTMLButtonElement> = (event) => {\n event.preventDefault();\n setIsDraggingOver(false);\n if (!isValidAsset(event.dataTransfer.files)) {\n setErrorMsg('Invalid');\n setTimeout(() => {\n setErrorMsg(undefined);\n }, 1000);\n return;\n }\n onDrop?.(event.dataTransfer.files);\n };\n\n const isValidAsset = (files: FileList) => {\n if (!validFileType) {\n return true;\n }\n for (let i = 0; i < files.length; i++) {\n const droppedFileExtension = (files[i].name.split('.').pop() ?? '') as FileExtension;\n if (!FileExtensionSets[validFileType].includes(droppedFileExtension)) {\n return false;\n }\n }\n return true;\n };\n\n const openMenu: MouseEventHandler<HTMLButtonElement> = (event) => {\n if (!buttonRef.current \|\| isLoading) {\n return;\n }\n const { clientX, clientY } = event;\n const isKeyboardEvent = clientX === 0 && clientY === 0;\n const { left, top, width, height } = buttonRef.current.getBoundingClientRect();\n const XInsideComponent = !isKeyboardEvent ? clientX - left : width / 2;\n const YInsideComponent = !isKeyboardEvent ? clientY - top : height / 2;\n setMenuPosition([XInsideComponent, YInsideComponent]);\n };\n\n const onItemClick = useCallback((callback: () => unknown) => {\n callback();\n setMenuPosition(undefined);\n }, []);\n\n const menuItems = useMemo(() => {\n const items = [];\n if (onUploadClick) {\n items.push({\n onSelect: () => onItemClick(onUploadClick),\n title: 'Upload asset',\n icon: <IconArrowCircleUp size=\"20\" />,\n });\n }\n if (onAssetChooseClick) {\n items.push({\n onSelect: () => onItemClick(onAssetChooseClick),\n title: 'Browse asset',\n icon: <IconImageStack size=\"20\" />,\n });\n }\n return items;\n }, [onAssetChooseClick, onUploadClick, onItemClick]);\n return (\n <button\n ref={buttonRef}\n data-test-id=\"block-inject-button\"\n className={joinClassNames([\n 'tw-font-body tw-relative tw-text-sm tw-leading-4 tw-border tw-flex tw-items-center tw-justify-center tw-cursor-pointer tw-gap-3 tw-w-full first:tw-rounded-tl last:tw-rounded-br',\n verticalLayout\n ? '[&:not(:first-child)]:tw-border-t-0 first:tw-rounded-tr last:tw-rounded-bl'\n : '[&:not(:first-child)]:tw-border-l-0 first:tw-rounded-bl last:tw-rounded-tr',\n fillParentContainer ? 'tw-h-full' : 'tw-h-[72px]',\n isDraggingOver && !isLoading ? 'tw-border-dashed' : 'tw-border-solid',\n menuPosition && 'tw-bg-blank-state-pressed-inverse',\n isDraggingOver && 'tw-bg-blank-state-weak-inverse',\n errorMsg ? '!tw-border-red-50 !tw-cursor-not-allowed' : ' tw-border-blank-state-line',\n isLoading \|\| menuPosition \|\| isDraggingOver \|\| errorMsg\n ? ''\n : 'tw-text-text-weak hover:tw-text-blank-state-hover hover:tw-bg-blank-state-hover-inverse hover:tw-border-blank-state-line-hover active:tw-text-blank-state-pressed active:tw-bg-blank-state-pressed-inverse active:tw-border-blank-state-line-hover',\n (isDraggingOver \|\| !!menuPosition) && !errorMsg\n ? '[&>]:tw-pointer-events-none tw-border-blank-state-line-hover'\n : 'tw-bg-blank-state-shaded-inverse tw-text-blank-state-shaded',\n ])}\n onDragEnter={\n onDrop\n ? (event) => {\n setIsDraggingOver(true);\n // is now only used for images, can be adapted if needed\n if (validFileType === 'Images') {\n for (const item of Array.from(event.dataTransfer.items)) {\n if (!item?.type?.startsWith('image/')) {\n setErrorMsg('Invalid');\n } else {\n setErrorMsg(undefined);\n }\n }\n }\n }\n : undefined\n }\n onDragLeave={\n onDrop\n ? () => {\n setIsDraggingOver(false);\n setErrorMsg(undefined);\n }\n : undefined\n }\n onDrop={onDrop ? handleDrop : undefined}\n onClick={(event) => {\n if (withMenu && !menuPosition) {\n openMenu(event);\n }\n onClick?.();\n }}\n >\n {isLoading ? (\n <LoadingCircle />\n ) : errorMsg ? (\n <div className=\" tw-flex tw-items-center tw-justify-center tw-text-red-60 tw-font-medium\">\n <IconExclamationMarkTriangle />\n {errorMsg}\n </div>\n ) : (\n <>\n {icon && <div>{icon}</div>}\n {(label \|\| secondaryLabel) && (\n <div className=\"tw-flex tw-flex-col tw-items-start\">\n {label && <div className=\"tw-font-medium\">{label}</div>}\n {secondaryLabel && <div className=\"tw-font-normal\">{secondaryLabel}</div>}\n </div>\n )}\n </>\n )}\n {menuPosition && (\n <div\n className=\"tw-absolute tw-left-0 tw-top-full tw-z-20\"\n style={{\n left: menuPosition[0],\n top: menuPosition[1],\n }}\n >\n <Flyout.Root open onOpenChange={(isOpen) => !isOpen && setMenuPosition(undefined)}>\n <Flyout.Trigger>\n <div />\n </Flyout.Trigger>\n <Flyout.Content triggerOffset=\"compact\">\n <Dropdown.Root open>\n <Dropdown.Trigger>\n <div />\n </Dropdown.Trigger>\n <Dropdown.Content triggerOffset=\"compact\">\n {menuItems.map((item) => (\n <Dropdown.Item key={item.title} onSelect={item.onSelect}>\n {item.icon}\n {item.title}\n </Dropdown.Item>\n ))}\n </Dropdown.Content>\n </Dropdown.Root>\n </Flyout.Content>\n </Flyout.Root>\n </div>\n )}\n </button>\n );\n};\n"],"names":["BlockInjectButton","onDrop","label","icon","secondaryLabel","isLoading","fillParentContainer","onAssetChooseClick","onUploadClick","withMenu","onClick","validFileType","verticalLayout","isDraggingOver","setIsDraggingOver","useState","menuPosition","setMenuPosition","buttonRef","useRef","errorMsg","setErrorMsg","handleDrop","event","isValidAsset","files","i","droppedFileExtension","FileExtensionSets","openMenu","clientX","clientY","isKeyboardEvent","left","top","width","height","XInsideComponent","YInsideComponent","onItemClick","useCallback","callback","menuItems","useMemo","items","jsx","IconArrowCircleUp","IconImageStack","jsxs","joinClassNames","item","_a","LoadingCircle","IconExclamationMarkTriangle","Fragment","Flyout","isOpen","Dropdown"],"mappings":"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"}

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

	@@ -1 +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, memo, useRef, useState } from 'react';\n\nimport { joinClassNames } from '../../utilities';\n\nimport { DEFAULT_MENU_BUTTON_ID, Toolbar, type ToolbarItem } from './Toolbar';\nimport { DragPreviewContextProvider } from './Toolbar/context/DragPreviewContext';\nimport { MultiFlyoutContextProvider } from './Toolbar/context/MultiFlyoutContext';\nimport { type BlockItemWrapperProps } from './types';\n\nexport const BlockItemWrapper = memo(\n ({\n children,\n toolbarItems,\n shouldHideWrapper,\n shouldHideComponent = false,\n isDragging = false,\n shouldFillContainer,\n outlineOffset = 0,\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);\n\nBlockItemWrapper.displayName = 'BlockItemWrapper';\n"],"names":["BlockItemWrapper","memo","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,IAAmBC;AAAA,EAC5B,CAAC;AAAA,IACG,UAAAC;AAAA,IACA,cAAAC;AAAA,IACA,mBAAAC;AAAA,IACA,qBAAAC,IAAsB;AAAA,IACtB,YAAAC,IAAa;AAAA,IACb,qBAAAC;AAAA,IACA,eAAAC,IAAgB;AAAA,IAChB,eAAAC,IAAgB;AAAA,IAChB,iBAAAC,IAAkB;AAAA,EAAA,MACqB;~~AACjC~~,~~UAAA~~,CAACC,GAAeC,CAAgB,IAAIC,EAAmBJ,IAAgB,CAACK,CAAsB,IAAI,~~CAAA~~,~~CAAE,~~GACpGC,IAAaC,EAAuB,IAAI;AAE9C,QAAIZ;~~AAEA~~,oCAAU,UAAAF,~~EAAS,CAAA~~;AAGvB,UAAMe,IAAQd,KAAA,gBAAAA,EAAc,OAAO,CAACe,MAA8BA,MAAS,SAErEC,IAAyBR,EAAc,SAAS,KAAKF;AAE3D,6BACKW,~~GAA2B~~,~~EAAA~~,eAAed,GACvC,~~UAAC~~,gBAAAe,~~EAAAC~~,GAAA,EAA2B,eAAAX,GAA8B,kBAAAC,GACtD,UAAA,gBAAAW;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,KAAKR;AAAA,QACL,gBAAa;AAAA,QACb,OAAO;AAAA,UACH,eAAAP;AAAA,~~QACJ~~;AAAA,~~QACA~~,WAAWgB,EAAe;AAAA,UACtB;AAAA,UACAjB,KAAuB;AAAA,UACvB;AAAA,UACAY,KAA0B;AAAA,UAC1Bd,KAAuB;AAAA,QAAA,CAC1B;AAAA,QAED,UAAA;AAAA,UAAA,gBAAAgB;AAAA,YAAC;AAAA,YAAA;AAAA,cACG,OAAO;AAAA,gBACH,OAAO,KAAKb;AAAA,gBACZ,QAAQ,eAAe,IAAIA,CAAa;AAAA,~~cAC5C~~;AAAA,~~cACA~~,WAAWgB,EAAe;AAAA,gBACtB;AAAA,gBACA;AAAA,gBACA;AAAA,gBACAL,KAA0B;AAAA,cAAA,CAC7B;AAAA,cAED,UAAA,gBAAAE;AAAA,gBAACI;AAAA,gBAAA;AAAA,kBACG,aAAa;AAAA,oBACT,WAAWf;AAAA,~~kBACf~~;AAAA,~~kBACA~~,OAAAO;AAAA,gBAAA;AAAA,~~cACJ~~;AAAA,~~YAAA~~;AAAA,~~UACJ~~;AAAA,~~UACCf~~;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA,~~EAET~~,~~CAAA~~,~~EACJ,CAAA~~;AAAA,EAER;AACJ;AAEAF,EAAiB,cAAc;"}
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, memo, useRef, useState } from 'react';\n\nimport { joinClassNames } from '../../utilities';\n\nimport { DEFAULT_MENU_BUTTON_ID, Toolbar, type ToolbarItem } from './Toolbar';\nimport { DragPreviewContextProvider } from './Toolbar/context/DragPreviewContext';\nimport { MultiFlyoutContextProvider } from './Toolbar/context/MultiFlyoutContext';\nimport { type BlockItemWrapperProps } from './types';\n\nexport const BlockItemWrapper = memo(\n ({\n children,\n toolbarItems,\n shouldHideWrapper,\n shouldHideComponent = false,\n isDragging = false,\n shouldFillContainer,\n outlineOffset = 0,\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 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);\n\nBlockItemWrapper.displayName = 'BlockItemWrapper';\n"],"names":["BlockItemWrapper","memo","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,IAAmBC;AAAA,EAC5B,CAAC;AAAA,IACG,UAAAC;AAAA,IACA,cAAAC;AAAA,IACA,mBAAAC;AAAA,IACA,qBAAAC,IAAsB;AAAA,IACtB,YAAAC,IAAa;AAAA,IACb,qBAAAC;AAAA,IACA,eAAAC,IAAgB;AAAA,IAChB,eAAAC,IAAgB;AAAA,IAChB,iBAAAC,IAAkB;AAAA,EAAA,MACqB;AACvC,UAAM,CAACC,GAAeC,CAAgB,IAAIC,EAAmBJ,IAAgB,CAACK,CAAsB,IAAI,EAAE,GACpGC,IAAaC,EAAuB,IAAI;AAE9C,QAAIZ;AACA,oCAAU,UAAAF,GAAS;AAGvB,UAAMe,IAAQd,KAAA,gBAAAA,EAAc,OAAO,CAACe,MAA8BA,MAAS,SAErEC,IAAyBR,EAAc,SAAS,KAAKF;AAE3D,6BACKW,GAAA,EAA2B,eAAed,GACvC,UAAA,gBAAAe,EAACC,GAAA,EAA2B,eAAAX,GAA8B,kBAAAC,GACtD,UAAA,gBAAAW;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,KAAKR;AAAA,QACL,gBAAa;AAAA,QACb,OAAO;AAAA,UACH,eAAAP;AAAA,QAAA;AAAA,QAEJ,WAAWgB,EAAe;AAAA,UACtB;AAAA,UACAjB,KAAuB;AAAA,UACvB;AAAA,UACAY,KAA0B;AAAA,UAC1Bd,KAAuB;AAAA,QAAA,CAC1B;AAAA,QAED,UAAA;AAAA,UAAA,gBAAAgB;AAAA,YAAC;AAAA,YAAA;AAAA,cACG,OAAO;AAAA,gBACH,OAAO,KAAKb;AAAA,gBACZ,QAAQ,eAAe,IAAIA,CAAa;AAAA,cAAA;AAAA,cAE5C,WAAWgB,EAAe;AAAA,gBACtB;AAAA,gBACA;AAAA,gBACA;AAAA,gBACAL,KAA0B;AAAA,cAAA,CAC7B;AAAA,cAED,UAAA,gBAAAE;AAAA,gBAACI;AAAA,gBAAA;AAAA,kBACG,aAAa;AAAA,oBACT,WAAWf;AAAA,kBAAA;AAAA,kBAEf,OAAAO;AAAA,gBAAA;AAAA,cAAA;AAAA,YACJ;AAAA,UAAA;AAAA,UAEHf;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA,GAET,EAAA,CACJ;AAAA,EAER;AACJ;AAEAF,EAAiB,cAAc;"}