@aws-amplify/ui-react 5.3.2 → 6.0.0

package/dist/esm/components/ThemeProvider/ThemeProvider.mjs

@@ -1 +1,23 @@
-import*as e from"react";import*as t from"@radix-ui/react-direction";import{sanitizeNamespaceImport as r,createTheme as o}from"@aws-amplify/ui";import{AmplifyContext as i}from"./AmplifyContext.mjs";const{DirectionProvider:m}=r(t);function n({children:t,colorMode:r,direction:n="ltr",nonce:a,theme:l}){const c=e.useMemo((()=>({theme:o(l)})),[l]),{theme:{name:d,cssText:s}}=c;return e.createElement(i.Provider,{value:c},e.createElement(m,{dir:n},e.createElement("div",{"data-amplify-theme":d,"data-amplify-color-mode":r,dir:n},t),void 0===l||/<\/style/i.test(s)?null:e.createElement("style",{id:`amplify-theme-${d}`,dangerouslySetInnerHTML:{__html:s},nonce:a})))}const a=n;export{n as AmplifyProvider,a as ThemeProvider};
+import * as React from 'react';
+import * as RadixDirection from '@radix-ui/react-direction';
+import { sanitizeNamespaceImport, createTheme } from '@aws-amplify/ui';
+import { ThemeContext } from './ThemeContext.mjs';
+
+// Radix packages don't support ESM in Node, in some scenarios(e.g. SSR)
+// We have to use namespace import and sanitize it to ensure the interoperablity between ESM and CJS
+const { DirectionProvider } = sanitizeNamespaceImport(RadixDirection);
+/**
+ * [📖 Docs](https://ui.docs.amplify.aws/react/theming)
+ */
+function ThemeProvider({ children, colorMode, direction = 'ltr', nonce, theme, }) {
+    const value = React.useMemo(() => ({ theme: createTheme(theme) }), [theme]);
+    const { theme: { name, cssText }, } = value;
+    return (React.createElement(ThemeContext.Provider, { value: value },
+        React.createElement(DirectionProvider, { dir: direction },
+            React.createElement("div", { "data-amplify-theme": name, "data-amplify-color-mode": colorMode, dir: direction }, children),
+            typeof theme === 'undefined' || /<\/style/i.test(cssText) ? null : (React.createElement("style", { id: `amplify-theme-${name}`, 
+                // eslint-disable-next-line react/no-danger
+                dangerouslySetInnerHTML: { __html: cssText }, nonce: nonce })))));
+}
+
+export { ThemeProvider };

package/dist/esm/components/index.mjs

@@ -1 +1,5 @@
-export{default as AccountSettings}from"./AccountSettings/AccountSettings.mjs";export{Authenticator}from"./Authenticator/Authenticator.mjs";export{withAuthenticator}from"./Authenticator/withAuthenticator.mjs";export{useAuthenticator}from"@aws-amplify/ui-react-core";export{FileUploader}from"./Storage/FileUploader/FileUploader.mjs";export{AmplifyProvider,ThemeProvider}from"./ThemeProvider/ThemeProvider.mjs";
+export { default as AccountSettings } from './AccountSettings/AccountSettings.mjs';
+export { Authenticator } from './Authenticator/Authenticator.mjs';
+export { withAuthenticator } from './Authenticator/withAuthenticator.mjs';
+export { useAuthenticator } from '@aws-amplify/ui-react-core';
+export { ThemeProvider } from './ThemeProvider/ThemeProvider.mjs';

package/dist/esm/components/shared/ValidationErrors.mjs

@@ -1 +1,15 @@
-import r from"react";import{translate as e}from"@aws-amplify/ui";import{View as t}from"../../primitives/View/View.mjs";import{Text as i}from"../../primitives/Text/Text.mjs";const m=({errors:m,id:o,dataAttr:a})=>{if(!((null==m?void 0:m.length)>0))return null;const n=a?{[a]:!0}:{};return r.createElement(t,Object.assign({},n,{id:o}),m.map((t=>r.createElement(i,{key:t,role:"alert",variation:"error"},e(t)))))};export{m as ValidationErrors};
+import React__default from 'react';
+import { translate } from '@aws-amplify/ui';
+import { View } from '../../primitives/View/View.mjs';
+import { Text } from '../../primitives/Text/Text.mjs';
+
+const ValidationErrors = ({ errors, id, dataAttr, }) => {
+    if (!(errors?.length > 0))
+        return null;
+    const dataAttrProp = dataAttr ? { [dataAttr]: true } : {};
+    return (React__default.createElement(View, { ...dataAttrProp, id: id }, errors.map((error) => {
+        return (React__default.createElement(Text, { key: error, role: "alert", variation: "error" }, translate(error)));
+    })));
+};
+
+export { ValidationErrors };

package/dist/esm/helpers/utils.mjs

@@ -1 +1,6 @@
-const r=r=>"object"==typeof r&&null!==r&&"message"in r&&"string"==typeof r.message,e=e=>{if(r(e))return e;try{return new Error(JSON.stringify(e))}catch(r){return new Error(String(e))}},t=r=>e(r).message,n=r=>{const e=new FormData(r.target);return Object.fromEntries(e)};export{t as getErrorMessage,n as getFormDataFromEvent,r as isErrorWithMessage,e as toErrorWithMessage};
+const getFormDataFromEvent = (event) => {
+    const formData = new FormData(event.target);
+    return Object.fromEntries(formData);
+};
+
+export { getFormDataFromEvent };

