@aws-amplify/ui-react 6.5.1 → 6.5.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.
@@ -280,6 +280,7 @@ const getCSSVariableIfValueIsThemeKey = (propKey, value, tokens) => {
280
280
  };
281
281
 
282
282
  // Inspiration for getMediaQueries and useBreakpoint
283
+ // comes from https://github.com/iiroj/use-breakpoint/
283
284
  const getMediaQueries = ({ breakpoints }) => {
284
285
  const sortedBreakpoints = objectKeys(breakpoints).sort((a, b) => breakpoints[b] - breakpoints[a]);
285
286
  return sortedBreakpoints.map((breakpoint, index) => {
@@ -306,6 +307,7 @@ const getMediaQueries = ({ breakpoints }) => {
306
307
  };
307
308
 
308
309
  // Inspiration for getMediaQueries and useBreakpoint
310
+ // comes from https://github.com/iiroj/use-breakpoint/
309
311
  const useIsomorphicEffect = typeof window === 'undefined' ? React__namespace.useEffect : React__namespace.useLayoutEffect;
310
312
  const useBreakpoint = ({ breakpoints, defaultBreakpoint, }) => {
311
313
  const supportMatchMedia = typeof window !== 'undefined' && typeof window.matchMedia !== 'undefined';
@@ -908,99 +910,6 @@ const AlertIcon = ({ variation, ariaHidden, ariaLabel, role, }) => {
908
910
  };
909
911
  AlertIcon.displayName = 'AlertIcon';
910
912
 
911
- function filterAllowedFiles(files, acceptedFileTypes) {
912
- // Allow any files if acceptedFileTypes is undefined, empty array, or contains '*'
913
- if (!acceptedFileTypes ||
914
- acceptedFileTypes.length === 0 ||
915
- acceptedFileTypes.includes('*')) {
916
- return { acceptedFiles: files, rejectedFiles: [] };
917
- }
918
- const acceptedFiles = [];
919
- const rejectedFiles = [];
920
- function filterFile(file) {
921
- const { type = '', name = '' } = file;
922
- const mimeType = type.toLowerCase();
923
- const baseMimeType = mimeType.split('/')[0];
924
- return acceptedFileTypes.some((type) => {
925
- const validType = type.trim().toLowerCase();
926
- // if the accepted file type is a file extension
927
- // it will start with '.', check against the file name
928
- if (validType.charAt(0) === '.') {
929
- return name.toLowerCase().endsWith(validType);
930
- }
931
- // This is something like a image/* mime type
932
- if (validType.endsWith('/*')) {
933
- return baseMimeType === validType.split('/')[0];
934
- }
935
- return mimeType === validType;
936
- });
937
- }
938
- files.forEach((file) => {
939
- (filterFile(file) ? acceptedFiles : rejectedFiles).push(file);
940
- });
941
- return { acceptedFiles, rejectedFiles };
942
- }
943
-
944
- function useDropZone({ onDropComplete, onDragEnter: _onDragEnter, onDragLeave: _onDragLeave, onDragOver: _onDragOver, onDragStart: _onDragStart, onDrop: _onDrop, acceptedFileTypes = [], }) {
945
- const [dragState, setDragState] = React.useState('inactive');
946
- const onDragStart = (event) => {
947
- event.dataTransfer.clearData();
948
- if (ui.isFunction(_onDragStart)) {
949
- _onDragStart(event);
950
- }
951
- };
952
- const onDragEnter = (event) => {
953
- event.preventDefault();
954
- event.stopPropagation();
955
- if (ui.isFunction(_onDragEnter)) {
956
- _onDragEnter(event);
957
- }
958
- };
959
- const onDragLeave = (event) => {
960
- event.preventDefault();
961
- event.stopPropagation();
962
- setDragState('inactive');
963
- if (ui.isFunction(_onDragLeave)) {
964
- _onDragLeave(event);
965
- }
966
- };
967
- const onDragOver = (event) => {
968
- event.preventDefault();
969
- event.stopPropagation();
970
- event.dataTransfer.dropEffect = 'copy';
971
- if (ui.isFunction(_onDragOver)) {
972
- _onDragOver(event);
973
- }
974
- const files = Array.from(event.dataTransfer.items).map(({ kind, type }) => ({
975
- kind,
976
- type,
977
- }));
978
- const { rejectedFiles } = filterAllowedFiles(files, acceptedFileTypes);
979
- setDragState(rejectedFiles.length > 0 ? 'reject' : 'accept');
980
- };
981
- const onDrop = (event) => {
982
- event.preventDefault();
983
- event.stopPropagation();
984
- setDragState('inactive');
985
- const files = Array.from(event.dataTransfer.files);
986
- const { acceptedFiles, rejectedFiles } = filterAllowedFiles(files, acceptedFileTypes);
987
- if (ui.isFunction(_onDrop)) {
988
- _onDrop(event);
989
- }
990
- if (ui.isFunction(onDropComplete)) {
991
- onDropComplete({ acceptedFiles, rejectedFiles });
992
- }
993
- };
994
- return {
995
- onDragStart,
996
- onDragEnter,
997
- onDragLeave,
998
- onDragOver,
999
- onDrop,
1000
- dragState,
1001
- };
1002
- }
1003
-
1004
913
  const FieldGroupIconPrimitive = ({ className, children, isVisible = true, excludeFromTabOrder = false, ...rest }, ref) => {
1005
914
  return isVisible ? (React__namespace.createElement(View, { className: ui.classNames(ui.ComponentClassName.FieldGroupIcon, className), ref: ref, tabIndex: excludeFromTabOrder ? -1 : undefined, ...rest }, children)) : null;
1006
915
  };
@@ -1201,7 +1110,6 @@ exports.useAuth = useAuth;
1201
1110
  exports.useBreakpoint = useBreakpoint;
1202
1111
  exports.useColorMode = useColorMode;
1203
1112
  exports.useDeprecationWarning = useDeprecationWarning;
1204
- exports.useDropZone = useDropZone;
1205
1113
  exports.useFieldset = useFieldset;
1206
1114
  exports.useIcons = useIcons;
1207
1115
  exports.useStyles = useStyles;
@@ -3,6 +3,7 @@ export { useStorageURL } from './hooks/useStorageURL.mjs';
3
3
  export { useThemeBreakpoint } from './hooks/useThemeBreakpoint.mjs';
4
4
  export { useDeprecationWarning } from './hooks/useDeprecationWarning.mjs';
5
5
  export { useColorMode } from './hooks/useTheme.mjs';
6
+ export { useDropZone } from '@aws-amplify/ui-react-core';
6
7
  export { FilterChildren } from './components/FilterChildren/FilterChildren.mjs';
7
8
  export { AlertIcon } from './primitives/Alert/AlertIcon.mjs';
8
9
  export { IconAdd } from './primitives/Icon/icons/IconAdd.mjs';
@@ -31,7 +32,6 @@ export { IconVisibilityOff } from './primitives/Icon/icons/IconVisibilityOff.mjs
31
32
  export { IconVisibility } from './primitives/Icon/icons/IconVisibility.mjs';
32
33
  export { IconWarning } from './primitives/Icon/icons/IconWarning.mjs';
33
34
  export { useIcons } from './primitives/Icon/context/useIcons.mjs';
34
- export { useDropZone } from './primitives/DropZone/useDropZone.mjs';
35
35
  import './primitives/Field/FieldClearButton.mjs';
36
36
  import './primitives/Field/FieldDescription.mjs';
37
37
  import './primitives/Field/FieldErrorMessage.mjs';
@@ -1,5 +1,5 @@
1
1
  import * as React from 'react';
2
- import { classNames, ComponentClassName, isTypedFunction } from '@aws-amplify/ui';
2
+ import { classNames, ComponentClassName, isFunction } from '@aws-amplify/ui';
3
3
  import { primitiveWithForwardRef } from '../utils/primitiveWithForwardRef.mjs';
4
4
  import { View } from '../View/View.mjs';
5
5
  import { AccordionContext, AccordionItemContext } from './AccordionContext.mjs';
@@ -8,7 +8,7 @@ const AccordionTriggerPrimitive = ({ children, className, ...rest }, ref) => {
8
8
  const context = React.useContext(AccordionContext);
9
9
  const value = React.useContext(AccordionItemContext);
10
10
  const handleOnClick = (e) => {
11
- if (isTypedFunction(rest.onClick)) {
11
+ if (isFunction(rest.onClick)) {
12
12
  rest.onClick(e);
13
13
  }
14
14
  if (context?.setValue && value) {
@@ -1,5 +1,5 @@
1
1
  import * as React from 'react';
2
- import { useDropZone } from './useDropZone.mjs';
2
+ import { useDropZone } from '@aws-amplify/ui-react-core';
3
3
  import { DropZoneProvider } from './DropZoneProvider.mjs';
4
4
  import { DropZoneContainer } from './DropZoneContainer.mjs';
5
5
  import { primitiveWithForwardRef } from '../utils/primitiveWithForwardRef.mjs';
@@ -1,5 +1,5 @@
1
1
  import * as React from 'react';
2
- import { classNames, ComponentClassName, classNameModifierByFlag, isTypedFunction } from '@aws-amplify/ui';
2
+ import { classNames, ComponentClassName, classNameModifierByFlag, isFunction } from '@aws-amplify/ui';
3
3
  import { View } from '../View/View.mjs';
4
4
  import { primitiveWithForwardRef } from '../utils/primitiveWithForwardRef.mjs';
5
5
  import { TabsContext } from './TabsContext.mjs';
@@ -13,7 +13,7 @@ const TabsItemPrimitive = ({ className, value, children, onClick, as = 'button',
13
13
  }
14
14
  const isActive = activeTab === value;
15
15
  const handleOnClick = (e) => {
16
- if (isTypedFunction(onClick)) {
16
+ if (isFunction(onClick)) {
17
17
  onClick?.(e);
18
18
  }
19
19
  setActiveTab(value);
@@ -1,6 +1,7 @@
1
1
  import { objectKeys } from '../utils.mjs';
2
2
 
3
3
  // Inspiration for getMediaQueries and useBreakpoint
4
+ // comes from https://github.com/iiroj/use-breakpoint/
4
5
  const getMediaQueries = ({ breakpoints }) => {
5
6
  const sortedBreakpoints = objectKeys(breakpoints).sort((a, b) => breakpoints[b] - breakpoints[a]);
6
7
  return sortedBreakpoints.map((breakpoint, index) => {
@@ -2,6 +2,7 @@ import * as React from 'react';
2
2
  import { getMediaQueries } from './getMediaQueries.mjs';
3
3
 
4
4
  // Inspiration for getMediaQueries and useBreakpoint
5
+ // comes from https://github.com/iiroj/use-breakpoint/
5
6
  const useIsomorphicEffect = typeof window === 'undefined' ? React.useEffect : React.useLayoutEffect;
6
7
  const useBreakpoint = ({ breakpoints, defaultBreakpoint, }) => {
7
8
  const supportMatchMedia = typeof window !== 'undefined' && typeof window.matchMedia !== 'undefined';
@@ -1,3 +1,3 @@
1
- const VERSION = '6.5.1';
1
+ const VERSION = '6.5.2';
2
2
 
3
3
  export { VERSION };