@frontify/guideline-blocks-settings 1.0.9 → 1.0.11

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

@@ -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            // 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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"}
+{"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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"}