package/dist/esm/hooks/useAuth.mjs

@@ -1 +1,73 @@
-import{__awaiter as e}from"tslib";import*as s from"react";import{Hub as a}from"@aws-amplify/core";import{Auth as i}from"aws-amplify";const r=()=>{const[r,t]=s.useState({error:void 0,isLoading:!0,user:void 0}),o=s.useCallback((()=>e(void 0,void 0,void 0,(function*(){t((e=>Object.assign(Object.assign({},e),{isLoading:!0})));try{const e=yield i.currentAuthenticatedUser();t({user:e,isLoading:!1})}catch(e){t({error:e,isLoading:!1})}}))),[]),n=s.useCallback((({payload:e})=>{switch(e.event){case"signIn":case"signUp":case"autoSignIn":t({user:e.data,isLoading:!1});break;case"signOut":t({user:void 0,isLoading:!1});break;case"tokenRefresh_failure":case"signIn_failure":t({error:e.data,isLoading:!1});break;case"autoSignIn_failure":t({error:new Error(e.message),isLoading:!1});break;case"tokenRefresh":o()}}),[o]);return s.useEffect((()=>{const e=a.listen("auth",n,"useAuth");return o(),e}),[n,o]),Object.assign(Object.assign({},r),{fetch:o})};export{r as useAuth};
+import * as React from 'react';
+import { Hub } from '@aws-amplify/core';
+import { getCurrentUser } from 'aws-amplify/auth';
+
+/**
+ * Amplify Auth React hook
+ * @internal
+ */
+const useAuth = () => {
+    const [result, setResult] = React.useState({
+        error: undefined,
+        isLoading: true,
+        user: undefined,
+    });
+    /**
+     * Hub events like `tokenRefresh` will not give back the user object.
+     * This util will be used to get current user after those events.
+     */
+    const fetchCurrentUser = React.useCallback(async () => {
+        setResult((prevResult) => ({ ...prevResult, isLoading: true }));
+        try {
+            const user = await getCurrentUser();
+            setResult({ user, isLoading: false });
+        }
+        catch (e) {
+            const error = e;
+            setResult({ error, isLoading: false });
+        }
+    }, []);
+    const handleAuth = React.useCallback(({ payload }) => {
+        switch (payload.event) {
+            // success events
+            case 'signedIn':
+            case 'signUp':
+            case 'autoSignIn': {
+                setResult({ user: payload.data, isLoading: false });
+                break;
+            }
+            case 'signedOut': {
+                setResult({ user: undefined, isLoading: false });
+                break;
+            }
+            // failure events
+            case 'tokenRefresh_failure':
+            case 'signIn_failure': {
+                setResult({ error: payload.data, isLoading: false });
+                break;
+            }
+            case 'autoSignIn_failure': {
+                // autoSignIn just returns error message. Wrap it to an Error object
+                setResult({ error: new Error(payload.message), isLoading: false });
+                break;
+            }
+            // events that need another fetch
+            case 'tokenRefresh': {
+                fetchCurrentUser();
+                break;
+            }
+        }
+    }, [fetchCurrentUser]);
+    React.useEffect(() => {
+        const unsubscribe = Hub.listen('auth', handleAuth, 'useAuth');
+        fetchCurrentUser(); // on init, see if user is already logged in
+        return unsubscribe;
+    }, [handleAuth, fetchCurrentUser]);
+    return {
+        ...result,
+        /** @deprecated Fetch is handled automatically, do not use this directly */
+        fetch: fetchCurrentUser,
+    };
+};
+
+export { useAuth };

package/dist/esm/hooks/useBreakpointValue.mjs

@@ -1 +1,29 @@
-import{getValueAtCurrentBreakpoint as e}from"../primitives/shared/responsive/utils.mjs";import{useBreakpoint as r}from"../primitives/shared/responsive/useBreakpoint.mjs";import{useTheme as s}from"./useTheme.mjs";import{getStyleValue as i}from"../primitives/shared/getStyleValue.mjs";import{isDesignToken as o,isString as t}from"@aws-amplify/ui";const p=(p,m="base",a)=>{const{breakpoints:{values:n},tokens:u}=s(),k=r({breakpoints:n,defaultBreakpoint:m}),l=e({breakpoint:k,breakpoints:n,values:p});return o(l)||t(l)?i({value:l,propKey:a,tokens:u}):l};export{p as useBreakpointValue};
+import { getValueAtCurrentBreakpoint } from '../primitives/shared/responsive/utils.mjs';
+import { useBreakpoint } from '../primitives/shared/responsive/useBreakpoint.mjs';
+import { useTheme } from './useTheme.mjs';
+import { getStyleValue } from '../primitives/shared/getStyleValue.mjs';
+import { isDesignToken, isString } from '@aws-amplify/ui';
+
+/**
+ * [📖 Docs](https://ui.docs.amplify.aws/react/theming/responsive#usebreakpointvalue)
+ */
+const useBreakpointValue = (values, defaultBreakpoint = 'base', propKey) => {
+    const { breakpoints: { values: breakpoints }, tokens, } = useTheme();
+    const breakpoint = useBreakpoint({
+        breakpoints,
+        defaultBreakpoint,
+    });
+    const value = getValueAtCurrentBreakpoint({
+        breakpoint,
+        breakpoints,
+        values,
+    });
+    if (isDesignToken(value) || isString(value)) {
+        return getStyleValue({ value, propKey, tokens });
+    }
+    else {
+        return value;
+    }
+};
+
+export { useBreakpointValue };

