@frontify/guideline-blocks-settings 3.0.1 → 3.0.2

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 (30) hide show
  1. package/dist/components/Attachments/AttachmentItem.es.js.map +1 -1
  2. package/dist/components/Attachments/Attachments.es.js +2 -2
  3. package/dist/components/Attachments/Attachments.es.js.map +1 -1
  4. package/dist/components/BlockItemWrapper/Toolbar/DragHandleToolbarButton/DragHandleToolbarButton.es.js +4 -4
  5. package/dist/components/BlockItemWrapper/Toolbar/DragHandleToolbarButton/DragHandleToolbarButton.es.js.map +1 -1
  6. package/dist/components/BlockItemWrapper/Toolbar/FlyoutToolbarButton/FlyoutToolbarButton.es.js +5 -5
  7. package/dist/components/BlockItemWrapper/Toolbar/FlyoutToolbarButton/FlyoutToolbarButton.es.js.map +1 -1
  8. package/dist/components/BlockItemWrapper/Toolbar/Toolbar.es.js.map +1 -1
  9. package/dist/components/BlockItemWrapper/Toolbar/ToolbarButton/ToolbarButton.es.js +4 -4
  10. package/dist/components/BlockItemWrapper/Toolbar/ToolbarButton/ToolbarButton.es.js.map +1 -1
  11. package/dist/components/Link/LinkSelector/DocumentLink.es.js.map +1 -1
  12. package/dist/components/Link/LinkSelector/DocumentLinks.es.js.map +1 -1
  13. package/dist/components/Link/LinkSelector/LinkSelector.es.js +1 -1
  14. package/dist/components/Link/LinkSelector/LinkSelector.es.js.map +1 -1
  15. package/dist/components/Link/LinkSelector/PageLink.es.js.map +1 -1
  16. package/dist/components/Link/LinkSelector/PageLinks.es.js.map +1 -1
  17. package/dist/components/RichTextEditor/RichTextEditor.es.js +4 -4
  18. package/dist/components/RichTextEditor/RichTextEditor.es.js.map +1 -1
  19. package/dist/components/RichTextEditor/plugins/ButtonPlugin/components/FloatingButton/floatingButtonStore.es.js.map +1 -1
  20. package/dist/components/RichTextEditor/plugins/ButtonPlugin/createButtonPlugin.es.js.map +1 -1
  21. package/dist/components/RichTextEditor/plugins/LinkPlugin/index.es.js +1 -1
  22. package/dist/components/RichTextEditor/plugins/LinkPlugin/index.es.js.map +1 -1
  23. package/dist/index.cjs.js +5 -5
  24. package/dist/index.cjs.js.map +1 -1
  25. package/dist/index.d.ts +1 -1
  26. package/dist/index.es.js.map +1 -1
  27. package/dist/index.umd.js +5 -5
  28. package/dist/index.umd.js.map +1 -1
  29. package/dist/styles.css +1 -1
  30. package/package.json +14 -13
@@ -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 { LoadingCircle, Dropdown, Button } from '@frontify/fondue/components';\nimport {\n IconArrowCircleUp,\n IconImageStack,\n IconPen,\n IconTrashBin,\n IconDocument,\n IconImage,\n IconPlayFrame,\n IconMusicNote,\n IconGrabHandle,\n} from '@frontify/fondue/icons';\nimport { 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 <IconImage size=\"24\" />;\n } else if (type === 'VIDEO') {\n return <IconPlayFrame size=\"24\" />;\n } else if (type === 'AUDIO') {\n return <IconMusicNote size=\"24\" />;\n } else {\n return <IconDocument size=\"24\" />;\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 useEffect(() => {\n if (selectedFiles) {\n uploadFile(selectedFiles[0]);\n }\n // eslint-disable-next-line @eslint-react/exhaustive-deps\n }, [selectedFiles]);\n\n useEffect(() => {\n if (doneAll) {\n onReplaceWithUpload(uploadResults[0]);\n }\n // eslint-disable-next-line @eslint-react/exhaustive-deps\n }, [doneAll, uploadResults]);\n\n const showLoadingCircle = isLoading || (selectedFiles && !doneAll);\n\n return (\n <button\n type=\"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-surface-hover focus-visible:tw-outline focus-visible:!-tw-outline-offset-4',\n isDragging ? 'tw-bg-surface-hover' : '',\n ])}\n >\n <div className=\"tw-text-secondary group-hover:tw-text-container-secondary-on-secondary-container\">\n {showLoadingCircle ? <LoadingCircle size=\"small\" /> : getDecorator(item.objectType)}\n </div>\n <div className=\"tw-text-small tw-flex-1 tw-min-w-0\">\n <div className=\"tw-whitespace-nowrap tw-overflow-hidden tw-text-ellipsis tw-font-bold tw-text-secondary group-hover:tw-text-container-secondary-on-secondary-container\">\n {item.title}\n </div>\n <div className=\"tw-text-secondary\">{`${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-hover:tw-opacity-100 group-focus-visible:tw-opacity-100 has-[:focus-visible]:tw-opacity-100',\n isOverlay || selectedAsset?.id === item.id ? 'tw-opacity-100' : 'tw-opacity-0',\n ])}\n >\n <Button\n aspect=\"square\"\n emphasis=\"weak\"\n aria-label=\"Drag attachment\"\n className={joinClassNames([\n isDragging || isOverlay ? 'tw-cursor-grabbing' : 'tw-cursor-grab',\n 'focus-visible:tw-z-[2]',\n ])}\n {...draggableProps}\n >\n <IconGrabHandle />\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 emphasis={selectedAsset?.id === item.id ? 'default' : 'weak'}\n onPress={(e) => {\n e?.stopPropagation();\n e?.preventDefault();\n }}\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","jsx","IconImage","IconPlayFrame","IconMusicNote","IconDocument","AttachmentItem","forwardRef","item","isEditing","draggableProps","transformStyle","isDragging","isOverlay","isLoading","onDelete","onReplaceWithBrowse","onReplaceWithUpload","onDownload","ref","selectedAsset","setSelectedAsset","useState","openFileDialog","selectedFiles","useFileInput","uploadFile","uploadResults","doneAll","useAssetUpload","useEffect","showLoadingCircle","jsxs","joinClassNames","LoadingCircle","Button","IconGrabHandle","Dropdown","isOpen","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 { LoadingCircle, Dropdown, Button } from '@frontify/fondue/components';\nimport {\n IconArrowCircleUp,\n IconImageStack,\n IconPen,\n IconTrashBin,\n IconDocument,\n IconImage,\n IconPlayFrame,\n IconMusicNote,\n IconGrabHandle,\n} from '@frontify/fondue/icons';\nimport { 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 <IconImage size=\"24\" />;\n } else if (type === 'VIDEO') {\n return <IconPlayFrame size=\"24\" />;\n } else if (type === 'AUDIO') {\n return <IconMusicNote size=\"24\" />;\n } else {\n return <IconDocument size=\"24\" />;\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 useEffect(() => {\n if (selectedFiles) {\n uploadFile(selectedFiles[0]);\n }\n // oxlint-disable-next-line @eslint-react/exhaustive-deps\n }, [selectedFiles]);\n\n useEffect(() => {\n if (doneAll) {\n onReplaceWithUpload(uploadResults[0]);\n }\n // oxlint-disable-next-line @eslint-react/exhaustive-deps\n }, [doneAll, uploadResults]);\n\n const showLoadingCircle = isLoading || (selectedFiles && !doneAll);\n\n return (\n <button\n type=\"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-surface-hover focus-visible:tw-outline focus-visible:!-tw-outline-offset-4',\n isDragging ? 'tw-bg-surface-hover' : '',\n ])}\n >\n <div className=\"tw-text-secondary group-hover:tw-text-container-secondary-on-secondary-container\">\n {showLoadingCircle ? <LoadingCircle size=\"small\" /> : getDecorator(item.objectType)}\n </div>\n <div className=\"tw-text-small tw-flex-1 tw-min-w-0\">\n <div className=\"tw-whitespace-nowrap tw-overflow-hidden tw-text-ellipsis tw-font-bold tw-text-secondary group-hover:tw-text-container-secondary-on-secondary-container\">\n {item.title}\n </div>\n <div className=\"tw-text-secondary\">{`${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-hover:tw-opacity-100 group-focus-visible:tw-opacity-100 has-[:focus-visible]:tw-opacity-100',\n isOverlay || selectedAsset?.id === item.id ? 'tw-opacity-100' : 'tw-opacity-0',\n ])}\n >\n <Button\n aspect=\"square\"\n emphasis=\"weak\"\n aria-label=\"Drag attachment\"\n className={joinClassNames([\n isDragging || isOverlay ? 'tw-cursor-grabbing' : 'tw-cursor-grab',\n 'focus-visible:tw-z-[2]',\n ])}\n {...draggableProps}\n >\n <IconGrabHandle />\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 emphasis={selectedAsset?.id === item.id ? 'default' : 'weak'}\n onPress={(e) => {\n e?.stopPropagation();\n e?.preventDefault();\n }}\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","jsx","IconImage","IconPlayFrame","IconMusicNote","IconDocument","AttachmentItem","forwardRef","item","isEditing","draggableProps","transformStyle","isDragging","isOverlay","isLoading","onDelete","onReplaceWithBrowse","onReplaceWithUpload","onDownload","ref","selectedAsset","setSelectedAsset","useState","openFileDialog","selectedFiles","useFileInput","uploadFile","uploadResults","doneAll","useAssetUpload","useEffect","showLoadingCircle","jsxs","joinClassNames","LoadingCircle","Button","IconGrabHandle","Dropdown","isOpen","e","IconPen","event","IconArrowCircleUp","IconImageStack","IconTrashBin","SortableAttachmentItem","props","attributes","listeners","setNodeRef","transform","transition","useSortable"],"mappings":"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"}
@@ -35,7 +35,7 @@ const Et = ({
35
35
  }, [P, E]);
