@frontify/guideline-blocks-settings 0.36.14 → 0.37.0

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    DragOverlay,\n    type DragStartEvent,\n    KeyboardSensor,\n    PointerSensor,\n    closestCenter,\n    useSensor,\n    useSensors,\n} from '@dnd-kit/core';\nimport { restrictToWindowEdges } 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, Flyout, FlyoutPlacement } from '@frontify/fondue';\nimport { Tooltip } from '@frontify/fondue/components';\nimport { type MutableRefObject, useEffect, useState } from 'react';\n\nimport { AttachmentItem, 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    return isEditing || (internalItems?.length ?? 0) > 0 ? (\n        <Tooltip.Root enterDelay={500}>\n            <Tooltip.Trigger>\n                <div data-test-id=\"attachments-flyout-button\">\n                    <Flyout\n                        placement={FlyoutPlacement.BottomRight}\n                        onOpenChange={(isOpen) => handleFlyoutOpenChange(draggedItem ? true : isOpen)}\n                        isOpen={isFlyoutOpen}\n                        hug={false}\n                        fitContent\n                        legacyFooter={false}\n                        trigger={(triggerProps, triggerRef) => (\n                            <TriggerComponent\n                                isFlyoutOpen={isFlyoutOpen}\n                                triggerProps={triggerProps}\n                                triggerRef={triggerRef as MutableRefObject<HTMLButtonElement>}\n                            >\n                                <div>{items.length > 0 ? items.length : 'Add'}</div>\n                            </TriggerComponent>\n                        )}\n                    >\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={[restrictToWindowEdges]}\n                                >\n                                    <SortableContext items={internalItems} strategy={rectSortingStrategy}>\n                                        <div className=\"tw-border-b tw-border-b-line\">\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                                    <DragOverlay>\n                                        {draggedItem && (\n                                            <AttachmentItem\n                                                isOverlay={true}\n                                                isEditing={isEditing}\n                                                key={draggedAssetId}\n                                                item={draggedItem}\n                                                isDragging={true}\n                                                onDelete={() => onDelete(draggedItem)}\n                                                onReplaceWithBrowse={() => onReplaceItemWithBrowse(draggedItem)}\n                                                onReplaceWithUpload={(uploadedAsset: Asset) =>\n                                                    onReplaceItemWithUpload(draggedItem, uploadedAsset)\n                                                }\n                                            />\n                                        )}\n                                    </DragOverlay>\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>\n                </div>\n            </Tooltip.Trigger>\n            <Tooltip.Content side=\"top\">Attachments</Tooltip.Content>\n        </Tooltip.Root>\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","Tooltip","jsx","Flyout","FlyoutPlacement","triggerProps","triggerRef","jsxs","DndContext","closestCenter","restrictToWindowEdges","SortableContext","rectSortingStrategy","SortableAttachmentItem","DragOverlay","AttachmentItem","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    DragOverlay,\n    type DragStartEvent,\n    KeyboardSensor,\n    PointerSensor,\n    closestCenter,\n    useSensor,\n    useSensors,\n} from '@dnd-kit/core';\nimport { restrictToWindowEdges } 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, Flyout, FlyoutPlacement } from '@frontify/fondue';\nimport { Tooltip } from '@frontify/fondue/components';\nimport { type MutableRefObject, useEffect, useState } from 'react';\n\nimport { AttachmentItem, 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    return isEditing || (internalItems?.length ?? 0) > 0 ? (\n        <Tooltip.Root enterDelay={500}>\n            <Tooltip.Trigger asChild>\n                <div data-test-id=\"attachments-flyout-button\">\n                    <Flyout\n                        placement={FlyoutPlacement.BottomRight}\n                        onOpenChange={(isOpen) => handleFlyoutOpenChange(draggedItem ? true : isOpen)}\n                        isOpen={isFlyoutOpen}\n                        hug={false}\n                        fitContent\n                        legacyFooter={false}\n                        trigger={(triggerProps, triggerRef) => (\n                            <TriggerComponent\n                                isFlyoutOpen={isFlyoutOpen}\n                                triggerProps={triggerProps}\n                                triggerRef={triggerRef as MutableRefObject<HTMLButtonElement>}\n                            >\n                                <div>{items.length > 0 ? items.length : 'Add'}</div>\n                            </TriggerComponent>\n                        )}\n                    >\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={[restrictToWindowEdges]}\n                                >\n                                    <SortableContext items={internalItems} strategy={rectSortingStrategy}>\n                                        <div className=\"tw-border-b tw-border-b-line\">\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                                    <DragOverlay>\n                                        {draggedItem && (\n                                            <AttachmentItem\n                                                isOverlay={true}\n                                                isEditing={isEditing}\n                                                key={draggedAssetId}\n                                                item={draggedItem}\n                                                isDragging={true}\n                                                onDelete={() => onDelete(draggedItem)}\n                                                onReplaceWithBrowse={() => onReplaceItemWithBrowse(draggedItem)}\n                                                onReplaceWithUpload={(uploadedAsset: Asset) =>\n                                                    onReplaceItemWithUpload(draggedItem, uploadedAsset)\n                                                }\n                                            />\n                                        )}\n                                    </DragOverlay>\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>\n                </div>\n            </Tooltip.Trigger>\n            <Tooltip.Content side=\"top\">Attachments</Tooltip.Content>\n        </Tooltip.Root>\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","Tooltip","jsx","Flyout","FlyoutPlacement","triggerProps","triggerRef","jsxs","DndContext","closestCenter","restrictToWindowEdges","SortableContext","rectSortingStrategy","SortableAttachmentItem","DragOverlay","AttachmentItem","AssetInput","AssetInputSize","fileList"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwBO,MAAMA,KAAc,CAAC;AAAA,EACxB,OAAAC,IAAQ,CAAC;AAAA,EACT,UAAAC;AAAA,EACA,qBAAAC;AAAA,EACA,qBAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,kBAAkBC,IAAmBC;AAAA,EACrC,QAAAC;AAAA,EACA,cAAAC;AACJ,MAAwB;AACpB,QAAM,CAACC,GAAeC,CAAgB,IAAIC,EAAkBd,CAAK,GAC3D,CAACe,GAAsBC,CAAuB,IAAIF,EAAS,EAAK,GAChEG,IAAUC,EAAWC,EAAUC,CAAa,GAAGD,EAAUE,EAAc,CAAC,GACxE,CAACC,GAAgBC,CAAiB,IAAIT,EAA6B,MAAS,GAC5E,CAACU,GAAiBC,CAAkB,IAAIX,EAAS,EAAK,GACtD,CAACY,GAAiBC,CAAkB,IAAIb,EAAmB,CAAE,CAAA,GAC7D,CAACc,GAAeC,CAAgB,IAAIf,EAA0B,IAAI,GAClEgB,IAAYC,GAAexB,CAAS,GACpC,EAAE,kBAAAyB,GAAkB,mBAAAC,EAAkB,IAAIC,GAAgB3B,CAAS,GACnE4B,IAA+BzB,MAAW,QAC1C0B,IAAeD,IAA+BzB,IAASK,GAEvDsB,IAAczB,KAAA,gBAAAA,EAAe,KAAK,CAAC0B,MAASA,EAAK,OAAOhB,IAExD,CAACiB,GAAY,EAAE,SAASC,GAAe,SAAAC,EAAQ,CAAC,IAAIC,GAAe;AAAA,IACrE,kBAAkB,MAAM,CAAClB,KAAmBC,EAAmB,EAAI;AAAA,EAAA,CACtE,GAEKkB,IAAyB,CAACjC,MAAoB;AAC1C,UAAAkC,IAAcT,IAA+BxB,IAAeK;AAElE,IAAA4B,KAAA,QAAAA,EAAclC;AAAAA,EAAM;AAGxB,EAAAmC,EAAU,MAAM;AACZ,IAAAhC,EAAiBb,CAAK;AAAA,EAAA,GACvB,CAACA,CAAK,CAAC,GAEV6C,EAAU,MAAM;AACZ,IAAIjB,MACAH,EAAmB,EAAI,GACvBc,EAAWX,CAAa;AAAA,EAC5B,GAED,CAACA,CAAa,CAAC,GAElBiB,EAAU,MAAM;AAOD,KANQ,YAAY;AAC3B,MAAIJ,MACA,MAAMpC,EAASmC,CAAa,GAC5Bf,EAAmB,EAAK;AAAA,IAC5B;EAEO,GAEZ,CAACgB,GAASD,CAAa,CAAC;AAE3B,QAAMM,IAAqB,MAAM;AAC7B,IAAAH,EAAuB,EAAK,GAC5BX;AAAA,MACI,CAACe,MAAoB;AACjB,QAAA3C,EAAS2C,CAAM,GACGd,KAClBU,EAAuB,EAAI;AAAA,MAC/B;AAAA,MACA;AAAA,QACI,gBAAgB;AAAA,QAChB,kBAAkB/B,EAAc,IAAI,CAACoC,MAAiBA,EAAa,EAAE;AAAA,MACzE;AAAA,IAAA;AAAA,EACJ,GAGEC,IAA0B,CAACC,MAAqB;AAClD,IAAAP,EAAuB,EAAK,GAC5BX;AAAA,MACI,OAAOe,MAAoB;AACvB,QAAAJ,EAAuB,EAAI,GACTV,KAClBN,EAAmB,CAAC,GAAGD,GAAiBwB,EAAU,EAAE,CAAC,GACrD,MAAMhD,EAAoBgD,GAAWH,EAAO,CAAC,CAAC,GAC9CpB,EAAmBD,EAAgB,OAAO,CAACyB,MAAOA,MAAOD,EAAU,EAAE,CAAC;AAAA,MAC1E;AAAA,MACA;AAAA,QACI,gBAAgB;AAAA,QAChB,kBAAkBtC,EAAc,IAAI,CAACoC,MAAiBA,EAAa,EAAE;AAAA,MACzE;AAAA,IAAA;AAAA,EACJ,GAGEI,IAA0B,OAAOF,GAAkBG,MAAyB;AAC9E,IAAA1B,EAAmB,CAAC,GAAGD,GAAiBwB,EAAU,EAAE,CAAC,GAC/C,MAAA/C,EAAoB+C,GAAWG,CAAa,GAClD1B,EAAmBD,EAAgB,OAAO,CAACyB,MAAOA,MAAOD,EAAU,EAAE,CAAC;AAAA,EAAA,GAGpEI,IAAkB,CAACC,MAA0B;AACzC,UAAA,EAAE,QAAAC,EAAW,IAAAD;AACnB,IAAAhC,EAAkBiC,EAAO,EAAY;AAAA,EAAA,GAGnCC,IAAgB,CAACF,MAAwB;AACrC,UAAA,EAAE,QAAAC,GAAQ,MAAAE,EAAS,IAAAH;AACzB,QAAIG,KAAQF,EAAO,OAAOE,EAAK,MAAM9C,GAAe;AAC1C,YAAA+C,IAAW/C,EAAc,UAAU,CAACgD,MAAMA,EAAE,OAAOJ,EAAO,EAAE,GAC5DK,IAAWjD,EAAc,UAAU,CAACgD,MAAMA,EAAE,OAAOF,EAAK,EAAE,GAC1DI,IAAcC,GAAUnD,GAAe+C,GAAUE,CAAQ;AAC/D,MAAAhD,EAAiBiD,CAAW,GAC5BxD,EAASwD,CAAW;AAAA,IACxB;AACA,IAAAvC,EAAkB,MAAS;AAAA,EAAA;AAGxB,SAAAO,OAAclB,KAAA,gBAAAA,EAAe,WAAU,KAAK,sBAC9CoD,EAAQ,MAAR,EAAa,YAAY,KACtB,UAAA;AAAA,IAAC,gBAAAC,EAAAD,EAAQ,SAAR,EAAgB,SAAO,IACpB,UAAC,gBAAAC,EAAA,OAAA,EAAI,gBAAa,6BACd,UAAA,gBAAAA;AAAA,MAACC;AAAA,MAAA;AAAA,QACG,WAAWC,GAAgB;AAAA,QAC3B,cAAc,CAACzD,MAAWiC,EAAuBN,IAAc,KAAO3B,CAAM;AAAA,QAC5E,QAAQ0B;AAAA,QACR,KAAK;AAAA,QACL,YAAU;AAAA,QACV,cAAc;AAAA,QACd,SAAS,CAACgC,GAAcC,MACpB,gBAAAJ;AAAA,UAACzD;AAAA,UAAA;AAAA,YACG,cAAA4B;AAAA,YACA,cAAAgC;AAAA,YACA,YAAAC;AAAA,YAEA,4BAAC,OAAK,EAAA,UAAArE,EAAM,SAAS,IAAIA,EAAM,SAAS,MAAM,CAAA;AAAA,UAAA;AAAA,QAClD;AAAA,QAGJ,UAAC,gBAAAsE,EAAA,OAAA,EAAI,WAAU,gBAAe,gBAAa,8BACtC,UAAA;AAAA,UAAA1D,EAAc,SAAS,KACpB,gBAAA0D;AAAA,YAACC;AAAA,YAAA;AAAA,cACG,SAAAtD;AAAA,cACA,oBAAoBuD;AAAA,cACpB,aAAalB;AAAA,cACb,WAAWG;AAAA,cACX,WAAW,CAACgB,EAAqB;AAAA,cAEjC,UAAA;AAAA,gBAAA,gBAAAR,EAACS,IAAgB,EAAA,OAAO9D,GAAe,UAAU+D,IAC7C,UAAA,gBAAAV,EAAC,OAAI,EAAA,WAAU,gCACV,UAAArD,EAAc,IAAI,CAAC0B,MAChB,gBAAA2B;AAAA,kBAACW;AAAA,kBAAA;AAAA,oBACG,WAAA9C;AAAA,oBACA,WAAWJ,EAAgB,SAASY,EAAK,EAAE;AAAA,oBAE3C,MAAAA;AAAA,oBACA,UAAU,MAAMrC,EAASqC,CAAI;AAAA,oBAC7B,qBAAqB,MAAMW,EAAwBX,CAAI;AAAA,oBACvD,qBAAqB,CAACe,MAClBD,EAAwBd,GAAMe,CAAa;AAAA,oBAE/C,YAAY,MACR9C,EAAU,SAAS;AAAA,sBACf,MAAM;AAAA,sBACN,SAAS+B;AAAA,oBAAA,CACZ;AAAA,kBAAA;AAAA,kBAXAA,EAAK;AAAA,gBAAA,CAcjB,GACL,EACJ,CAAA;AAAA,gBACA,gBAAA2B,EAACY,MACI,UACGxC,KAAA,gBAAA4B;AAAA,kBAACa;AAAA,kBAAA;AAAA,oBACG,WAAW;AAAA,oBACX,WAAAhD;AAAA,oBAEA,MAAMO;AAAA,oBACN,YAAY;AAAA,oBACZ,UAAU,MAAMpC,EAASoC,CAAW;AAAA,oBACpC,qBAAqB,MAAMY,EAAwBZ,CAAW;AAAA,oBAC9D,qBAAqB,CAACgB,MAClBD,EAAwBf,GAAagB,CAAa;AAAA,kBAAA;AAAA,kBANjD/B;AAAA,gBAAA,GAUjB;AAAA,cAAA;AAAA,YAAA;AAAA,UACJ;AAAA,UAEHQ,KACG,gBAAAwC,EAAC,OAAI,EAAA,WAAU,mBACX,UAAA;AAAA,YAAC,gBAAAL,EAAA,OAAA,EAAI,WAAU,8DAA6D,UAE5E,mBAAA;AAAA,YACA,gBAAAA;AAAA,cAACc;AAAA,cAAA;AAAA,gBACG,WAAWvD;AAAA,gBACX,MAAMwD,GAAe;AAAA,gBACrB,eAAe,CAACC,MAAapD,EAAiBoD,CAAQ;AAAA,gBACtD,gBAAgBnC;AAAA,cAAA;AAAA,YACpB;AAAA,UAAA,GACJ;AAAA,QAAA,GAER;AAAA,MAAA;AAAA,OAER,EACJ,CAAA;AAAA,sBACCkB,EAAQ,SAAR,EAAgB,MAAK,OAAM,UAAW,eAAA;AAAA,EAAA,EAC3C,CAAA,IACA;AACR;"}

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

@@ -1,7 +1,7 @@
 import { jsxs as l, jsx as o } from "react/jsx-runtime";
-import { Tooltip as t } from "../../../node_modules/.pnpm/@frontify_fondue-components@3.3.6_@frontify_fondue-icons@0.4.3_react@18.3.1__@frontify_fondue_7cxc7a3jkaf64pzgaqs74lfks4/node_modules/@frontify/fondue-components/dist/fondue-components22.es.js";
+import { Tooltip as t } from "../../../node_modules/.pnpm/@frontify_fondue-components@16.0.4_@frontify_fondue-icons@0.15.2_react@18.3.1__@frontify_fond_op7623tx44xrzjacx6eyu4zgva/node_modules/@frontify/fondue-components/dist/fondue-components29.es.js";
 const d = ({ content: e, children: r, open: i, disabled: n }) => n ? r : /* @__PURE__ */ l(t.Root, { enterDelay: 300, open: i, children: [
-  /* @__PURE__ */ o(t.Trigger, { children: r }),
+  /* @__PURE__ */ o(t.Trigger, { asChild: !0, children: r }),
   /* @__PURE__ */ o(t.Content, { side: "top", children: /* @__PURE__ */ o("div", { children: e }) })
 ] });
 export {

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

@@ -1 +1 @@
-{"version":3,"file":"ToolbarButtonTooltip.es.js","sources":["../../../../src/components/BlockItemWrapper/Toolbar/ToolbarButtonTooltip.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { Tooltip } from '@frontify/fondue/components';\nimport { type ReactElement, type ReactNode } from 'react';\n\ntype ToolbarButtonTooltipProps = {\n    content: ReactNode;\n    children: ReactElement;\n    open?: boolean;\n    disabled?: boolean;\n};\n\nexport const ToolbarButtonTooltip = ({ content, children, open, disabled }: ToolbarButtonTooltipProps) => {\n    return disabled ? (\n        children\n    ) : (\n        <Tooltip.Root enterDelay={300} open={open}>\n            <Tooltip.Trigger>{children}</Tooltip.Trigger>\n            <Tooltip.Content side=\"top\">\n                <div>{content}</div>\n            </Tooltip.Content>\n        </Tooltip.Root>\n    );\n};\n"],"names":["ToolbarButtonTooltip","content","children","open","disabled","jsxs","Tooltip","jsx"],"mappings":";;AAYO,MAAMA,IAAuB,CAAC,EAAE,SAAAC,GAAS,UAAAC,GAAU,MAAAC,GAAM,UAAAC,QACrDA,IACHF,IAEC,gBAAAG,EAAAC,EAAQ,MAAR,EAAa,YAAY,KAAK,MAAAH,GAC3B,UAAA;AAAA,EAAC,gBAAAI,EAAAD,EAAQ,SAAR,EAAiB,UAAAJ,EAAS,CAAA;AAAA,EAC3B,gBAAAK,EAACD,EAAQ,SAAR,EAAgB,MAAK,OAClB,UAAA,gBAAAC,EAAC,OAAK,EAAA,UAAAN,EAAA,CAAQ,EAClB,CAAA;AACJ,EAAA,CAAA;"}
+{"version":3,"file":"ToolbarButtonTooltip.es.js","sources":["../../../../src/components/BlockItemWrapper/Toolbar/ToolbarButtonTooltip.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { Tooltip } from '@frontify/fondue/components';\nimport { type ReactElement, type ReactNode } from 'react';\n\ntype ToolbarButtonTooltipProps = {\n    content: ReactNode;\n    children: ReactElement;\n    open?: boolean;\n    disabled?: boolean;\n};\n\nexport const ToolbarButtonTooltip = ({ content, children, open, disabled }: ToolbarButtonTooltipProps) => {\n    return disabled ? (\n        children\n    ) : (\n        <Tooltip.Root enterDelay={300} open={open}>\n            <Tooltip.Trigger asChild>{children}</Tooltip.Trigger>\n            <Tooltip.Content side=\"top\">\n                <div>{content}</div>\n            </Tooltip.Content>\n        </Tooltip.Root>\n    );\n};\n"],"names":["ToolbarButtonTooltip","content","children","open","disabled","jsxs","Tooltip","jsx"],"mappings":";;AAYO,MAAMA,IAAuB,CAAC,EAAE,SAAAC,GAAS,UAAAC,GAAU,MAAAC,GAAM,UAAAC,QACrDA,IACHF,IAEC,gBAAAG,EAAAC,EAAQ,MAAR,EAAa,YAAY,KAAK,MAAAH,GAC3B,UAAA;AAAA,EAAA,gBAAAI,EAACD,EAAQ,SAAR,EAAgB,SAAO,IAAE,UAAAJ,GAAS;AAAA,EACnC,gBAAAK,EAACD,EAAQ,SAAR,EAAgB,MAAK,OAClB,UAAA,gBAAAC,EAAC,OAAK,EAAA,UAAAN,EAAA,CAAQ,EAClB,CAAA;AACJ,EAAA,CAAA;"}

package/dist/components/DownloadButton/DownloadButton.es.js

@@ -1,7 +1,7 @@
 import { jsxs as i, jsx as t } from "react/jsx-runtime";
 import { FOCUS_STYLE as l, IconArrowCircleDown16 as a } from "@frontify/fondue";
 import { useFocusRing as w } from "@react-aria/focus";
-import { Tooltip as o } from "../../node_modules/.pnpm/@frontify_fondue-components@3.3.6_@frontify_fondue-icons@0.4.3_react@18.3.1__@frontify_fondue_7cxc7a3jkaf64pzgaqs74lfks4/node_modules/@frontify/fondue-components/dist/fondue-components22.es.js";
+import { Tooltip as o } from "../../node_modules/.pnpm/@frontify_fondue-components@16.0.4_@frontify_fondue-icons@0.15.2_react@18.3.1__@frontify_fond_op7623tx44xrzjacx6eyu4zgva/node_modules/@frontify/fondue-components/dist/fondue-components29.es.js";
 import { joinClassNames as d } from "../../utilities/react/joinClassNames.es.js";
 const f = ({ onDownload: e }) => {
   const { isFocused: n, focusProps: r } = w();

package/dist/components/Link/LinkSelector/LinkSelector.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"LinkSelector.es.js","sources":["../../../../src/components/Link/LinkSelector/LinkSelector.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type Document, type DocumentPage, type DocumentSection } from '@frontify/app-bridge';\nimport { Button, ButtonEmphasis, ButtonSize, ButtonStyle, ButtonType, IconLink, Modal } from '@frontify/fondue';\nimport { useOverlayTriggerState } from '@react-stately/overlays';\nimport { type KeyboardEvent, type ReactElement, useEffect, useState } from 'react';\n\nimport { DocumentLinks } from './DocumentLinks';\n\ntype LinkSelectorProps = {\n    url: string;\n    onUrlChange?: (value: string) => void;\n    buttonSize?: ButtonSize;\n    getAllDocuments: () => Promise<Document[]>;\n    getDocumentSectionsByDocumentPageId: (documentPageId: number) => Promise<DocumentSection[]>;\n    getDocumentPagesByDocumentId: (documentId: number) => Promise<DocumentPage[]>;\n};\n\nexport const LinkSelector = ({\n    url,\n    onUrlChange,\n    buttonSize = ButtonSize.Medium,\n    getAllDocuments,\n    getDocumentPagesByDocumentId,\n    getDocumentSectionsByDocumentPageId,\n}: LinkSelectorProps): ReactElement => {\n    const { open: openLinkTree, isOpen: isLinkTreeOpen, close: closeLinkTree } = useOverlayTriggerState({});\n    const [selectedUrl, setSelectedUrl] = useState<string>(url);\n\n    const onSelectUrl = (url: string) => {\n        setSelectedUrl(url);\n    };\n\n    const onPressEnter = (event: KeyboardEvent<HTMLInputElement>) => {\n        if (event.key === 'Enter') {\n            saveLink();\n        }\n    };\n\n    useEffect(() => {\n        if (url && !selectedUrl) {\n            setSelectedUrl(url);\n        }\n    }, [url, selectedUrl]);\n\n    const saveLink = () => {\n        onUrlChange?.(selectedUrl);\n        closeLinkTree();\n    };\n\n    return (\n        // eslint-disable-next-line jsx-a11y/no-static-element-interactions\n        <div\n            onPointerDown={(event) => event.preventDefault()}\n            data-test-id=\"internal-link-selector\"\n            onKeyDown={onPressEnter}\n        >\n            <Button\n                icon={<IconLink />}\n                size={buttonSize}\n                type={ButtonType.Button}\n                style={ButtonStyle.Default}\n                emphasis={ButtonEmphasis.Default}\n                onClick={() => openLinkTree()}\n            >\n                Internal link\n            </Button>\n            <Modal zIndex={1001} onClose={() => closeLinkTree()} isOpen={isLinkTreeOpen} isDismissable>\n                <Modal.Header title=\"Select internal link\" />\n                <Modal.Body>\n                    <DocumentLinks\n                        selectedUrl={selectedUrl}\n                        onSelectUrl={onSelectUrl}\n                        getAllDocuments={getAllDocuments}\n                        getDocumentPagesByDocumentId={getDocumentPagesByDocumentId}\n                        getDocumentSectionsByDocumentPageId={getDocumentSectionsByDocumentPageId}\n                    />\n                </Modal.Body>\n                <Modal.Footer\n                    buttons={[\n                        {\n                            children: 'Cancel',\n                            onClick: () => closeLinkTree(),\n                            style: ButtonStyle.Default,\n                            emphasis: ButtonEmphasis.Default,\n                        },\n                        {\n                            children: 'Choose',\n                            onClick: (event) => {\n                                event?.preventDefault();\n                                saveLink();\n                            },\n                            style: ButtonStyle.Default,\n                            emphasis: ButtonEmphasis.Strong,\n                            disabled: !selectedUrl,\n                        },\n                    ]}\n                />\n            </Modal>\n        </div>\n    );\n};\n"],"names":["LinkSelector","url","onUrlChange","buttonSize","ButtonSize","getAllDocuments","getDocumentPagesByDocumentId","getDocumentSectionsByDocumentPageId","openLinkTree","isLinkTreeOpen","closeLinkTree","useOverlayTriggerState","selectedUrl","setSelectedUrl","useState","onSelectUrl","onPressEnter","event","saveLink","useEffect","jsxs","jsx","Button","IconLink","ButtonType","ButtonStyle","ButtonEmphasis","Modal","DocumentLinks"],"mappings":";;;;;AAkBO,MAAMA,IAAe,CAAC;AAAA,EACzB,KAAAC;AAAA,EACA,aAAAC;AAAA,EACA,YAAAC,IAAaC,EAAW;AAAA,EACxB,iBAAAC;AAAA,EACA,8BAAAC;AAAA,EACA,qCAAAC;AACJ,MAAuC;AAC7B,QAAA,EAAE,MAAMC,GAAc,QAAQC,GAAgB,OAAOC,EAAc,IAAIC,EAAuB,CAAA,CAAE,GAChG,CAACC,GAAaC,CAAc,IAAIC,EAAiBb,CAAG,GAEpDc,IAAc,CAACd,MAAgB;AACjC,IAAAY,EAAeZ,CAAG;AAAA,EAAA,GAGhBe,IAAe,CAACC,MAA2C;AACzD,IAAAA,EAAM,QAAQ,WACLC;EACb;AAGJ,EAAAC,EAAU,MAAM;AACR,IAAAlB,KAAO,CAACW,KACRC,EAAeZ,CAAG;AAAA,EACtB,GACD,CAACA,GAAKW,CAAW,CAAC;AAErB,QAAMM,IAAW,MAAM;AACnB,IAAAhB,KAAA,QAAAA,EAAcU,IACAF;EAAA;AAGlB;AAAA;AAAA,IAEI,gBAAAU;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,eAAe,CAACH,MAAUA,EAAM,eAAe;AAAA,QAC/C,gBAAa;AAAA,QACb,WAAWD;AAAA,QAEX,UAAA;AAAA,UAAA,gBAAAK;AAAA,YAACC;AAAA,YAAA;AAAA,cACG,wBAAOC,GAAS,EAAA;AAAA,cAChB,MAAMpB;AAAA,cACN,MAAMqB,EAAW;AAAA,cACjB,OAAOC,EAAY;AAAA,cACnB,UAAUC,EAAe;AAAA,cACzB,SAAS,MAAMlB,EAAa;AAAA,cAC/B,UAAA;AAAA,YAAA;AAAA,UAED;AAAA,UACA,gBAAAY,EAACO,GAAM,EAAA,QAAQ,MAAM,SAAS,MAAMjB,EAAiB,GAAA,QAAQD,GAAgB,eAAa,IACtF,UAAA;AAAA,YAAA,gBAAAY,EAACM,EAAM,QAAN,EAAa,OAAM,uBAAuB,CAAA;AAAA,YAC3C,gBAAAN,EAACM,EAAM,MAAN,EACG,UAAA,gBAAAN;AAAA,cAACO;AAAA,cAAA;AAAA,gBACG,aAAAhB;AAAA,gBACA,aAAAG;AAAA,gBACA,iBAAAV;AAAA,gBACA,8BAAAC;AAAA,gBACA,qCAAAC;AAAA,cAAA;AAAA,YAAA,GAER;AAAA,YACA,gBAAAc;AAAA,cAACM,EAAM;AAAA,cAAN;AAAA,gBACG,SAAS;AAAA,kBACL;AAAA,oBACI,UAAU;AAAA,oBACV,SAAS,MAAMjB,EAAc;AAAA,oBAC7B,OAAOe,EAAY;AAAA,oBACnB,UAAUC,EAAe;AAAA,kBAC7B;AAAA,kBACA;AAAA,oBACI,UAAU;AAAA,oBACV,SAAS,CAACT,MAAU;AAChB,sBAAAA,KAAA,QAAAA,EAAO,kBACEC;oBACb;AAAA,oBACA,OAAOO,EAAY;AAAA,oBACnB,UAAUC,EAAe;AAAA,oBACzB,UAAU,CAACd;AAAA,kBACf;AAAA,gBACJ;AAAA,cAAA;AAAA,YACJ;AAAA,UAAA,GACJ;AAAA,QAAA;AAAA,MAAA;AAAA,IACJ;AAAA;AAER;"}
+{"version":3,"file":"LinkSelector.es.js","sources":["../../../../src/components/Link/LinkSelector/LinkSelector.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type Document, type DocumentPage, type DocumentSection } from '@frontify/app-bridge';\nimport { Button, ButtonEmphasis, ButtonSize, ButtonStyle, ButtonType, IconLink, Modal } from '@frontify/fondue';\nimport { useOverlayTriggerState } from '@react-stately/overlays';\nimport { type KeyboardEvent, type ReactElement, useEffect, useState } from 'react';\n\nimport { DocumentLinks } from './DocumentLinks';\n\ntype LinkSelectorProps = {\n    url: string;\n    onUrlChange?: (value: string) => void;\n    buttonSize?: ButtonSize;\n    getAllDocuments: () => Promise<Document[]>;\n    getDocumentSectionsByDocumentPageId: (documentPageId: number) => Promise<DocumentSection[]>;\n    getDocumentPagesByDocumentId: (documentId: number) => Promise<DocumentPage[]>;\n};\n\nexport const LinkSelector = ({\n    url,\n    onUrlChange,\n    buttonSize = ButtonSize.Medium,\n    getAllDocuments,\n    getDocumentPagesByDocumentId,\n    getDocumentSectionsByDocumentPageId,\n}: LinkSelectorProps): ReactElement => {\n    const { open: openLinkTree, isOpen: isLinkTreeOpen, close: closeLinkTree } = useOverlayTriggerState({});\n    const [selectedUrl, setSelectedUrl] = useState<string>(url);\n\n    const onSelectUrl = (url: string) => {\n        setSelectedUrl(url);\n    };\n\n    const onPressEnter = (event: KeyboardEvent<HTMLInputElement>) => {\n        if (event.key === 'Enter') {\n            saveLink();\n        }\n    };\n\n    useEffect(() => {\n        if (url && !selectedUrl) {\n            setSelectedUrl(url);\n        }\n    }, [url, selectedUrl]);\n\n    const saveLink = () => {\n        onUrlChange?.(selectedUrl);\n        closeLinkTree();\n    };\n\n    return (\n        // eslint-disable-next-line jsx-a11y/no-static-element-interactions\n        <div\n            onPointerDown={(event) => event.preventDefault()}\n            data-test-id=\"internal-link-selector\"\n            onKeyDown={onPressEnter}\n        >\n            <Button\n                icon={<IconLink />}\n                size={buttonSize}\n                type={ButtonType.Button}\n                style={ButtonStyle.Default}\n                emphasis={ButtonEmphasis.Default}\n                onClick={() => openLinkTree()}\n            >\n                Internal link\n            </Button>\n            <Modal zIndex={1001} onClose={() => closeLinkTree()} isOpen={isLinkTreeOpen} isDismissable>\n                <Modal.Header title=\"Select internal link\" />\n                <Modal.Body>\n                    <DocumentLinks\n                        selectedUrl={selectedUrl}\n                        onSelectUrl={onSelectUrl}\n                        getAllDocuments={getAllDocuments}\n                        getDocumentPagesByDocumentId={getDocumentPagesByDocumentId}\n                        getDocumentSectionsByDocumentPageId={getDocumentSectionsByDocumentPageId}\n                    />\n                </Modal.Body>\n                <Modal.Footer\n                    buttons={[\n                        {\n                            children: 'Cancel',\n                            onClick: () => closeLinkTree(),\n                            style: ButtonStyle.Default,\n                            emphasis: ButtonEmphasis.Default,\n                        },\n                        {\n                            children: 'Choose',\n                            onClick: (event: React.MouseEvent<HTMLButtonElement>) => {\n                                event?.preventDefault();\n                                saveLink();\n                            },\n                            style: ButtonStyle.Default,\n                            emphasis: ButtonEmphasis.Strong,\n                            disabled: !selectedUrl,\n                        },\n                    ]}\n                />\n            </Modal>\n        </div>\n    );\n};\n"],"names":["LinkSelector","url","onUrlChange","buttonSize","ButtonSize","getAllDocuments","getDocumentPagesByDocumentId","getDocumentSectionsByDocumentPageId","openLinkTree","isLinkTreeOpen","closeLinkTree","useOverlayTriggerState","selectedUrl","setSelectedUrl","useState","onSelectUrl","onPressEnter","event","saveLink","useEffect","jsxs","jsx","Button","IconLink","ButtonType","ButtonStyle","ButtonEmphasis","Modal","DocumentLinks"],"mappings":";;;;;AAkBO,MAAMA,IAAe,CAAC;AAAA,EACzB,KAAAC;AAAA,EACA,aAAAC;AAAA,EACA,YAAAC,IAAaC,EAAW;AAAA,EACxB,iBAAAC;AAAA,EACA,8BAAAC;AAAA,EACA,qCAAAC;AACJ,MAAuC;AAC7B,QAAA,EAAE,MAAMC,GAAc,QAAQC,GAAgB,OAAOC,EAAc,IAAIC,EAAuB,CAAA,CAAE,GAChG,CAACC,GAAaC,CAAc,IAAIC,EAAiBb,CAAG,GAEpDc,IAAc,CAACd,MAAgB;AACjC,IAAAY,EAAeZ,CAAG;AAAA,EAAA,GAGhBe,IAAe,CAACC,MAA2C;AACzD,IAAAA,EAAM,QAAQ,WACLC;EACb;AAGJ,EAAAC,EAAU,MAAM;AACR,IAAAlB,KAAO,CAACW,KACRC,EAAeZ,CAAG;AAAA,EACtB,GACD,CAACA,GAAKW,CAAW,CAAC;AAErB,QAAMM,IAAW,MAAM;AACnB,IAAAhB,KAAA,QAAAA,EAAcU,IACAF;EAAA;AAGlB;AAAA;AAAA,IAEI,gBAAAU;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,eAAe,CAACH,MAAUA,EAAM,eAAe;AAAA,QAC/C,gBAAa;AAAA,QACb,WAAWD;AAAA,QAEX,UAAA;AAAA,UAAA,gBAAAK;AAAA,YAACC;AAAA,YAAA;AAAA,cACG,wBAAOC,GAAS,EAAA;AAAA,cAChB,MAAMpB;AAAA,cACN,MAAMqB,EAAW;AAAA,cACjB,OAAOC,EAAY;AAAA,cACnB,UAAUC,EAAe;AAAA,cACzB,SAAS,MAAMlB,EAAa;AAAA,cAC/B,UAAA;AAAA,YAAA;AAAA,UAED;AAAA,UACA,gBAAAY,EAACO,GAAM,EAAA,QAAQ,MAAM,SAAS,MAAMjB,EAAiB,GAAA,QAAQD,GAAgB,eAAa,IACtF,UAAA;AAAA,YAAA,gBAAAY,EAACM,EAAM,QAAN,EAAa,OAAM,uBAAuB,CAAA;AAAA,YAC3C,gBAAAN,EAACM,EAAM,MAAN,EACG,UAAA,gBAAAN;AAAA,cAACO;AAAA,cAAA;AAAA,gBACG,aAAAhB;AAAA,gBACA,aAAAG;AAAA,gBACA,iBAAAV;AAAA,gBACA,8BAAAC;AAAA,gBACA,qCAAAC;AAAA,cAAA;AAAA,YAAA,GAER;AAAA,YACA,gBAAAc;AAAA,cAACM,EAAM;AAAA,cAAN;AAAA,gBACG,SAAS;AAAA,kBACL;AAAA,oBACI,UAAU;AAAA,oBACV,SAAS,MAAMjB,EAAc;AAAA,oBAC7B,OAAOe,EAAY;AAAA,oBACnB,UAAUC,EAAe;AAAA,kBAC7B;AAAA,kBACA;AAAA,oBACI,UAAU;AAAA,oBACV,SAAS,CAACT,MAA+C;AACrD,sBAAAA,KAAA,QAAAA,EAAO,kBACEC;oBACb;AAAA,oBACA,OAAOO,EAAY;AAAA,oBACnB,UAAUC,EAAe;AAAA,oBACzB,UAAU,CAACd;AAAA,kBACf;AAAA,gBACJ;AAAA,cAAA;AAAA,YACJ;AAAA,UAAA,GACJ;AAAA,QAAA;AAAA,MAAA;AAAA,IACJ;AAAA;AAER;"}

package/dist/components/RichTextEditor/RichTextEditor.es.js

@@ -4,7 +4,7 @@ import { memo as v, useState as h, useCallback as a, useEffect as p, useRef as P
 import { useIsInViewport as C } from "../../hooks/useIsInViewport.es.js";
 import { SerializedText as I } from "./SerializedText.es.js";
 import { getResponsiveColumnClasses as L } from "./plugins/ColumnBreakPlugin/helpers.es.js";
-import { floatingButtonSelectors as S, floatingButtonActions as H } from "./plugins/ButtonPlugin/components/FloatingButton/floatingButtonStore.es.js";
+import { floatingButtonSelectors as S, floatingButtonActions as y } from "./plugins/ButtonPlugin/components/FloatingButton/floatingButtonStore.es.js";
 const E = v(
   ({
     id: d = "rte",
@@ -23,7 +23,7 @@ const E = v(
       },
       [r, t]
     ), x = a(() => u(!0), []), R = a((e) => {
-      S.isOpen(e) && H.reset();
+      S.isOpen(e) && y.reset();
     }, []);
     return p(() => {
       const e = (m) => {
@@ -40,7 +40,8 @@ const E = v(
         plugins: s,
         onValueChanged: x,
         onTextChange: b,
-        hideExternalFloatingModals: R
+        hideExternalFloatingModals: R,
+        placeholderOpacity: "high"
       }
     ) : /* @__PURE__ */ l(
       I,
@@ -55,7 +56,7 @@ const E = v(
   }
 );
 E.displayName = "InternalRichTextEditor";
-const j = (d) => {
+const O = (d) => {
   const i = P(null), [t, n] = h(!1), { isEditing: o, ...c } = d, s = a((r) => {
     r && n(!0);
   }, []);
@@ -64,6 +65,6 @@ const j = (d) => {
   }, [o]), /* @__PURE__ */ l("div", { "data-test-id": "rich-text-editor-container", className: "tw-block tw-w-full tw-@container", ref: i, children: /* @__PURE__ */ l(E, { ...c, isEnabled: o && t }) });
 };
 export {
-  j as RichTextEditor
+  O as RichTextEditor
 };
 //# sourceMappingURL=RichTextEditor.es.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"RichTextEditor.es.js","sources":["../../../src/components/RichTextEditor/RichTextEditor.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { RichTextEditor as FondueRichTextEditor } from '@frontify/fondue';\nimport { memo, useCallback, useEffect, useRef, useState } from 'react';\n\nimport { useIsInViewport } from '../../hooks/useIsInViewport';\n\nimport { SerializedText } from './SerializedText';\nimport { floatingButtonActions, floatingButtonSelectors } from './plugins/ButtonPlugin/components';\nimport { getResponsiveColumnClasses } from './plugins/ColumnBreakPlugin/helpers';\nimport { type RichTextEditorProps } from './types';\n\nconst InternalRichTextEditor = memo(\n    ({\n        id = 'rte',\n        isEnabled,\n        value,\n        columns,\n        gap,\n        placeholder,\n        plugins,\n        onTextChange,\n        showSerializedText,\n    }: Omit<RichTextEditorProps, 'isEditing'> & { isEnabled: boolean }) => {\n        const customClass = getResponsiveColumnClasses(columns);\n        const [shouldPreventPageLeave, setShouldPreventPageLeave] = useState(false);\n\n        const handleTextChange = useCallback(\n            (newContent: string) => {\n                if (newContent !== value) {\n                    onTextChange?.(newContent);\n                }\n                setShouldPreventPageLeave(false);\n            },\n            [onTextChange, value],\n        );\n\n        const handleValueChange = useCallback(() => setShouldPreventPageLeave(true), []);\n\n        const handleHideExternalFloatingModals = useCallback((editorId: string) => {\n            if (floatingButtonSelectors.isOpen(editorId)) {\n                floatingButtonActions.reset();\n            }\n        }, []);\n\n        useEffect(() => {\n            const unloadHandler = (event: BeforeUnloadEvent) => {\n                event.preventDefault();\n                event.returnValue = 'Unprocessed changes';\n            };\n\n            if (shouldPreventPageLeave) {\n                window.addEventListener('beforeunload', unloadHandler);\n            }\n\n            return () => window.removeEventListener('beforeunload', unloadHandler);\n        }, [shouldPreventPageLeave]);\n\n        if (isEnabled) {\n            return (\n                <FondueRichTextEditor\n                    id={id}\n                    value={value}\n                    border={false}\n                    placeholder={placeholder}\n                    plugins={plugins}\n                    onValueChanged={handleValueChange}\n                    onTextChange={handleTextChange}\n                    hideExternalFloatingModals={handleHideExternalFloatingModals}\n                />\n            );\n        }\n        return (\n            <SerializedText\n                value={value}\n                gap={gap}\n                customClass={customClass}\n                show={showSerializedText}\n                plugins={plugins}\n            />\n        );\n    },\n);\nInternalRichTextEditor.displayName = 'InternalRichTextEditor';\n\nexport const RichTextEditor = (props: RichTextEditorProps) => {\n    const ref = useRef<HTMLDivElement>(null);\n    const [hasEnteredViewport, setHasEnteredViewport] = useState(false);\n\n    const { isEditing, ...internalRteProps } = props;\n\n    const onViewportVisibilityChange = useCallback((isInViewport: boolean) => {\n        if (isInViewport) {\n            setHasEnteredViewport(true);\n        }\n    }, []);\n\n    useIsInViewport({ ref, disabled: !isEditing, onChange: onViewportVisibilityChange });\n\n    useEffect(() => {\n        if (!isEditing) {\n            setHasEnteredViewport(false);\n        }\n    }, [isEditing]);\n\n    return (\n        <div data-test-id=\"rich-text-editor-container\" className=\"tw-block tw-w-full tw-@container\" ref={ref}>\n            <InternalRichTextEditor {...internalRteProps} isEnabled={isEditing && hasEnteredViewport} />\n        </div>\n    );\n};\n"],"names":["InternalRichTextEditor","memo","id","isEnabled","value","columns","gap","placeholder","plugins","onTextChange","showSerializedText","customClass","getResponsiveColumnClasses","shouldPreventPageLeave","setShouldPreventPageLeave","useState","handleTextChange","useCallback","newContent","handleValueChange","handleHideExternalFloatingModals","editorId","floatingButtonSelectors","floatingButtonActions","useEffect","unloadHandler","event","jsx","FondueRichTextEditor","SerializedText","RichTextEditor","props","ref","useRef","hasEnteredViewport","setHasEnteredViewport","isEditing","internalRteProps","onViewportVisibilityChange","isInViewport","useIsInViewport"],"mappings":";;;;;;;AAYA,MAAMA,IAAyBC;AAAA,EAC3B,CAAC;AAAA,IACG,IAAAC,IAAK;AAAA,IACL,WAAAC;AAAA,IACA,OAAAC;AAAA,IACA,SAAAC;AAAA,IACA,KAAAC;AAAA,IACA,aAAAC;AAAA,IACA,SAAAC;AAAA,IACA,cAAAC;AAAA,IACA,oBAAAC;AAAA,EAAA,MACmE;AAC7D,UAAAC,IAAcC,EAA2BP,CAAO,GAChD,CAACQ,GAAwBC,CAAyB,IAAIC,EAAS,EAAK,GAEpEC,IAAmBC;AAAA,MACrB,CAACC,MAAuB;AACpB,QAAIA,MAAed,MACfK,KAAA,QAAAA,EAAeS,KAEnBJ,EAA0B,EAAK;AAAA,MACnC;AAAA,MACA,CAACL,GAAcL,CAAK;AAAA,IAAA,GAGlBe,IAAoBF,EAAY,MAAMH,EAA0B,EAAI,GAAG,CAAA,CAAE,GAEzEM,IAAmCH,EAAY,CAACI,MAAqB;AACnE,MAAAC,EAAwB,OAAOD,CAAQ,KACvCE,EAAsB,MAAM;AAAA,IAEpC,GAAG,CAAE,CAAA;AAeL,WAbAC,EAAU,MAAM;AACN,YAAAC,IAAgB,CAACC,MAA6B;AAChD,QAAAA,EAAM,eAAe,GACrBA,EAAM,cAAc;AAAA,MAAA;AAGxB,aAAIb,KACO,OAAA,iBAAiB,gBAAgBY,CAAa,GAGlD,MAAM,OAAO,oBAAoB,gBAAgBA,CAAa;AAAA,IAAA,GACtE,CAACZ,CAAsB,CAAC,GAEvBV,IAEI,gBAAAwB;AAAA,MAACC;AAAAA,MAAA;AAAA,QACG,IAAA1B;AAAA,QACA,OAAAE;AAAA,QACA,QAAQ;AAAA,QACR,aAAAG;AAAA,QACA,SAAAC;AAAA,QACA,gBAAgBW;AAAA,QAChB,cAAcH;AAAA,QACd,4BAA4BI;AAAA,MAAA;AAAA,IAAA,IAKpC,gBAAAO;AAAA,MAACE;AAAA,MAAA;AAAA,QACG,OAAAzB;AAAA,QACA,KAAAE;AAAA,QACA,aAAAK;AAAA,QACA,MAAMD;AAAA,QACN,SAAAF;AAAA,MAAA;AAAA,IAAA;AAAA,EAGZ;AACJ;AACAR,EAAuB,cAAc;AAExB,MAAA8B,IAAiB,CAACC,MAA+B;AACpD,QAAAC,IAAMC,EAAuB,IAAI,GACjC,CAACC,GAAoBC,CAAqB,IAAIpB,EAAS,EAAK,GAE5D,EAAE,WAAAqB,GAAW,GAAGC,EAAA,IAAqBN,GAErCO,IAA6BrB,EAAY,CAACsB,MAA0B;AACtE,IAAIA,KACAJ,EAAsB,EAAI;AAAA,EAElC,GAAG,CAAE,CAAA;AAEL,SAAAK,EAAgB,EAAE,KAAAR,GAAK,UAAU,CAACI,GAAW,UAAUE,GAA4B,GAEnFd,EAAU,MAAM;AACZ,IAAKY,KACDD,EAAsB,EAAK;AAAA,EAC/B,GACD,CAACC,CAAS,CAAC,GAGT,gBAAAT,EAAA,OAAA,EAAI,gBAAa,8BAA6B,WAAU,oCAAmC,KAAAK,GACxF,UAAC,gBAAAL,EAAA3B,GAAA,EAAwB,GAAGqC,GAAkB,WAAWD,KAAaF,GAAoB,EAC9F,CAAA;AAER;"}
+{"version":3,"file":"RichTextEditor.es.js","sources":["../../../src/components/RichTextEditor/RichTextEditor.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { RichTextEditor as FondueRichTextEditor } from '@frontify/fondue';\nimport { memo, useCallback, useEffect, useRef, useState } from 'react';\n\nimport { useIsInViewport } from '../../hooks/useIsInViewport';\n\nimport { SerializedText } from './SerializedText';\nimport { floatingButtonActions, floatingButtonSelectors } from './plugins/ButtonPlugin/components';\nimport { getResponsiveColumnClasses } from './plugins/ColumnBreakPlugin/helpers';\nimport { type RichTextEditorProps } from './types';\n\nconst InternalRichTextEditor = memo(\n    ({\n        id = 'rte',\n        isEnabled,\n        value,\n        columns,\n        gap,\n        placeholder,\n        plugins,\n        onTextChange,\n        showSerializedText,\n    }: Omit<RichTextEditorProps, 'isEditing'> & { isEnabled: boolean }) => {\n        const customClass = getResponsiveColumnClasses(columns);\n        const [shouldPreventPageLeave, setShouldPreventPageLeave] = useState(false);\n\n        const handleTextChange = useCallback(\n            (newContent: string) => {\n                if (newContent !== value) {\n                    onTextChange?.(newContent);\n                }\n                setShouldPreventPageLeave(false);\n            },\n            [onTextChange, value],\n        );\n\n        const handleValueChange = useCallback(() => setShouldPreventPageLeave(true), []);\n\n        const handleHideExternalFloatingModals = useCallback((editorId: string) => {\n            if (floatingButtonSelectors.isOpen(editorId)) {\n                floatingButtonActions.reset();\n            }\n        }, []);\n\n        useEffect(() => {\n            const unloadHandler = (event: BeforeUnloadEvent) => {\n                event.preventDefault();\n                event.returnValue = 'Unprocessed changes';\n            };\n\n            if (shouldPreventPageLeave) {\n                window.addEventListener('beforeunload', unloadHandler);\n            }\n\n            return () => window.removeEventListener('beforeunload', unloadHandler);\n        }, [shouldPreventPageLeave]);\n\n        if (isEnabled) {\n            return (\n                <FondueRichTextEditor\n                    id={id}\n                    value={value}\n                    border={false}\n                    placeholder={placeholder}\n                    plugins={plugins}\n                    onValueChanged={handleValueChange}\n                    onTextChange={handleTextChange}\n                    hideExternalFloatingModals={handleHideExternalFloatingModals}\n                    placeholderOpacity=\"high\"\n                />\n            );\n        }\n        return (\n            <SerializedText\n                value={value}\n                gap={gap}\n                customClass={customClass}\n                show={showSerializedText}\n                plugins={plugins}\n            />\n        );\n    },\n);\nInternalRichTextEditor.displayName = 'InternalRichTextEditor';\n\nexport const RichTextEditor = (props: RichTextEditorProps) => {\n    const ref = useRef<HTMLDivElement>(null);\n    const [hasEnteredViewport, setHasEnteredViewport] = useState(false);\n\n    const { isEditing, ...internalRteProps } = props;\n\n    const onViewportVisibilityChange = useCallback((isInViewport: boolean) => {\n        if (isInViewport) {\n            setHasEnteredViewport(true);\n        }\n    }, []);\n\n    useIsInViewport({ ref, disabled: !isEditing, onChange: onViewportVisibilityChange });\n\n    useEffect(() => {\n        if (!isEditing) {\n            setHasEnteredViewport(false);\n        }\n    }, [isEditing]);\n\n    return (\n        <div data-test-id=\"rich-text-editor-container\" className=\"tw-block tw-w-full tw-@container\" ref={ref}>\n            <InternalRichTextEditor {...internalRteProps} isEnabled={isEditing && hasEnteredViewport} />\n        </div>\n    );\n};\n"],"names":["InternalRichTextEditor","memo","id","isEnabled","value","columns","gap","placeholder","plugins","onTextChange","showSerializedText","customClass","getResponsiveColumnClasses","shouldPreventPageLeave","setShouldPreventPageLeave","useState","handleTextChange","useCallback","newContent","handleValueChange","handleHideExternalFloatingModals","editorId","floatingButtonSelectors","floatingButtonActions","useEffect","unloadHandler","event","jsx","FondueRichTextEditor","SerializedText","RichTextEditor","props","ref","useRef","hasEnteredViewport","setHasEnteredViewport","isEditing","internalRteProps","onViewportVisibilityChange","isInViewport","useIsInViewport"],"mappings":";;;;;;;AAYA,MAAMA,IAAyBC;AAAA,EAC3B,CAAC;AAAA,IACG,IAAAC,IAAK;AAAA,IACL,WAAAC;AAAA,IACA,OAAAC;AAAA,IACA,SAAAC;AAAA,IACA,KAAAC;AAAA,IACA,aAAAC;AAAA,IACA,SAAAC;AAAA,IACA,cAAAC;AAAA,IACA,oBAAAC;AAAA,EAAA,MACmE;AAC7D,UAAAC,IAAcC,EAA2BP,CAAO,GAChD,CAACQ,GAAwBC,CAAyB,IAAIC,EAAS,EAAK,GAEpEC,IAAmBC;AAAA,MACrB,CAACC,MAAuB;AACpB,QAAIA,MAAed,MACfK,KAAA,QAAAA,EAAeS,KAEnBJ,EAA0B,EAAK;AAAA,MACnC;AAAA,MACA,CAACL,GAAcL,CAAK;AAAA,IAAA,GAGlBe,IAAoBF,EAAY,MAAMH,EAA0B,EAAI,GAAG,CAAA,CAAE,GAEzEM,IAAmCH,EAAY,CAACI,MAAqB;AACnE,MAAAC,EAAwB,OAAOD,CAAQ,KACvCE,EAAsB,MAAM;AAAA,IAEpC,GAAG,CAAE,CAAA;AAeL,WAbAC,EAAU,MAAM;AACN,YAAAC,IAAgB,CAACC,MAA6B;AAChD,QAAAA,EAAM,eAAe,GACrBA,EAAM,cAAc;AAAA,MAAA;AAGxB,aAAIb,KACO,OAAA,iBAAiB,gBAAgBY,CAAa,GAGlD,MAAM,OAAO,oBAAoB,gBAAgBA,CAAa;AAAA,IAAA,GACtE,CAACZ,CAAsB,CAAC,GAEvBV,IAEI,gBAAAwB;AAAA,MAACC;AAAAA,MAAA;AAAA,QACG,IAAA1B;AAAA,QACA,OAAAE;AAAA,QACA,QAAQ;AAAA,QACR,aAAAG;AAAA,QACA,SAAAC;AAAA,QACA,gBAAgBW;AAAA,QAChB,cAAcH;AAAA,QACd,4BAA4BI;AAAA,QAC5B,oBAAmB;AAAA,MAAA;AAAA,IAAA,IAK3B,gBAAAO;AAAA,MAACE;AAAA,MAAA;AAAA,QACG,OAAAzB;AAAA,QACA,KAAAE;AAAA,QACA,aAAAK;AAAA,QACA,MAAMD;AAAA,QACN,SAAAF;AAAA,MAAA;AAAA,IAAA;AAAA,EAGZ;AACJ;AACAR,EAAuB,cAAc;AAExB,MAAA8B,IAAiB,CAACC,MAA+B;AACpD,QAAAC,IAAMC,EAAuB,IAAI,GACjC,CAACC,GAAoBC,CAAqB,IAAIpB,EAAS,EAAK,GAE5D,EAAE,WAAAqB,GAAW,GAAGC,EAAA,IAAqBN,GAErCO,IAA6BrB,EAAY,CAACsB,MAA0B;AACtE,IAAIA,KACAJ,EAAsB,EAAI;AAAA,EAElC,GAAG,CAAE,CAAA;AAEL,SAAAK,EAAgB,EAAE,KAAAR,GAAK,UAAU,CAACI,GAAW,UAAUE,GAA4B,GAEnFd,EAAU,MAAM;AACZ,IAAKY,KACDD,EAAsB,EAAK;AAAA,EAC/B,GACD,CAACC,CAAS,CAAC,GAGT,gBAAAT,EAAA,OAAA,EAAI,gBAAa,8BAA6B,WAAU,oCAAmC,KAAAK,GACxF,UAAC,gBAAAL,EAAA3B,GAAA,EAAwB,GAAGqC,GAAkB,WAAWD,KAAaF,GAAoB,EAC9F,CAAA;AAER;"}