package/dist/esm/hooks/useComposeRefsCallback.mjs

@@ -1 +1,20 @@
-import*as r from"react";import{isFunction as e}from"@aws-amplify/ui";function t({externalRef:t,internalRef:a}){return r.useCallback((r=>{e(t)?t(r):t&&(t.current=r),a.current=r}),[t,a])}export{t as useComposeRefsCallback};
+import * as React from 'react';
+import { isFunction } from '@aws-amplify/ui';
+
+/**
+ *  Creates ref callback to compose together external and internal refs
+ */
+function useComposeRefsCallback({ externalRef, internalRef, }) {
+    return React.useCallback((node) => {
+        // Handle callback ref
+        if (isFunction(externalRef)) {
+            externalRef(node);
+        }
+        else if (externalRef) {
+            externalRef.current = node;
+        }
+        internalRef.current = node;
+    }, [externalRef, internalRef]);
+}
+
+export { useComposeRefsCallback };

package/dist/esm/hooks/useDeprecationWarning.mjs

@@ -1 +1,15 @@
-import{useDeprecationWarning as e}from"@aws-amplify/ui-react-core";const s=({message:s,shouldWarn:o})=>{const r=o&&("undefined"==typeof process||process&&"production"!==process.env.NODE_ENV);e({message:s,shouldWarn:r})};export{s as useDeprecationWarning};
+import { useDeprecationWarning as useDeprecationWarning$1 } from '@aws-amplify/ui-react-core';
+
+/**
+ * Logs a deprecation warning `message` to the console.
+ */
+const useDeprecationWarning = ({ message, shouldWarn: _shouldWarn, }) => {
+    const shouldWarn = _shouldWarn &&
+        // show message on builds without Node `process` polyfill
+        // or with process.env.NODE_ENV not production
+        (typeof process === 'undefined' ||
+            (process && process.env.NODE_ENV !== 'production'));
+    useDeprecationWarning$1({ message, shouldWarn });
+};
+
+export { useDeprecationWarning };

package/dist/esm/hooks/useStorageURL.mjs

@@ -1 +1,40 @@
-import*as r from"react";import{isFunction as t}from"@aws-amplify/ui";import{useHasValueUpdated as o}from"@aws-amplify/ui-react-core";import{Storage as e}from"@aws-amplify/storage";const a=({key:a,options:c,fallbackURL:f,onStorageGetError:i})=>{const[m,s]=r.useState(),n=o(a);return r.useEffect((()=>{if(!n)return;const r=e.get(a,c).then((r=>s(r))).catch((r=>{t(i)&&i(r),f&&s(f)}));return()=>e.cancel(r)}),[a,c,f,i,n]),m};export{a as useStorageURL};
+import * as React from 'react';
+import * as Storage from 'aws-amplify/storage';
+import { isFunction } from '@aws-amplify/ui';
+import { useHasValueUpdated } from '@aws-amplify/ui-react-core';
+
+const useStorageURL = ({ key, options, fallbackURL, onStorageGetError, }) => {
+    const [url, setURL] = React.useState();
+    const hasKeyUpdated = useHasValueUpdated(key);
+    React.useEffect(() => {
+        if (!hasKeyUpdated) {
+            return;
+        }
+        let ignore = false;
+        const input = { key, options };
+        Storage.getUrl(input)
+            .then(({ url }) => {
+            if (ignore) {
+                return;
+            }
+            setURL(url.toString());
+        })
+            .catch((error) => {
+            if (ignore) {
+                return;
+            }
+            if (isFunction(onStorageGetError)) {
+                onStorageGetError(error);
+            }
+            if (fallbackURL) {
+                setURL(fallbackURL);
+            }
+            return () => {
+                ignore = true;
+            };
+        });
+    }, [key, options, fallbackURL, onStorageGetError, hasKeyUpdated]);
+    return url;
+};
+
+export { useStorageURL };

package/dist/esm/hooks/useTheme.mjs

@@ -1 +1,23 @@
-import*as o from"react";import{createTheme as t}from"@aws-amplify/ui";import{AmplifyContext as e}from"../components/ThemeProvider/AmplifyContext.mjs";const m=o=>void 0===o||void 0===o.theme?t():o.theme,r=()=>{const t=o.useContext(e);return m(t)};export{m as getThemeFromContext,r as useTheme};
+import * as React from 'react';
+import { createTheme } from '@aws-amplify/ui';
+import { ThemeContext } from '../components/ThemeProvider/ThemeContext.mjs';
+
+/**
+ * Get current Theme object value from Amplify context.
+ * Returns a default theme if context is not available
+ */
+const getThemeFromContext = (context) => {
+    if (typeof context === 'undefined' || typeof context.theme === 'undefined') {
+        return createTheme();
+    }
+    return context.theme;
+};
+/**
+ * [📖 Docs](https://ui.docs.amplify.aws/react/theming)
+ */
+const useTheme = () => {
+    const context = React.useContext(ThemeContext);
+    return getThemeFromContext(context);
+};
+
+export { getThemeFromContext, useTheme };

package/dist/esm/hooks/useThemeBreakpoint.mjs

