From 54830756a5b931f1fcf09353409ff05c6bc9725a Mon Sep 17 00:00:00 2001 From: Tom King Date: Mon, 23 Oct 2023 15:26:58 +1000 Subject: [PATCH] - added 'use client' on all components that should need it --- packages/ui/src/components/accordion/accordion.component.tsx | 2 ++ packages/ui/src/components/alert/alert.component.tsx | 2 ++ .../ui/src/components/autocomplete/autocomplete.component.tsx | 2 ++ packages/ui/src/components/badge/badge.component.tsx | 2 ++ packages/ui/src/components/breadcrumb/breadcrumb.component.tsx | 2 ++ .../components/button-dropdown/button-dropdown.component.tsx | 2 ++ .../ui/src/components/button-group/button-group.component.tsx | 2 ++ packages/ui/src/components/button/button.component.tsx | 2 ++ .../src/components/checkbox-group/checkbox-group.component.tsx | 2 ++ .../ui/src/components/collapsible/collapsible.component.tsx | 2 ++ packages/ui/src/components/compacta/compacta.component.tsx | 2 ++ .../ui/src/components/date-picker/date-picker.component.tsx | 2 ++ packages/ui/src/components/field/field.component.tsx | 2 ++ packages/ui/src/components/flexi-cell/flexi-cell.component.tsx | 2 ++ packages/ui/src/components/form/form.component.tsx | 2 ++ .../ui/src/components/input-field/input-field.component.tsx | 2 ++ packages/ui/src/components/input/input.component.tsx | 2 ++ packages/ui/src/components/link/link.component.tsx | 2 ++ packages/ui/src/components/list/list.component.tsx | 2 ++ packages/ui/src/components/modal/modal.component.tsx | 2 ++ packages/ui/src/components/pagination/pagination.component.tsx | 2 ++ packages/ui/src/components/popover/popover.component.tsx | 2 ++ .../ui/src/components/progress-bar/progress-bar.component.tsx | 2 ++ .../ui/src/components/progress-rope/progress-rope.component.tsx | 2 ++ .../ui/src/components/radio-group/radio-group.component.tsx | 2 ++ packages/ui/src/components/repeater/repeater.component.tsx | 2 ++ packages/ui/src/components/select/select.component.tsx | 2 ++ packages/ui/src/components/selector/selector.component.tsx | 2 ++ packages/ui/src/components/skip-link/skip-link.component.tsx | 2 ++ packages/ui/src/components/switch/switch.component.tsx | 2 ++ packages/ui/src/components/table/table.component.tsx | 2 ++ packages/ui/src/components/tabs/tabs.component.tsx | 2 ++ packages/ui/src/components/textarea/textarea.component.tsx | 2 ++ 33 files changed, 66 insertions(+) diff --git a/packages/ui/src/components/accordion/accordion.component.tsx b/packages/ui/src/components/accordion/accordion.component.tsx index 32f68d029..4d1178aac 100644 --- a/packages/ui/src/components/accordion/accordion.component.tsx +++ b/packages/ui/src/components/accordion/accordion.component.tsx @@ -1,3 +1,5 @@ +'use client'; + import { useAccordion } from '@react-aria/accordion'; import { filterDOMProps } from '@react-aria/utils'; import { useDOMRef } from '@react-spectrum/utils'; diff --git a/packages/ui/src/components/alert/alert.component.tsx b/packages/ui/src/components/alert/alert.component.tsx index 398a1930d..2f8954edf 100644 --- a/packages/ui/src/components/alert/alert.component.tsx +++ b/packages/ui/src/components/alert/alert.component.tsx @@ -1,3 +1,5 @@ +'use client'; + import { AnimatePresence, LazyMotion, m } from 'framer-motion'; import React, { useCallback, useEffect, useState } from 'react'; diff --git a/packages/ui/src/components/autocomplete/autocomplete.component.tsx b/packages/ui/src/components/autocomplete/autocomplete.component.tsx index d136c2b14..93f6621f8 100644 --- a/packages/ui/src/components/autocomplete/autocomplete.component.tsx +++ b/packages/ui/src/components/autocomplete/autocomplete.component.tsx @@ -1,3 +1,5 @@ +'use client'; + import * as React from 'react'; import { useButton, useComboBox, useFilter, useSearchField } from 'react-aria'; import { Item, useComboBoxState, useSearchFieldState } from 'react-stately'; diff --git a/packages/ui/src/components/badge/badge.component.tsx b/packages/ui/src/components/badge/badge.component.tsx index b67b6c5d8..fe5e7b8e0 100644 --- a/packages/ui/src/components/badge/badge.component.tsx +++ b/packages/ui/src/components/badge/badge.component.tsx @@ -1,3 +1,5 @@ +'use client'; + import React, { forwardRef } from 'react'; import { styles } from './badge.styles.js'; diff --git a/packages/ui/src/components/breadcrumb/breadcrumb.component.tsx b/packages/ui/src/components/breadcrumb/breadcrumb.component.tsx index 850ccbd4d..b1d5c50be 100644 --- a/packages/ui/src/components/breadcrumb/breadcrumb.component.tsx +++ b/packages/ui/src/components/breadcrumb/breadcrumb.component.tsx @@ -1,3 +1,5 @@ +'use client'; + import React, { Children, FunctionComponentElement, cloneElement } from 'react'; import { useBreadcrumbs } from 'react-aria'; diff --git a/packages/ui/src/components/button-dropdown/button-dropdown.component.tsx b/packages/ui/src/components/button-dropdown/button-dropdown.component.tsx index 3a79c5fc4..473824c95 100644 --- a/packages/ui/src/components/button-dropdown/button-dropdown.component.tsx +++ b/packages/ui/src/components/button-dropdown/button-dropdown.component.tsx @@ -1,3 +1,5 @@ +'use client'; + import React, { useCallback, useEffect, useId, useRef } from 'react'; import { useButton, useOverlayTrigger } from 'react-aria'; import { useOverlayTriggerState } from 'react-stately'; diff --git a/packages/ui/src/components/button-group/button-group.component.tsx b/packages/ui/src/components/button-group/button-group.component.tsx index 9bb29406b..e0e1bdfe6 100644 --- a/packages/ui/src/components/button-group/button-group.component.tsx +++ b/packages/ui/src/components/button-group/button-group.component.tsx @@ -1,3 +1,5 @@ +'use client'; + import React, { ReactElement, cloneElement, createContext } from 'react'; import { useRadioGroup } from 'react-aria'; import { useRadioGroupState } from 'react-stately'; diff --git a/packages/ui/src/components/button/button.component.tsx b/packages/ui/src/components/button/button.component.tsx index af1a1de0c..b20b23079 100644 --- a/packages/ui/src/components/button/button.component.tsx +++ b/packages/ui/src/components/button/button.component.tsx @@ -1,3 +1,5 @@ +'use client'; + import React, { forwardRef, useMemo } from 'react'; import { mergeProps, useFocusRing } from 'react-aria'; diff --git a/packages/ui/src/components/checkbox-group/checkbox-group.component.tsx b/packages/ui/src/components/checkbox-group/checkbox-group.component.tsx index 045edfc28..daf8e58d7 100644 --- a/packages/ui/src/components/checkbox-group/checkbox-group.component.tsx +++ b/packages/ui/src/components/checkbox-group/checkbox-group.component.tsx @@ -1,3 +1,5 @@ +'use client'; + import React, { ReactElement, cloneElement, createContext, useEffect, useMemo, useRef, useState } from 'react'; import { useCheckboxGroup, useFocusRing } from 'react-aria'; import { useCheckboxGroupState } from 'react-stately'; diff --git a/packages/ui/src/components/collapsible/collapsible.component.tsx b/packages/ui/src/components/collapsible/collapsible.component.tsx index 9d0dcba2d..4f52c3d90 100644 --- a/packages/ui/src/components/collapsible/collapsible.component.tsx +++ b/packages/ui/src/components/collapsible/collapsible.component.tsx @@ -1,3 +1,5 @@ +'use client'; + import { AnimatePresence, LazyMotion, m } from 'framer-motion'; import React, { useCallback, useId, useState } from 'react'; diff --git a/packages/ui/src/components/compacta/compacta.component.tsx b/packages/ui/src/components/compacta/compacta.component.tsx index 1cf53badc..feec346f2 100644 --- a/packages/ui/src/components/compacta/compacta.component.tsx +++ b/packages/ui/src/components/compacta/compacta.component.tsx @@ -1,3 +1,5 @@ +'use client'; + import { AnimatePresence, LazyMotion, m } from 'framer-motion'; import React, { useCallback, useEffect, useId, useRef, useState } from 'react'; diff --git a/packages/ui/src/components/date-picker/date-picker.component.tsx b/packages/ui/src/components/date-picker/date-picker.component.tsx index c3b410412..a3b01998c 100644 --- a/packages/ui/src/components/date-picker/date-picker.component.tsx +++ b/packages/ui/src/components/date-picker/date-picker.component.tsx @@ -1,3 +1,5 @@ +'use client'; + import React, { useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react'; import { styles } from './date-picker.styles.js'; diff --git a/packages/ui/src/components/field/field.component.tsx b/packages/ui/src/components/field/field.component.tsx index d2a6564a2..0e6e48b89 100644 --- a/packages/ui/src/components/field/field.component.tsx +++ b/packages/ui/src/components/field/field.component.tsx @@ -1,3 +1,5 @@ +'use client'; + import React, { Children, ReactNode, cloneElement, isValidElement, useCallback } from 'react'; import { useField } from 'react-aria'; diff --git a/packages/ui/src/components/flexi-cell/flexi-cell.component.tsx b/packages/ui/src/components/flexi-cell/flexi-cell.component.tsx index 8efdb97ef..82221ca04 100644 --- a/packages/ui/src/components/flexi-cell/flexi-cell.component.tsx +++ b/packages/ui/src/components/flexi-cell/flexi-cell.component.tsx @@ -1,3 +1,5 @@ +'use client'; + import React, { forwardRef } from 'react'; import { mergeProps, useFocusRing } from 'react-aria'; diff --git a/packages/ui/src/components/form/form.component.tsx b/packages/ui/src/components/form/form.component.tsx index 4431154ef..fca05f742 100644 --- a/packages/ui/src/components/form/form.component.tsx +++ b/packages/ui/src/components/form/form.component.tsx @@ -1,3 +1,5 @@ +'use client'; + import React, { createContext, useContext } from 'react'; import { ErrorMessage } from '../error-message/index.js'; diff --git a/packages/ui/src/components/input-field/input-field.component.tsx b/packages/ui/src/components/input-field/input-field.component.tsx index 04c6b1200..2cf206302 100644 --- a/packages/ui/src/components/input-field/input-field.component.tsx +++ b/packages/ui/src/components/input-field/input-field.component.tsx @@ -1,3 +1,5 @@ +'use client'; + import React, { Children, ReactNode, cloneElement, isValidElement, useCallback, useId, useMemo } from 'react'; import { ErrorMessage, FormHint, FormLabel } from '../index.js'; diff --git a/packages/ui/src/components/input/input.component.tsx b/packages/ui/src/components/input/input.component.tsx index cf4c1918e..637aae609 100644 --- a/packages/ui/src/components/input/input.component.tsx +++ b/packages/ui/src/components/input/input.component.tsx @@ -1,3 +1,5 @@ +'use client'; + import React, { ForwardedRef, forwardRef } from 'react'; import { mergeProps, useFocusRing } from 'react-aria'; diff --git a/packages/ui/src/components/link/link.component.tsx b/packages/ui/src/components/link/link.component.tsx index 8a2d205a4..8d3a13e07 100644 --- a/packages/ui/src/components/link/link.component.tsx +++ b/packages/ui/src/components/link/link.component.tsx @@ -1,3 +1,5 @@ +'use client'; + import React, { forwardRef, useRef } from 'react'; import { mergeProps, useFocusRing, useLink } from 'react-aria'; diff --git a/packages/ui/src/components/list/list.component.tsx b/packages/ui/src/components/list/list.component.tsx index 4dc990e10..5650c8c4a 100644 --- a/packages/ui/src/components/list/list.component.tsx +++ b/packages/ui/src/components/list/list.component.tsx @@ -1,3 +1,5 @@ +'use client'; + import React, { Children, ReactElement, cloneElement, createContext, useContext } from 'react'; import { Item } from './components/item/index.js'; diff --git a/packages/ui/src/components/modal/modal.component.tsx b/packages/ui/src/components/modal/modal.component.tsx index 0ab9c5f4e..c262fd5c4 100644 --- a/packages/ui/src/components/modal/modal.component.tsx +++ b/packages/ui/src/components/modal/modal.component.tsx @@ -1,3 +1,5 @@ +'use client'; + import React from 'react'; import { Backdrop, Dialog } from './components/index.js'; diff --git a/packages/ui/src/components/pagination/pagination.component.tsx b/packages/ui/src/components/pagination/pagination.component.tsx index 7f0c5fba6..111fdd88c 100644 --- a/packages/ui/src/components/pagination/pagination.component.tsx +++ b/packages/ui/src/components/pagination/pagination.component.tsx @@ -1,3 +1,5 @@ +'use client'; + import React, { useCallback, useMemo } from 'react'; import { PaginationItem } from './components/index.js'; diff --git a/packages/ui/src/components/popover/popover.component.tsx b/packages/ui/src/components/popover/popover.component.tsx index 33c50235d..8eaa8c53e 100644 --- a/packages/ui/src/components/popover/popover.component.tsx +++ b/packages/ui/src/components/popover/popover.component.tsx @@ -1,3 +1,5 @@ +'use client'; + import React, { useCallback, useEffect, useId } from 'react'; import { useOverlayTriggerState } from 'react-stately'; diff --git a/packages/ui/src/components/progress-bar/progress-bar.component.tsx b/packages/ui/src/components/progress-bar/progress-bar.component.tsx index 797eea299..482a46a7e 100644 --- a/packages/ui/src/components/progress-bar/progress-bar.component.tsx +++ b/packages/ui/src/components/progress-bar/progress-bar.component.tsx @@ -1,3 +1,5 @@ +'use client'; + import React from 'react'; import { useProgressBar } from 'react-aria'; diff --git a/packages/ui/src/components/progress-rope/progress-rope.component.tsx b/packages/ui/src/components/progress-rope/progress-rope.component.tsx index 0a32b56f3..7c2342528 100644 --- a/packages/ui/src/components/progress-rope/progress-rope.component.tsx +++ b/packages/ui/src/components/progress-rope/progress-rope.component.tsx @@ -1,3 +1,5 @@ +'use client'; + import React, { useEffect, useMemo, useState } from 'react'; import { ProgressRopeGroupStep, ProgressRopeStep } from './components/index.js'; diff --git a/packages/ui/src/components/radio-group/radio-group.component.tsx b/packages/ui/src/components/radio-group/radio-group.component.tsx index 268add36a..1602f7d57 100644 --- a/packages/ui/src/components/radio-group/radio-group.component.tsx +++ b/packages/ui/src/components/radio-group/radio-group.component.tsx @@ -1,3 +1,5 @@ +'use client'; + import React, { ReactElement, cloneElement, createContext, useEffect, useMemo, useRef, useState } from 'react'; import { useFocusRing, useRadioGroup } from 'react-aria'; import { useRadioGroupState } from 'react-stately'; diff --git a/packages/ui/src/components/repeater/repeater.component.tsx b/packages/ui/src/components/repeater/repeater.component.tsx index 83fed6797..03f6d50cb 100644 --- a/packages/ui/src/components/repeater/repeater.component.tsx +++ b/packages/ui/src/components/repeater/repeater.component.tsx @@ -1,3 +1,5 @@ +'use client'; + import { AnimatePresence, LazyMotion, m } from 'framer-motion'; import React, { useCallback, useEffect, useRef, useState } from 'react'; import { useFocusRing } from 'react-aria'; diff --git a/packages/ui/src/components/select/select.component.tsx b/packages/ui/src/components/select/select.component.tsx index 9e4b9b309..3bda13822 100644 --- a/packages/ui/src/components/select/select.component.tsx +++ b/packages/ui/src/components/select/select.component.tsx @@ -1,3 +1,5 @@ +'use client'; + import React, { ForwardedRef, forwardRef } from 'react'; import { mergeProps, useFocusRing } from 'react-aria'; diff --git a/packages/ui/src/components/selector/selector.component.tsx b/packages/ui/src/components/selector/selector.component.tsx index bcc579721..b9d519e78 100644 --- a/packages/ui/src/components/selector/selector.component.tsx +++ b/packages/ui/src/components/selector/selector.component.tsx @@ -1,3 +1,5 @@ +'use client'; + import React from 'react'; import { diff --git a/packages/ui/src/components/skip-link/skip-link.component.tsx b/packages/ui/src/components/skip-link/skip-link.component.tsx index a041e43f4..fd9db4a3e 100644 --- a/packages/ui/src/components/skip-link/skip-link.component.tsx +++ b/packages/ui/src/components/skip-link/skip-link.component.tsx @@ -1,3 +1,5 @@ +'use client'; + import React, { forwardRef } from 'react'; import { styles } from './skip-link.styles.js'; diff --git a/packages/ui/src/components/switch/switch.component.tsx b/packages/ui/src/components/switch/switch.component.tsx index edbc264ee..fbcdd6bdf 100644 --- a/packages/ui/src/components/switch/switch.component.tsx +++ b/packages/ui/src/components/switch/switch.component.tsx @@ -1,3 +1,5 @@ +'use client'; + import React, { useId, useRef } from 'react'; import { VisuallyHidden, mergeProps, useCheckbox, useFocusRing } from 'react-aria'; import { useToggleState } from 'react-stately'; diff --git a/packages/ui/src/components/table/table.component.tsx b/packages/ui/src/components/table/table.component.tsx index 4114051a8..755dddea1 100644 --- a/packages/ui/src/components/table/table.component.tsx +++ b/packages/ui/src/components/table/table.component.tsx @@ -1,3 +1,5 @@ +'use client'; + import React, { createContext } from 'react'; import { Body, Caption, Cell, Footer, Header, HeaderCell, HeaderRow, Row } from './components/index.js'; diff --git a/packages/ui/src/components/tabs/tabs.component.tsx b/packages/ui/src/components/tabs/tabs.component.tsx index 4d3778005..4e4df7a92 100644 --- a/packages/ui/src/components/tabs/tabs.component.tsx +++ b/packages/ui/src/components/tabs/tabs.component.tsx @@ -1,3 +1,5 @@ +'use client'; + import React, { useRef } from 'react'; import { useTabList } from 'react-aria'; import { Item, useTabListState } from 'react-stately'; diff --git a/packages/ui/src/components/textarea/textarea.component.tsx b/packages/ui/src/components/textarea/textarea.component.tsx index 8c9bd860b..a5c44ecd9 100644 --- a/packages/ui/src/components/textarea/textarea.component.tsx +++ b/packages/ui/src/components/textarea/textarea.component.tsx @@ -1,3 +1,5 @@ +'use client'; + import React, { ForwardedRef, forwardRef } from 'react'; import { mergeProps, useFocusRing } from 'react-aria';