@danske/sapphire-react-lab 0.105.1 → 0.106.1
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.
- package/build/cjs/index.js +1528 -2227
- package/build/cjs/index.js.map +1 -1
- package/build/esm/Accordion/index.js.map +1 -1
- package/build/esm/Accordion/src/Accordion.js +41 -73
- package/build/esm/Accordion/src/Accordion.js.map +1 -1
- package/build/esm/Accordion/src/AccordionContext.js +3 -1
- package/build/esm/Accordion/src/AccordionContext.js.map +1 -1
- package/build/esm/Accordion/src/AccordionHeading.js +22 -54
- package/build/esm/Accordion/src/AccordionHeading.js.map +1 -1
- package/build/esm/Accordion/src/AccordionItem.js +15 -42
- package/build/esm/Accordion/src/AccordionItem.js.map +1 -1
- package/build/esm/Accordion/src/AccordionPanel.js +27 -44
- package/build/esm/Accordion/src/AccordionPanel.js.map +1 -1
- package/build/esm/Accordion/src/utils.js.map +1 -1
- package/build/esm/Alert/src/Alert.js +26 -64
- package/build/esm/Alert/src/Alert.js.map +1 -1
- package/build/esm/Amount/src/Amount.js +40 -62
- package/build/esm/Amount/src/Amount.js.map +1 -1
- package/build/esm/Amount/src/useGroupAmount.js +4 -1
- package/build/esm/Amount/src/useGroupAmount.js.map +1 -1
- package/build/esm/Autocomplete/i18n/da-DK.json.js +6 -0
- package/build/esm/Autocomplete/i18n/da-DK.json.js.map +1 -0
- package/build/esm/Autocomplete/i18n/de-DE.json.js +6 -0
- package/build/esm/Autocomplete/i18n/de-DE.json.js.map +1 -0
- package/build/esm/Autocomplete/i18n/en-US.json.js +6 -0
- package/build/esm/Autocomplete/i18n/en-US.json.js.map +1 -0
- package/build/esm/Autocomplete/i18n/fi-FI.json.js +6 -0
- package/build/esm/Autocomplete/i18n/fi-FI.json.js.map +1 -0
- package/build/esm/Autocomplete/i18n/index.js +9 -9
- package/build/esm/Autocomplete/i18n/index.js.map +1 -1
- package/build/esm/Autocomplete/i18n/nb-NO.json.js +6 -0
- package/build/esm/Autocomplete/i18n/nb-NO.json.js.map +1 -0
- package/build/esm/Autocomplete/i18n/pl-PL.json.js +6 -0
- package/build/esm/Autocomplete/i18n/pl-PL.json.js.map +1 -0
- package/build/esm/Autocomplete/i18n/sv-SE.json.js +6 -0
- package/build/esm/Autocomplete/i18n/sv-SE.json.js.map +1 -0
- package/build/esm/Autocomplete/src/Autocomplete.js +49 -74
- package/build/esm/Autocomplete/src/Autocomplete.js.map +1 -1
- package/build/esm/Breadcrumbs/src/BreadcrumbItem.js +44 -51
- package/build/esm/Breadcrumbs/src/BreadcrumbItem.js.map +1 -1
- package/build/esm/Breadcrumbs/src/BreadcrumbItemLink.js +18 -46
- package/build/esm/Breadcrumbs/src/BreadcrumbItemLink.js.map +1 -1
- package/build/esm/Breadcrumbs/src/BreadcrumbItemStatic.js +24 -45
- package/build/esm/Breadcrumbs/src/BreadcrumbItemStatic.js.map +1 -1
- package/build/esm/Breadcrumbs/src/BreadcrumbOverflowMenu.js +18 -11
- package/build/esm/Breadcrumbs/src/BreadcrumbOverflowMenu.js.map +1 -1
- package/build/esm/Breadcrumbs/src/Breadcrumbs.js +42 -61
- package/build/esm/Breadcrumbs/src/Breadcrumbs.js.map +1 -1
- package/build/esm/Breadcrumbs/src/BreadcrumbsSeparator.js +8 -6
- package/build/esm/Breadcrumbs/src/BreadcrumbsSeparator.js.map +1 -1
- package/build/esm/Breadcrumbs/src/useBreadcrumbThreshold.js +5 -5
- package/build/esm/Breadcrumbs/src/useBreadcrumbThreshold.js.map +1 -1
- package/build/esm/FileDropzone/i18n/{da-DK.js → da-DK.json.js} +3 -3
- package/build/esm/FileDropzone/i18n/da-DK.json.js.map +1 -0
- package/build/esm/FileDropzone/i18n/{de-DE.js → de-DE.json.js} +3 -3
- package/build/esm/FileDropzone/i18n/de-DE.json.js.map +1 -0
- package/build/esm/FileDropzone/i18n/{en-US.js → en-US.json.js} +3 -3
- package/build/esm/FileDropzone/i18n/en-US.json.js.map +1 -0
- package/build/esm/FileDropzone/i18n/{fi-FI.js → fi-FI.json.js} +3 -3
- package/build/esm/FileDropzone/i18n/fi-FI.json.js.map +1 -0
- package/build/esm/FileDropzone/i18n/index.js +9 -9
- package/build/esm/FileDropzone/i18n/index.js.map +1 -1
- package/build/esm/FileDropzone/i18n/{nb-NO.js → nb-NO.json.js} +3 -3
- package/build/esm/FileDropzone/i18n/nb-NO.json.js.map +1 -0
- package/build/esm/FileDropzone/i18n/{pl-PL.js → pl-PL.json.js} +3 -3
- package/build/esm/FileDropzone/i18n/pl-PL.json.js.map +1 -0
- package/build/esm/FileDropzone/i18n/{sv-SE.js → sv-SE.json.js} +3 -3
- package/build/esm/FileDropzone/i18n/sv-SE.json.js.map +1 -0
- package/build/esm/FileDropzone/src/FileDropzone.js +59 -84
- package/build/esm/FileDropzone/src/FileDropzone.js.map +1 -1
- package/build/esm/FileDropzone/src/FileTrigger.js +26 -59
- package/build/esm/FileDropzone/src/FileTrigger.js.map +1 -1
- package/build/esm/FileDropzone/src/utils.js.map +1 -1
- package/build/esm/Filtering/src/FilterDropdown.js +88 -110
- package/build/esm/Filtering/src/FilterDropdown.js.map +1 -1
- package/build/esm/Filtering/src/SearchableSelectFilter.js +38 -58
- package/build/esm/Filtering/src/SearchableSelectFilter.js.map +1 -1
- package/build/esm/Flag/src/Flag.js +5 -37
- package/build/esm/Flag/src/Flag.js.map +1 -1
- package/build/esm/LabeledValue/src/LabeledValue.js +19 -53
- package/build/esm/LabeledValue/src/LabeledValue.js.map +1 -1
- package/build/esm/NumberField/i18n/da-DK.json.js +9 -0
- package/build/esm/NumberField/i18n/da-DK.json.js.map +1 -0
- package/build/esm/NumberField/i18n/de-DE.json.js +9 -0
- package/build/esm/NumberField/i18n/de-DE.json.js.map +1 -0
- package/build/esm/NumberField/i18n/en-US.json.js +9 -0
- package/build/esm/NumberField/i18n/en-US.json.js.map +1 -0
- package/build/esm/NumberField/i18n/fi-FI.json.js +9 -0
- package/build/esm/NumberField/i18n/fi-FI.json.js.map +1 -0
- package/build/esm/NumberField/i18n/index.js +9 -9
- package/build/esm/NumberField/i18n/index.js.map +1 -1
- package/build/esm/NumberField/i18n/nb-NO.json.js +9 -0
- package/build/esm/NumberField/i18n/nb-NO.json.js.map +1 -0
- package/build/esm/NumberField/i18n/pl-PL.json.js +9 -0
- package/build/esm/NumberField/i18n/pl-PL.json.js.map +1 -0
- package/build/esm/NumberField/i18n/sv-SE.json.js +9 -0
- package/build/esm/NumberField/i18n/sv-SE.json.js.map +1 -0
- package/build/esm/NumberField/src/NumberField.js +125 -108
- package/build/esm/NumberField/src/NumberField.js.map +1 -1
- package/build/esm/NumberField/src/StepperButton.js +28 -50
- package/build/esm/NumberField/src/StepperButton.js.map +1 -1
- package/build/esm/NumberField/src/cursorHelpers.js +13 -8
- package/build/esm/NumberField/src/cursorHelpers.js.map +1 -1
- package/build/esm/NumberField/src/formatHelpers.js +15 -18
- package/build/esm/NumberField/src/formatHelpers.js.map +1 -1
- package/build/esm/NumberField/src/keyboardHelpers.js +13 -8
- package/build/esm/NumberField/src/keyboardHelpers.js.map +1 -1
- package/build/esm/NumberField/src/useAutofillStyle.js.map +1 -1
- package/build/esm/NumberField/src/useNumberFieldFormatting.js +79 -45
- package/build/esm/NumberField/src/useNumberFieldFormatting.js.map +1 -1
- package/build/esm/NumberField/src/useSapphireNumberField.js +13 -39
- package/build/esm/NumberField/src/useSapphireNumberField.js.map +1 -1
- package/build/esm/ProgressIndicator/src/ProgressIndicator.js +21 -33
- package/build/esm/ProgressIndicator/src/ProgressIndicator.js.map +1 -1
- package/build/esm/Sidebar/index.js.map +1 -1
- package/build/esm/Sidebar/src/Body.js +18 -43
- package/build/esm/Sidebar/src/Body.js.map +1 -1
- package/build/esm/Sidebar/src/ExpandableItem.js +86 -95
- package/build/esm/Sidebar/src/ExpandableItem.js.map +1 -1
- package/build/esm/Sidebar/src/Header.js +13 -43
- package/build/esm/Sidebar/src/Header.js.map +1 -1
- package/build/esm/Sidebar/src/Item.js +16 -43
- package/build/esm/Sidebar/src/Item.js.map +1 -1
- package/build/esm/Sidebar/src/List.js +13 -42
- package/build/esm/Sidebar/src/List.js.map +1 -1
- package/build/esm/Sidebar/src/Panel.js +56 -69
- package/build/esm/Sidebar/src/Panel.js.map +1 -1
- package/build/esm/Sidebar/src/ResponsiveSidebarContext.js +16 -8
- package/build/esm/Sidebar/src/ResponsiveSidebarContext.js.map +1 -1
- package/build/esm/Sidebar/src/SecondarySidebarContext.js +14 -11
- package/build/esm/Sidebar/src/SecondarySidebarContext.js.map +1 -1
- package/build/esm/Sidebar/src/Section.js +36 -49
- package/build/esm/Sidebar/src/Section.js.map +1 -1
- package/build/esm/Sidebar/src/Sidebar.js +62 -91
- package/build/esm/Sidebar/src/Sidebar.js.map +1 -1
- package/build/esm/Sidebar/src/useSidebar.js.map +1 -1
- package/build/esm/Slider/index.js.map +1 -1
- package/build/esm/Slider/src/Slider.js +46 -71
- package/build/esm/Slider/src/Slider.js.map +1 -1
- package/build/esm/TagGroup/src/Tag.js +66 -82
- package/build/esm/TagGroup/src/Tag.js.map +1 -1
- package/build/esm/TagGroup/src/TagGroup.js +44 -65
- package/build/esm/TagGroup/src/TagGroup.js.map +1 -1
- package/build/esm/TagGroup/src/TagItem.js.map +1 -1
- package/build/esm/TimeField/i18n/da-DK.json.js +7 -0
- package/build/esm/TimeField/i18n/da-DK.json.js.map +1 -0
- package/build/esm/TimeField/i18n/de-DE.json.js +7 -0
- package/build/esm/TimeField/i18n/de-DE.json.js.map +1 -0
- package/build/esm/TimeField/i18n/en-US.json.js +7 -0
- package/build/esm/TimeField/i18n/en-US.json.js.map +1 -0
- package/build/esm/TimeField/i18n/fi-FI.json.js +7 -0
- package/build/esm/TimeField/i18n/fi-FI.json.js.map +1 -0
- package/build/esm/TimeField/i18n/index.js +7 -7
- package/build/esm/TimeField/i18n/index.js.map +1 -1
- package/build/esm/TimeField/i18n/nb-NO.json.js +7 -0
- package/build/esm/TimeField/i18n/nb-NO.json.js.map +1 -0
- package/build/esm/TimeField/i18n/pl-PL.json.js +7 -0
- package/build/esm/TimeField/i18n/pl-PL.json.js.map +1 -0
- package/build/esm/TimeField/i18n/{sv-SE.js → sv-SE.json.js} +1 -1
- package/build/esm/TimeField/i18n/sv-SE.json.js.map +1 -0
- package/build/esm/TimeField/src/TimeField.js +62 -80
- package/build/esm/TimeField/src/TimeField.js.map +1 -1
- package/build/esm/TimeField/src/TimeFieldSegment.js +24 -36
- package/build/esm/TimeField/src/TimeFieldSegment.js.map +1 -1
- package/build/index.d.ts +13 -12
- package/package.json +6 -6
- package/build/esm/Autocomplete/i18n/da-DK.js +0 -6
- package/build/esm/Autocomplete/i18n/da-DK.js.map +0 -1
- package/build/esm/Autocomplete/i18n/de-DE.js +0 -6
- package/build/esm/Autocomplete/i18n/de-DE.js.map +0 -1
- package/build/esm/Autocomplete/i18n/en-US.js +0 -6
- package/build/esm/Autocomplete/i18n/en-US.js.map +0 -1
- package/build/esm/Autocomplete/i18n/fi-FI.js +0 -6
- package/build/esm/Autocomplete/i18n/fi-FI.js.map +0 -1
- package/build/esm/Autocomplete/i18n/nb-NO.js +0 -6
- package/build/esm/Autocomplete/i18n/nb-NO.js.map +0 -1
- package/build/esm/Autocomplete/i18n/pl-PL.js +0 -6
- package/build/esm/Autocomplete/i18n/pl-PL.js.map +0 -1
- package/build/esm/Autocomplete/i18n/sv-SE.js +0 -6
- package/build/esm/Autocomplete/i18n/sv-SE.js.map +0 -1
- package/build/esm/FileDropzone/i18n/da-DK.js.map +0 -1
- package/build/esm/FileDropzone/i18n/de-DE.js.map +0 -1
- package/build/esm/FileDropzone/i18n/en-US.js.map +0 -1
- package/build/esm/FileDropzone/i18n/fi-FI.js.map +0 -1
- package/build/esm/FileDropzone/i18n/nb-NO.js.map +0 -1
- package/build/esm/FileDropzone/i18n/pl-PL.js.map +0 -1
- package/build/esm/FileDropzone/i18n/sv-SE.js.map +0 -1
- package/build/esm/NumberField/i18n/da-DK.js +0 -9
- package/build/esm/NumberField/i18n/da-DK.js.map +0 -1
- package/build/esm/NumberField/i18n/de-DE.js +0 -9
- package/build/esm/NumberField/i18n/de-DE.js.map +0 -1
- package/build/esm/NumberField/i18n/en-US.js +0 -9
- package/build/esm/NumberField/i18n/en-US.js.map +0 -1
- package/build/esm/NumberField/i18n/fi-FI.js +0 -9
- package/build/esm/NumberField/i18n/fi-FI.js.map +0 -1
- package/build/esm/NumberField/i18n/nb-NO.js +0 -9
- package/build/esm/NumberField/i18n/nb-NO.js.map +0 -1
- package/build/esm/NumberField/i18n/pl-PL.js +0 -9
- package/build/esm/NumberField/i18n/pl-PL.js.map +0 -1
- package/build/esm/NumberField/i18n/sv-SE.js +0 -9
- package/build/esm/NumberField/i18n/sv-SE.js.map +0 -1
- package/build/esm/TimeField/i18n/da-DK.js +0 -7
- package/build/esm/TimeField/i18n/da-DK.js.map +0 -1
- package/build/esm/TimeField/i18n/de-DE.js +0 -7
- package/build/esm/TimeField/i18n/de-DE.js.map +0 -1
- package/build/esm/TimeField/i18n/en-US.js +0 -7
- package/build/esm/TimeField/i18n/en-US.js.map +0 -1
- package/build/esm/TimeField/i18n/fi-FI.js +0 -7
- package/build/esm/TimeField/i18n/fi-FI.js.map +0 -1
- package/build/esm/TimeField/i18n/nb-NO.js +0 -7
- package/build/esm/TimeField/i18n/nb-NO.js.map +0 -1
- package/build/esm/TimeField/i18n/pl-PL.js +0 -7
- package/build/esm/TimeField/i18n/pl-PL.js.map +0 -1
- package/build/esm/TimeField/i18n/sv-SE.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useBreadcrumbThreshold.js","sources":["../../../../src/Breadcrumbs/src/useBreadcrumbThreshold.ts"],"sourcesContent":["import { useState, useMemo, useEffect } from 'react';\nimport { useResizeObserver } from '@react-aria/utils';\n\nexport const useBreadcrumbThreshold = (\n childrenCount: number,\n containerRef: React.RefObject<HTMLElement>,\n breadcrumbRef: React.RefObject<HTMLOListElement>\n) => {\n const [itemWidths, setItemWidths] = useState<number[]>([]);\n const [containerWidth, setContainerWidth] = useState<number>(0);\n\n const { shouldRenderOverflow, maxVisibleTailChildren } = useMemo(() => {\n if (!containerWidth || itemWidths.length === 0) {\n return {\n shouldRenderOverflow: false,\n maxVisibleTailChildren: childrenCount,\n };\n }\n\n // Exit early if the container is wider than all items combined\n const totalItemWidth = itemWidths.reduce((a, b) => a + b, 0);\n if (totalItemWidth <= containerWidth) {\n return {\n shouldRenderOverflow: false,\n maxVisibleTailChildren: itemWidths.length - 1,\n };\n }\n\n // The minimum number of items in the container is 2 (first and last).\n let totalWidth = itemWidths[0] + itemWidths[itemWidths.length - 1];\n let visibleTailCount = 1; // Last item counted by default\n\n for (\n let i = itemWidths.length - 2;\n i > 0 && totalWidth + itemWidths[i] < containerWidth;\n i--\n ) {\n totalWidth += itemWidths[i];\n visibleTailCount++;\n }\n\n visibleTailCount--; // When we are overflowing, take into account the icon button that will be rendered\n return {\n shouldRenderOverflow: true,\n maxVisibleTailChildren: Math.max(1, visibleTailCount),\n };\n }, [itemWidths, containerWidth, childrenCount]);\n\n /**\n * Compute the individual widths of the breadcrumb items.\n * It's important to have these values for all the items, since they disappear if the container\n * is overflowing. We need these values to recompute the number of items that can fit,\n * but we can't do that once they have disappeared from the container.\n */\n const computeItemWidths = () => {\n if (!breadcrumbRef.current) return;\n const breadcrumbItems = Array.from(\n breadcrumbRef.current.children\n ) as HTMLElement[];\n const widths = breadcrumbItems\n .map((item) => item.offsetWidth)\n .filter(Boolean);\n\n if (widths.length === breadcrumbItems.length) {\n setItemWidths(widths);\n }\n };\n\n /**\n * Recompute the item widths when the children change.\n */\n useEffect(() => {\n if (childrenCount !== itemWidths.length) {\n computeItemWidths();\n }\n }, [containerRef.current, childrenCount]);\n\n useResizeObserver({\n ref: containerRef,\n onResize: () => {\n if (!containerRef.current) return;\n setContainerWidth(containerRef.current.offsetWidth);\n },\n });\n\n const overflowNodes = useMemo(() => {\n if (childrenCount > 0 && shouldRenderOverflow) {\n const tailCount = maxVisibleTailChildren > 1 ? maxVisibleTailChildren : 1;\n const actualTailCount =\n maxVisibleTailChildren === 1 ? maxVisibleTailChildren : tailCount;\n const limitedTailCount = Math.min(actualTailCount, 5); // By design, we limit the number of visible tail items to 6\n const tailStartIndex = childrenCount - limitedTailCount;\n // Return overflow indexes (hidden items) - all items except first and tail items\n return Array.from({ length: tailStartIndex - 1 }, (_, i) => i + 1);\n }\n return [];\n }, [childrenCount, shouldRenderOverflow, maxVisibleTailChildren]);\n\n return {\n overflowNodes,\n };\n};\n"],"names":[],"mappings":";;;AAGO,MAAM,
|
|
1
|
+
{"version":3,"file":"useBreadcrumbThreshold.js","sources":["../../../../src/Breadcrumbs/src/useBreadcrumbThreshold.ts"],"sourcesContent":["import { useState, useMemo, useEffect } from 'react';\nimport { useResizeObserver } from '@react-aria/utils';\n\nexport const useBreadcrumbThreshold = (\n childrenCount: number,\n containerRef: React.RefObject<HTMLElement>,\n breadcrumbRef: React.RefObject<HTMLOListElement>\n) => {\n const [itemWidths, setItemWidths] = useState<number[]>([]);\n const [containerWidth, setContainerWidth] = useState<number>(0);\n\n const { shouldRenderOverflow, maxVisibleTailChildren } = useMemo(() => {\n if (!containerWidth || itemWidths.length === 0) {\n return {\n shouldRenderOverflow: false,\n maxVisibleTailChildren: childrenCount,\n };\n }\n\n // Exit early if the container is wider than all items combined\n const totalItemWidth = itemWidths.reduce((a, b) => a + b, 0);\n if (totalItemWidth <= containerWidth) {\n return {\n shouldRenderOverflow: false,\n maxVisibleTailChildren: itemWidths.length - 1,\n };\n }\n\n // The minimum number of items in the container is 2 (first and last).\n let totalWidth = itemWidths[0] + itemWidths[itemWidths.length - 1];\n let visibleTailCount = 1; // Last item counted by default\n\n for (\n let i = itemWidths.length - 2;\n i > 0 && totalWidth + itemWidths[i] < containerWidth;\n i--\n ) {\n totalWidth += itemWidths[i];\n visibleTailCount++;\n }\n\n visibleTailCount--; // When we are overflowing, take into account the icon button that will be rendered\n return {\n shouldRenderOverflow: true,\n maxVisibleTailChildren: Math.max(1, visibleTailCount),\n };\n }, [itemWidths, containerWidth, childrenCount]);\n\n /**\n * Compute the individual widths of the breadcrumb items.\n * It's important to have these values for all the items, since they disappear if the container\n * is overflowing. We need these values to recompute the number of items that can fit,\n * but we can't do that once they have disappeared from the container.\n */\n const computeItemWidths = () => {\n if (!breadcrumbRef.current) return;\n const breadcrumbItems = Array.from(\n breadcrumbRef.current.children\n ) as HTMLElement[];\n const widths = breadcrumbItems\n .map((item) => item.offsetWidth)\n .filter(Boolean);\n\n if (widths.length === breadcrumbItems.length) {\n setItemWidths(widths);\n }\n };\n\n /**\n * Recompute the item widths when the children change.\n */\n useEffect(() => {\n if (childrenCount !== itemWidths.length) {\n computeItemWidths();\n }\n }, [containerRef.current, childrenCount]);\n\n useResizeObserver({\n ref: containerRef,\n onResize: () => {\n if (!containerRef.current) return;\n setContainerWidth(containerRef.current.offsetWidth);\n },\n });\n\n const overflowNodes = useMemo(() => {\n if (childrenCount > 0 && shouldRenderOverflow) {\n const tailCount = maxVisibleTailChildren > 1 ? maxVisibleTailChildren : 1;\n const actualTailCount =\n maxVisibleTailChildren === 1 ? maxVisibleTailChildren : tailCount;\n const limitedTailCount = Math.min(actualTailCount, 5); // By design, we limit the number of visible tail items to 6\n const tailStartIndex = childrenCount - limitedTailCount;\n // Return overflow indexes (hidden items) - all items except first and tail items\n return Array.from({ length: tailStartIndex - 1 }, (_, i) => i + 1);\n }\n return [];\n }, [childrenCount, shouldRenderOverflow, maxVisibleTailChildren]);\n\n return {\n overflowNodes,\n };\n};\n"],"names":[],"mappings":"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"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
var da = {
|
|
1
|
+
var da$2 = {
|
|
2
2
|
"dropzone-heading-default": "Træk filer hertil, eller klik for at vælge",
|
|
3
3
|
"dropzone-heading-default-single": "Træk fil her, eller klik for at vælge",
|
|
4
4
|
"dropzone-heading-dropping": "Slip fil"
|
|
5
5
|
};
|
|
6
6
|
|
|
7
|
-
export { da as default };
|
|
8
|
-
//# sourceMappingURL=da-DK.js.map
|
|
7
|
+
export { da$2 as default };
|
|
8
|
+
//# sourceMappingURL=da-DK.json.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"da-DK.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
var de = {
|
|
1
|
+
var de$2 = {
|
|
2
2
|
"dropzone-heading-default": "Ziehen Sie Dateien hierher oder klicken Sie, um sie auszuwählen",
|
|
3
3
|
"dropzone-heading-default-single": "Ziehen Sie die Datei hierher oder klicken Sie, um sie auszuwählen",
|
|
4
4
|
"dropzone-heading-dropping": "Datei ablegen"
|
|
5
5
|
};
|
|
6
6
|
|
|
7
|
-
export { de as default };
|
|
8
|
-
//# sourceMappingURL=de-DE.js.map
|
|
7
|
+
export { de$2 as default };
|
|
8
|
+
//# sourceMappingURL=de-DE.json.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"de-DE.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
var en = {
|
|
1
|
+
var en$2 = {
|
|
2
2
|
"dropzone-heading-default": "Drag files here or click to select",
|
|
3
3
|
"dropzone-heading-default-single": "Drag a file here or click to select",
|
|
4
4
|
"dropzone-heading-dropping": "Drop file"
|
|
5
5
|
};
|
|
6
6
|
|
|
7
|
-
export { en as default };
|
|
8
|
-
//# sourceMappingURL=en-US.js.map
|
|
7
|
+
export { en$2 as default };
|
|
8
|
+
//# sourceMappingURL=en-US.json.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"en-US.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
var fi = {
|
|
1
|
+
var fi$2 = {
|
|
2
2
|
"dropzone-heading-default": "Vedä tiedostoja tähän tai valitse napsauttamalla",
|
|
3
3
|
"dropzone-heading-default-single": "Vedä tiedosto tähän tai valitse napsauttamalla",
|
|
4
4
|
"dropzone-heading-dropping": "Pudota tiedosto"
|
|
5
5
|
};
|
|
6
6
|
|
|
7
|
-
export { fi as default };
|
|
8
|
-
//# sourceMappingURL=fi-FI.js.map
|
|
7
|
+
export { fi$2 as default };
|
|
8
|
+
//# sourceMappingURL=fi-FI.json.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"fi-FI.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}
|
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
import da from './da-DK.js';
|
|
2
|
-
import en from './en-US.js';
|
|
3
|
-
import de from './de-DE.js';
|
|
4
|
-
import fi from './fi-FI.js';
|
|
5
|
-
import no from './nb-NO.js';
|
|
6
|
-
import pl from './pl-PL.js';
|
|
7
|
-
import se from './sv-SE.js';
|
|
1
|
+
import da from './da-DK.json.js';
|
|
2
|
+
import en from './en-US.json.js';
|
|
3
|
+
import de from './de-DE.json.js';
|
|
4
|
+
import fi from './fi-FI.json.js';
|
|
5
|
+
import no from './nb-NO.json.js';
|
|
6
|
+
import pl from './pl-PL.json.js';
|
|
7
|
+
import se from './sv-SE.json.js';
|
|
8
8
|
|
|
9
|
-
var intlMessages = {
|
|
9
|
+
var intlMessages$2 = {
|
|
10
10
|
"da-DK": da,
|
|
11
11
|
"en-US": en,
|
|
12
12
|
"de-DE": de,
|
|
@@ -16,5 +16,5 @@ var intlMessages = {
|
|
|
16
16
|
"sv-SE": se
|
|
17
17
|
};
|
|
18
18
|
|
|
19
|
-
export { intlMessages as default };
|
|
19
|
+
export { intlMessages$2 as default };
|
|
20
20
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../../src/FileDropzone/i18n/index.ts"],"sourcesContent":["import da from './da-DK.json';\nimport en from './en-US.json';\nimport de from './de-DE.json';\nimport fi from './fi-FI.json';\nimport no from './nb-NO.json';\nimport pl from './pl-PL.json';\nimport se from './sv-SE.json';\n\nexport default {\n 'da-DK': da,\n 'en-US': en,\n 'de-DE': de,\n 'fi-FI': fi,\n 'nb-NO': no,\n 'pl-PL': pl,\n 'sv-SE': se,\n};\n"],"names":[],"mappings":";;;;;;;;AAQA,
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../../src/FileDropzone/i18n/index.ts"],"sourcesContent":["import da from './da-DK.json';\nimport en from './en-US.json';\nimport de from './de-DE.json';\nimport fi from './fi-FI.json';\nimport no from './nb-NO.json';\nimport pl from './pl-PL.json';\nimport se from './sv-SE.json';\n\nexport default {\n 'da-DK': da,\n 'en-US': en,\n 'de-DE': de,\n 'fi-FI': fi,\n 'nb-NO': no,\n 'pl-PL': pl,\n 'sv-SE': se,\n};\n"],"names":[],"mappings":";;;;;;;;AAQA,qBAAe;AAAA,EACb,OAAA,EAAS,EAAA;AAAA,EACT,OAAA,EAAS,EAAA;AAAA,EACT,OAAA,EAAS,EAAA;AAAA,EACT,OAAA,EAAS,EAAA;AAAA,EACT,OAAA,EAAS,EAAA;AAAA,EACT,OAAA,EAAS,EAAA;AAAA,EACT,OAAA,EAAS;AACX,CAAA;;;;"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
var no = {
|
|
1
|
+
var no$2 = {
|
|
2
2
|
"dropzone-heading-default": "Dra filer her eller klikk for å velge",
|
|
3
3
|
"dropzone-heading-default-single": "Dra fil her eller klikk for å velge",
|
|
4
4
|
"dropzone-heading-dropping": "Slipp fil"
|
|
5
5
|
};
|
|
6
6
|
|
|
7
|
-
export { no as default };
|
|
8
|
-
//# sourceMappingURL=nb-NO.js.map
|
|
7
|
+
export { no$2 as default };
|
|
8
|
+
//# sourceMappingURL=nb-NO.json.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"nb-NO.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
var pl = {
|
|
1
|
+
var pl$2 = {
|
|
2
2
|
"dropzone-heading-default": "Przeciągnij pliki tutaj lub kliknij, aby wybrać",
|
|
3
3
|
"dropzone-heading-default-single": "Przeciągnij plik tutaj lub kliknij, aby wybrać",
|
|
4
4
|
"dropzone-heading-dropping": "Upuść plik"
|
|
5
5
|
};
|
|
6
6
|
|
|
7
|
-
export { pl as default };
|
|
8
|
-
//# sourceMappingURL=pl-PL.js.map
|
|
7
|
+
export { pl$2 as default };
|
|
8
|
+
//# sourceMappingURL=pl-PL.json.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"pl-PL.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
var se = {
|
|
1
|
+
var se$2 = {
|
|
2
2
|
"dropzone-heading-default": "Dra filer hit eller klicka för att välja",
|
|
3
3
|
"dropzone-heading-default-single": "Dra fil hit eller klicka för att välja",
|
|
4
4
|
"dropzone-heading-dropping": "Släpp filen"
|
|
5
5
|
};
|
|
6
6
|
|
|
7
|
-
export { se as default };
|
|
8
|
-
//# sourceMappingURL=sv-SE.js.map
|
|
7
|
+
export { se$2 as default };
|
|
8
|
+
//# sourceMappingURL=sv-SE.json.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"sv-SE.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}
|
|
@@ -12,39 +12,8 @@ import { useFocusRing } from '@react-aria/focus';
|
|
|
12
12
|
import { useMessageFormatter } from '@react-aria/i18n';
|
|
13
13
|
import intlMessages from '../i18n/index.js';
|
|
14
14
|
|
|
15
|
-
var __defProp = Object.defineProperty;
|
|
16
|
-
var __defProps = Object.defineProperties;
|
|
17
|
-
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
18
|
-
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
19
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
20
|
-
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
21
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
22
|
-
var __spreadValues = (a, b) => {
|
|
23
|
-
for (var prop in b || (b = {}))
|
|
24
|
-
if (__hasOwnProp.call(b, prop))
|
|
25
|
-
__defNormalProp(a, prop, b[prop]);
|
|
26
|
-
if (__getOwnPropSymbols)
|
|
27
|
-
for (var prop of __getOwnPropSymbols(b)) {
|
|
28
|
-
if (__propIsEnum.call(b, prop))
|
|
29
|
-
__defNormalProp(a, prop, b[prop]);
|
|
30
|
-
}
|
|
31
|
-
return a;
|
|
32
|
-
};
|
|
33
|
-
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
34
|
-
var __objRest = (source, exclude) => {
|
|
35
|
-
var target = {};
|
|
36
|
-
for (var prop in source)
|
|
37
|
-
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
38
|
-
target[prop] = source[prop];
|
|
39
|
-
if (source != null && __getOwnPropSymbols)
|
|
40
|
-
for (var prop of __getOwnPropSymbols(source)) {
|
|
41
|
-
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
|
42
|
-
target[prop] = source[prop];
|
|
43
|
-
}
|
|
44
|
-
return target;
|
|
45
|
-
};
|
|
46
15
|
const FileDropzone = React.forwardRef(function DropzoneWrapper(props, forwardedRef) {
|
|
47
|
-
const
|
|
16
|
+
const {
|
|
48
17
|
isDisabled = false,
|
|
49
18
|
hasError,
|
|
50
19
|
renderInstruction,
|
|
@@ -52,30 +21,26 @@ const FileDropzone = React.forwardRef(function DropzoneWrapper(props, forwardedR
|
|
|
52
21
|
acceptedFileTypes,
|
|
53
22
|
allowsMultiple,
|
|
54
23
|
onDrop = () => null,
|
|
55
|
-
getDropOperation = () => "copy"
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
"hasError",
|
|
59
|
-
"renderInstruction",
|
|
60
|
-
"onFileSelectOpen",
|
|
61
|
-
"acceptedFileTypes",
|
|
62
|
-
"allowsMultiple",
|
|
63
|
-
"onDrop",
|
|
64
|
-
"getDropOperation"
|
|
65
|
-
]);
|
|
24
|
+
getDropOperation = () => "copy",
|
|
25
|
+
...otherProps
|
|
26
|
+
} = props;
|
|
66
27
|
const id = useId();
|
|
67
28
|
const paragraphId = props["aria-label"] ? void 0 : id;
|
|
68
29
|
const format = useMessageFormatter(intlMessages);
|
|
69
30
|
const pressableRef = useObjectRef(forwardedRef);
|
|
70
31
|
const { hoverProps, isHovered } = useHover({ isDisabled });
|
|
71
32
|
const { styleProps } = useSapphireStyleProps(props);
|
|
72
|
-
const { dropProps, isDropTarget: isDropping } = useDrop(
|
|
33
|
+
const { dropProps, isDropTarget: isDropping } = useDrop({
|
|
34
|
+
...props,
|
|
73
35
|
ref: pressableRef,
|
|
74
36
|
hasDropButton: true,
|
|
75
37
|
isDisabled,
|
|
76
38
|
getDropOperation
|
|
77
|
-
})
|
|
78
|
-
const { buttonProps, isPressed } = useButton(
|
|
39
|
+
});
|
|
40
|
+
const { buttonProps, isPressed } = useButton(
|
|
41
|
+
{ elementType: "div" },
|
|
42
|
+
pressableRef
|
|
43
|
+
);
|
|
79
44
|
const { focusProps, isFocusVisible } = useFocusRing();
|
|
80
45
|
const { clipboardProps } = useClipboard({
|
|
81
46
|
isDisabled,
|
|
@@ -97,44 +62,54 @@ const FileDropzone = React.forwardRef(function DropzoneWrapper(props, forwardedR
|
|
|
97
62
|
dropOperation: "copy"
|
|
98
63
|
});
|
|
99
64
|
};
|
|
100
|
-
return /* @__PURE__ */ React.createElement(
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
65
|
+
return /* @__PURE__ */ React.createElement(
|
|
66
|
+
FileTrigger,
|
|
67
|
+
{
|
|
68
|
+
acceptedFileTypes,
|
|
69
|
+
allowsMultiple,
|
|
70
|
+
onSelect: onFileTriggerSelect,
|
|
71
|
+
isDisabled
|
|
72
|
+
},
|
|
73
|
+
/* @__PURE__ */ React.createElement(Pressable, { ref: pressableRef, onPress: onFileSelectOpen }, /* @__PURE__ */ React.createElement(
|
|
74
|
+
"div",
|
|
75
|
+
{
|
|
76
|
+
...mergeProps(
|
|
77
|
+
dropProps,
|
|
78
|
+
hoverProps,
|
|
79
|
+
clipboardProps,
|
|
80
|
+
focusProps,
|
|
81
|
+
buttonProps
|
|
82
|
+
),
|
|
83
|
+
...filterDOMProps(otherProps, { global: true }),
|
|
84
|
+
style: { ...styleProps.style },
|
|
85
|
+
className: clsx(
|
|
86
|
+
styles["sapphire-dropzone"],
|
|
87
|
+
styles["js-focus"],
|
|
88
|
+
styles["js-hover"],
|
|
89
|
+
{
|
|
90
|
+
[styles["is-hover"]]: isHovered && !isDropping,
|
|
91
|
+
[styles["is-active"]]: isPressed,
|
|
92
|
+
[styles["is-disabled"]]: isDisabled,
|
|
93
|
+
[styles["is-focus"]]: isFocusVisible,
|
|
94
|
+
[styles["sapphire-dropzone--dropping"]]: isDropping,
|
|
95
|
+
[styles["sapphire-dropzone--error"]]: hasError
|
|
96
|
+
},
|
|
97
|
+
styleProps.className
|
|
98
|
+
),
|
|
99
|
+
"aria-label": ariaLabel,
|
|
100
|
+
"aria-invalid": hasError,
|
|
101
|
+
"aria-describedby": paragraphId
|
|
102
|
+
},
|
|
103
|
+
/* @__PURE__ */ React.createElement("div", { className: clsx(styles["sapphire-dropzone__content"]) }, /* @__PURE__ */ React.createElement("div", { className: clsx(styles["sapphire-dropzone__icon"]) }, /* @__PURE__ */ React.createElement(Icon, { size: "lg" }, /* @__PURE__ */ React.createElement(Upload, null))), /* @__PURE__ */ React.createElement("div", { className: clsx(styles["sapphire-dropzone__heading"]) }, /* @__PURE__ */ React.createElement(Typography.Heading, { level: 6 }, isDropping ? format("dropzone-heading-dropping") : allowsMultiple ? format("dropzone-heading-default") : format("dropzone-heading-default-single"))), /* @__PURE__ */ React.createElement(
|
|
104
|
+
"div",
|
|
105
|
+
{
|
|
106
|
+
id: paragraphId,
|
|
107
|
+
className: clsx(styles["sapphire-dropzone__paragraph"])
|
|
108
|
+
},
|
|
109
|
+
/* @__PURE__ */ React.createElement(Typography.Body, { size: "sm", color: "secondary" }, renderInstruction(isDropping))
|
|
110
|
+
))
|
|
111
|
+
))
|
|
112
|
+
);
|
|
138
113
|
});
|
|
139
114
|
|
|
140
115
|
export { FileDropzone };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FileDropzone.js","sources":["../../../../src/FileDropzone/src/FileDropzone.tsx"],"sourcesContent":["import React, { ForwardedRef } from 'react';\nimport clsx from 'clsx';\nimport {\n Typography,\n Icon,\n SapphireStyleProps,\n useButton,\n useSapphireStyleProps,\n GlobalDomAttributes,\n} from '@danske/sapphire-react';\nimport styles from '@danske/sapphire-css/components/dropzone/dropzone.module.css';\nimport { Upload } from '@danske/sapphire-icons/react';\nimport { HoverProps, Pressable, useHover } from '@react-aria/interactions';\nimport {\n mergeProps,\n useId,\n useObjectRef,\n filterDOMProps,\n} from '@react-aria/utils';\nimport { FileSelectProps, FileTrigger } from './FileTrigger';\nimport { DropOptions, useClipboard, useDrop } from '@react-aria/dnd';\nimport { convertFileListToFileDropItems } from './utils';\nimport { useFocusRing } from '@react-aria/focus';\nimport { AriaLabelingProps } from '@react-types/shared';\nimport { useMessageFormatter } from '@react-aria/i18n';\nimport intlMessages from '../i18n';\n\nexport interface FileDropzoneProps\n extends GlobalDomAttributes,\n SapphireStyleProps,\n Pick<\n DropOptions,\n | 'getDropOperation'\n | 'onDropEnter'\n | 'onDropActivate'\n | 'onDropMove'\n | 'onDropExit'\n | 'onDrop'\n >,\n HoverProps,\n FileSelectProps,\n // TODO when moving to \"core\", use types under `types.ts` instead of plain strings\n Pick<\n AriaLabelingProps,\n 'aria-label' | 'aria-labelledby' | 'aria-describedby' | 'aria-details'\n > {\n /**\n * Whether the dropzone has an error\n * @default false\n */\n hasError?: boolean;\n /**\n * The body text of the dropzone which can contain the instructions for the files to be uploaded.\n * Can be rendered differently based on the `isDropping` parameter, which is true if a file is about to be dropped in the zone.\n * @param isDropping - boolean that marks whether a payload is about to be dropped in the dropzone.\n */\n renderInstruction: (isDropping: boolean) => string;\n /**\n * Function that is called when the file select is opened on press, before any file is selected.\n * @default \"() => null\"\n */\n onFileSelectOpen?: () => void;\n}\n\nexport const FileDropzone = React.forwardRef(function DropzoneWrapper(\n props: FileDropzoneProps,\n forwardedRef: ForwardedRef<HTMLDivElement>\n) {\n const {\n isDisabled = false,\n hasError,\n renderInstruction,\n onFileSelectOpen = () => null,\n acceptedFileTypes,\n allowsMultiple,\n onDrop = () => null,\n getDropOperation = () => 'copy',\n ...otherProps\n } = props;\n\n const id = useId();\n const paragraphId = props['aria-label'] ? undefined : id;\n const format = useMessageFormatter(intlMessages);\n const pressableRef = useObjectRef(forwardedRef);\n const { hoverProps, isHovered } = useHover({ isDisabled });\n const { styleProps } = useSapphireStyleProps(props);\n const { dropProps, isDropTarget: isDropping } = useDrop({\n ...props,\n ref: pressableRef,\n hasDropButton: true,\n isDisabled,\n getDropOperation,\n });\n const { buttonProps, isPressed } = useButton(\n { elementType: 'div' },\n pressableRef as React.RefObject<Element>\n );\n const { focusProps, isFocusVisible } = useFocusRing();\n\n const { clipboardProps } = useClipboard({\n isDisabled,\n onPaste: (items) =>\n onDrop({\n type: 'drop',\n items,\n x: 0,\n y: 0,\n dropOperation: 'copy',\n }),\n });\n\n const ariaLabel: string = props['aria-label'] || 'Dropzone';\n\n const onFileTriggerSelect = (files: FileList | null) => {\n onDrop({\n type: 'drop',\n items: convertFileListToFileDropItems(files),\n x: 0,\n y: 0,\n dropOperation: 'copy',\n });\n };\n\n return (\n <FileTrigger\n acceptedFileTypes={acceptedFileTypes}\n allowsMultiple={allowsMultiple}\n onSelect={onFileTriggerSelect}\n isDisabled={isDisabled}\n >\n <Pressable ref={pressableRef} onPress={onFileSelectOpen}>\n <div\n {...mergeProps(\n dropProps,\n hoverProps,\n clipboardProps,\n focusProps,\n buttonProps\n )}\n {...filterDOMProps(otherProps, { global: true })}\n style={{ ...styleProps.style }}\n className={clsx(\n styles['sapphire-dropzone'],\n styles['js-focus'],\n styles['js-hover'],\n {\n [styles['is-hover']]: isHovered && !isDropping,\n [styles['is-active']]: isPressed,\n [styles['is-disabled']]: isDisabled,\n [styles['is-focus']]: isFocusVisible,\n [styles['sapphire-dropzone--dropping']]: isDropping,\n [styles['sapphire-dropzone--error']]: hasError,\n },\n styleProps.className\n )}\n aria-label={ariaLabel}\n aria-invalid={hasError}\n aria-describedby={paragraphId}\n >\n <div className={clsx(styles['sapphire-dropzone__content'])}>\n <div className={clsx(styles['sapphire-dropzone__icon'])}>\n <Icon size=\"lg\">\n <Upload />\n </Icon>\n </div>\n <div className={clsx(styles['sapphire-dropzone__heading'])}>\n <Typography.Heading level={6}>\n {isDropping\n ? format('dropzone-heading-dropping')\n : allowsMultiple\n ? format('dropzone-heading-default')\n : format('dropzone-heading-default-single')}\n </Typography.Heading>\n </div>\n <div\n id={paragraphId}\n className={clsx(styles['sapphire-dropzone__paragraph'])}\n >\n <Typography.Body size=\"sm\" color=\"secondary\">\n {renderInstruction(isDropping)}\n </Typography.Body>\n </div>\n </div>\n </div>\n </Pressable>\n </FileTrigger>\n );\n});\n"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"FileDropzone.js","sources":["../../../../src/FileDropzone/src/FileDropzone.tsx"],"sourcesContent":["import React, { ForwardedRef } from 'react';\nimport clsx from 'clsx';\nimport {\n Typography,\n Icon,\n SapphireStyleProps,\n useButton,\n useSapphireStyleProps,\n GlobalDomAttributes,\n} from '@danske/sapphire-react';\nimport styles from '@danske/sapphire-css/components/dropzone/dropzone.module.css';\nimport { Upload } from '@danske/sapphire-icons/react';\nimport { HoverProps, Pressable, useHover } from '@react-aria/interactions';\nimport {\n mergeProps,\n useId,\n useObjectRef,\n filterDOMProps,\n} from '@react-aria/utils';\nimport { FileSelectProps, FileTrigger } from './FileTrigger';\nimport { DropOptions, useClipboard, useDrop } from '@react-aria/dnd';\nimport { convertFileListToFileDropItems } from './utils';\nimport { useFocusRing } from '@react-aria/focus';\nimport { AriaLabelingProps } from '@react-types/shared';\nimport { useMessageFormatter } from '@react-aria/i18n';\nimport intlMessages from '../i18n';\n\nexport interface FileDropzoneProps\n extends GlobalDomAttributes,\n SapphireStyleProps,\n Pick<\n DropOptions,\n | 'getDropOperation'\n | 'onDropEnter'\n | 'onDropActivate'\n | 'onDropMove'\n | 'onDropExit'\n | 'onDrop'\n >,\n HoverProps,\n FileSelectProps,\n // TODO when moving to \"core\", use types under `types.ts` instead of plain strings\n Pick<\n AriaLabelingProps,\n 'aria-label' | 'aria-labelledby' | 'aria-describedby' | 'aria-details'\n > {\n /**\n * Whether the dropzone has an error\n * @default false\n */\n hasError?: boolean;\n /**\n * The body text of the dropzone which can contain the instructions for the files to be uploaded.\n * Can be rendered differently based on the `isDropping` parameter, which is true if a file is about to be dropped in the zone.\n * @param isDropping - boolean that marks whether a payload is about to be dropped in the dropzone.\n */\n renderInstruction: (isDropping: boolean) => string;\n /**\n * Function that is called when the file select is opened on press, before any file is selected.\n * @default \"() => null\"\n */\n onFileSelectOpen?: () => void;\n}\n\nexport const FileDropzone = React.forwardRef(function DropzoneWrapper(\n props: FileDropzoneProps,\n forwardedRef: ForwardedRef<HTMLDivElement>\n) {\n const {\n isDisabled = false,\n hasError,\n renderInstruction,\n onFileSelectOpen = () => null,\n acceptedFileTypes,\n allowsMultiple,\n onDrop = () => null,\n getDropOperation = () => 'copy',\n ...otherProps\n } = props;\n\n const id = useId();\n const paragraphId = props['aria-label'] ? undefined : id;\n const format = useMessageFormatter(intlMessages);\n const pressableRef = useObjectRef(forwardedRef);\n const { hoverProps, isHovered } = useHover({ isDisabled });\n const { styleProps } = useSapphireStyleProps(props);\n const { dropProps, isDropTarget: isDropping } = useDrop({\n ...props,\n ref: pressableRef,\n hasDropButton: true,\n isDisabled,\n getDropOperation,\n });\n const { buttonProps, isPressed } = useButton(\n { elementType: 'div' },\n pressableRef as React.RefObject<Element>\n );\n const { focusProps, isFocusVisible } = useFocusRing();\n\n const { clipboardProps } = useClipboard({\n isDisabled,\n onPaste: (items) =>\n onDrop({\n type: 'drop',\n items,\n x: 0,\n y: 0,\n dropOperation: 'copy',\n }),\n });\n\n const ariaLabel: string = props['aria-label'] || 'Dropzone';\n\n const onFileTriggerSelect = (files: FileList | null) => {\n onDrop({\n type: 'drop',\n items: convertFileListToFileDropItems(files),\n x: 0,\n y: 0,\n dropOperation: 'copy',\n });\n };\n\n return (\n <FileTrigger\n acceptedFileTypes={acceptedFileTypes}\n allowsMultiple={allowsMultiple}\n onSelect={onFileTriggerSelect}\n isDisabled={isDisabled}\n >\n <Pressable ref={pressableRef} onPress={onFileSelectOpen}>\n <div\n {...mergeProps(\n dropProps,\n hoverProps,\n clipboardProps,\n focusProps,\n buttonProps\n )}\n {...filterDOMProps(otherProps, { global: true })}\n style={{ ...styleProps.style }}\n className={clsx(\n styles['sapphire-dropzone'],\n styles['js-focus'],\n styles['js-hover'],\n {\n [styles['is-hover']]: isHovered && !isDropping,\n [styles['is-active']]: isPressed,\n [styles['is-disabled']]: isDisabled,\n [styles['is-focus']]: isFocusVisible,\n [styles['sapphire-dropzone--dropping']]: isDropping,\n [styles['sapphire-dropzone--error']]: hasError,\n },\n styleProps.className\n )}\n aria-label={ariaLabel}\n aria-invalid={hasError}\n aria-describedby={paragraphId}\n >\n <div className={clsx(styles['sapphire-dropzone__content'])}>\n <div className={clsx(styles['sapphire-dropzone__icon'])}>\n <Icon size=\"lg\">\n <Upload />\n </Icon>\n </div>\n <div className={clsx(styles['sapphire-dropzone__heading'])}>\n <Typography.Heading level={6}>\n {isDropping\n ? format('dropzone-heading-dropping')\n : allowsMultiple\n ? format('dropzone-heading-default')\n : format('dropzone-heading-default-single')}\n </Typography.Heading>\n </div>\n <div\n id={paragraphId}\n className={clsx(styles['sapphire-dropzone__paragraph'])}\n >\n <Typography.Body size=\"sm\" color=\"secondary\">\n {renderInstruction(isDropping)}\n </Typography.Body>\n </div>\n </div>\n </div>\n </Pressable>\n </FileTrigger>\n );\n});\n"],"names":[],"mappings":"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"}
|
|
@@ -2,76 +2,43 @@ import React from 'react';
|
|
|
2
2
|
import { useObjectRef, filterDOMProps } from '@react-aria/utils';
|
|
3
3
|
import { PressResponder } from '@react-aria/interactions';
|
|
4
4
|
|
|
5
|
-
var __defProp = Object.defineProperty;
|
|
6
|
-
var __defProps = Object.defineProperties;
|
|
7
|
-
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
8
|
-
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
9
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
10
|
-
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
11
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
12
|
-
var __spreadValues = (a, b) => {
|
|
13
|
-
for (var prop in b || (b = {}))
|
|
14
|
-
if (__hasOwnProp.call(b, prop))
|
|
15
|
-
__defNormalProp(a, prop, b[prop]);
|
|
16
|
-
if (__getOwnPropSymbols)
|
|
17
|
-
for (var prop of __getOwnPropSymbols(b)) {
|
|
18
|
-
if (__propIsEnum.call(b, prop))
|
|
19
|
-
__defNormalProp(a, prop, b[prop]);
|
|
20
|
-
}
|
|
21
|
-
return a;
|
|
22
|
-
};
|
|
23
|
-
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
24
|
-
var __objRest = (source, exclude) => {
|
|
25
|
-
var target = {};
|
|
26
|
-
for (var prop in source)
|
|
27
|
-
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
28
|
-
target[prop] = source[prop];
|
|
29
|
-
if (source != null && __getOwnPropSymbols)
|
|
30
|
-
for (var prop of __getOwnPropSymbols(source)) {
|
|
31
|
-
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
|
32
|
-
target[prop] = source[prop];
|
|
33
|
-
}
|
|
34
|
-
return target;
|
|
35
|
-
};
|
|
36
5
|
const HiddenFileInput = React.forwardRef(function InputWrapper(props, ref) {
|
|
37
|
-
return /* @__PURE__ */ React.createElement("input",
|
|
38
|
-
ref,
|
|
39
|
-
type: "file",
|
|
40
|
-
style: { display: "none" }
|
|
41
|
-
}));
|
|
6
|
+
return /* @__PURE__ */ React.createElement("input", { ...props, ref, type: "file", style: { display: "none" } });
|
|
42
7
|
});
|
|
43
8
|
const FileTrigger = React.forwardRef(function FileTriggerWrapper(props, ref) {
|
|
44
|
-
const
|
|
9
|
+
const {
|
|
45
10
|
acceptedFileTypes,
|
|
46
11
|
allowsMultiple = false,
|
|
47
12
|
onSelect = () => null,
|
|
48
13
|
children,
|
|
49
|
-
isDisabled = false
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
"allowsMultiple",
|
|
53
|
-
"onSelect",
|
|
54
|
-
"children",
|
|
55
|
-
"isDisabled"
|
|
56
|
-
]);
|
|
14
|
+
isDisabled = false,
|
|
15
|
+
...rest
|
|
16
|
+
} = props;
|
|
57
17
|
const inputRef = useObjectRef(ref);
|
|
58
18
|
const domProps = filterDOMProps(rest, { global: true });
|
|
59
|
-
return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
inputRef.current
|
|
19
|
+
return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
|
|
20
|
+
PressResponder,
|
|
21
|
+
{
|
|
22
|
+
isDisabled,
|
|
23
|
+
onPress: () => {
|
|
24
|
+
if (inputRef.current) {
|
|
25
|
+
inputRef.current.value = "";
|
|
26
|
+
}
|
|
27
|
+
inputRef.current?.click();
|
|
65
28
|
}
|
|
66
|
-
|
|
29
|
+
},
|
|
30
|
+
children
|
|
31
|
+
), /* @__PURE__ */ React.createElement(
|
|
32
|
+
HiddenFileInput,
|
|
33
|
+
{
|
|
34
|
+
...domProps,
|
|
35
|
+
disabled: isDisabled,
|
|
36
|
+
ref: inputRef,
|
|
37
|
+
accept: acceptedFileTypes?.toString(),
|
|
38
|
+
onChange: (e) => onSelect?.(e.target.files),
|
|
39
|
+
multiple: allowsMultiple
|
|
67
40
|
}
|
|
68
|
-
|
|
69
|
-
disabled: isDisabled,
|
|
70
|
-
ref: inputRef,
|
|
71
|
-
accept: acceptedFileTypes == null ? void 0 : acceptedFileTypes.toString(),
|
|
72
|
-
onChange: (e) => onSelect == null ? void 0 : onSelect(e.target.files),
|
|
73
|
-
multiple: allowsMultiple
|
|
74
|
-
})));
|
|
41
|
+
));
|
|
75
42
|
});
|
|
76
43
|
|
|
77
44
|
export { FileTrigger };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FileTrigger.js","sources":["../../../../src/FileDropzone/src/FileTrigger.tsx"],"sourcesContent":["import React, { ForwardedRef } from 'react';\nimport { filterDOMProps, useObjectRef } from '@react-aria/utils';\nimport { PressResponder } from '@react-aria/interactions';\n\nexport interface FileSelectProps {\n /**\n * List of file types that are allowed to be selected using the file select.\n * When no list is passed, all file types will be allowed to be selected.\n * @default \"\"\n */\n acceptedFileTypes?: string[];\n /**\n * Whether multiple files are allowed to be selected using the file select.\n * @default \"false\"\n */\n allowsMultiple?: boolean;\n}\n\nexport interface FileTriggerProps extends FileSelectProps {\n /**\n * Callback for file selection.\n * @param files - the list of selected files\n * @default \"() => null\"\n */\n onSelect?: (files: FileList | null) => void;\n isDisabled?: boolean;\n children?: React.ReactNode;\n}\n\nconst HiddenFileInput = React.forwardRef(function InputWrapper(\n props: React.HTMLProps<HTMLInputElement>,\n ref: ForwardedRef<HTMLInputElement>\n) {\n return <input {...props} ref={ref} type=\"file\" style={{ display: 'none' }} />;\n});\n\nexport const FileTrigger = React.forwardRef(function FileTriggerWrapper(\n props: FileTriggerProps,\n ref: ForwardedRef<HTMLInputElement>\n) {\n const {\n acceptedFileTypes,\n allowsMultiple = false,\n onSelect = () => null,\n children,\n isDisabled = false,\n ...rest\n } = props;\n const inputRef = useObjectRef(ref);\n const domProps = filterDOMProps(rest, { global: true });\n\n return (\n <>\n <PressResponder\n isDisabled={isDisabled}\n onPress={() => {\n if (inputRef.current) {\n inputRef.current.value = '';\n }\n inputRef.current?.click();\n }}\n >\n {children}\n </PressResponder>\n <HiddenFileInput\n {...domProps}\n disabled={isDisabled}\n ref={inputRef}\n accept={acceptedFileTypes?.toString()}\n onChange={(e) => onSelect?.((e.target as HTMLInputElement).files)}\n multiple={allowsMultiple}\n />\n </>\n );\n});\n"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"FileTrigger.js","sources":["../../../../src/FileDropzone/src/FileTrigger.tsx"],"sourcesContent":["import React, { ForwardedRef } from 'react';\nimport { filterDOMProps, useObjectRef } from '@react-aria/utils';\nimport { PressResponder } from '@react-aria/interactions';\n\nexport interface FileSelectProps {\n /**\n * List of file types that are allowed to be selected using the file select.\n * When no list is passed, all file types will be allowed to be selected.\n * @default \"\"\n */\n acceptedFileTypes?: string[];\n /**\n * Whether multiple files are allowed to be selected using the file select.\n * @default \"false\"\n */\n allowsMultiple?: boolean;\n}\n\nexport interface FileTriggerProps extends FileSelectProps {\n /**\n * Callback for file selection.\n * @param files - the list of selected files\n * @default \"() => null\"\n */\n onSelect?: (files: FileList | null) => void;\n isDisabled?: boolean;\n children?: React.ReactNode;\n}\n\nconst HiddenFileInput = React.forwardRef(function InputWrapper(\n props: React.HTMLProps<HTMLInputElement>,\n ref: ForwardedRef<HTMLInputElement>\n) {\n return <input {...props} ref={ref} type=\"file\" style={{ display: 'none' }} />;\n});\n\nexport const FileTrigger = React.forwardRef(function FileTriggerWrapper(\n props: FileTriggerProps,\n ref: ForwardedRef<HTMLInputElement>\n) {\n const {\n acceptedFileTypes,\n allowsMultiple = false,\n onSelect = () => null,\n children,\n isDisabled = false,\n ...rest\n } = props;\n const inputRef = useObjectRef(ref);\n const domProps = filterDOMProps(rest, { global: true });\n\n return (\n <>\n <PressResponder\n isDisabled={isDisabled}\n onPress={() => {\n if (inputRef.current) {\n inputRef.current.value = '';\n }\n inputRef.current?.click();\n }}\n >\n {children}\n </PressResponder>\n <HiddenFileInput\n {...domProps}\n disabled={isDisabled}\n ref={inputRef}\n accept={acceptedFileTypes?.toString()}\n onChange={(e) => onSelect?.((e.target as HTMLInputElement).files)}\n multiple={allowsMultiple}\n />\n </>\n );\n});\n"],"names":[],"mappings":";;;;AA6BA,MAAM,kBAAkB,KAAA,CAAM,UAAA,CAAW,SAAS,YAAA,CAChD,OACA,GAAA,EACA;AACA,EAAA,uBAAO,KAAA,CAAA,aAAA,CAAC,OAAA,EAAA,EAAO,GAAG,KAAA,EAAO,GAAA,EAAU,IAAA,EAAK,MAAA,EAAO,KAAA,EAAO,EAAE,OAAA,EAAS,MAAA,EAAO,EAAG,CAAA;AAC7E,CAAC,CAAA;AAEM,MAAM,cAAc,KAAA,CAAM,UAAA,CAAW,SAAS,kBAAA,CACnD,OACA,GAAA,EACA;AACA,EAAA,MAAM;AAAA,IACJ,iBAAA;AAAA,IACA,cAAA,GAAiB,KAAA;AAAA,IACjB,WAAW,MAAM,IAAA;AAAA,IACjB,QAAA;AAAA,IACA,UAAA,GAAa,KAAA;AAAA,IACb,GAAG;AAAA,GACL,GAAI,KAAA;AACJ,EAAA,MAAM,QAAA,GAAW,aAAa,GAAG,CAAA;AACjC,EAAA,MAAM,WAAW,cAAA,CAAe,IAAA,EAAM,EAAE,MAAA,EAAQ,MAAM,CAAA;AAEtD,EAAA,uBACE,KAAA,CAAA,aAAA,CAAA,KAAA,CAAA,QAAA,EAAA,IAAA,kBACE,KAAA,CAAA,aAAA;AAAA,IAAC,cAAA;AAAA,IAAA;AAAA,MACC,UAAA;AAAA,MACA,SAAS,MAAM;AACb,QAAA,IAAI,SAAS,OAAA,EAAS;AACpB,UAAA,QAAA,CAAS,QAAQ,KAAA,GAAQ,EAAA;AAAA,QAC3B;AACA,QAAA,QAAA,CAAS,SAAS,KAAA,EAAM;AAAA,MAC1B;AAAA,KAAA;AAAA,IAEC;AAAA,GACH,kBACA,KAAA,CAAA,aAAA;AAAA,IAAC,eAAA;AAAA,IAAA;AAAA,MACE,GAAG,QAAA;AAAA,MACJ,QAAA,EAAU,UAAA;AAAA,MACV,GAAA,EAAK,QAAA;AAAA,MACL,MAAA,EAAQ,mBAAmB,QAAA,EAAS;AAAA,MACpC,UAAU,CAAC,CAAA,KAAM,QAAA,GAAY,CAAA,CAAE,OAA4B,KAAK,CAAA;AAAA,MAChE,QAAA,EAAU;AAAA;AAAA,GAEd,CAAA;AAEJ,CAAC;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"utils.js","sources":["../../../../src/FileDropzone/src/utils.ts"],"sourcesContent":["import { FileDropItem } from '@react-types/shared';\n\nexport const convertFileListToFileDropItems = (\n fileList: FileList | null\n): FileDropItem[] => {\n if (!fileList) {\n return [];\n }\n\n return Array.from(fileList).map((file) => ({\n kind: 'file',\n type: file.type,\n name: file.name,\n getFile: () => Promise.resolve(file),\n getText: () =>\n new Promise<string>((resolve, reject) => {\n const reader = new FileReader();\n reader.onload = () => resolve(reader.result as string);\n reader.onerror = () => reject(reader.error);\n reader.readAsText(file);\n }),\n }));\n};\n"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"utils.js","sources":["../../../../src/FileDropzone/src/utils.ts"],"sourcesContent":["import { FileDropItem } from '@react-types/shared';\n\nexport const convertFileListToFileDropItems = (\n fileList: FileList | null\n): FileDropItem[] => {\n if (!fileList) {\n return [];\n }\n\n return Array.from(fileList).map((file) => ({\n kind: 'file',\n type: file.type,\n name: file.name,\n getFile: () => Promise.resolve(file),\n getText: () =>\n new Promise<string>((resolve, reject) => {\n const reader = new FileReader();\n reader.onload = () => resolve(reader.result as string);\n reader.onerror = () => reject(reader.error);\n reader.readAsText(file);\n }),\n }));\n};\n"],"names":[],"mappings":"AAEO,MAAM,8BAAA,GAAiC,CAC5C,QAAA,KACmB;AACnB,EAAA,IAAI,CAAC,QAAA,EAAU;AACb,IAAA,OAAO,EAAC;AAAA,EACV;AAEA,EAAA,OAAO,MAAM,IAAA,CAAK,QAAQ,CAAA,CAAE,GAAA,CAAI,CAAC,IAAA,MAAU;AAAA,IACzC,IAAA,EAAM,MAAA;AAAA,IACN,MAAM,IAAA,CAAK,IAAA;AAAA,IACX,MAAM,IAAA,CAAK,IAAA;AAAA,IACX,OAAA,EAAS,MAAM,OAAA,CAAQ,OAAA,CAAQ,IAAI,CAAA;AAAA,IACnC,SAAS,MACP,IAAI,OAAA,CAAgB,CAAC,SAAS,MAAA,KAAW;AACvC,MAAA,MAAM,MAAA,GAAS,IAAI,UAAA,EAAW;AAC9B,MAAA,MAAA,CAAO,MAAA,GAAS,MAAM,OAAA,CAAQ,MAAA,CAAO,MAAgB,CAAA;AACrD,MAAA,MAAA,CAAO,OAAA,GAAU,MAAM,MAAA,CAAO,MAAA,CAAO,KAAK,CAAA;AAC1C,MAAA,MAAA,CAAO,WAAW,IAAI,CAAA;AAAA,IACxB,CAAC;AAAA,GACL,CAAE,CAAA;AACJ;;;;"}
|