@@ -1 +1,19 @@
-import{useTheme as e}from"./useTheme.mjs";import{useBreakpoint as r}from"../primitives/shared/responsive/useBreakpoint.mjs";const t=()=>{const{breakpoints:{values:t,defaultBreakpoint:o}}=e();return r({breakpoints:t,defaultBreakpoint:o})};export{t as useThemeBreakpoint};
+import { useTheme } from './useTheme.mjs';
+import { useBreakpoint } from '../primitives/shared/responsive/useBreakpoint.mjs';
+
+/**
+ * @internal For internal Amplify UI use only. May be removed in a future release.
+ *
+ * Hook to get the current breakpoint of the provided theme.
+ * @returns {Breakpoint}
+ */
+const useThemeBreakpoint = () => {
+    const { breakpoints: { values: breakpoints, defaultBreakpoint }, } = useTheme();
+    const breakpoint = useBreakpoint({
+        breakpoints,
+        defaultBreakpoint,
+    });
+    return breakpoint;
+};
+
+export { useThemeBreakpoint };

package/dist/esm/index.mjs

@@ -1 +1,71 @@
-import*as e from"./components/index.mjs";export{e as components};export{useAmplify}from"./hooks/useAmplify.mjs";export{useTheme}from"./hooks/useTheme.mjs";export{useBreakpointValue}from"./hooks/useBreakpointValue.mjs";import*as i from"./primitives/index.mjs";export{i as primitives};export{createTheme,defaultDarkModeOverride,defaultTheme,translations}from"@aws-amplify/ui";export{default as AccountSettings}from"./components/AccountSettings/AccountSettings.mjs";export{Authenticator}from"./components/Authenticator/Authenticator.mjs";export{withAuthenticator}from"./components/Authenticator/withAuthenticator.mjs";export{useAuthenticator}from"@aws-amplify/ui-react-core";export{FileUploader}from"./components/Storage/FileUploader/FileUploader.mjs";export{AmplifyProvider,ThemeProvider}from"./components/ThemeProvider/ThemeProvider.mjs";export{IconsProvider}from"./primitives/Icon/context/IconsProvider.mjs";export{Alert}from"./primitives/Alert/Alert.mjs";export{Autocomplete}from"./primitives/Autocomplete/Autocomplete.mjs";export{Badge}from"./primitives/Badge/Badge.mjs";export{Breadcrumbs}from"./primitives/Breadcrumbs/Breadcrumbs.mjs";export{Button}from"./primitives/Button/Button.mjs";export{ButtonGroup}from"./primitives/ButtonGroup/ButtonGroup.mjs";export{Card}from"./primitives/Card/Card.mjs";export{CheckboxField}from"./primitives/CheckboxField/CheckboxField.mjs";export{Collection}from"./primitives/Collection/Collection.mjs";export{Divider}from"./primitives/Divider/Divider.mjs";export{DropZone}from"./primitives/DropZone/DropZone.mjs";export{Expander}from"./primitives/Expander/Expander.mjs";export{ExpanderItem}from"./primitives/Expander/ExpanderItem.mjs";export{FieldGroupIcon}from"./primitives/FieldGroupIcon/FieldGroupIcon.mjs";export{FieldGroupIconButton}from"./primitives/FieldGroupIcon/FieldGroupIconButton.mjs";export{Fieldset}from"./primitives/Fieldset/Fieldset.mjs";export{Flex}from"./primitives/Flex/Flex.mjs";export{Grid}from"./primitives/Grid/Grid.mjs";export{Heading}from"./primitives/Heading/Heading.mjs";export{HighlightMatch}from"./primitives/HighlightMatch/HighlightMatch.mjs";export{Icon}from"./primitives/Icon/Icon.mjs";export{Image}from"./primitives/Image/Image.mjs";export{Input}from"./primitives/Input/Input.mjs";export{Label}from"./primitives/Label/Label.mjs";export{Link}from"./primitives/Link/Link.mjs";export{Loader}from"./primitives/Loader/Loader.mjs";export{Menu}from"./primitives/Menu/Menu.mjs";export{MenuButton}from"./primitives/Menu/MenuButton.mjs";export{MenuItem}from"./primitives/Menu/MenuItem.mjs";export{Message}from"./primitives/Message/Message.mjs";export{Pagination}from"./primitives/Pagination/Pagination.mjs";export{PasswordField}from"./primitives/PasswordField/PasswordField.mjs";export{PhoneNumberField}from"./primitives/PhoneNumberField/PhoneNumberField.mjs";export{Placeholder}from"./primitives/Placeholder/Placeholder.mjs";export{Radio}from"./primitives/Radio/Radio.mjs";export{RadioGroupField}from"./primitives/RadioGroupField/RadioGroupField.mjs";export{Rating}from"./primitives/Rating/Rating.mjs";export{ScrollView}from"./primitives/ScrollView/ScrollView.mjs";export{SearchField}from"./primitives/SearchField/SearchField.mjs";export{SelectField}from"./primitives/SelectField/SelectField.mjs";export{SliderField}from"./primitives/SliderField/SliderField.mjs";export{StepperField}from"./primitives/StepperField/StepperField.mjs";export{SwitchField}from"./primitives/SwitchField/SwitchField.mjs";export{TabItem,Tabs}from"./primitives/Tabs/Tabs.mjs";export{Text}from"./primitives/Text/Text.mjs";export{TextAreaField}from"./primitives/TextAreaField/TextAreaField.mjs";export{TextField}from"./primitives/TextField/TextField.mjs";export{ToggleButton}from"./primitives/ToggleButton/ToggleButton.mjs";export{ToggleButtonGroup}from"./primitives/ToggleButtonGroup/ToggleButtonGroup.mjs";export{View}from"./primitives/View/View.mjs";export{VisuallyHidden}from"./primitives/VisuallyHidden/VisuallyHidden.mjs";export{Table}from"./primitives/Table/Table.mjs";export{TableBody}from"./primitives/Table/TableBody.mjs";export{TableCell}from"./primitives/Table/TableCell.mjs";export{TableFoot}from"./primitives/Table/TableFoot.mjs";export{TableHead}from"./primitives/Table/TableHead.mjs";export{TableRow}from"./primitives/Table/TableRow.mjs";export{usePagination}from"./primitives/Pagination/usePagination.mjs";export{ComponentClassNames,ComponentClassObject}from"./primitives/shared/constants.mjs";export{ComponentPropsToStylePropsMap,ComponentPropsToStylePropsMapKeys}from"./primitives/types/style.mjs";
+import * as index from './components/index.mjs';
+export { index as components };
+export { useTheme } from './hooks/useTheme.mjs';
+export { useBreakpointValue } from './hooks/useBreakpointValue.mjs';
+import * as index$1 from './primitives/index.mjs';
+export { index$1 as primitives };
+export { createTheme, defaultDarkModeOverride, defaultTheme, translations } from '@aws-amplify/ui';
+export { default as AccountSettings } from './components/AccountSettings/AccountSettings.mjs';
+export { Authenticator } from './components/Authenticator/Authenticator.mjs';
+export { withAuthenticator } from './components/Authenticator/withAuthenticator.mjs';
+export { useAuthenticator } from '@aws-amplify/ui-react-core';
+export { ThemeProvider } from './components/ThemeProvider/ThemeProvider.mjs';
+export { IconsProvider } from './primitives/Icon/context/IconsProvider.mjs';
+export { Alert } from './primitives/Alert/Alert.mjs';
+export { Autocomplete } from './primitives/Autocomplete/Autocomplete.mjs';
+export { Badge } from './primitives/Badge/Badge.mjs';
+export { Breadcrumbs } from './primitives/Breadcrumbs/Breadcrumbs.mjs';
+export { Button } from './primitives/Button/Button.mjs';
+export { ButtonGroup } from './primitives/ButtonGroup/ButtonGroup.mjs';
+export { Card } from './primitives/Card/Card.mjs';
+export { CheckboxField } from './primitives/CheckboxField/CheckboxField.mjs';
+export { Collection } from './primitives/Collection/Collection.mjs';
+export { Divider } from './primitives/Divider/Divider.mjs';
+export { DropZone } from './primitives/DropZone/DropZone.mjs';
+export { Accordion } from './primitives/Accordion/Accordion.mjs';
+export { FieldGroupIcon } from './primitives/FieldGroupIcon/FieldGroupIcon.mjs';
+export { FieldGroupIconButton } from './primitives/FieldGroupIcon/FieldGroupIconButton.mjs';
+export { Fieldset } from './primitives/Fieldset/Fieldset.mjs';
+export { Flex } from './primitives/Flex/Flex.mjs';
+export { Grid } from './primitives/Grid/Grid.mjs';
+export { Heading } from './primitives/Heading/Heading.mjs';
+export { HighlightMatch } from './primitives/HighlightMatch/HighlightMatch.mjs';
+export { Icon } from './primitives/Icon/Icon.mjs';
+export { Image } from './primitives/Image/Image.mjs';
+export { Input } from './primitives/Input/Input.mjs';
+export { Label } from './primitives/Label/Label.mjs';
+export { Link } from './primitives/Link/Link.mjs';
+export { Loader } from './primitives/Loader/Loader.mjs';
+export { Menu } from './primitives/Menu/Menu.mjs';
+export { MenuButton } from './primitives/Menu/MenuButton.mjs';
+export { MenuItem } from './primitives/Menu/MenuItem.mjs';
+export { Message } from './primitives/Message/Message.mjs';
+export { Pagination } from './primitives/Pagination/Pagination.mjs';
+export { PasswordField } from './primitives/PasswordField/PasswordField.mjs';
+export { PhoneNumberField } from './primitives/PhoneNumberField/PhoneNumberField.mjs';
+export { Placeholder } from './primitives/Placeholder/Placeholder.mjs';
+export { Radio } from './primitives/Radio/Radio.mjs';
+export { RadioGroupField } from './primitives/RadioGroupField/RadioGroupField.mjs';
+export { Rating } from './primitives/Rating/Rating.mjs';
+export { ScrollView } from './primitives/ScrollView/ScrollView.mjs';
+export { SearchField } from './primitives/SearchField/SearchField.mjs';
+export { SelectField } from './primitives/SelectField/SelectField.mjs';
+export { SliderField } from './primitives/SliderField/SliderField.mjs';
+export { StepperField } from './primitives/StepperField/StepperField.mjs';
+export { SwitchField } from './primitives/SwitchField/SwitchField.mjs';
+export { Tabs } from './primitives/Tabs/Tabs.mjs';
+export { Text } from './primitives/Text/Text.mjs';
+export { TextAreaField } from './primitives/TextAreaField/TextAreaField.mjs';
+export { TextField } from './primitives/TextField/TextField.mjs';
+export { ToggleButton } from './primitives/ToggleButton/ToggleButton.mjs';
+export { ToggleButtonGroup } from './primitives/ToggleButtonGroup/ToggleButtonGroup.mjs';
+export { View } from './primitives/View/View.mjs';
+export { VisuallyHidden } from './primitives/VisuallyHidden/VisuallyHidden.mjs';
+export { Table } from './primitives/Table/Table.mjs';
+export { TableBody } from './primitives/Table/TableBody.mjs';
+export { TableCell } from './primitives/Table/TableCell.mjs';
+export { TableFoot } from './primitives/Table/TableFoot.mjs';
+export { TableHead } from './primitives/Table/TableHead.mjs';
+export { TableRow } from './primitives/Table/TableRow.mjs';
+export { usePagination } from './primitives/Pagination/usePagination.mjs';
+export { ComponentPropsToStylePropsMap, ComponentPropsToStylePropsMapKeys } from './primitives/types/style.mjs';