36
36
  const X = () => {
37
37
  i(!1), b(
38
- // eslint-disable-next-line @typescript-eslint/no-misused-promises
38
+ // oxlint-disable-next-line typescript/no-misused-promises
39
39
  async (t) => {
40
40
  F(), i(!0), D(!0), await R(t), D(!1);
41
41
  },
@@ -46,7 +46,7 @@ const Et = ({
46
46
  );
47
47
  }, Y = (t) => {
48
48
  i(!1), b(
49
- // eslint-disable-next-line @typescript-eslint/no-misused-promises
49
+ // oxlint-disable-next-line typescript/no-misused-promises
50
50
  async (o) => {
51
51
  i(!0), F(), h([...c, t.id]), await O(t, o[0]), h(c.filter((a) => a !== t.id));
52
52
  },
@@ -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 { restrictToParentElement } from '@dnd-kit/modifiers';\nimport { SortableContext, arrayMove, rectSortingStrategy } from '@dnd-kit/sortable';\nimport { type Asset, useAssetChooser, useAssetUpload, useEditorState } from '@frontify/app-bridge';\nimport { Tooltip, Flyout, AssetInput, Flex } from '@frontify/fondue/components';\nimport { IconArrowCircleUp, IconImageStack } from '@frontify/fondue/icons';\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 [isBrowseLoading, setIsBrowseLoading] = 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 @eslint-react/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 @eslint-react/exhaustive-deps\n }, [doneAll, uploadResults]);\n\n const onOpenAssetChooser = () => {\n handleFlyoutOpenChange(false);\n openAssetChooser(\n // eslint-disable-next-line @typescript-eslint/no-misused-promises\n async (result: Asset[]) => {\n closeAssetChooser();\n handleFlyoutOpenChange(true);\n setIsBrowseLoading(true);\n await onBrowse(result);\n setIsBrowseLoading(false);\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 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\" width=\"300px\" {...autoFocusModifier}>\n <div className=\"tw-w-full\" 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={[restrictToParentElement]}\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\" data-test-id=\"asset-input-placeholder\">\n <div className=\"tw-font-primary tw-font-medium tw-text-primary tw-text-small tw-my-4\">\n Add attachments\n </div>\n {isUploadLoading || isBrowseLoading ? (\n <AssetInput.Root orientation=\"horizontal\">\n <AssetInput.Preview>\n <AssetInput.PreviewLoading />\n </AssetInput.Preview>\n <AssetInput.Title>Asset</AssetInput.Title>\n <AssetInput.Metadata>\n <AssetInput.MetadataItem>\n <Flex align=\"center\" gap={0.5}>\n {isBrowseLoading ? (\n <IconImageStack size={16} />\n ) : (\n <IconArrowCircleUp size={16} />\n )}\n {isBrowseLoading ? 'Loading' : 'Uploading'}\n </Flex>\n </AssetInput.MetadataItem>\n </AssetInput.Metadata>\n </AssetInput.Root>\n ) : (\n <AssetInput.Placeholder>\n <AssetInput.UploadInput\n allowMultiple\n onSelect={(event) => setSelectedFiles(event.target.files)}\n />\n <AssetInput.BrowseInput onBrowse={onOpenAssetChooser} />\n </AssetInput.Placeholder>\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","isBrowseLoading","setIsBrowseLoading","assetIdsLoading","setAssetIdsLoading","selectedFiles","setSelectedFiles","isEditing","useEditorState","openAssetChooser","closeAssetChooser","useAssetChooser","isControllingStateExternally","isFlyoutOpen","draggedItem","item","uploadFile","uploadResults","doneAll","useAssetUpload","handleFlyoutOpenChange","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","restrictToParentElement","SortableContext","rectSortingStrategy","SortableAttachmentItem","AssetInput","Flex","IconImageStack","IconArrowCircleUp"],"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 { restrictToParentElement } from '@dnd-kit/modifiers';\nimport { SortableContext, arrayMove, rectSortingStrategy } from '@dnd-kit/sortable';\nimport { type Asset, useAssetChooser, useAssetUpload, useEditorState } from '@frontify/app-bridge';\nimport { Tooltip, Flyout, AssetInput, Flex } from '@frontify/fondue/components';\nimport { IconArrowCircleUp, IconImageStack } from '@frontify/fondue/icons';\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 [isBrowseLoading, setIsBrowseLoading] = 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 // oxlint-disable-next-line @eslint-react/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 // oxlint-disable-next-line @eslint-react/exhaustive-deps\n }, [doneAll, uploadResults]);\n\n const onOpenAssetChooser = () => {\n handleFlyoutOpenChange(false);\n openAssetChooser(\n // oxlint-disable-next-line typescript/no-misused-promises\n async (result: Asset[]) => {\n closeAssetChooser();\n handleFlyoutOpenChange(true);\n setIsBrowseLoading(true);\n await onBrowse(result);\n setIsBrowseLoading(false);\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 // oxlint-disable-next-line typescript/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 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\" width=\"300px\" {...autoFocusModifier}>\n <div className=\"tw-w-full\" 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={[restrictToParentElement]}\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\" data-test-id=\"asset-input-placeholder\">\n <div className=\"tw-font-primary tw-font-medium tw-text-primary tw-text-small tw-my-4\">\n Add attachments\n </div>\n {isUploadLoading || isBrowseLoading ? (\n <AssetInput.Root orientation=\"horizontal\">\n <AssetInput.Preview>\n <AssetInput.PreviewLoading />\n </AssetInput.Preview>\n <AssetInput.Title>Asset</AssetInput.Title>\n <AssetInput.Metadata>\n <AssetInput.MetadataItem>\n <Flex align=\"center\" gap={0.5}>\n {isBrowseLoading ? (\n <IconImageStack size={16} />\n ) : (\n <IconArrowCircleUp size={16} />\n )}\n {isBrowseLoading ? 'Loading' : 'Uploading'}\n </Flex>\n </AssetInput.MetadataItem>\n </AssetInput.Metadata>\n </AssetInput.Root>\n ) : (\n <AssetInput.Placeholder>\n <AssetInput.UploadInput\n allowMultiple\n onSelect={(event) => setSelectedFiles(event.target.files)}\n />\n <AssetInput.BrowseInput onBrowse={onOpenAssetChooser} />\n </AssetInput.Placeholder>\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","isBrowseLoading","setIsBrowseLoading","assetIdsLoading","setAssetIdsLoading","selectedFiles","setSelectedFiles","isEditing","useEditorState","openAssetChooser","closeAssetChooser","useAssetChooser","isControllingStateExternally","isFlyoutOpen","draggedItem","item","uploadFile","uploadResults","doneAll","useAssetUpload","handleFlyoutOpenChange","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","restrictToParentElement","SortableContext","rectSortingStrategy","SortableAttachmentItem","AssetInput","Flex","IconImageStack","IconArrowCircleUp"],"mappings":"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"}
@@ -2,17 +2,17 @@ import { jsx as t } from "react/jsx-runtime";
2
2
  import { useDndContext as m } from "@dnd-kit/core";
3
3
  import { DEFAULT_DRAGGING_TOOLTIP as s, DEFAULT_DRAG_TOOLTIP as d } from "../../constants.es.js";
4
4
  import { BaseToolbarButton as l } from "../BaseToolbarButton.es.js";
5
- import { ToolbarButtonTooltip as p } from "../ToolbarButtonTooltip.es.js";
6
- import { useDragPreviewContext as T } from "../context/DragPreviewContext.es.js";
5
+ import { useDragPreviewContext as p } from "../context/DragPreviewContext.es.js";
6
+ import { ToolbarButtonTooltip as T } from "../ToolbarButtonTooltip.es.js";
7
7
  const B = ({
8
8
  tooltip: r,
9
9
  icon: e,
10
10
  setActivatorNodeRef: n,
11
11
  draggableProps: a
12
12
  }) => {
13
- const o = T(), { activatorEvent: i } = m(), c = i instanceof KeyboardEvent;
13
+ const o = p(), { activatorEvent: i } = m(), c = i instanceof KeyboardEvent;
14
14
  return /* @__PURE__ */ t(
15
- p,
15
+ T,
16
16
  {
17
17
  ...o && { open: c },
18
18
  content: /* @__PURE__ */ t("div", { children: o ? s : r ?? d }),
@@ -1 +1 @@
1
- {"version":3,"file":"DragHandleToolbarButton.es.js","sources":["../../../../../src/components/BlockItemWrapper/Toolbar/DragHandleToolbarButton/DragHandleToolbarButton.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { useDndContext } from '@dnd-kit/core';\nimport { type ReactNode } from 'react';\n\nimport { DEFAULT_DRAGGING_TOOLTIP, DEFAULT_DRAG_TOOLTIP } from '../../constants';\nimport { BaseToolbarButton } from '../BaseToolbarButton';\nimport { ToolbarButtonTooltip } from '../ToolbarButtonTooltip';\nimport { useDragPreviewContext } from '../context/DragPreviewContext';\n\nexport type DragHandleToolbarButtonProps = {\n icon?: ReactNode;\n tooltip?: string;\n draggableProps: Record<string, unknown>;\n setActivatorNodeRef?: (node: HTMLElement | null) => void;\n};\n\nexport const DragHandleToolbarButton = ({\n tooltip,\n icon,\n setActivatorNodeRef,\n draggableProps,\n}: DragHandleToolbarButtonProps) => {\n const isDragPreview = useDragPreviewContext();\n const { activatorEvent } = useDndContext();\n const activatedByKeyboard = activatorEvent instanceof KeyboardEvent;\n\n return (\n <ToolbarButtonTooltip\n {...(isDragPreview && { open: activatedByKeyboard })}\n content={<div>{isDragPreview ? DEFAULT_DRAGGING_TOOLTIP : (tooltip ?? DEFAULT_DRAG_TOOLTIP)}</div>}\n >\n <BaseToolbarButton\n ref={setActivatorNodeRef}\n data-test-id=\"block-item-wrapper-toolbar-btn\"\n forceActiveStyle={isDragPreview}\n cursor=\"grab\"\n {...draggableProps}\n >\n {icon}\n </BaseToolbarButton>\n </ToolbarButtonTooltip>\n );\n};\n"],"names":["DragHandleToolbarButton","tooltip","icon","setActivatorNodeRef","draggableProps","isDragPreview","useDragPreviewContext","activatorEvent","useDndContext","activatedByKeyboard","jsx","ToolbarButtonTooltip","DEFAULT_DRAGGING_TOOLTIP","DEFAULT_DRAG_TOOLTIP","BaseToolbarButton"],"mappings":";;;;;;AAiBO,MAAMA,IAA0B,CAAC;AAAA,EACpC,SAAAC;AAAA,EACA,MAAAC;AAAA,EACA,qBAAAC;AAAA,EACA,gBAAAC;AACJ,MAAoC;AAChC,QAAMC,IAAgBC,EAAA,GAChB,EAAE,gBAAAC,EAAA,IAAmBC,EAAA,GACrBC,IAAsBF,aAA0B;AAEtD,SACI,gBAAAG;AAAA,IAACC;AAAA,IAAA;AAAA,MACI,GAAIN,KAAiB,EAAE,MAAMI,EAAA;AAAA,MAC9B,SAAS,gBAAAC,EAAC,OAAA,EAAK,UAAAL,IAAgBO,IAA4BX,KAAWY,GAAsB;AAAA,MAE5F,UAAA,gBAAAH;AAAA,QAACI;AAAA,QAAA;AAAA,UACG,KAAKX;AAAA,UACL,gBAAa;AAAA,UACb,kBAAkBE;AAAA,UAClB,QAAO;AAAA,UACN,GAAGD;AAAA,UAEH,UAAAF;AAAA,QAAA;AAAA,MAAA;AAAA,IACL;AAAA,EAAA;AAGZ;"}
1
+ {"version":3,"file":"DragHandleToolbarButton.es.js","sources":["../../../../../src/components/BlockItemWrapper/Toolbar/DragHandleToolbarButton/DragHandleToolbarButton.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { useDndContext } from '@dnd-kit/core';\nimport { type ReactNode } from 'react';\n\nimport { DEFAULT_DRAGGING_TOOLTIP, DEFAULT_DRAG_TOOLTIP } from '../../constants';\nimport { BaseToolbarButton } from '../BaseToolbarButton';\nimport { useDragPreviewContext } from '../context/DragPreviewContext';\nimport { ToolbarButtonTooltip } from '../ToolbarButtonTooltip';\n\nexport type DragHandleToolbarButtonProps = {\n icon?: ReactNode;\n tooltip?: string;\n draggableProps: Record<string, unknown>;\n setActivatorNodeRef?: (node: HTMLElement | null) => void;\n};\n\nexport const DragHandleToolbarButton = ({\n tooltip,\n icon,\n setActivatorNodeRef,\n draggableProps,\n}: DragHandleToolbarButtonProps) => {\n const isDragPreview = useDragPreviewContext();\n const { activatorEvent } = useDndContext();\n const activatedByKeyboard = activatorEvent instanceof KeyboardEvent;\n\n return (\n <ToolbarButtonTooltip\n {...(isDragPreview && { open: activatedByKeyboard })}\n content={<div>{isDragPreview ? DEFAULT_DRAGGING_TOOLTIP : (tooltip ?? DEFAULT_DRAG_TOOLTIP)}</div>}\n >\n <BaseToolbarButton\n ref={setActivatorNodeRef}\n data-test-id=\"block-item-wrapper-toolbar-btn\"\n forceActiveStyle={isDragPreview}\n cursor=\"grab\"\n {...draggableProps}\n >\n {icon}\n </BaseToolbarButton>\n </ToolbarButtonTooltip>\n );\n};\n"],"names":["DragHandleToolbarButton","tooltip","icon","setActivatorNodeRef","draggableProps","isDragPreview","useDragPreviewContext","activatorEvent","useDndContext","activatedByKeyboard","jsx","ToolbarButtonTooltip","DEFAULT_DRAGGING_TOOLTIP","DEFAULT_DRAG_TOOLTIP","BaseToolbarButton"],"mappings":";;;;;;AAiBO,MAAMA,IAA0B,CAAC;AAAA,EACpC,SAAAC;AAAA,EACA,MAAAC;AAAA,EACA,qBAAAC;AAAA,EACA,gBAAAC;AACJ,MAAoC;AAChC,QAAMC,IAAgBC,EAAA,GAChB,EAAE,gBAAAC,EAAA,IAAmBC,EAAA,GACrBC,IAAsBF,aAA0B;AAEtD,SACI,gBAAAG;AAAA,IAACC;AAAA,IAAA;AAAA,MACI,GAAIN,KAAiB,EAAE,MAAMI,EAAA;AAAA,MAC9B,SAAS,gBAAAC,EAAC,OAAA,EAAK,UAAAL,IAAgBO,IAA4BX,KAAWY,GAAsB;AAAA,MAE5F,UAAA,gBAAAH;AAAA,QAACI;AAAA,QAAA;AAAA,UACG,KAAKX;AAAA,UACL,gBAAa;AAAA,UACb,kBAAkBE;AAAA,UAClB,QAAO;AAAA,UACN,GAAGD;AAAA,UAEH,UAAAF;AAAA,QAAA;AAAA,MAAA;AAAA,IACL;AAAA,EAAA;AAGZ;"}
@@ -1,9 +1,9 @@
1
1
  import { jsx as t, jsxs as n } from "react/jsx-runtime";
2
2
  import { Flyout as o } from "@frontify/fondue/components";
3
3
  import { BaseToolbarButton as p } from "../BaseToolbarButton.es.js";
4
- import { ToolbarButtonTooltip as h } from "../ToolbarButtonTooltip.es.js";
5
- import { useDragPreviewContext as u } from "../context/DragPreviewContext.es.js";
6
- import { useMultiFlyoutState as f } from "../hooks/useMultiFlyoutState.es.js";
4
+ import { useDragPreviewContext as h } from "../context/DragPreviewContext.es.js";
5
+ import { useMultiFlyoutState as u } from "../hooks/useMultiFlyoutState.es.js";
6
+ import { ToolbarButtonTooltip as f } from "../ToolbarButtonTooltip.es.js";
7
7
  const T = ({
8
8
  content: a,
9
9
  icon: d,
@@ -12,8 +12,8 @@ const T = ({
12
12
  flyoutFooter: i,
13
13
  flyoutHeader: l
14
14
  }) => {
15
- const { isOpen: e, onOpenChange: m } = f(s), r = u();
16
- return /* @__PURE__ */ t(h, { disabled: r || e, content: c, children: /* @__PURE__ */ t("div", { className: "tw-flex tw-flex-shrink-0 tw-flex-1 tw-h-6 tw-relative", children: /* @__PURE__ */ n(o.Root, { open: e && !r, onOpenChange: m, children: [
15
+ const { isOpen: e, onOpenChange: m } = u(s), r = h();
16
+ return /* @__PURE__ */ t(f, { disabled: r || e, content: c, children: /* @__PURE__ */ t("div", { className: "tw-flex tw-flex-shrink-0 tw-flex-1 tw-h-6 tw-relative", children: /* @__PURE__ */ n(o.Root, { open: e && !r, onOpenChange: m, children: [
17
17
  /* @__PURE__ */ t(o.Trigger, { asChild: !0, children: /* @__PURE__ */ t(
18
18
  p,
19
19
  {
@@ -1 +1 @@
1
- {"version":3,"file":"FlyoutToolbarButton.es.js","sources":["../../../../../src/components/BlockItemWrapper/Toolbar/FlyoutToolbarButton/FlyoutToolbarButton.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { Flyout } from '@frontify/fondue/components';\nimport { type ReactNode } from 'react';\n\nimport { BaseToolbarButton } from '../BaseToolbarButton';\nimport { ToolbarButtonTooltip } from '../ToolbarButtonTooltip';\nimport { useDragPreviewContext } from '../context/DragPreviewContext';\nimport { useMultiFlyoutState } from '../hooks/useMultiFlyoutState';\n\nexport type FlyoutToolbarButtonProps = {\n content: ReactNode;\n icon: ReactNode;\n tooltip: ReactNode;\n flyoutId: string;\n flyoutFooter?: ReactNode;\n flyoutHeader?: ReactNode;\n};\n\nexport const FlyoutToolbarButton = ({\n content,\n icon,\n tooltip,\n flyoutId,\n flyoutFooter,\n flyoutHeader,\n}: FlyoutToolbarButtonProps) => {\n const { isOpen, onOpenChange } = useMultiFlyoutState(flyoutId);\n\n const isDragPreview = useDragPreviewContext();\n\n return (\n <ToolbarButtonTooltip disabled={isDragPreview || isOpen} content={tooltip}>\n <div className=\"tw-flex tw-flex-shrink-0 tw-flex-1 tw-h-6 tw-relative\">\n <Flyout.Root open={isOpen && !isDragPreview} onOpenChange={onOpenChange}>\n <Flyout.Trigger asChild>\n <BaseToolbarButton\n data-test-id=\"block-item-wrapper-toolbar-flyout\"\n forceActiveStyle={isOpen && !isDragPreview}\n >\n {icon}\n </BaseToolbarButton>\n </Flyout.Trigger>\n <Flyout.Content side=\"bottom\" align=\"end\" padding=\"comfortable\">\n {flyoutHeader ? <Flyout.Header>{flyoutHeader}</Flyout.Header> : null}\n <Flyout.Body>{content}</Flyout.Body>\n {flyoutFooter ? <Flyout.Footer>{flyoutFooter}</Flyout.Footer> : null}\n </Flyout.Content>\n </Flyout.Root>\n </div>\n </ToolbarButtonTooltip>\n );\n};\n"],"names":["FlyoutToolbarButton","content","icon","tooltip","flyoutId","flyoutFooter","flyoutHeader","isOpen","onOpenChange","useMultiFlyoutState","isDragPreview","useDragPreviewContext","ToolbarButtonTooltip","jsx","jsxs","Flyout","BaseToolbarButton"],"mappings":";;;;;;AAmBO,MAAMA,IAAsB,CAAC;AAAA,EAChC,SAAAC;AAAA,EACA,MAAAC;AAAA,EACA,SAAAC;AAAA,EACA,UAAAC;AAAA,EACA,cAAAC;AAAA,EACA,cAAAC;AACJ,MAAgC;AAC5B,QAAM,EAAE,QAAAC,GAAQ,cAAAC,MAAiBC,EAAoBL,CAAQ,GAEvDM,IAAgBC,EAAA;AAEtB,2BACKC,GAAA,EAAqB,UAAUF,KAAiBH,GAAQ,SAASJ,GAC9D,UAAA,gBAAAU,EAAC,OAAA,EAAI,WAAU,yDACX,UAAA,gBAAAC,EAACC,EAAO,MAAP,EAAY,MAAMR,KAAU,CAACG,GAAe,cAAAF,GACzC,UAAA;AAAA,IAAA,gBAAAK,EAACE,EAAO,SAAP,EAAe,SAAO,IACnB,UAAA,gBAAAF;AAAA,MAACG;AAAA,MAAA;AAAA,QACG,gBAAa;AAAA,QACb,kBAAkBT,KAAU,CAACG;AAAA,QAE5B,UAAAR;AAAA,MAAA;AAAA,IAAA,GAET;AAAA,IACA,gBAAAY,EAACC,EAAO,SAAP,EAAe,MAAK,UAAS,OAAM,OAAM,SAAQ,eAC7C,UAAA;AAAA,MAAAT,IAAe,gBAAAO,EAACE,EAAO,QAAP,EAAe,aAAa,IAAmB;AAAA,MAChE,gBAAAF,EAACE,EAAO,MAAP,EAAa,UAAAd,EAAA,CAAQ;AAAA,MACrBI,IAAe,gBAAAQ,EAACE,EAAO,QAAP,EAAe,aAAa,IAAmB;AAAA,IAAA,EAAA,CACpE;AAAA,EAAA,EAAA,CACJ,GACJ,GACJ;AAER;"}
1
+ {"version":3,"file":"FlyoutToolbarButton.es.js","sources":["../../../../../src/components/BlockItemWrapper/Toolbar/FlyoutToolbarButton/FlyoutToolbarButton.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { Flyout } from '@frontify/fondue/components';\nimport { type ReactNode } from 'react';\n\nimport { BaseToolbarButton } from '../BaseToolbarButton';\nimport { useDragPreviewContext } from '../context/DragPreviewContext';\nimport { useMultiFlyoutState } from '../hooks/useMultiFlyoutState';\nimport { ToolbarButtonTooltip } from '../ToolbarButtonTooltip';\n\nexport type FlyoutToolbarButtonProps = {\n content: ReactNode;\n icon: ReactNode;\n tooltip: ReactNode;\n flyoutId: string;\n flyoutFooter?: ReactNode;\n flyoutHeader?: ReactNode;\n};\n\nexport const FlyoutToolbarButton = ({\n content,\n icon,\n tooltip,\n flyoutId,\n flyoutFooter,\n flyoutHeader,\n}: FlyoutToolbarButtonProps) => {\n const { isOpen, onOpenChange } = useMultiFlyoutState(flyoutId);\n\n const isDragPreview = useDragPreviewContext();\n\n return (\n <ToolbarButtonTooltip disabled={isDragPreview || isOpen} content={tooltip}>\n <div className=\"tw-flex tw-flex-shrink-0 tw-flex-1 tw-h-6 tw-relative\">\n <Flyout.Root open={isOpen && !isDragPreview} onOpenChange={onOpenChange}>\n <Flyout.Trigger asChild>\n <BaseToolbarButton\n data-test-id=\"block-item-wrapper-toolbar-flyout\"\n forceActiveStyle={isOpen && !isDragPreview}\n >\n {icon}\n </BaseToolbarButton>\n </Flyout.Trigger>\n <Flyout.Content side=\"bottom\" align=\"end\" padding=\"comfortable\">\n {flyoutHeader ? <Flyout.Header>{flyoutHeader}</Flyout.Header> : null}\n <Flyout.Body>{content}</Flyout.Body>\n {flyoutFooter ? <Flyout.Footer>{flyoutFooter}</Flyout.Footer> : null}\n </Flyout.Content>\n </Flyout.Root>\n </div>\n </ToolbarButtonTooltip>\n );\n};\n"],"names":["FlyoutToolbarButton","content","icon","tooltip","flyoutId","flyoutFooter","flyoutHeader","isOpen","onOpenChange","useMultiFlyoutState","isDragPreview","useDragPreviewContext","ToolbarButtonTooltip","jsx","jsxs","Flyout","BaseToolbarButton"],"mappings":";;;;;;AAmBO,MAAMA,IAAsB,CAAC;AAAA,EAChC,SAAAC;AAAA,EACA,MAAAC;AAAA,EACA,SAAAC;AAAA,EACA,UAAAC;AAAA,EACA,cAAAC;AAAA,EACA,cAAAC;AACJ,MAAgC;AAC5B,QAAM,EAAE,QAAAC,GAAQ,cAAAC,MAAiBC,EAAoBL,CAAQ,GAEvDM,IAAgBC,EAAA;AAEtB,2BACKC,GAAA,EAAqB,UAAUF,KAAiBH,GAAQ,SAASJ,GAC9D,UAAA,gBAAAU,EAAC,OAAA,EAAI,WAAU,yDACX,UAAA,gBAAAC,EAACC,EAAO,MAAP,EAAY,MAAMR,KAAU,CAACG,GAAe,cAAAF,GACzC,UAAA;AAAA,IAAA,gBAAAK,EAACE,EAAO,SAAP,EAAe,SAAO,IACnB,UAAA,gBAAAF;AAAA,MAACG;AAAA,MAAA;AAAA,QACG,gBAAa;AAAA,QACb,kBAAkBT,KAAU,CAACG;AAAA,QAE5B,UAAAR;AAAA,MAAA;AAAA,IAAA,GAET;AAAA,IACA,gBAAAY,EAACC,EAAO,SAAP,EAAe,MAAK,UAAS,OAAM,OAAM,SAAQ,eAC7C,UAAA;AAAA,MAAAT,IAAe,gBAAAO,EAACE,EAAO,QAAP,EAAe,aAAa,IAAmB;AAAA,MAChE,gBAAAF,EAACE,EAAO,MAAP,EAAa,UAAAd,EAAA,CAAQ;AAAA,MACrBI,IAAe,gBAAAQ,EAACE,EAAO,QAAP,EAAe,aAAa,IAAmB;AAAA,IAAA,EAAA,CACpE;AAAA,EAAA,EAAA,CACJ,GACJ,GACJ;AAER;"}
@@ -1 +1 @@
1
- {"version":3,"file":"Toolbar.es.js","sources":["../../../../src/components/BlockItemWrapper/Toolbar/Toolbar.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { AttachmentsToolbarButton } from './AttachmentsToolbarButton';\nimport { DragHandleToolbarButton } from './DragHandleToolbarButton';\nimport { FlyoutToolbarButton } from './FlyoutToolbarButton';\nimport { MenuToolbarButton } from './MenuToolbarButton';\nimport { ToolbarButton } from './ToolbarButton';\nimport { ToolbarSegment } from './ToolbarSegment';\nimport { type ToolbarProps } from './types';\n\nexport const Toolbar = ({ items, attachments }: ToolbarProps) => (\n <div\n data-test-id=\"block-item-wrapper-toolbar\"\n className=\"tw-rounded-md tw-bg-surface tw-border tw-border-line-mid tw-divide-x tw-divide-line-mid tw-shadow-lg tw-flex tw-flex-none tw-items-center tw-isolate\"\n >\n {attachments.isEnabled && (\n <ToolbarSegment>\n <AttachmentsToolbarButton />\n </ToolbarSegment>\n )}\n {items.length > 0 && (\n <ToolbarSegment>\n {items.map((item) => {\n switch (item.type) {\n case 'dragHandle':\n return <DragHandleToolbarButton key={item.tooltip + item.type} {...item} />;\n case 'menu':\n return <MenuToolbarButton key={item.tooltip + item.type} {...item} />;\n case 'flyout':\n // eslint-disable-next-line @typescript-eslint/restrict-plus-operands, @typescript-eslint/no-base-to-string\n return <FlyoutToolbarButton key={item.tooltip + item.type} {...item} />;\n default:\n return <ToolbarButton key={item.tooltip + item.type} {...item} />;\n }\n })}\n </ToolbarSegment>\n )}\n </div>\n);\n"],"names":["Toolbar","items","attachments","jsxs","jsx","ToolbarSegment","AttachmentsToolbarButton","item","DragHandleToolbarButton","MenuToolbarButton","FlyoutToolbarButton","ToolbarButton"],"mappings":";;;;;;;AAUO,MAAMA,IAAU,CAAC,EAAE,OAAAC,GAAO,aAAAC,QAC7B,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACG,gBAAa;AAAA,IACb,WAAU;AAAA,IAET,UAAA;AAAA,MAAAD,EAAY,aACT,gBAAAE,EAACC,GAAA,EACG,UAAA,gBAAAD,EAACE,KAAyB,GAC9B;AAAA,MAEHL,EAAM,SAAS,KACZ,gBAAAG,EAACC,KACI,UAAAJ,EAAM,IAAI,CAACM,MAAS;AACjB,gBAAQA,EAAK,MAAA;AAAA,UACT,KAAK;AACD,qCAAQC,GAAA,EAAwD,GAAGD,KAA9BA,EAAK,UAAUA,EAAK,IAAgB;AAAA,UAC7E,KAAK;AACD,qCAAQE,GAAA,EAAkD,GAAGF,KAA9BA,EAAK,UAAUA,EAAK,IAAgB;AAAA,UACvE,KAAK;AAED,qCAAQG,GAAA,EAAoD,GAAGH,KAA9BA,EAAK,UAAUA,EAAK,IAAgB;AAAA,UACzE;AACI,qCAAQI,GAAA,EAA8C,GAAGJ,KAA9BA,EAAK,UAAUA,EAAK,IAAgB;AAAA,QAAA;AAAA,MAE3E,CAAC,EAAA,CACL;AAAA,IAAA;AAAA,EAAA;AAER;"}
1
+ {"version":3,"file":"Toolbar.es.js","sources":["../../../../src/components/BlockItemWrapper/Toolbar/Toolbar.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { AttachmentsToolbarButton } from './AttachmentsToolbarButton';\nimport { DragHandleToolbarButton } from './DragHandleToolbarButton';\nimport { FlyoutToolbarButton } from './FlyoutToolbarButton';\nimport { MenuToolbarButton } from './MenuToolbarButton';\nimport { ToolbarButton } from './ToolbarButton';\nimport { ToolbarSegment } from './ToolbarSegment';\nimport { type ToolbarProps } from './types';\n\nexport const Toolbar = ({ items, attachments }: ToolbarProps) => (\n <div\n data-test-id=\"block-item-wrapper-toolbar\"\n className=\"tw-rounded-md tw-bg-surface tw-border tw-border-line-mid tw-divide-x tw-divide-line-mid tw-shadow-lg tw-flex tw-flex-none tw-items-center tw-isolate\"\n >\n {attachments.isEnabled && (\n <ToolbarSegment>\n <AttachmentsToolbarButton />\n </ToolbarSegment>\n )}\n {items.length > 0 && (\n <ToolbarSegment>\n {items.map((item) => {\n switch (item.type) {\n case 'dragHandle':\n return <DragHandleToolbarButton key={item.tooltip + item.type} {...item} />;\n case 'menu':\n return <MenuToolbarButton key={item.tooltip + item.type} {...item} />;\n case 'flyout':\n // oxlint-disable-next-line typescript/restrict-plus-operands,typescript/no-base-to-string\n return <FlyoutToolbarButton key={item.tooltip + item.type} {...item} />;\n default:\n return <ToolbarButton key={item.tooltip + item.type} {...item} />;\n }\n })}\n </ToolbarSegment>\n )}\n </div>\n);\n"],"names":["Toolbar","items","attachments","jsxs","jsx","ToolbarSegment","AttachmentsToolbarButton","item","DragHandleToolbarButton","MenuToolbarButton","FlyoutToolbarButton","ToolbarButton"],"mappings":";;;;;;;AAUO,MAAMA,IAAU,CAAC,EAAE,OAAAC,GAAO,aAAAC,QAC7B,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACG,gBAAa;AAAA,IACb,WAAU;AAAA,IAET,UAAA;AAAA,MAAAD,EAAY,aACT,gBAAAE,EAACC,GAAA,EACG,UAAA,gBAAAD,EAACE,KAAyB,GAC9B;AAAA,MAEHL,EAAM,SAAS,KACZ,gBAAAG,EAACC,KACI,UAAAJ,EAAM,IAAI,CAACM,MAAS;AACjB,gBAAQA,EAAK,MAAA;AAAA,UACT,KAAK;AACD,qCAAQC,GAAA,EAAwD,GAAGD,KAA9BA,EAAK,UAAUA,EAAK,IAAgB;AAAA,UAC7E,KAAK;AACD,qCAAQE,GAAA,EAAkD,GAAGF,KAA9BA,EAAK,UAAUA,EAAK,IAAgB;AAAA,UACvE,KAAK;AAED,qCAAQG,GAAA,EAAoD,GAAGH,KAA9BA,EAAK,UAAUA,EAAK,IAAgB;AAAA,UACzE;AACI,qCAAQI,GAAA,EAA8C,GAAGJ,KAA9BA,EAAK,UAAUA,EAAK,IAAgB;AAAA,QAAA;AAAA,MAE3E,CAAC,EAAA,CACL;AAAA,IAAA;AAAA,EAAA;AAER;"}
@@ -1,10 +1,10 @@
1
1
  import { jsx as o } from "react/jsx-runtime";
2
2
  import { BaseToolbarButton as n } from "../BaseToolbarButton.es.js";
3
- import { ToolbarButtonTooltip as a } from "../ToolbarButtonTooltip.es.js";
4
- import { useDragPreviewContext as l } from "../context/DragPreviewContext.es.js";
3
+ import { useDragPreviewContext as a } from "../context/DragPreviewContext.es.js";
4
+ import { ToolbarButtonTooltip as l } from "../ToolbarButtonTooltip.es.js";
5
5
  const c = ({ tooltip: t, icon: r, onClick: e }) => {
6
- const i = l();
7
- return /* @__PURE__ */ o(a, { disabled: i, content: t ?? "", children: /* @__PURE__ */ o(n, { "data-test-id": "block-item-wrapper-toolbar-btn", onClick: e, children: r }) });
6
+ const i = a();
7
+ return /* @__PURE__ */ o(l, { disabled: i, content: t ?? "", children: /* @__PURE__ */ o(n, { "data-test-id": "block-item-wrapper-toolbar-btn", onClick: e, children: r }) });
8
8
  };
9
9
  export {
10
10
  c as ToolbarButton
@@ -1 +1 @@
1
- {"version":3,"file":"ToolbarButton.es.js","sources":["../../../../../src/components/BlockItemWrapper/Toolbar/ToolbarButton/ToolbarButton.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { BaseToolbarButton } from '../BaseToolbarButton';\nimport { ToolbarButtonTooltip } from '../ToolbarButtonTooltip';\nimport { useDragPreviewContext } from '../context/DragPreviewContext';\n\nexport type ToolbarButtonProps = { icon: JSX.Element; tooltip?: string; onClick: () => void };\n\nexport const ToolbarButton = ({ tooltip, icon, onClick }: ToolbarButtonProps) => {\n const isDragPreview = useDragPreviewContext();\n\n return (\n <ToolbarButtonTooltip disabled={isDragPreview} content={tooltip ?? ''}>\n <BaseToolbarButton data-test-id=\"block-item-wrapper-toolbar-btn\" onClick={onClick}>\n {icon}\n </BaseToolbarButton>\n </ToolbarButtonTooltip>\n );\n};\n"],"names":["ToolbarButton","tooltip","icon","onClick","isDragPreview","useDragPreviewContext","jsx","ToolbarButtonTooltip","BaseToolbarButton"],"mappings":";;;;AAQO,MAAMA,IAAgB,CAAC,EAAE,SAAAC,GAAS,MAAAC,GAAM,SAAAC,QAAkC;AAC7E,QAAMC,IAAgBC,EAAA;AAEtB,SACI,gBAAAC,EAACC,GAAA,EAAqB,UAAUH,GAAe,SAASH,KAAW,IAC/D,UAAA,gBAAAK,EAACE,GAAA,EAAkB,gBAAa,kCAAiC,SAAAL,GAC5D,aACL,GACJ;AAER;"}
1
+ {"version":3,"file":"ToolbarButton.es.js","sources":["../../../../../src/components/BlockItemWrapper/Toolbar/ToolbarButton/ToolbarButton.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { BaseToolbarButton } from '../BaseToolbarButton';\nimport { useDragPreviewContext } from '../context/DragPreviewContext';\nimport { ToolbarButtonTooltip } from '../ToolbarButtonTooltip';\n\nexport type ToolbarButtonProps = { icon: JSX.Element; tooltip?: string; onClick: () => void };\n\nexport const ToolbarButton = ({ tooltip, icon, onClick }: ToolbarButtonProps) => {\n const isDragPreview = useDragPreviewContext();\n\n return (\n <ToolbarButtonTooltip disabled={isDragPreview} content={tooltip ?? ''}>\n <BaseToolbarButton data-test-id=\"block-item-wrapper-toolbar-btn\" onClick={onClick}>\n {icon}\n </BaseToolbarButton>\n </ToolbarButtonTooltip>\n );\n};\n"],"names":["ToolbarButton","tooltip","icon","onClick","isDragPreview","useDragPreviewContext","jsx","ToolbarButtonTooltip","BaseToolbarButton"],"mappings":";;;;AAQO,MAAMA,IAAgB,CAAC,EAAE,SAAAC,GAAS,MAAAC,GAAM,SAAAC,QAAkC;AAC7E,QAAMC,IAAgBC,EAAA;AAEtB,SACI,gBAAAC,EAACC,GAAA,EAAqB,UAAUH,GAAe,SAASH,KAAW,IAC/D,UAAA,gBAAAK,EAACE,GAAA,EAAkB,gBAAa,kCAAiC,SAAAL,GAC5D,aACL,GACJ;AAER;"}
@@ -1 +1 @@
1
- {"version":3,"file":"DocumentLink.es.js","sources":["../../../../src/components/Link/LinkSelector/DocumentLink.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type DocumentPage, type DocumentSection } from '@frontify/app-bridge';\nimport { IconColorFan } from '@frontify/fondue/icons';\nimport { useEffect, useState } from 'react';\n\nimport { type InitiallyExpandedItems } from '../types';\n\nimport { PageLinks } from './PageLinks';\n\ntype DocumentLinkProps = {\n document: {\n id: number;\n title: string;\n permanentLink: string;\n };\n selectedUrl: string;\n onSelectUrl: (url: string) => void;\n itemsToExpandInitially: InitiallyExpandedItems;\n getDocumentSectionsByDocumentPageId: (documentPageId: number) => Promise<DocumentSection[]>;\n getDocumentPagesByDocumentId: (documentId: number) => Promise<DocumentPage[]>;\n};\n\nexport const DocumentLink = ({\n document,\n selectedUrl,\n onSelectUrl,\n itemsToExpandInitially,\n getDocumentSectionsByDocumentPageId,\n getDocumentPagesByDocumentId,\n}: DocumentLinkProps) => {\n const [isExpanded, setIsExpanded] = useState(document.id === itemsToExpandInitially.documentId);\n const isActive = document.permanentLink === selectedUrl;\n\n useEffect(() => {\n if (document.id === itemsToExpandInitially.documentId) {\n // eslint-disable-next-line @eslint-react/set-state-in-effect\n setIsExpanded(true);\n }\n }, [itemsToExpandInitially, document.id]);\n\n return (\n <>\n <button\n type=\"button\"\n data-test-id=\"internal-link-selector-document-link\"\n className={`tw-flex tw-flex-1 tw-space-x-2 tw-items-center tw-py-2 tw-pr-2.5 tw-leading-5 tw-cursor-pointer tw-w-full ${\n isActive\n ? 'tw-bg-highlight tw-text-highlight-on-highlight hover:tw-bg-highlight-hover:hover hover:tw-text-highlight-on-highlight:hover'\n : 'hover:tw-bg-container-secondary-hover hover:tw-text-container-secondary-on-secondary-container'\n }`}\n onClick={() => onSelectUrl(document.permanentLink)}\n >\n <button\n type=\"button\"\n tabIndex={0}\n data-test-id=\"tree-item-toggle\"\n className=\"tw-flex tw-items-center tw-justify-center -tw-mr-2 tw-pr-3.5 tw-pt-1.5 tw-pb-1.5 tw-pl-3.5 tw-cursor-pointer\"\n onClick={() => setIsExpanded(!isExpanded)}\n onKeyDown={(event) => event.key === 'Enter' && event.stopPropagation()}\n >\n <div\n className={`tw-transition-transform tw-w-0 tw-h-0 tw-font-normal tw-border-t-4 tw-border-t-transparent tw-border-b-4 tw-border-b-transparent tw-border-l-4 tw-border-l-x-strong ${isExpanded ? 'tw-rotate-90' : ''}`}\n ></div>\n </button>\n <IconColorFan size={16} />\n <span className=\"tw-text-small\">{document.title}</span>\n <span className=\"tw-flex-auto tw-font-sans tw-text-x-small tw-text-right\">Document</span>\n </button>\n {isExpanded && (\n <PageLinks\n documentId={document.id}\n selectedUrl={selectedUrl}\n onSelectUrl={onSelectUrl}\n itemsToExpandInitially={itemsToExpandInitially}\n getDocumentSectionsByDocumentPageId={getDocumentSectionsByDocumentPageId}\n getDocumentPagesByDocumentId={getDocumentPagesByDocumentId}\n />\n )}\n </>\n );\n};\n"],"names":["DocumentLink","document","selectedUrl","onSelectUrl","itemsToExpandInitially","getDocumentSectionsByDocumentPageId","getDocumentPagesByDocumentId","isExpanded","setIsExpanded","useState","isActive","useEffect","jsxs","Fragment","jsx","event","IconColorFan","PageLinks"],"mappings":";;;;AAuBO,MAAMA,IAAe,CAAC;AAAA,EACzB,UAAAC;AAAA,EACA,aAAAC;AAAA,EACA,aAAAC;AAAA,EACA,wBAAAC;AAAA,EACA,qCAAAC;AAAA,EACA,8BAAAC;AACJ,MAAyB;AACrB,QAAM,CAACC,GAAYC,CAAa,IAAIC,EAASR,EAAS,OAAOG,EAAuB,UAAU,GACxFM,IAAWT,EAAS,kBAAkBC;AAE5C,SAAAS,EAAU,MAAM;AACZ,IAAIV,EAAS,OAAOG,EAAuB,cAEvCI,EAAc,EAAI;AAAA,EAE1B,GAAG,CAACJ,GAAwBH,EAAS,EAAE,CAAC,GAGpC,gBAAAW,EAAAC,GAAA,EACI,UAAA;AAAA,IAAA,gBAAAD;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,MAAK;AAAA,QACL,gBAAa;AAAA,QACb,WAAW,6GACPF,IACM,gIACA,gGACV;AAAA,QACA,SAAS,MAAMP,EAAYF,EAAS,aAAa;AAAA,QAEjD,UAAA;AAAA,UAAA,gBAAAa;AAAA,YAAC;AAAA,YAAA;AAAA,cACG,MAAK;AAAA,cACL,UAAU;AAAA,cACV,gBAAa;AAAA,cACb,WAAU;AAAA,cACV,SAAS,MAAMN,EAAc,CAACD,CAAU;AAAA,cACxC,WAAW,CAACQ,MAAUA,EAAM,QAAQ,WAAWA,EAAM,gBAAA;AAAA,cAErD,UAAA,gBAAAD;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACG,WAAW,uKAAuKP,IAAa,iBAAiB,EAAE;AAAA,gBAAA;AAAA,cAAA;AAAA,YACrN;AAAA,UAAA;AAAA,UAEL,gBAAAO,EAACE,GAAA,EAAa,MAAM,GAAA,CAAI;AAAA,UACxB,gBAAAF,EAAC,QAAA,EAAK,WAAU,iBAAiB,YAAS,OAAM;AAAA,UAChD,gBAAAA,EAAC,QAAA,EAAK,WAAU,2DAA0D,UAAA,WAAA,CAAQ;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,IAErFP,KACG,gBAAAO;AAAA,MAACG;AAAA,MAAA;AAAA,QACG,YAAYhB,EAAS;AAAA,QACrB,aAAAC;AAAA,QACA,aAAAC;AAAA,QACA,wBAAAC;AAAA,QACA,qCAAAC;AAAA,QACA,8BAAAC;AAAA,MAAA;AAAA,IAAA;AAAA,EACJ,GAER;AAER;"}
1
+ {"version":3,"file":"DocumentLink.es.js","sources":["../../../../src/components/Link/LinkSelector/DocumentLink.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type DocumentPage, type DocumentSection } from '@frontify/app-bridge';\nimport { IconColorFan } from '@frontify/fondue/icons';\nimport { useEffect, useState } from 'react';\n\nimport { type InitiallyExpandedItems } from '../types';\n\nimport { PageLinks } from './PageLinks';\n\ntype DocumentLinkProps = {\n document: {\n id: number;\n title: string;\n permanentLink: string;\n };\n selectedUrl: string;\n onSelectUrl: (url: string) => void;\n itemsToExpandInitially: InitiallyExpandedItems;\n getDocumentSectionsByDocumentPageId: (documentPageId: number) => Promise<DocumentSection[]>;\n getDocumentPagesByDocumentId: (documentId: number) => Promise<DocumentPage[]>;\n};\n\nexport const DocumentLink = ({\n document,\n selectedUrl,\n onSelectUrl,\n itemsToExpandInitially,\n getDocumentSectionsByDocumentPageId,\n getDocumentPagesByDocumentId,\n}: DocumentLinkProps) => {\n const [isExpanded, setIsExpanded] = useState(document.id === itemsToExpandInitially.documentId);\n const isActive = document.permanentLink === selectedUrl;\n\n useEffect(() => {\n if (document.id === itemsToExpandInitially.documentId) {\n // oxlint-disable-next-line @eslint-react/set-state-in-effect\n setIsExpanded(true);\n }\n }, [itemsToExpandInitially, document.id]);\n\n return (\n <>\n <button\n type=\"button\"\n data-test-id=\"internal-link-selector-document-link\"\n className={`tw-flex tw-flex-1 tw-space-x-2 tw-items-center tw-py-2 tw-pr-2.5 tw-leading-5 tw-cursor-pointer tw-w-full ${\n isActive\n ? 'tw-bg-highlight tw-text-highlight-on-highlight hover:tw-bg-highlight-hover:hover hover:tw-text-highlight-on-highlight:hover'\n : 'hover:tw-bg-container-secondary-hover hover:tw-text-container-secondary-on-secondary-container'\n }`}\n onClick={() => onSelectUrl(document.permanentLink)}\n >\n <button\n type=\"button\"\n tabIndex={0}\n data-test-id=\"tree-item-toggle\"\n className=\"tw-flex tw-items-center tw-justify-center -tw-mr-2 tw-pr-3.5 tw-pt-1.5 tw-pb-1.5 tw-pl-3.5 tw-cursor-pointer\"\n onClick={() => setIsExpanded(!isExpanded)}\n onKeyDown={(event) => event.key === 'Enter' && event.stopPropagation()}\n >\n <div\n className={`tw-transition-transform tw-w-0 tw-h-0 tw-font-normal tw-border-t-4 tw-border-t-transparent tw-border-b-4 tw-border-b-transparent tw-border-l-4 tw-border-l-x-strong ${isExpanded ? 'tw-rotate-90' : ''}`}\n ></div>\n </button>\n <IconColorFan size={16} />\n <span className=\"tw-text-small\">{document.title}</span>\n <span className=\"tw-flex-auto tw-font-sans tw-text-x-small tw-text-right\">Document</span>\n </button>\n {isExpanded && (\n <PageLinks\n documentId={document.id}\n selectedUrl={selectedUrl}\n onSelectUrl={onSelectUrl}\n itemsToExpandInitially={itemsToExpandInitially}\n getDocumentSectionsByDocumentPageId={getDocumentSectionsByDocumentPageId}\n getDocumentPagesByDocumentId={getDocumentPagesByDocumentId}\n />\n )}\n </>\n );\n};\n"],"names":["DocumentLink","document","selectedUrl","onSelectUrl","itemsToExpandInitially","getDocumentSectionsByDocumentPageId","getDocumentPagesByDocumentId","isExpanded","setIsExpanded","useState","isActive","useEffect","jsxs","Fragment","jsx","event","IconColorFan","PageLinks"],"mappings":";;;;AAuBO,MAAMA,IAAe,CAAC;AAAA,EACzB,UAAAC;AAAA,EACA,aAAAC;AAAA,EACA,aAAAC;AAAA,EACA,wBAAAC;AAAA,EACA,qCAAAC;AAAA,EACA,8BAAAC;AACJ,MAAyB;AACrB,QAAM,CAACC,GAAYC,CAAa,IAAIC,EAASR,EAAS,OAAOG,EAAuB,UAAU,GACxFM,IAAWT,EAAS,kBAAkBC;AAE5C,SAAAS,EAAU,MAAM;AACZ,IAAIV,EAAS,OAAOG,EAAuB,cAEvCI,EAAc,EAAI;AAAA,EAE1B,GAAG,CAACJ,GAAwBH,EAAS,EAAE,CAAC,GAGpC,gBAAAW,EAAAC,GAAA,EACI,UAAA;AAAA,IAAA,gBAAAD;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,MAAK;AAAA,QACL,gBAAa;AAAA,QACb,WAAW,6GACPF,IACM,gIACA,gGACV;AAAA,QACA,SAAS,MAAMP,EAAYF,EAAS,aAAa;AAAA,QAEjD,UAAA;AAAA,UAAA,gBAAAa;AAAA,YAAC;AAAA,YAAA;AAAA,cACG,MAAK;AAAA,cACL,UAAU;AAAA,cACV,gBAAa;AAAA,cACb,WAAU;AAAA,cACV,SAAS,MAAMN,EAAc,CAACD,CAAU;AAAA,cACxC,WAAW,CAACQ,MAAUA,EAAM,QAAQ,WAAWA,EAAM,gBAAA;AAAA,cAErD,UAAA,gBAAAD;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACG,WAAW,uKAAuKP,IAAa,iBAAiB,EAAE;AAAA,gBAAA;AAAA,cAAA;AAAA,YACrN;AAAA,UAAA;AAAA,UAEL,gBAAAO,EAACE,GAAA,EAAa,MAAM,GAAA,CAAI;AAAA,UACxB,gBAAAF,EAAC,QAAA,EAAK,WAAU,iBAAiB,YAAS,OAAM;AAAA,UAChD,gBAAAA,EAAC,QAAA,EAAK,WAAU,2DAA0D,UAAA,WAAA,CAAQ;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,IAErFP,KACG,gBAAAO;AAAA,MAACG;AAAA,MAAA;AAAA,QACG,YAAYhB,EAAS;AAAA,QACrB,aAAAC;AAAA,QACA,aAAAC;AAAA,QACA,wBAAAC;AAAA,QACA,qCAAAC;AAAA,QACA,8BAAAC;AAAA,MAAA;AAAA,IAAA;AAAA,EACJ,GAER;AAER;"}
@@ -1 +1 @@
1
- {"version":3,"file":"DocumentLinks.es.js","sources":["../../../../src/components/Link/LinkSelector/DocumentLinks.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type Document, type DocumentPage, type DocumentSection } from '@frontify/app-bridge';\nimport { type ReactElement, useEffect, useState } from 'react';\n\nimport { filterDocumentSectionsWithUnreadableTitles } from '../helpers/filterDocumentSectionsWithUnreadableTitles';\nimport { type InitiallyExpandedItems } from '../types';\n\nimport { DocumentLink } from './DocumentLink';\nimport { LoadingIndicator } from './LoadingIndicator';\n\ntype DocumentLinksProps = {\n selectedUrl: string;\n onSelectUrl: (url: string) => void;\n getAllDocuments: () => Promise<Document[]>;\n getDocumentSectionsByDocumentPageId: (documentPageId: number) => Promise<DocumentSection[]>;\n getDocumentPagesByDocumentId: (documentId: number) => Promise<DocumentPage[]>;\n};\n\nexport const DocumentLinks = ({\n selectedUrl,\n onSelectUrl,\n getAllDocuments,\n getDocumentPagesByDocumentId,\n getDocumentSectionsByDocumentPageId,\n}: DocumentLinksProps): ReactElement => {\n const [isLoading, setIsLoading] = useState(true);\n const [documents, setDocuments] = useState<Document[]>([]);\n const [itemsToExpandInitially, setItemsToExpandInitially] = useState<InitiallyExpandedItems>({\n documentId: undefined,\n pageId: undefined,\n });\n\n useEffect(() => {\n if (selectedUrl && documents.length > 0) {\n findLocationOfSelectedUrl().then((items) => {\n setItemsToExpandInitially(items);\n });\n }\n // eslint-disable-next-line @eslint-react/exhaustive-deps\n }, [documents.length]);\n\n useEffect(() => {\n getAllDocuments()\n .then((_documents) => {\n setDocuments(_documents);\n })\n .finally(() => {\n setIsLoading(false);\n });\n // eslint-disable-next-line @eslint-react/exhaustive-deps\n }, []);\n\n const findLocationOfSelectedUrl = async () => {\n const itemsToExpand: InitiallyExpandedItems = {\n documentId: undefined,\n pageId: undefined,\n };\n const selectedUrlIsDocument = documents.find((document) => document.permanentLink === selectedUrl);\n if (selectedUrlIsDocument) {\n return itemsToExpand;\n }\n for (const document of documents) {\n const pages = await getDocumentPagesByDocumentId(document.id);\n const selectedUrlIsPage = !!pages.find((page) => page.permanentLink === selectedUrl);\n if (selectedUrlIsPage) {\n itemsToExpand.documentId = document.id;\n return itemsToExpand;\n }\n for (const page of pages) {\n const sections = await getDocumentSectionsByDocumentPageId(page.id);\n const sectionsWithReadableTitles = filterDocumentSectionsWithUnreadableTitles(sections);\n const selectedUrlIsSection = !!sectionsWithReadableTitles.find(\n (section) => section.permanentLink === selectedUrl,\n );\n if (selectedUrlIsSection) {\n itemsToExpand.documentId = document.id;\n itemsToExpand.pageId = page.id;\n return itemsToExpand;\n }\n }\n }\n return itemsToExpand;\n };\n\n return isLoading ? (\n <LoadingIndicator />\n ) : (\n <>\n {documents.map((document) => {\n return (\n <DocumentLink\n key={document.id}\n document={document}\n selectedUrl={selectedUrl}\n onSelectUrl={onSelectUrl}\n itemsToExpandInitially={itemsToExpandInitially}\n getDocumentSectionsByDocumentPageId={getDocumentSectionsByDocumentPageId}\n getDocumentPagesByDocumentId={getDocumentPagesByDocumentId}\n />\n );\n })}\n </>\n );\n};\n"],"names":["DocumentLinks","selectedUrl","onSelectUrl","getAllDocuments","getDocumentPagesByDocumentId","getDocumentSectionsByDocumentPageId","isLoading","setIsLoading","useState","documents","setDocuments","itemsToExpandInitially","setItemsToExpandInitially","useEffect","findLocationOfSelectedUrl","items","_documents","itemsToExpand","document","pages","page","sections","filterDocumentSectionsWithUnreadableTitles","section","LoadingIndicator","jsx","DocumentLink"],"mappings":";;;;;AAmBO,MAAMA,IAAgB,CAAC;AAAA,EAC1B,aAAAC;AAAA,EACA,aAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,8BAAAC;AAAA,EACA,qCAAAC;AACJ,MAAwC;AACpC,QAAM,CAACC,GAAWC,CAAY,IAAIC,EAAS,EAAI,GACzC,CAACC,GAAWC,CAAY,IAAIF,EAAqB,CAAA,CAAE,GACnD,CAACG,GAAwBC,CAAyB,IAAIJ,EAAiC;AAAA,IACzF,YAAY;AAAA,IACZ,QAAQ;AAAA,EAAA,CACX;AAED,EAAAK,EAAU,MAAM;AACZ,IAAIZ,KAAeQ,EAAU,SAAS,KAClCK,EAAA,EAA4B,KAAK,CAACC,MAAU;AACxC,MAAAH,EAA0BG,CAAK;AAAA,IACnC,CAAC;AAAA,EAGT,GAAG,CAACN,EAAU,MAAM,CAAC,GAErBI,EAAU,MAAM;AACZ,IAAAV,EAAA,EACK,KAAK,CAACa,MAAe;AAClB,MAAAN,EAAaM,CAAU;AAAA,IAC3B,CAAC,EACA,QAAQ,MAAM;AACX,MAAAT,EAAa,EAAK;AAAA,IACtB,CAAC;AAAA,EAET,GAAG,CAAA,CAAE;AAEL,QAAMO,IAA4B,YAAY;AAC1C,UAAMG,IAAwC;AAAA,MAC1C,YAAY;AAAA,MACZ,QAAQ;AAAA,IAAA;AAGZ,QAD8BR,EAAU,KAAK,CAACS,MAAaA,EAAS,kBAAkBjB,CAAW;AAE7F,aAAOgB;AAEX,eAAWC,KAAYT,GAAW;AAC9B,YAAMU,IAAQ,MAAMf,EAA6Bc,EAAS,EAAE;AAE5D,UAD0B,CAAC,CAACC,EAAM,KAAK,CAACC,MAASA,EAAK,kBAAkBnB,CAAW;AAE/E,eAAAgB,EAAc,aAAaC,EAAS,IAC7BD;AAEX,iBAAWG,KAAQD,GAAO;AACtB,cAAME,IAAW,MAAMhB,EAAoCe,EAAK,EAAE;AAKlE,YAH6B,CAAC,CADKE,EAA2CD,CAAQ,EAC5B;AAAA,UACtD,CAACE,MAAYA,EAAQ,kBAAkBtB;AAAA,QAAA;AAGvC,iBAAAgB,EAAc,aAAaC,EAAS,IACpCD,EAAc,SAASG,EAAK,IACrBH;AAAA,MAEf;AAAA,IACJ;AACA,WAAOA;AAAA,EACX;AAEA,SAAOX,sBACFkB,GAAA,CAAA,CAAiB,2BAGb,UAAAf,EAAU,IAAI,CAACS,MAER,gBAAAO;AAAA,IAACC;AAAA,IAAA;AAAA,MAEG,UAAAR;AAAA,MACA,aAAAjB;AAAA,MACA,aAAAC;AAAA,MACA,wBAAAS;AAAA,MACA,qCAAAN;AAAA,MACA,8BAAAD;AAAA,IAAA;AAAA,IANKc,EAAS;AAAA,EAAA,CASzB,EAAA,CACL;AAER;"}
1
+ {"version":3,"file":"DocumentLinks.es.js","sources":["../../../../src/components/Link/LinkSelector/DocumentLinks.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type Document, type DocumentPage, type DocumentSection } from '@frontify/app-bridge';\nimport { type ReactElement, useEffect, useState } from 'react';\n\nimport { filterDocumentSectionsWithUnreadableTitles } from '../helpers/filterDocumentSectionsWithUnreadableTitles';\nimport { type InitiallyExpandedItems } from '../types';\n\nimport { DocumentLink } from './DocumentLink';\nimport { LoadingIndicator } from './LoadingIndicator';\n\ntype DocumentLinksProps = {\n selectedUrl: string;\n onSelectUrl: (url: string) => void;\n getAllDocuments: () => Promise<Document[]>;\n getDocumentSectionsByDocumentPageId: (documentPageId: number) => Promise<DocumentSection[]>;\n getDocumentPagesByDocumentId: (documentId: number) => Promise<DocumentPage[]>;\n};\n\nexport const DocumentLinks = ({\n selectedUrl,\n onSelectUrl,\n getAllDocuments,\n getDocumentPagesByDocumentId,\n getDocumentSectionsByDocumentPageId,\n}: DocumentLinksProps): ReactElement => {\n const [isLoading, setIsLoading] = useState(true);\n const [documents, setDocuments] = useState<Document[]>([]);\n const [itemsToExpandInitially, setItemsToExpandInitially] = useState<InitiallyExpandedItems>({\n documentId: undefined,\n pageId: undefined,\n });\n\n useEffect(() => {\n if (selectedUrl && documents.length > 0) {\n findLocationOfSelectedUrl().then((items) => {\n setItemsToExpandInitially(items);\n });\n }\n // oxlint-disable-next-line @eslint-react/exhaustive-deps\n }, [documents.length]);\n\n useEffect(() => {\n getAllDocuments()\n .then((_documents) => {\n setDocuments(_documents);\n })\n .finally(() => {\n setIsLoading(false);\n });\n // oxlint-disable-next-line @eslint-react/exhaustive-deps\n }, []);\n\n const findLocationOfSelectedUrl = async () => {\n const itemsToExpand: InitiallyExpandedItems = {\n documentId: undefined,\n pageId: undefined,\n };\n const selectedUrlIsDocument = documents.find((document) => document.permanentLink === selectedUrl);\n if (selectedUrlIsDocument) {\n return itemsToExpand;\n }\n for (const document of documents) {\n const pages = await getDocumentPagesByDocumentId(document.id);\n const selectedUrlIsPage = !!pages.find((page) => page.permanentLink === selectedUrl);\n if (selectedUrlIsPage) {\n itemsToExpand.documentId = document.id;\n return itemsToExpand;\n }\n for (const page of pages) {\n const sections = await getDocumentSectionsByDocumentPageId(page.id);\n const sectionsWithReadableTitles = filterDocumentSectionsWithUnreadableTitles(sections);\n const selectedUrlIsSection = !!sectionsWithReadableTitles.find(\n (section) => section.permanentLink === selectedUrl,\n );\n if (selectedUrlIsSection) {\n itemsToExpand.documentId = document.id;\n itemsToExpand.pageId = page.id;\n return itemsToExpand;\n }\n }\n }\n return itemsToExpand;\n };\n\n return isLoading ? (\n <LoadingIndicator />\n ) : (\n <>\n {documents.map((document) => {\n return (\n <DocumentLink\n key={document.id}\n document={document}\n selectedUrl={selectedUrl}\n onSelectUrl={onSelectUrl}\n itemsToExpandInitially={itemsToExpandInitially}\n getDocumentSectionsByDocumentPageId={getDocumentSectionsByDocumentPageId}\n getDocumentPagesByDocumentId={getDocumentPagesByDocumentId}\n />\n );\n })}\n </>\n );\n};\n"],"names":["DocumentLinks","selectedUrl","onSelectUrl","getAllDocuments","getDocumentPagesByDocumentId","getDocumentSectionsByDocumentPageId","isLoading","setIsLoading","useState","documents","setDocuments","itemsToExpandInitially","setItemsToExpandInitially","useEffect","findLocationOfSelectedUrl","items","_documents","itemsToExpand","document","pages","page","sections","filterDocumentSectionsWithUnreadableTitles","section","LoadingIndicator","jsx","DocumentLink"],"mappings":";;;;;AAmBO,MAAMA,IAAgB,CAAC;AAAA,EAC1B,aAAAC;AAAA,EACA,aAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,8BAAAC;AAAA,EACA,qCAAAC;AACJ,MAAwC;AACpC,QAAM,CAACC,GAAWC,CAAY,IAAIC,EAAS,EAAI,GACzC,CAACC,GAAWC,CAAY,IAAIF,EAAqB,CAAA,CAAE,GACnD,CAACG,GAAwBC,CAAyB,IAAIJ,EAAiC;AAAA,IACzF,YAAY;AAAA,IACZ,QAAQ;AAAA,EAAA,CACX;AAED,EAAAK,EAAU,MAAM;AACZ,IAAIZ,KAAeQ,EAAU,SAAS,KAClCK,EAAA,EAA4B,KAAK,CAACC,MAAU;AACxC,MAAAH,EAA0BG,CAAK;AAAA,IACnC,CAAC;AAAA,EAGT,GAAG,CAACN,EAAU,MAAM,CAAC,GAErBI,EAAU,MAAM;AACZ,IAAAV,EAAA,EACK,KAAK,CAACa,MAAe;AAClB,MAAAN,EAAaM,CAAU;AAAA,IAC3B,CAAC,EACA,QAAQ,MAAM;AACX,MAAAT,EAAa,EAAK;AAAA,IACtB,CAAC;AAAA,EAET,GAAG,CAAA,CAAE;AAEL,QAAMO,IAA4B,YAAY;AAC1C,UAAMG,IAAwC;AAAA,MAC1C,YAAY;AAAA,MACZ,QAAQ;AAAA,IAAA;AAGZ,QAD8BR,EAAU,KAAK,CAACS,MAAaA,EAAS,kBAAkBjB,CAAW;AAE7F,aAAOgB;AAEX,eAAWC,KAAYT,GAAW;AAC9B,YAAMU,IAAQ,MAAMf,EAA6Bc,EAAS,EAAE;AAE5D,UAD0B,CAAC,CAACC,EAAM,KAAK,CAACC,MAASA,EAAK,kBAAkBnB,CAAW;AAE/E,eAAAgB,EAAc,aAAaC,EAAS,IAC7BD;AAEX,iBAAWG,KAAQD,GAAO;AACtB,cAAME,IAAW,MAAMhB,EAAoCe,EAAK,EAAE;AAKlE,YAH6B,CAAC,CADKE,EAA2CD,CAAQ,EAC5B;AAAA,UACtD,CAACE,MAAYA,EAAQ,kBAAkBtB;AAAA,QAAA;AAGvC,iBAAAgB,EAAc,aAAaC,EAAS,IACpCD,EAAc,SAASG,EAAK,IACrBH;AAAA,MAEf;AAAA,IACJ;AACA,WAAOA;AAAA,EACX;AAEA,SAAOX,sBACFkB,GAAA,CAAA,CAAiB,2BAGb,UAAAf,EAAU,IAAI,CAACS,MAER,gBAAAO;AAAA,IAACC;AAAA,IAAA;AAAA,MAEG,UAAAR;AAAA,MACA,aAAAjB;AAAA,MACA,aAAAC;AAAA,MACA,wBAAAS;AAAA,MACA,qCAAAN;AAAA,MACA,8BAAAD;AAAA,IAAA;AAAA,IANKc,EAAS;AAAA,EAAA,CASzB,EAAA,CACL;AAER;"}
@@ -30,7 +30,7 @@ const I = ({
30
30
  minWidth: "800px"
31
31
  };
32
32
  return (
33
- // eslint-disable-next-line jsx-a11y-x/no-static-element-interactions
33
+ // oxlint-disable-next-line jsx-a11y-x/no-static-element-interactions
34
34
  /* @__PURE__ */ e(
35
35
  "div",
36
36
  {
@@ -1 +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, Dialog, ScrollArea } from '@frontify/fondue/components';\nimport { IconLink } from '@frontify/fondue/icons';\nimport { type KeyboardEvent, type ReactElement, useEffect, useState } from 'react';\n\nimport './LinkSelector.css';\nimport { DocumentLinks } from './DocumentLinks';\n\ntype LinkSelectorProps = {\n url: string;\n onUrlChange?: (value: string) => void;\n buttonSize?: 'small' | 'medium' | 'large';\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 = 'medium',\n getAllDocuments,\n getDocumentPagesByDocumentId,\n getDocumentSectionsByDocumentPageId,\n}: LinkSelectorProps): ReactElement => {\n const [isModalOpen, setIsModalOpen] = useState(false);\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 event.preventDefault();\n saveLink();\n }\n };\n\n useEffect(() => {\n if (url && !selectedUrl) {\n // eslint-disable-next-line @eslint-react/set-state-in-effect\n setSelectedUrl(url);\n }\n }, [url, selectedUrl]);\n\n const saveLink = () => {\n onUrlChange?.(selectedUrl);\n setIsModalOpen(false);\n };\n\n const dialogProps = {\n onOpenAutoFocus: () => {},\n showUnderlay: true,\n 'data-is-underlay': true,\n minWidth: '800px',\n };\n\n return (\n // eslint-disable-next-line jsx-a11y-x/no-static-element-interactions\n <div\n onPointerDown={(event) => {\n event.preventDefault();\n }}\n data-test-id=\"internal-link-selector\"\n onKeyDown={onPressEnter}\n >\n <Dialog.Root modal open={isModalOpen} onOpenChange={setIsModalOpen}>\n <Dialog.Trigger asChild>\n <Button size={buttonSize} emphasis=\"default\">\n <IconLink size=\"20\" />\n Internal link\n </Button>\n </Dialog.Trigger>\n <Dialog.Content {...dialogProps}>\n <Dialog.Header>\n <Dialog.Title>Select internal link</Dialog.Title>\n </Dialog.Header>\n <Dialog.Body padding=\"none\">\n <ScrollArea padding=\"compact\">\n <DocumentLinks\n selectedUrl={selectedUrl}\n onSelectUrl={onSelectUrl}\n getAllDocuments={getAllDocuments}\n getDocumentPagesByDocumentId={getDocumentPagesByDocumentId}\n getDocumentSectionsByDocumentPageId={getDocumentSectionsByDocumentPageId}\n />\n </ScrollArea>\n </Dialog.Body>\n <Dialog.Footer>\n <Button size={buttonSize} emphasis=\"default\" onPress={() => setIsModalOpen(false)}>\n Cancel\n </Button>\n <Button size={buttonSize} disabled={!selectedUrl} emphasis=\"strong\" onPress={() => saveLink()}>\n Choose\n </Button>\n </Dialog.Footer>\n </Dialog.Content>\n </Dialog.Root>\n </div>\n );\n};\n"],"names":["LinkSelector","url","onUrlChange","buttonSize","getAllDocuments","getDocumentPagesByDocumentId","getDocumentSectionsByDocumentPageId","isModalOpen","setIsModalOpen","useState","selectedUrl","setSelectedUrl","onSelectUrl","onPressEnter","event","saveLink","useEffect","dialogProps","jsx","jsxs","Dialog","Button","IconLink","ScrollArea","DocumentLinks"],"mappings":";;;;;;AAmBO,MAAMA,IAAe,CAAC;AAAA,EACzB,KAAAC;AAAA,EACA,aAAAC;AAAA,EACA,YAAAC,IAAa;AAAA,EACb,iBAAAC;AAAA,EACA,8BAAAC;AAAA,EACA,qCAAAC;AACJ,MAAuC;AACnC,QAAM,CAACC,GAAaC,CAAc,IAAIC,EAAS,EAAK,GAC9C,CAACC,GAAaC,CAAc,IAAIF,EAAiBR,CAAG,GAEpDW,IAAc,CAACX,MAAgB;AACjC,IAAAU,EAAeV,CAAG;AAAA,EACtB,GAEMY,IAAe,CAACC,MAA2C;AAC7D,IAAIA,EAAM,QAAQ,YACdA,EAAM,eAAA,GACNC,EAAA;AAAA,EAER;AAEA,EAAAC,EAAU,MAAM;AACZ,IAAIf,KAAO,CAACS,KAERC,EAAeV,CAAG;AAAA,EAE1B,GAAG,CAACA,GAAKS,CAAW,CAAC;AAErB,QAAMK,IAAW,MAAM;AACnB,IAAAb,IAAcQ,CAAW,GACzBF,EAAe,EAAK;AAAA,EACxB,GAEMS,IAAc;AAAA,IAChB,iBAAiB,MAAM;AAAA,IAAC;AAAA,IACxB,cAAc;AAAA,IACd,oBAAoB;AAAA,IACpB,UAAU;AAAA,EAAA;AAGd;AAAA;AAAA,IAEI,gBAAAC;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,eAAe,CAACJ,MAAU;AACtB,UAAAA,EAAM,eAAA;AAAA,QACV;AAAA,QACA,gBAAa;AAAA,QACb,WAAWD;AAAA,QAEX,UAAA,gBAAAM,EAACC,EAAO,MAAP,EAAY,OAAK,IAAC,MAAMb,GAAa,cAAcC,GAChD,UAAA;AAAA,UAAA,gBAAAU,EAACE,EAAO,SAAP,EAAe,SAAO,IACnB,4BAACC,GAAA,EAAO,MAAMlB,GAAY,UAAS,WAC/B,UAAA;AAAA,YAAA,gBAAAe,EAACI,GAAA,EAAS,MAAK,KAAA,CAAK;AAAA,YAAE;AAAA,UAAA,EAAA,CAE1B,EAAA,CACJ;AAAA,UACA,gBAAAH,EAACC,EAAO,SAAP,EAAgB,GAAGH,GAChB,UAAA;AAAA,YAAA,gBAAAC,EAACE,EAAO,QAAP,EACG,UAAA,gBAAAF,EAACE,EAAO,OAAP,EAAa,kCAAoB,EAAA,CACtC;AAAA,YACA,gBAAAF,EAACE,EAAO,MAAP,EAAY,SAAQ,QACjB,UAAA,gBAAAF,EAACK,GAAA,EAAW,SAAQ,WAChB,UAAA,gBAAAL;AAAA,cAACM;AAAA,cAAA;AAAA,gBACG,aAAAd;AAAA,gBACA,aAAAE;AAAA,gBACA,iBAAAR;AAAA,gBACA,8BAAAC;AAAA,gBACA,qCAAAC;AAAA,cAAA;AAAA,YAAA,GAER,EAAA,CACJ;AAAA,YACA,gBAAAa,EAACC,EAAO,QAAP,EACG,UAAA;AAAA,cAAA,gBAAAF,EAACG,GAAA,EAAO,MAAMlB,GAAY,UAAS,WAAU,SAAS,MAAMK,EAAe,EAAK,GAAG,UAAA,SAAA,CAEnF;AAAA,cACA,gBAAAU,EAACG,GAAA,EAAO,MAAMlB,GAAY,UAAU,CAACO,GAAa,UAAS,UAAS,SAAS,MAAMK,EAAA,GAAY,UAAA,SAAA,CAE/F;AAAA,YAAA,EAAA,CACJ;AAAA,UAAA,EAAA,CACJ;AAAA,QAAA,EAAA,CACJ;AAAA,MAAA;AAAA,IAAA;AAAA;AAGZ;"}
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, Dialog, ScrollArea } from '@frontify/fondue/components';\nimport { IconLink } from '@frontify/fondue/icons';\nimport { type KeyboardEvent, type ReactElement, useEffect, useState } from 'react';\n\nimport './LinkSelector.css';\nimport { DocumentLinks } from './DocumentLinks';\n\ntype LinkSelectorProps = {\n url: string;\n onUrlChange?: (value: string) => void;\n buttonSize?: 'small' | 'medium' | 'large';\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 = 'medium',\n getAllDocuments,\n getDocumentPagesByDocumentId,\n getDocumentSectionsByDocumentPageId,\n}: LinkSelectorProps): ReactElement => {\n const [isModalOpen, setIsModalOpen] = useState(false);\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 event.preventDefault();\n saveLink();\n }\n };\n\n useEffect(() => {\n if (url && !selectedUrl) {\n // oxlint-disable-next-line @eslint-react/set-state-in-effect\n setSelectedUrl(url);\n }\n }, [url, selectedUrl]);\n\n const saveLink = () => {\n onUrlChange?.(selectedUrl);\n setIsModalOpen(false);\n };\n\n const dialogProps = {\n onOpenAutoFocus: () => {},\n showUnderlay: true,\n 'data-is-underlay': true,\n minWidth: '800px',\n };\n\n return (\n // oxlint-disable-next-line jsx-a11y-x/no-static-element-interactions\n <div\n onPointerDown={(event) => {\n event.preventDefault();\n }}\n data-test-id=\"internal-link-selector\"\n onKeyDown={onPressEnter}\n >\n <Dialog.Root modal open={isModalOpen} onOpenChange={setIsModalOpen}>\n <Dialog.Trigger asChild>\n <Button size={buttonSize} emphasis=\"default\">\n <IconLink size=\"20\" />\n Internal link\n </Button>\n </Dialog.Trigger>\n <Dialog.Content {...dialogProps}>\n <Dialog.Header>\n <Dialog.Title>Select internal link</Dialog.Title>\n </Dialog.Header>\n <Dialog.Body padding=\"none\">\n <ScrollArea padding=\"compact\">\n <DocumentLinks\n selectedUrl={selectedUrl}\n onSelectUrl={onSelectUrl}\n getAllDocuments={getAllDocuments}\n getDocumentPagesByDocumentId={getDocumentPagesByDocumentId}\n getDocumentSectionsByDocumentPageId={getDocumentSectionsByDocumentPageId}\n />\n </ScrollArea>\n </Dialog.Body>\n <Dialog.Footer>\n <Button size={buttonSize} emphasis=\"default\" onPress={() => setIsModalOpen(false)}>\n Cancel\n </Button>\n <Button size={buttonSize} disabled={!selectedUrl} emphasis=\"strong\" onPress={() => saveLink()}>\n Choose\n </Button>\n </Dialog.Footer>\n </Dialog.Content>\n </Dialog.Root>\n </div>\n );\n};\n"],"names":["LinkSelector","url","onUrlChange","buttonSize","getAllDocuments","getDocumentPagesByDocumentId","getDocumentSectionsByDocumentPageId","isModalOpen","setIsModalOpen","useState","selectedUrl","setSelectedUrl","onSelectUrl","onPressEnter","event","saveLink","useEffect","dialogProps","jsx","jsxs","Dialog","Button","IconLink","ScrollArea","DocumentLinks"],"mappings":";;;;;;AAmBO,MAAMA,IAAe,CAAC;AAAA,EACzB,KAAAC;AAAA,EACA,aAAAC;AAAA,EACA,YAAAC,IAAa;AAAA,EACb,iBAAAC;AAAA,EACA,8BAAAC;AAAA,EACA,qCAAAC;AACJ,MAAuC;AACnC,QAAM,CAACC,GAAaC,CAAc,IAAIC,EAAS,EAAK,GAC9C,CAACC,GAAaC,CAAc,IAAIF,EAAiBR,CAAG,GAEpDW,IAAc,CAACX,MAAgB;AACjC,IAAAU,EAAeV,CAAG;AAAA,EACtB,GAEMY,IAAe,CAACC,MAA2C;AAC7D,IAAIA,EAAM,QAAQ,YACdA,EAAM,eAAA,GACNC,EAAA;AAAA,EAER;AAEA,EAAAC,EAAU,MAAM;AACZ,IAAIf,KAAO,CAACS,KAERC,EAAeV,CAAG;AAAA,EAE1B,GAAG,CAACA,GAAKS,CAAW,CAAC;AAErB,QAAMK,IAAW,MAAM;AACnB,IAAAb,IAAcQ,CAAW,GACzBF,EAAe,EAAK;AAAA,EACxB,GAEMS,IAAc;AAAA,IAChB,iBAAiB,MAAM;AAAA,IAAC;AAAA,IACxB,cAAc;AAAA,IACd,oBAAoB;AAAA,IACpB,UAAU;AAAA,EAAA;AAGd;AAAA;AAAA,IAEI,gBAAAC;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,eAAe,CAACJ,MAAU;AACtB,UAAAA,EAAM,eAAA;AAAA,QACV;AAAA,QACA,gBAAa;AAAA,QACb,WAAWD;AAAA,QAEX,UAAA,gBAAAM,EAACC,EAAO,MAAP,EAAY,OAAK,IAAC,MAAMb,GAAa,cAAcC,GAChD,UAAA;AAAA,UAAA,gBAAAU,EAACE,EAAO,SAAP,EAAe,SAAO,IACnB,4BAACC,GAAA,EAAO,MAAMlB,GAAY,UAAS,WAC/B,UAAA;AAAA,YAAA,gBAAAe,EAACI,GAAA,EAAS,MAAK,KAAA,CAAK;AAAA,YAAE;AAAA,UAAA,EAAA,CAE1B,EAAA,CACJ;AAAA,UACA,gBAAAH,EAACC,EAAO,SAAP,EAAgB,GAAGH,GAChB,UAAA;AAAA,YAAA,gBAAAC,EAACE,EAAO,QAAP,EACG,UAAA,gBAAAF,EAACE,EAAO,OAAP,EAAa,kCAAoB,EAAA,CACtC;AAAA,YACA,gBAAAF,EAACE,EAAO,MAAP,EAAY,SAAQ,QACjB,UAAA,gBAAAF,EAACK,GAAA,EAAW,SAAQ,WAChB,UAAA,gBAAAL;AAAA,cAACM;AAAA,cAAA;AAAA,gBACG,aAAAd;AAAA,gBACA,aAAAE;AAAA,gBACA,iBAAAR;AAAA,gBACA,8BAAAC;AAAA,gBACA,qCAAAC;AAAA,cAAA;AAAA,YAAA,GAER,EAAA,CACJ;AAAA,YACA,gBAAAa,EAACC,EAAO,QAAP,EACG,UAAA;AAAA,cAAA,gBAAAF,EAACG,GAAA,EAAO,MAAMlB,GAAY,UAAS,WAAU,SAAS,MAAMK,EAAe,EAAK,GAAG,UAAA,SAAA,CAEnF;AAAA,cACA,gBAAAU,EAACG,GAAA,EAAO,MAAMlB,GAAY,UAAU,CAACO,GAAa,UAAS,UAAS,SAAS,MAAMK,EAAA,GAAY,UAAA,SAAA,CAE/F;AAAA,YAAA,EAAA,CACJ;AAAA,UAAA,EAAA,CACJ;AAAA,QAAA,EAAA,CACJ;AAAA,MAAA;AAAA,IAAA;AAAA;AAGZ;"}
@@ -1 +1 @@
1
- {"version":3,"file":"PageLink.es.js","sources":["../../../../src/components/Link/LinkSelector/PageLink.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type DocumentSection } from '@frontify/app-bridge';\nimport { useEffect, useState } from 'react';\n\nimport { filterDocumentSectionsWithUnreadableTitles } from '../helpers/filterDocumentSectionsWithUnreadableTitles';\nimport { type DocumentSectionWithTitle, type InitiallyExpandedItems } from '../types';\n\nimport { SectionLink } from './SectionLink';\n\ntype PageLinkProps = {\n page: {\n id: number;\n title: string;\n permanentLink: string;\n };\n selectedUrl: string;\n onSelectUrl: (url: string) => void;\n itemsToExpandInitially: InitiallyExpandedItems;\n getDocumentSectionsByDocumentPageId: (documentPageId: number) => Promise<DocumentSection[]>;\n};\n\nexport const PageLink = ({\n page,\n selectedUrl,\n onSelectUrl,\n itemsToExpandInitially,\n getDocumentSectionsByDocumentPageId,\n}: PageLinkProps) => {\n const [isExpanded, setIsExpanded] = useState(page.id === itemsToExpandInitially.documentId);\n const [documentSections, setDocumentSections] = useState<DocumentSectionWithTitle[]>([]);\n const isActive = page.permanentLink === selectedUrl;\n\n useEffect(() => {\n const fetchDocumentSections = async () => {\n const sections = await getDocumentSectionsByDocumentPageId(page.id);\n const sectionsWithReadableTitles = filterDocumentSectionsWithUnreadableTitles(sections);\n setDocumentSections(sectionsWithReadableTitles);\n };\n\n fetchDocumentSections();\n }, [page.id, getDocumentSectionsByDocumentPageId]);\n\n useEffect(() => {\n if (page.id === itemsToExpandInitially.pageId) {\n // eslint-disable-next-line @eslint-react/set-state-in-effect\n setIsExpanded(true);\n }\n }, [itemsToExpandInitially, page.id]);\n\n const hasSections = documentSections.length > 0;\n\n return (\n <>\n <button\n type=\"button\"\n data-test-id=\"internal-link-selector-page-link\"\n className={`\n tw-py-2 tw-pr-2.5 tw-leading-5 tw-cursor-pointer tw-flex tw-w-full \n ${hasSections ? 'tw-pl-7 ' : 'tw-pl-12 '}\n ${\n isActive\n ? 'tw-bg-highlight tw-text-highlight-on-highlight hover:tw-bg-highlight-hover:hover hover:tw-text-highlight-on-highlight:hover '\n : 'hover:tw-bg-container-secondary-hover hover:tw-text-container-secondary-on-secondary-container '\n }`}\n onClick={() => onSelectUrl(page.permanentLink)}\n >\n <div key={page.id} className=\"tw-flex tw-flex-1 tw-space-x-1 tw-items-center tw-h-6\">\n {hasSections && (\n <button\n type=\"button\"\n className=\"tw-flex tw-items-center tw-justify-center -tw-mr-2 tw-pr-3.5 tw-pt-1.5 tw-pb-1.5 tw-pl-3.5 tw-cursor-pointer\"\n onClick={() => setIsExpanded(!isExpanded)}\n onKeyDown={(event) => event.key === 'Enter' && event.stopPropagation()}\n >\n <div\n className={`tw-transition-transform tw-w-0 tw-h-0 tw-font-normal tw-border-t-4 tw-border-t-transparent tw-border-b-4 tw-border-b-transparent tw-border-l-4 tw-border-l-x-strong \n ${isExpanded ? 'tw-rotate-90 ' : ''}`}\n />\n </button>\n )}\n <span className=\"tw-text-small\">{page.title}</span>\n <span className=\"tw-flex-auto tw-font-sans tw-text-x-small tw-text-right\">Page</span>\n </div>\n </button>\n {isExpanded &&\n documentSections.length > 0 &&\n documentSections.map((section) => {\n return (\n <SectionLink\n key={section.id}\n section={section}\n selectedUrl={selectedUrl}\n onSelectUrl={onSelectUrl}\n />\n );\n })}\n </>\n );\n};\n"],"names":["PageLink","page","selectedUrl","onSelectUrl","itemsToExpandInitially","getDocumentSectionsByDocumentPageId","isExpanded","setIsExpanded","useState","documentSections","setDocumentSections","isActive","useEffect","sections","sectionsWithReadableTitles","filterDocumentSectionsWithUnreadableTitles","hasSections","jsxs","Fragment","jsx","event","section","SectionLink"],"mappings":";;;;AAsBO,MAAMA,IAAW,CAAC;AAAA,EACrB,MAAAC;AAAA,EACA,aAAAC;AAAA,EACA,aAAAC;AAAA,EACA,wBAAAC;AAAA,EACA,qCAAAC;AACJ,MAAqB;AACjB,QAAM,CAACC,GAAYC,CAAa,IAAIC,EAASP,EAAK,OAAOG,EAAuB,UAAU,GACpF,CAACK,GAAkBC,CAAmB,IAAIF,EAAqC,CAAA,CAAE,GACjFG,IAAWV,EAAK,kBAAkBC;AAExC,EAAAU,EAAU,MAAM;AAOZ,KAN8B,YAAY;AACtC,YAAMC,IAAW,MAAMR,EAAoCJ,EAAK,EAAE,GAC5Da,IAA6BC,EAA2CF,CAAQ;AACtF,MAAAH,EAAoBI,CAA0B;AAAA,IAClD,GAEA;AAAA,EACJ,GAAG,CAACb,EAAK,IAAII,CAAmC,CAAC,GAEjDO,EAAU,MAAM;AACZ,IAAIX,EAAK,OAAOG,EAAuB,UAEnCG,EAAc,EAAI;AAAA,EAE1B,GAAG,CAACH,GAAwBH,EAAK,EAAE,CAAC;AAEpC,QAAMe,IAAcP,EAAiB,SAAS;AAE9C,SACI,gBAAAQ,EAAAC,GAAA,EACI,UAAA;AAAA,IAAA,gBAAAC;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,MAAK;AAAA,QACL,gBAAa;AAAA,QACb,WAAW;AAAA;AAAA,sBAELH,IAAc,aAAa,WAAW;AAAA,sBAEpCL,IACM,iIACA,iGACV;AAAA,QACJ,SAAS,MAAMR,EAAYF,EAAK,aAAa;AAAA,QAE7C,UAAA,gBAAAgB,EAAC,OAAA,EAAkB,WAAU,yDACxB,UAAA;AAAA,UAAAD,KACG,gBAAAG;AAAA,YAAC;AAAA,YAAA;AAAA,cACG,MAAK;AAAA,cACL,WAAU;AAAA,cACV,SAAS,MAAMZ,EAAc,CAACD,CAAU;AAAA,cACxC,WAAW,CAACc,MAAUA,EAAM,QAAQ,WAAWA,EAAM,gBAAA;AAAA,cAErD,UAAA,gBAAAD;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACG,WAAW;AAAA,kCACTb,IAAa,kBAAkB,EAAE;AAAA,gBAAA;AAAA,cAAA;AAAA,YACvC;AAAA,UAAA;AAAA,UAGR,gBAAAa,EAAC,QAAA,EAAK,WAAU,iBAAiB,YAAK,OAAM;AAAA,UAC5C,gBAAAA,EAAC,QAAA,EAAK,WAAU,2DAA0D,UAAA,OAAA,CAAI;AAAA,QAAA,EAAA,GAfxElB,EAAK,EAgBf;AAAA,MAAA;AAAA,IAAA;AAAA,IAEHK,KACGG,EAAiB,SAAS,KAC1BA,EAAiB,IAAI,CAACY,MAEd,gBAAAF;AAAA,MAACG;AAAA,MAAA;AAAA,QAEG,SAAAD;AAAA,QACA,aAAAnB;AAAA,QACA,aAAAC;AAAA,MAAA;AAAA,MAHKkB,EAAQ;AAAA,IAAA,CAMxB;AAAA,EAAA,GACT;AAER;"}
1
+ {"version":3,"file":"PageLink.es.js","sources":["../../../../src/components/Link/LinkSelector/PageLink.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type DocumentSection } from '@frontify/app-bridge';\nimport { useEffect, useState } from 'react';\n\nimport { filterDocumentSectionsWithUnreadableTitles } from '../helpers/filterDocumentSectionsWithUnreadableTitles';\nimport { type DocumentSectionWithTitle, type InitiallyExpandedItems } from '../types';\n\nimport { SectionLink } from './SectionLink';\n\ntype PageLinkProps = {\n page: {\n id: number;\n title: string;\n permanentLink: string;\n };\n selectedUrl: string;\n onSelectUrl: (url: string) => void;\n itemsToExpandInitially: InitiallyExpandedItems;\n getDocumentSectionsByDocumentPageId: (documentPageId: number) => Promise<DocumentSection[]>;\n};\n\nexport const PageLink = ({\n page,\n selectedUrl,\n onSelectUrl,\n itemsToExpandInitially,\n getDocumentSectionsByDocumentPageId,\n}: PageLinkProps) => {\n const [isExpanded, setIsExpanded] = useState(page.id === itemsToExpandInitially.documentId);\n const [documentSections, setDocumentSections] = useState<DocumentSectionWithTitle[]>([]);\n const isActive = page.permanentLink === selectedUrl;\n\n useEffect(() => {\n const fetchDocumentSections = async () => {\n const sections = await getDocumentSectionsByDocumentPageId(page.id);\n const sectionsWithReadableTitles = filterDocumentSectionsWithUnreadableTitles(sections);\n setDocumentSections(sectionsWithReadableTitles);\n };\n\n fetchDocumentSections();\n }, [page.id, getDocumentSectionsByDocumentPageId]);\n\n useEffect(() => {\n if (page.id === itemsToExpandInitially.pageId) {\n // oxlint-disable-next-line @eslint-react/set-state-in-effect\n setIsExpanded(true);\n }\n }, [itemsToExpandInitially, page.id]);\n\n const hasSections = documentSections.length > 0;\n\n return (\n <>\n <button\n type=\"button\"\n data-test-id=\"internal-link-selector-page-link\"\n className={`\n tw-py-2 tw-pr-2.5 tw-leading-5 tw-cursor-pointer tw-flex tw-w-full \n ${hasSections ? 'tw-pl-7 ' : 'tw-pl-12 '}\n ${\n isActive\n ? 'tw-bg-highlight tw-text-highlight-on-highlight hover:tw-bg-highlight-hover:hover hover:tw-text-highlight-on-highlight:hover '\n : 'hover:tw-bg-container-secondary-hover hover:tw-text-container-secondary-on-secondary-container '\n }`}\n onClick={() => onSelectUrl(page.permanentLink)}\n >\n <div key={page.id} className=\"tw-flex tw-flex-1 tw-space-x-1 tw-items-center tw-h-6\">\n {hasSections && (\n <button\n type=\"button\"\n className=\"tw-flex tw-items-center tw-justify-center -tw-mr-2 tw-pr-3.5 tw-pt-1.5 tw-pb-1.5 tw-pl-3.5 tw-cursor-pointer\"\n onClick={() => setIsExpanded(!isExpanded)}\n onKeyDown={(event) => event.key === 'Enter' && event.stopPropagation()}\n >\n <div\n className={`tw-transition-transform tw-w-0 tw-h-0 tw-font-normal tw-border-t-4 tw-border-t-transparent tw-border-b-4 tw-border-b-transparent tw-border-l-4 tw-border-l-x-strong \n ${isExpanded ? 'tw-rotate-90 ' : ''}`}\n />\n </button>\n )}\n <span className=\"tw-text-small\">{page.title}</span>\n <span className=\"tw-flex-auto tw-font-sans tw-text-x-small tw-text-right\">Page</span>\n </div>\n </button>\n {isExpanded &&\n documentSections.length > 0 &&\n documentSections.map((section) => {\n return (\n <SectionLink\n key={section.id}\n section={section}\n selectedUrl={selectedUrl}\n onSelectUrl={onSelectUrl}\n />\n );\n })}\n </>\n );\n};\n"],"names":["PageLink","page","selectedUrl","onSelectUrl","itemsToExpandInitially","getDocumentSectionsByDocumentPageId","isExpanded","setIsExpanded","useState","documentSections","setDocumentSections","isActive","useEffect","sections","sectionsWithReadableTitles","filterDocumentSectionsWithUnreadableTitles","hasSections","jsxs","Fragment","jsx","event","section","SectionLink"],"mappings":";;;;AAsBO,MAAMA,IAAW,CAAC;AAAA,EACrB,MAAAC;AAAA,EACA,aAAAC;AAAA,EACA,aAAAC;AAAA,EACA,wBAAAC;AAAA,EACA,qCAAAC;AACJ,MAAqB;AACjB,QAAM,CAACC,GAAYC,CAAa,IAAIC,EAASP,EAAK,OAAOG,EAAuB,UAAU,GACpF,CAACK,GAAkBC,CAAmB,IAAIF,EAAqC,CAAA,CAAE,GACjFG,IAAWV,EAAK,kBAAkBC;AAExC,EAAAU,EAAU,MAAM;AAOZ,KAN8B,YAAY;AACtC,YAAMC,IAAW,MAAMR,EAAoCJ,EAAK,EAAE,GAC5Da,IAA6BC,EAA2CF,CAAQ;AACtF,MAAAH,EAAoBI,CAA0B;AAAA,IAClD,GAEA;AAAA,EACJ,GAAG,CAACb,EAAK,IAAII,CAAmC,CAAC,GAEjDO,EAAU,MAAM;AACZ,IAAIX,EAAK,OAAOG,EAAuB,UAEnCG,EAAc,EAAI;AAAA,EAE1B,GAAG,CAACH,GAAwBH,EAAK,EAAE,CAAC;AAEpC,QAAMe,IAAcP,EAAiB,SAAS;AAE9C,SACI,gBAAAQ,EAAAC,GAAA,EACI,UAAA;AAAA,IAAA,gBAAAC;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,MAAK;AAAA,QACL,gBAAa;AAAA,QACb,WAAW;AAAA;AAAA,sBAELH,IAAc,aAAa,WAAW;AAAA,sBAEpCL,IACM,iIACA,iGACV;AAAA,QACJ,SAAS,MAAMR,EAAYF,EAAK,aAAa;AAAA,QAE7C,UAAA,gBAAAgB,EAAC,OAAA,EAAkB,WAAU,yDACxB,UAAA;AAAA,UAAAD,KACG,gBAAAG;AAAA,YAAC;AAAA,YAAA;AAAA,cACG,MAAK;AAAA,cACL,WAAU;AAAA,cACV,SAAS,MAAMZ,EAAc,CAACD,CAAU;AAAA,cACxC,WAAW,CAACc,MAAUA,EAAM,QAAQ,WAAWA,EAAM,gBAAA;AAAA,cAErD,UAAA,gBAAAD;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACG,WAAW;AAAA,kCACTb,IAAa,kBAAkB,EAAE;AAAA,gBAAA;AAAA,cAAA;AAAA,YACvC;AAAA,UAAA;AAAA,UAGR,gBAAAa,EAAC,QAAA,EAAK,WAAU,iBAAiB,YAAK,OAAM;AAAA,UAC5C,gBAAAA,EAAC,QAAA,EAAK,WAAU,2DAA0D,UAAA,OAAA,CAAI;AAAA,QAAA,EAAA,GAfxElB,EAAK,EAgBf;AAAA,MAAA;AAAA,IAAA;AAAA,IAEHK,KACGG,EAAiB,SAAS,KAC1BA,EAAiB,IAAI,CAACY,MAEd,gBAAAF;AAAA,MAACG;AAAA,MAAA;AAAA,QAEG,SAAAD;AAAA,QACA,aAAAnB;AAAA,QACA,aAAAC;AAAA,MAAA;AAAA,MAHKkB,EAAQ;AAAA,IAAA,CAMxB;AAAA,EAAA,GACT;AAER;"}
@@ -1 +1 @@
1
- {"version":3,"file":"PageLinks.es.js","sources":["../../../../src/components/Link/LinkSelector/PageLinks.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type DocumentPage, type DocumentSection } from '@frontify/app-bridge';\nimport { type ReactElement, useEffect, useState } from 'react';\n\nimport { type InitiallyExpandedItems } from '../types';\n\nimport { LoadingIndicator } from './LoadingIndicator';\nimport { PageLink } from './PageLink';\n\ntype PageLinksProps = {\n documentId: number;\n selectedUrl: string;\n onSelectUrl: (url: string) => void;\n itemsToExpandInitially: InitiallyExpandedItems;\n getDocumentSectionsByDocumentPageId: (documentPageId: number) => Promise<DocumentSection[]>;\n getDocumentPagesByDocumentId: (documentId: number) => Promise<DocumentPage[]>;\n};\n\nexport const PageLinks = ({\n documentId,\n selectedUrl,\n onSelectUrl,\n itemsToExpandInitially,\n getDocumentSectionsByDocumentPageId,\n getDocumentPagesByDocumentId,\n}: PageLinksProps): ReactElement => {\n const [pages, setPages] = useState<DocumentPage[]>([]);\n const [isLoading, setIsLoading] = useState(true);\n const pagesArray = [...pages.values()];\n const hasPages = !isLoading && pagesArray.length > 0;\n\n useEffect(() => {\n getDocumentPagesByDocumentId(documentId)\n .then((_pages) => {\n const pagesWithCategories = _pages\n .filter((page) => !!page.category)\n .sort((a, b) =>\n a.category.sort === b.category.sort ? a.sort - b.sort : a.category.sort - b.category.sort,\n );\n const pagesWithoutCategories = _pages.filter((page) => !page.category).sort((a, b) => a.sort - b.sort);\n setPages([...pagesWithCategories, ...pagesWithoutCategories]);\n })\n .finally(() => {\n setIsLoading(false);\n });\n // eslint-disable-next-line @eslint-react/exhaustive-deps\n }, []);\n\n if (isLoading) {\n return <LoadingIndicator />;\n }\n\n return hasPages ? (\n <>\n {pagesArray.map((page) => {\n return (\n <PageLink\n key={page.id}\n page={page}\n selectedUrl={selectedUrl}\n onSelectUrl={onSelectUrl}\n itemsToExpandInitially={itemsToExpandInitially}\n getDocumentSectionsByDocumentPageId={getDocumentSectionsByDocumentPageId}\n />\n );\n })}\n </>\n ) : (\n <div className=\"tw-h-10 tw-flex tw-items-center tw-pr-2.5 tw-pl-7 tw-leading-5 tw-text-small tw-text-secondary\">\n This document does not contain any pages.\n </div>\n );\n};\n"],"names":["PageLinks","documentId","selectedUrl","onSelectUrl","itemsToExpandInitially","getDocumentSectionsByDocumentPageId","getDocumentPagesByDocumentId","pages","setPages","useState","isLoading","setIsLoading","pagesArray","hasPages","useEffect","_pages","pagesWithCategories","page","a","b","pagesWithoutCategories","LoadingIndicator","jsx","Fragment","PageLink"],"mappings":";;;;AAmBO,MAAMA,IAAY,CAAC;AAAA,EACtB,YAAAC;AAAA,EACA,aAAAC;AAAA,EACA,aAAAC;AAAA,EACA,wBAAAC;AAAA,EACA,qCAAAC;AAAA,EACA,8BAAAC;AACJ,MAAoC;AAChC,QAAM,CAACC,GAAOC,CAAQ,IAAIC,EAAyB,CAAA,CAAE,GAC/C,CAACC,GAAWC,CAAY,IAAIF,EAAS,EAAI,GACzCG,IAAa,CAAC,GAAGL,EAAM,QAAQ,GAC/BM,IAAW,CAACH,KAAaE,EAAW,SAAS;AAmBnD,SAjBAE,EAAU,MAAM;AACZ,IAAAR,EAA6BL,CAAU,EAClC,KAAK,CAACc,MAAW;AACd,YAAMC,IAAsBD,EACvB,OAAO,CAACE,MAAS,CAAC,CAACA,EAAK,QAAQ,EAChC;AAAA,QAAK,CAACC,GAAGC,MACND,EAAE,SAAS,SAASC,EAAE,SAAS,OAAOD,EAAE,OAAOC,EAAE,OAAOD,EAAE,SAAS,OAAOC,EAAE,SAAS;AAAA,MAAA,GAEvFC,IAAyBL,EAAO,OAAO,CAACE,MAAS,CAACA,EAAK,QAAQ,EAAE,KAAK,CAACC,GAAGC,MAAMD,EAAE,OAAOC,EAAE,IAAI;AACrG,MAAAX,EAAS,CAAC,GAAGQ,GAAqB,GAAGI,CAAsB,CAAC;AAAA,IAChE,CAAC,EACA,QAAQ,MAAM;AACX,MAAAT,EAAa,EAAK;AAAA,IACtB,CAAC;AAAA,EAET,GAAG,CAAA,CAAE,GAEDD,sBACQW,GAAA,EAAiB,IAGtBR,IACH,gBAAAS,EAAAC,GAAA,EACK,UAAAX,EAAW,IAAI,CAACK,MAET,gBAAAK;AAAA,IAACE;AAAA,IAAA;AAAA,MAEG,MAAAP;AAAA,MACA,aAAAf;AAAA,MACA,aAAAC;AAAA,MACA,wBAAAC;AAAA,MACA,qCAAAC;AAAA,IAAA;AAAA,IALKY,EAAK;AAAA,EAAA,CAQrB,EAAA,CACL,sBAEC,OAAA,EAAI,WAAU,kGAAiG,UAAA,6CAEhH;AAER;"}
1
+ {"version":3,"file":"PageLinks.es.js","sources":["../../../../src/components/Link/LinkSelector/PageLinks.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type DocumentPage, type DocumentSection } from '@frontify/app-bridge';\nimport { type ReactElement, useEffect, useState } from 'react';\n\nimport { type InitiallyExpandedItems } from '../types';\n\nimport { LoadingIndicator } from './LoadingIndicator';\nimport { PageLink } from './PageLink';\n\ntype PageLinksProps = {\n documentId: number;\n selectedUrl: string;\n onSelectUrl: (url: string) => void;\n itemsToExpandInitially: InitiallyExpandedItems;\n getDocumentSectionsByDocumentPageId: (documentPageId: number) => Promise<DocumentSection[]>;\n getDocumentPagesByDocumentId: (documentId: number) => Promise<DocumentPage[]>;\n};\n\nexport const PageLinks = ({\n documentId,\n selectedUrl,\n onSelectUrl,\n itemsToExpandInitially,\n getDocumentSectionsByDocumentPageId,\n getDocumentPagesByDocumentId,\n}: PageLinksProps): ReactElement => {\n const [pages, setPages] = useState<DocumentPage[]>([]);\n const [isLoading, setIsLoading] = useState(true);\n const pagesArray = [...pages.values()];\n const hasPages = !isLoading && pagesArray.length > 0;\n\n useEffect(() => {\n getDocumentPagesByDocumentId(documentId)\n .then((_pages) => {\n const pagesWithCategories = _pages\n .filter((page) => !!page.category)\n .sort((a, b) =>\n a.category.sort === b.category.sort ? a.sort - b.sort : a.category.sort - b.category.sort,\n );\n const pagesWithoutCategories = _pages.filter((page) => !page.category).sort((a, b) => a.sort - b.sort);\n setPages([...pagesWithCategories, ...pagesWithoutCategories]);\n })\n .finally(() => {\n setIsLoading(false);\n });\n // oxlint-disable-next-line @eslint-react/exhaustive-deps\n }, []);\n\n if (isLoading) {\n return <LoadingIndicator />;\n }\n\n return hasPages ? (\n <>\n {pagesArray.map((page) => {\n return (\n <PageLink\n key={page.id}\n page={page}\n selectedUrl={selectedUrl}\n onSelectUrl={onSelectUrl}\n itemsToExpandInitially={itemsToExpandInitially}\n getDocumentSectionsByDocumentPageId={getDocumentSectionsByDocumentPageId}\n />\n );\n })}\n </>\n ) : (\n <div className=\"tw-h-10 tw-flex tw-items-center tw-pr-2.5 tw-pl-7 tw-leading-5 tw-text-small tw-text-secondary\">\n This document does not contain any pages.\n </div>\n );\n};\n"],"names":["PageLinks","documentId","selectedUrl","onSelectUrl","itemsToExpandInitially","getDocumentSectionsByDocumentPageId","getDocumentPagesByDocumentId","pages","setPages","useState","isLoading","setIsLoading","pagesArray","hasPages","useEffect","_pages","pagesWithCategories","page","a","b","pagesWithoutCategories","LoadingIndicator","jsx","Fragment","PageLink"],"mappings":";;;;AAmBO,MAAMA,IAAY,CAAC;AAAA,EACtB,YAAAC;AAAA,EACA,aAAAC;AAAA,EACA,aAAAC;AAAA,EACA,wBAAAC;AAAA,EACA,qCAAAC;AAAA,EACA,8BAAAC;AACJ,MAAoC;AAChC,QAAM,CAACC,GAAOC,CAAQ,IAAIC,EAAyB,CAAA,CAAE,GAC/C,CAACC,GAAWC,CAAY,IAAIF,EAAS,EAAI,GACzCG,IAAa,CAAC,GAAGL,EAAM,QAAQ,GAC/BM,IAAW,CAACH,KAAaE,EAAW,SAAS;AAmBnD,SAjBAE,EAAU,MAAM;AACZ,IAAAR,EAA6BL,CAAU,EAClC,KAAK,CAACc,MAAW;AACd,YAAMC,IAAsBD,EACvB,OAAO,CAACE,MAAS,CAAC,CAACA,EAAK,QAAQ,EAChC;AAAA,QAAK,CAACC,GAAGC,MACND,EAAE,SAAS,SAASC,EAAE,SAAS,OAAOD,EAAE,OAAOC,EAAE,OAAOD,EAAE,SAAS,OAAOC,EAAE,SAAS;AAAA,MAAA,GAEvFC,IAAyBL,EAAO,OAAO,CAACE,MAAS,CAACA,EAAK,QAAQ,EAAE,KAAK,CAACC,GAAGC,MAAMD,EAAE,OAAOC,EAAE,IAAI;AACrG,MAAAX,EAAS,CAAC,GAAGQ,GAAqB,GAAGI,CAAsB,CAAC;AAAA,IAChE,CAAC,EACA,QAAQ,MAAM;AACX,MAAAT,EAAa,EAAK;AAAA,IACtB,CAAC;AAAA,EAET,GAAG,CAAA,CAAE,GAEDD,sBACQW,GAAA,EAAiB,IAGtBR,IACH,gBAAAS,EAAAC,GAAA,EACK,UAAAX,EAAW,IAAI,CAACK,MAET,gBAAAK;AAAA,IAACE;AAAA,IAAA;AAAA,MAEG,MAAAP;AAAA,MACA,aAAAf;AAAA,MACA,aAAAC;AAAA,MACA,wBAAAC;AAAA,MACA,qCAAAC;AAAA,IAAA;AAAA,IALKY,EAAK;AAAA,EAAA,CAQrB,EAAA,CACL,sBAEC,OAAA,EAAI,WAAU,kGAAiG,UAAA,6CAEhH;AAER;"}
@@ -2,8 +2,8 @@ import { jsx as a } from "react/jsx-runtime";
2
2
  import { RichTextEditor as C } from "@frontify/fondue/rte";
3
3
  import { useRef as R, useState as m, useCallback as c, useEffect as p, memo as V, useId as T } from "react";
4
4
  import { useIsInViewport as v } from "../../hooks/useIsInViewport.es.js";
5
- import { SerializedText as I } from "./SerializedText.es.js";
6
- import { getResponsiveColumnClasses as P } from "./plugins/ColumnBreakPlugin/helpers.es.js";
5
+ import { getResponsiveColumnClasses as I } from "./plugins/ColumnBreakPlugin/helpers.es.js";
6
+ import { SerializedText as P } from "./SerializedText.es.js";
7
7
  import { floatingButtonSelectors as L, floatingButtonActions as S } from "./plugins/ButtonPlugin/components/FloatingButton/floatingButtonStore.es.js";
8
8
  const y = (o) => {
9
9
  L.isOpen(o) && S.reset();
@@ -18,7 +18,7 @@ const y = (o) => {
18
18
  onTextChange: s,
19
19
  showSerializedText: d
20
20
  }) => {
21
- const E = P(l), [f, h] = m(!1), w = T(), x = c(
21
+ const E = I(l), [f, h] = m(!1), w = T(), x = c(
22
22
  (n) => {
23
23
  n !== e && s?.(n), h(!1);
24
24
  },
@@ -43,7 +43,7 @@ const y = (o) => {
43
43
  placeholderOpacity: "high"
44
44
  }
45
45
  ) : /* @__PURE__ */ a(
46
- I,
46
+ P,
47
47
  {
48
48
  value: e,
49
49
  gap: r,
@@ -1 +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/rte';\nimport { memo, useCallback, useEffect, useId, 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 handleHideExternalFloatingModals = (editorId: string) => {\n if (floatingButtonSelectors.isOpen(editorId)) {\n floatingButtonActions.reset();\n }\n};\n\nconst InternalRichTextEditor = memo(\n ({\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 const editorId = useId();\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 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={editorId}\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 // eslint-disable-next-line @eslint-react/set-state-in-effect\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":["handleHideExternalFloatingModals","editorId","floatingButtonSelectors","floatingButtonActions","InternalRichTextEditor","memo","isEnabled","value","columns","gap","placeholder","plugins","onTextChange","showSerializedText","customClass","getResponsiveColumnClasses","shouldPreventPageLeave","setShouldPreventPageLeave","useState","useId","handleTextChange","useCallback","newContent","handleValueChange","useEffect","unloadHandler","event","jsx","FondueRichTextEditor","SerializedText","RichTextEditor","props","ref","useRef","hasEnteredViewport","setHasEnteredViewport","isEditing","internalRteProps","onViewportVisibilityChange","isInViewport","useIsInViewport"],"mappings":";;;;;;;AAYA,MAAMA,IAAmC,CAACC,MAAqB;AAC3D,EAAIC,EAAwB,OAAOD,CAAQ,KACvCE,EAAsB,MAAA;AAE9B,GAEMC,IAAyBC;AAAA,EAC3B,CAAC;AAAA,IACG,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;AACnE,UAAMC,IAAcC,EAA2BP,CAAO,GAChD,CAACQ,GAAwBC,CAAyB,IAAIC,EAAS,EAAK,GACpEjB,IAAWkB,EAAA,GAEXC,IAAmBC;AAAA,MACrB,CAACC,MAAuB;AACpB,QAAIA,MAAef,KACfK,IAAeU,CAAU,GAE7BL,EAA0B,EAAK;AAAA,MACnC;AAAA,MACA,CAACL,GAAcL,CAAK;AAAA,IAAA,GAGlBgB,IAAoBF,EAAY,MAAMJ,EAA0B,EAAI,GAAG,CAAA,CAAE;AAe/E,WAbAO,EAAU,MAAM;AACZ,YAAMC,IAAgB,CAACC,MAA6B;AAChD,QAAAA,EAAM,eAAA,GACNA,EAAM,cAAc;AAAA,MACxB;AAEA,aAAIV,KACA,OAAO,iBAAiB,gBAAgBS,CAAa,GAGlD,MAAM,OAAO,oBAAoB,gBAAgBA,CAAa;AAAA,IACzE,GAAG,CAACT,CAAsB,CAAC,GAEvBV,IAEI,gBAAAqB;AAAA,MAACC;AAAAA,MAAA;AAAA,QACG,IAAI3B;AAAA,QACJ,OAAAM;AAAA,QACA,QAAQ;AAAA,QACR,aAAAG;AAAA,QACA,SAAAC;AAAA,QACA,gBAAgBY;AAAA,QAChB,cAAcH;AAAA,QACd,4BAA4BpB;AAAA,QAC5B,oBAAmB;AAAA,MAAA;AAAA,IAAA,IAK3B,gBAAA2B;AAAA,MAACE;AAAA,MAAA;AAAA,QACG,OAAAtB;AAAA,QACA,KAAAE;AAAA,QACA,aAAAK;AAAA,QACA,MAAMD;AAAA,QACN,SAAAF;AAAA,MAAA;AAAA,IAAA;AAAA,EAGZ;AACJ;AACAP,EAAuB,cAAc;AAE9B,MAAM0B,IAAiB,CAACC,MAA+B;AAC1D,QAAMC,IAAMC,EAAuB,IAAI,GACjC,CAACC,GAAoBC,CAAqB,IAAIjB,EAAS,EAAK,GAE5D,EAAE,WAAAkB,GAAW,GAAGC,EAAA,IAAqBN,GAErCO,IAA6BjB,EAAY,CAACkB,MAA0B;AACtE,IAAIA,KACAJ,EAAsB,EAAI;AAAA,EAElC,GAAG,CAAA,CAAE;AAEL,SAAAK,EAAgB,EAAE,KAAAR,GAAK,UAAU,CAACI,GAAW,UAAUE,GAA4B,GAEnFd,EAAU,MAAM;AACZ,IAAKY,KAEDD,EAAsB,EAAK;AAAA,EAEnC,GAAG,CAACC,CAAS,CAAC,GAGV,gBAAAT,EAAC,OAAA,EAAI,gBAAa,8BAA6B,WAAU,oCAAmC,KAAAK,GACxF,UAAA,gBAAAL,EAACvB,GAAA,EAAwB,GAAGiC,GAAkB,WAAWD,KAAaF,GAAoB,GAC9F;AAER;"}
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/rte';\nimport { memo, useCallback, useEffect, useId, useRef, useState } from 'react';\n\nimport { useIsInViewport } from '../../hooks/useIsInViewport';\n\nimport { floatingButtonActions, floatingButtonSelectors } from './plugins/ButtonPlugin/components';\nimport { getResponsiveColumnClasses } from './plugins/ColumnBreakPlugin/helpers';\nimport { SerializedText } from './SerializedText';\nimport { type RichTextEditorProps } from './types';\n\nconst handleHideExternalFloatingModals = (editorId: string) => {\n if (floatingButtonSelectors.isOpen(editorId)) {\n floatingButtonActions.reset();\n }\n};\n\nconst InternalRichTextEditor = memo(\n ({\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 const editorId = useId();\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 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={editorId}\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 // oxlint-disable-next-line @eslint-react/set-state-in-effect\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":["handleHideExternalFloatingModals","editorId","floatingButtonSelectors","floatingButtonActions","InternalRichTextEditor","memo","isEnabled","value","columns","gap","placeholder","plugins","onTextChange","showSerializedText","customClass","getResponsiveColumnClasses","shouldPreventPageLeave","setShouldPreventPageLeave","useState","useId","handleTextChange","useCallback","newContent","handleValueChange","useEffect","unloadHandler","event","jsx","FondueRichTextEditor","SerializedText","RichTextEditor","props","ref","useRef","hasEnteredViewport","setHasEnteredViewport","isEditing","internalRteProps","onViewportVisibilityChange","isInViewport","useIsInViewport"],"mappings":";;;;;;;AAYA,MAAMA,IAAmC,CAACC,MAAqB;AAC3D,EAAIC,EAAwB,OAAOD,CAAQ,KACvCE,EAAsB,MAAA;AAE9B,GAEMC,IAAyBC;AAAA,EAC3B,CAAC;AAAA,IACG,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;AACnE,UAAMC,IAAcC,EAA2BP,CAAO,GAChD,CAACQ,GAAwBC,CAAyB,IAAIC,EAAS,EAAK,GACpEjB,IAAWkB,EAAA,GAEXC,IAAmBC;AAAA,MACrB,CAACC,MAAuB;AACpB,QAAIA,MAAef,KACfK,IAAeU,CAAU,GAE7BL,EAA0B,EAAK;AAAA,MACnC;AAAA,MACA,CAACL,GAAcL,CAAK;AAAA,IAAA,GAGlBgB,IAAoBF,EAAY,MAAMJ,EAA0B,EAAI,GAAG,CAAA,CAAE;AAe/E,WAbAO,EAAU,MAAM;AACZ,YAAMC,IAAgB,CAACC,MAA6B;AAChD,QAAAA,EAAM,eAAA,GACNA,EAAM,cAAc;AAAA,MACxB;AAEA,aAAIV,KACA,OAAO,iBAAiB,gBAAgBS,CAAa,GAGlD,MAAM,OAAO,oBAAoB,gBAAgBA,CAAa;AAAA,IACzE,GAAG,CAACT,CAAsB,CAAC,GAEvBV,IAEI,gBAAAqB;AAAA,MAACC;AAAAA,MAAA;AAAA,QACG,IAAI3B;AAAA,QACJ,OAAAM;AAAA,QACA,QAAQ;AAAA,QACR,aAAAG;AAAA,QACA,SAAAC;AAAA,QACA,gBAAgBY;AAAA,QAChB,cAAcH;AAAA,QACd,4BAA4BpB;AAAA,QAC5B,oBAAmB;AAAA,MAAA;AAAA,IAAA,IAK3B,gBAAA2B;AAAA,MAACE;AAAA,MAAA;AAAA,QACG,OAAAtB;AAAA,QACA,KAAAE;AAAA,QACA,aAAAK;AAAA,QACA,MAAMD;AAAA,QACN,SAAAF;AAAA,MAAA;AAAA,IAAA;AAAA,EAGZ;AACJ;AACAP,EAAuB,cAAc;AAE9B,MAAM0B,IAAiB,CAACC,MAA+B;AAC1D,QAAMC,IAAMC,EAAuB,IAAI,GACjC,CAACC,GAAoBC,CAAqB,IAAIjB,EAAS,EAAK,GAE5D,EAAE,WAAAkB,GAAW,GAAGC,EAAA,IAAqBN,GAErCO,IAA6BjB,EAAY,CAACkB,MAA0B;AACtE,IAAIA,KACAJ,EAAsB,EAAI;AAAA,EAElC,GAAG,CAAA,CAAE;AAEL,SAAAK,EAAgB,EAAE,KAAAR,GAAK,UAAU,CAACI,GAAW,UAAUE,GAA4B,GAEnFd,EAAU,MAAM;AACZ,IAAKY,KAEDD,EAAsB,EAAK;AAAA,EAEnC,GAAG,CAACC,CAAS,CAAC,GAGV,gBAAAT,EAAC,OAAA,EAAI,gBAAa,8BAA6B,WAAU,oCAAmC,KAAAK,GACxF,UAAA,gBAAAL,EAACvB,GAAA,EAAwB,GAAGiC,GAAkB,WAAWD,KAAaF,GAAoB,GAC9F;AAER;"}
@@ -1 +1 @@
1
- {"version":3,"file":"floatingButtonStore.es.js","sources":["../../../../../../../src/components/RichTextEditor/plugins/ButtonPlugin/components/FloatingButton/floatingButtonStore.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { createStore } from '@frontify/fondue/rte';\n\nimport { type RichTextButtonStyle } from '../../types';\n\nexport type FloatingButtonMode = '' | 'insert' | 'edit';\n\nexport const floatingButtonStore: any = createStore('floatingButton')({\n openEditorId: null as null | string,\n mouseDown: false,\n updated: false,\n url: '',\n text: '',\n buttonStyle: 'primary' as RichTextButtonStyle,\n newTab: false,\n mode: '' as FloatingButtonMode,\n isEditing: false,\n})\n .extendActions((set) => ({\n reset: () => {\n set.url('');\n set.text('');\n set.buttonStyle('primary');\n set.newTab(false);\n set.mode('');\n set.isEditing(false);\n },\n }))\n .extendActions((set) => ({\n show: (mode: FloatingButtonMode, editorId: string) => {\n set.mode(mode);\n set.isEditing(false);\n set.openEditorId(editorId);\n },\n hide: () => {\n set.reset();\n set.openEditorId(null);\n },\n }))\n .extendSelectors((state) => ({\n isOpen: (editorId: string) => state.openEditorId === editorId,\n }));\n\nexport const floatingButtonActions = floatingButtonStore.set;\nexport const floatingButtonSelectors = floatingButtonStore.get;\n// eslint-disable-next-line @typescript-eslint/no-unsafe-return\nexport const useFloatingButtonSelectors = () => floatingButtonStore.use;\n"],"names":["floatingButtonStore","createStore","set","mode","editorId","state","floatingButtonActions","floatingButtonSelectors","useFloatingButtonSelectors"],"mappings":";AAQO,MAAMA,IAA2BC,EAAY,gBAAgB,EAAE;AAAA,EAClE,cAAc;AAAA,EACd,WAAW;AAAA,EACX,SAAS;AAAA,EACT,KAAK;AAAA,EACL,MAAM;AAAA,EACN,aAAa;AAAA,EACb,QAAQ;AAAA,EACR,MAAM;AAAA,EACN,WAAW;AACf,CAAC,EACI,cAAc,CAACC,OAAS;AAAA,EACrB,OAAO,MAAM;AACT,IAAAA,EAAI,IAAI,EAAE,GACVA,EAAI,KAAK,EAAE,GACXA,EAAI,YAAY,SAAS,GACzBA,EAAI,OAAO,EAAK,GAChBA,EAAI,KAAK,EAAE,GACXA,EAAI,UAAU,EAAK;AAAA,EACvB;AACJ,EAAE,EACD,cAAc,CAACA,OAAS;AAAA,EACrB,MAAM,CAACC,GAA0BC,MAAqB;AAClD,IAAAF,EAAI,KAAKC,CAAI,GACbD,EAAI,UAAU,EAAK,GACnBA,EAAI,aAAaE,CAAQ;AAAA,EAC7B;AAAA,EACA,MAAM,MAAM;AACR,IAAAF,EAAI,MAAA,GACJA,EAAI,aAAa,IAAI;AAAA,EACzB;AACJ,EAAE,EACD,gBAAgB,CAACG,OAAW;AAAA,EACzB,QAAQ,CAACD,MAAqBC,EAAM,iBAAiBD;AACzD,EAAE,GAEOE,IAAwBN,EAAoB,KAC5CO,IAA0BP,EAAoB,KAE9CQ,IAA6B,MAAMR,EAAoB;"}
1
+ {"version":3,"file":"floatingButtonStore.es.js","sources":["../../../../../../../src/components/RichTextEditor/plugins/ButtonPlugin/components/FloatingButton/floatingButtonStore.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { createStore } from '@frontify/fondue/rte';\n\nimport { type RichTextButtonStyle } from '../../types';\n\nexport type FloatingButtonMode = '' | 'insert' | 'edit';\n\nexport const floatingButtonStore: any = createStore('floatingButton')({\n openEditorId: null as null | string,\n mouseDown: false,\n updated: false,\n url: '',\n text: '',\n buttonStyle: 'primary' as RichTextButtonStyle,\n newTab: false,\n mode: '' as FloatingButtonMode,\n isEditing: false,\n})\n .extendActions((set) => ({\n reset: () => {\n set.url('');\n set.text('');\n set.buttonStyle('primary');\n set.newTab(false);\n set.mode('');\n set.isEditing(false);\n },\n }))\n .extendActions((set) => ({\n show: (mode: FloatingButtonMode, editorId: string) => {\n set.mode(mode);\n set.isEditing(false);\n set.openEditorId(editorId);\n },\n hide: () => {\n set.reset();\n set.openEditorId(null);\n },\n }))\n .extendSelectors((state) => ({\n isOpen: (editorId: string) => state.openEditorId === editorId,\n }));\n\nexport const floatingButtonActions = floatingButtonStore.set;\nexport const floatingButtonSelectors = floatingButtonStore.get;\n// oxlint-disable-next-line typescript/no-unsafe-return\nexport const useFloatingButtonSelectors = () => floatingButtonStore.use;\n"],"names":["floatingButtonStore","createStore","set","mode","editorId","state","floatingButtonActions","floatingButtonSelectors","useFloatingButtonSelectors"],"mappings":";AAQO,MAAMA,IAA2BC,EAAY,gBAAgB,EAAE;AAAA,EAClE,cAAc;AAAA,EACd,WAAW;AAAA,EACX,SAAS;AAAA,EACT,KAAK;AAAA,EACL,MAAM;AAAA,EACN,aAAa;AAAA,EACb,QAAQ;AAAA,EACR,MAAM;AAAA,EACN,WAAW;AACf,CAAC,EACI,cAAc,CAACC,OAAS;AAAA,EACrB,OAAO,MAAM;AACT,IAAAA,EAAI,IAAI,EAAE,GACVA,EAAI,KAAK,EAAE,GACXA,EAAI,YAAY,SAAS,GACzBA,EAAI,OAAO,EAAK,GAChBA,EAAI,KAAK,EAAE,GACXA,EAAI,UAAU,EAAK;AAAA,EACvB;AACJ,EAAE,EACD,cAAc,CAACA,OAAS;AAAA,EACrB,MAAM,CAACC,GAA0BC,MAAqB;AAClD,IAAAF,EAAI,KAAKC,CAAI,GACbD,EAAI,UAAU,EAAK,GACnBA,EAAI,aAAaE,CAAQ;AAAA,EAC7B;AAAA,EACA,MAAM,MAAM;AACR,IAAAF,EAAI,MAAA,GACJA,EAAI,aAAa,IAAI;AAAA,EACzB;AACJ,EAAE,EACD,gBAAgB,CAACG,OAAW;AAAA,EACzB,QAAQ,CAACD,MAAqBC,EAAM,iBAAiBD;AACzD,EAAE,GAEOE,IAAwBN,EAAoB,KAC5CO,IAA0BP,EAAoB,KAE9CQ,IAA6B,MAAMR,EAAoB;"}