package/dist/esm/internal.mjs

@@ -1 +1,32 @@
-export{useAuth}from"./hooks/useAuth.mjs";export{useDataStoreBinding,useDataStoreCollection,useDataStoreItem}from"./hooks/useDataStore.mjs";export{useStorageURL}from"./hooks/useStorageURL.mjs";export{useThemeBreakpoint}from"./hooks/useThemeBreakpoint.mjs";export{useAuthSignOutAction}from"./hooks/actions/useAuthSignOutAction.mjs";export{useNavigateAction}from"./hooks/actions/useNavigateAction.mjs";export{useStateMutationAction}from"./hooks/actions/useStateMutationAction.mjs";export{useDataStoreCreateAction}from"./hooks/actions/useDataStoreCreateAction.mjs";export{useDataStoreDeleteAction}from"./hooks/actions/useDataStoreDeleteAction.mjs";export{useDataStoreUpdateAction}from"./hooks/actions/useDataStoreUpdateAction.mjs";export{AlertIcon}from"./primitives/Alert/AlertIcon.mjs";export{IconAdd}from"./primitives/Icon/icons/IconAdd.mjs";export{IconCheckCircleOutline}from"./primitives/Icon/icons/IconCheckCircleOutline.mjs";export{IconCheckCircle}from"./primitives/Icon/icons/IconCheckCircle.mjs";export{IconCheck}from"./primitives/Icon/icons/IconCheck.mjs";export{IconChevronLeft}from"./primitives/Icon/icons/IconChevronLeft.mjs";export{IconChevronRight}from"./primitives/Icon/icons/IconChevronRight.mjs";export{IconClose}from"./primitives/Icon/icons/IconClose.mjs";export{IconEdit}from"./primitives/Icon/icons/IconEdit.mjs";export{IconError}from"./primitives/Icon/icons/IconError.mjs";export{IconExpandMore}from"./primitives/Icon/icons/IconExpandMore.mjs";export{IconFile}from"./primitives/Icon/icons/IconFile.mjs";export{IconIndeterminate}from"./primitives/Icon/icons/IconIndeterminate.mjs";export{IconInfo}from"./primitives/Icon/icons/IconInfo.mjs";export{IconMenu}from"./primitives/Icon/icons/IconMenu.mjs";export{IconRemove}from"./primitives/Icon/icons/IconRemove.mjs";export{IconSearch}from"./primitives/Icon/icons/IconSearch.mjs";export{IconStar}from"./primitives/Icon/icons/IconStar.mjs";export{IconUpload}from"./primitives/Icon/icons/IconUpload.mjs";export{IconVisibilityOff}from"./primitives/Icon/icons/IconVisibilityOff.mjs";export{IconVisibility}from"./primitives/Icon/icons/IconVisibility.mjs";export{IconWarning}from"./primitives/Icon/icons/IconWarning.mjs";export{useIcons}from"./primitives/Icon/context/useIcons.mjs";export{createDataStorePredicate}from"./primitives/shared/datastore.mjs";export{useDropZone}from"./primitives/DropZone/useDropZone.mjs";export{findChildOverrides}from"./studio/findChildOverrides.mjs";export{getOverridesFromVariants}from"./studio/getOverridesFromVariants.mjs";export{getOverrideProps}from"./studio/getOverrideProps.mjs";export{mergeVariantsAndOverrides}from"./studio/mergeVariantsAndOverrides.mjs";import"./primitives/Field/FieldClearButton.mjs";import"./primitives/Field/FieldDescription.mjs";import"./primitives/Field/FieldErrorMessage.mjs";export{Field}from"./primitives/Field/Field.mjs";export{PrimitiveCatalog}from"./PrimitiveCatalog.mjs";
+export { useAuth } from './hooks/useAuth.mjs';
+export { useStorageURL } from './hooks/useStorageURL.mjs';
+export { useThemeBreakpoint } from './hooks/useThemeBreakpoint.mjs';
+export { AlertIcon } from './primitives/Alert/AlertIcon.mjs';
+export { IconAdd } from './primitives/Icon/icons/IconAdd.mjs';
+export { IconCheckCircleOutline } from './primitives/Icon/icons/IconCheckCircleOutline.mjs';
+export { IconCheckCircle } from './primitives/Icon/icons/IconCheckCircle.mjs';
+export { IconCheck } from './primitives/Icon/icons/IconCheck.mjs';
+export { IconChevronLeft } from './primitives/Icon/icons/IconChevronLeft.mjs';
+export { IconChevronRight } from './primitives/Icon/icons/IconChevronRight.mjs';
+export { IconClose } from './primitives/Icon/icons/IconClose.mjs';
+export { IconEdit } from './primitives/Icon/icons/IconEdit.mjs';
+export { IconError } from './primitives/Icon/icons/IconError.mjs';
+export { IconExpandMore } from './primitives/Icon/icons/IconExpandMore.mjs';
+export { IconFile } from './primitives/Icon/icons/IconFile.mjs';
+export { IconIndeterminate } from './primitives/Icon/icons/IconIndeterminate.mjs';
+export { IconInfo } from './primitives/Icon/icons/IconInfo.mjs';
+export { IconMenu } from './primitives/Icon/icons/IconMenu.mjs';
+export { IconRemove } from './primitives/Icon/icons/IconRemove.mjs';
+export { IconSearch } from './primitives/Icon/icons/IconSearch.mjs';
+export { IconStar } from './primitives/Icon/icons/IconStar.mjs';
+export { IconUpload } from './primitives/Icon/icons/IconUpload.mjs';
+export { IconVisibilityOff } from './primitives/Icon/icons/IconVisibilityOff.mjs';
+export { IconVisibility } from './primitives/Icon/icons/IconVisibility.mjs';
+export { IconWarning } from './primitives/Icon/icons/IconWarning.mjs';
+export { useIcons } from './primitives/Icon/context/useIcons.mjs';
+export { useDropZone } from './primitives/DropZone/useDropZone.mjs';
+import './primitives/Field/FieldClearButton.mjs';
+import './primitives/Field/FieldDescription.mjs';
+import './primitives/Field/FieldErrorMessage.mjs';
+export { Field } from './primitives/Field/Field.mjs';
+export { PrimitiveCatalog } from './PrimitiveCatalog.mjs';

package/dist/esm/primitives/Accordion/Accordion.mjs

@@ -0,0 +1,28 @@
+import * as React from 'react';
+import { primitiveWithForwardRef } from '../utils/primitiveWithForwardRef.mjs';
+import { AccordionItem } from './AccordionItem.mjs';
+import { AccordionContent } from './AccordionContent.mjs';
+import { AccordionTrigger } from './AccordionTrigger.mjs';
+import { AccordionIcon } from './AccordionIcon.mjs';
+import { AccordionContainer } from './AccordionContainer.mjs';
+
+const AccordionPrimitive = ({ items, ...rest }, ref) => {
+    return (React.createElement(AccordionContainer, { ref: ref, ...rest }, items?.map(({ content, trigger, value }) => (React.createElement(AccordionItem, { key: value, value: value },
+        React.createElement(AccordionTrigger, null,
+            trigger,
+            React.createElement(AccordionIcon, null)),
+        React.createElement(AccordionContent, null, content))))));
+};
+/**
+ * [📖 Docs](https://ui.docs.amplify.aws/react/components/accordion)
+ */
+const Accordion = Object.assign(primitiveWithForwardRef(AccordionPrimitive), {
+    Container: AccordionContainer,
+    Content: AccordionContent,
+    Icon: AccordionIcon,
+    Item: AccordionItem,
+    Trigger: AccordionTrigger,
+});
+Accordion.displayName = 'Accordion';
+
+export { Accordion };

package/dist/esm/primitives/Accordion/AccordionContainer.mjs

@@ -0,0 +1,49 @@
+import * as React from 'react';
+import { isFunction, classNames, ComponentClassName } from '@aws-amplify/ui';
+import { primitiveWithForwardRef } from '../utils/primitiveWithForwardRef.mjs';
+import { View } from '../View/View.mjs';
+import { AccordionContext } from './AccordionContext.mjs';
+
+const AccordionContainerPrimitive = ({ children, className, defaultValue, allowMultiple, preventCollapse, onValueChange, testId, value: controlledValue, ...rest }, ref) => {
+    const isControlled = controlledValue !== undefined;
+    const [localValue, setLocalValue] = React.useState(() => isControlled ? controlledValue : defaultValue ?? []);
+    const value = isControlled ? controlledValue : localValue;
+    const setValue = React.useCallback((_value) => {
+        let newValue;
+        // if the value has the incoming value we try to close it by removing it from the array
+        if (value.includes(_value)) {
+            // only remove it from the array if preventCollapse is false/undefined OR
+            // the number of open accordions is more than 1 (so it won't fully collapse anyways)
+            newValue =
+                !preventCollapse || value.length > 1
+                    ? value.filter((v) => v !== _value)
+                    : value;
+        }
+        else {
+            // open the item by adding it to the array if allowMultiple is true
+            // or make it the whole array
+            newValue = allowMultiple ? [...value, _value] : [_value];
+        }
+        if (isFunction(onValueChange)) {
+            onValueChange(newValue);
+        }
+        if (!isControlled) {
+            setLocalValue(newValue);
+        }
+    }, [onValueChange, value, isControlled, allowMultiple, preventCollapse]);
+    const contextValue = React.useMemo(() => {
+        return {
+            value,
+            setValue,
+        };
+    }, [value, setValue]);
+    return (React.createElement(AccordionContext.Provider, { value: contextValue },
+        React.createElement(View, { ...rest, className: classNames(ComponentClassName.Accordion, className), "data-testid": testId, ref: ref }, children)));
+};
+/**
+ * [📖 Docs](https://ui.docs.amplify.aws/react/components/accordion)
+ */
+const AccordionContainer = primitiveWithForwardRef(AccordionContainerPrimitive);
+AccordionContainer.displayName = 'Accordion.Container';
+
+export { AccordionContainer };

package/dist/esm/primitives/Accordion/AccordionContent.mjs

@@ -0,0 +1,15 @@
+import * as React from 'react';
+import { classNames, ComponentClassName } from '@aws-amplify/ui';
+import { primitiveWithForwardRef } from '../utils/primitiveWithForwardRef.mjs';
+import { View } from '../View/View.mjs';
+
+const AccordionContentPrimitive = ({ className, children, ...rest }, ref) => {
+    return (React.createElement(View, { ...rest, className: classNames(ComponentClassName.AccordionItemContent, className), ref: ref }, children));
+};
+/**
+ * [📖 Docs](https://ui.docs.amplify.aws/react/components/accordion)
+ */
+const AccordionContent = primitiveWithForwardRef(AccordionContentPrimitive);
+AccordionContent.displayName = 'Accordion.Content';
+
+export { AccordionContent };

package/dist/esm/primitives/Accordion/AccordionContext.mjs

@@ -0,0 +1,6 @@
+import * as React from 'react';
+
+const AccordionContext = React.createContext(undefined);
+const AccordionItemContext = React.createContext(undefined);
+
+export { AccordionContext, AccordionItemContext };

package/dist/esm/primitives/Accordion/AccordionIcon.mjs

@@ -0,0 +1,20 @@
+import * as React from 'react';
+import { classNames, ComponentClassName } from '@aws-amplify/ui';
+import { primitiveWithForwardRef } from '../utils/primitiveWithForwardRef.mjs';
+import '../Icon/Icon.mjs';
+import '../Icon/context/IconsContext.mjs';
+import { useIcons } from '../Icon/context/useIcons.mjs';
+import { View } from '../View/View.mjs';
+import { IconExpandMore } from '../Icon/icons/IconExpandMore.mjs';
+
+const AccordionIconPrimitive = ({ className, as = 'span', ...rest }, ref) => {
+    const icons = useIcons('accordion');
+    return (React.createElement(View, { ...rest, ref: ref, as: as, className: classNames(ComponentClassName.AccordionItemIcon, className), "aria-hidden": "true" }, icons?.more ?? React.createElement(IconExpandMore, null)));
+};
+/**
+ * [📖 Docs](https://ui.docs.amplify.aws/react/components/accordion)
+ */
+const AccordionIcon = primitiveWithForwardRef(AccordionIconPrimitive);
+AccordionIcon.displayName = 'Accordion.Icon';
+
+export { AccordionIcon };

package/dist/esm/primitives/Accordion/AccordionItem.mjs

@@ -0,0 +1,19 @@
+import * as React from 'react';
+import { classNames, ComponentClassName } from '@aws-amplify/ui';
+import { primitiveWithForwardRef } from '../utils/primitiveWithForwardRef.mjs';
+import { View } from '../View/View.mjs';
+import { AccordionContext, AccordionItemContext } from './AccordionContext.mjs';
+
+const AccordionItemPrimitive = ({ children, className, value, as = 'details', ...rest }, ref) => {
+    const context = React.useContext(AccordionContext);
+    const open = value ? context?.value?.includes(value) : undefined;
+    return (React.createElement(AccordionItemContext.Provider, { value: value },
+        React.createElement(View, { ...rest, open: open, ref: ref, as: as, className: classNames(ComponentClassName.AccordionItem, className) }, children)));
+};
+/**
+ * [📖 Docs](https://ui.docs.amplify.aws/react/components/accordion)
+ */
+const AccordionItem = primitiveWithForwardRef(AccordionItemPrimitive);
+AccordionItem.displayName = 'AccordionItem';
+
+export { AccordionItem };

package/dist/esm/primitives/Accordion/AccordionTrigger.mjs

@@ -0,0 +1,27 @@
+import * as React from 'react';
+import { classNames, ComponentClassName, isTypedFunction } from '@aws-amplify/ui';
+import { primitiveWithForwardRef } from '../utils/primitiveWithForwardRef.mjs';
+import { View } from '../View/View.mjs';
+import { AccordionContext, AccordionItemContext } from './AccordionContext.mjs';
+
+const AccordionTriggerPrimitive = ({ children, className, ...rest }, ref) => {
+    const context = React.useContext(AccordionContext);
+    const value = React.useContext(AccordionItemContext);
+    const handleOnClick = (e) => {
+        if (isTypedFunction(rest.onClick)) {
+            rest.onClick(e);
+        }
+        if (context?.setValue && value) {
+            e.preventDefault();
+            context.setValue(value);
+        }
+    };
+    return (React.createElement(View, { ...rest, ref: ref, as: "summary", className: classNames(ComponentClassName.AccordionItemTrigger, className), onClick: handleOnClick }, children));
+};
+/**
+ * [📖 Docs](https://ui.docs.amplify.aws/react/components/accordion)
+ */
+const AccordionTrigger = primitiveWithForwardRef(AccordionTriggerPrimitive);
+AccordionTrigger.displayName = 'Accordion.Trigger';
+
+export { AccordionTrigger };