Skip to content

Commit

Permalink
feat: Re-export Spectrum components + prop types (#1880)
Browse files Browse the repository at this point in the history
Re-export most of the React Spectrum components listed in the docs. This
excludes
* TableView - likely want our grid to replace this at some point
* Components we have already wrapped or have components with the same
names
* Beta components

resolves #1852
  • Loading branch information
bmingles authored Mar 19, 2024
1 parent 3a5de97 commit 4783092
Show file tree
Hide file tree
Showing 20 changed files with 165 additions and 41 deletions.
2 changes: 2 additions & 0 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions packages/components/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -33,6 +33,7 @@
"@fortawesome/react-fontawesome": "^0.2.0",
"@react-spectrum/theme-default": "^3.5.1",
"@react-types/shared": "^3.22.1",
"@react-types/textfield": "^3.9.1",
"bootstrap": "4.6.2",
"classnames": "^2.3.1",
"event-target-shim": "^6.0.2",
Expand Down
5 changes: 0 additions & 5 deletions packages/components/src/spectrum/Flex.tsx

This file was deleted.

13 changes: 0 additions & 13 deletions packages/components/src/spectrum/Item.tsx

This file was deleted.

13 changes: 0 additions & 13 deletions packages/components/src/spectrum/Section.tsx

This file was deleted.

10 changes: 10 additions & 0 deletions packages/components/src/spectrum/buttons.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
export {
ActionButton,
type SpectrumActionButtonProps as ActionButtonProps,
ActionGroup,
type SpectrumActionGroupProps as ActionGroupProps,
LogicButton,
type SpectrumLogicButtonProps as LogicButtonProps,
ToggleButton,
type SpectrumToggleButtonProps as ToggleButtonProps,
} from '@adobe/react-spectrum';
12 changes: 12 additions & 0 deletions packages/components/src/spectrum/collections.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
export {
ActionBar,
type SpectrumActionBarProps as ActionBarProps,
ActionMenu,
type SpectrumActionMenuProps as ActionMenuProps,
ListView,
type SpectrumListViewProps as ListViewProps,
MenuTrigger,
type SpectrumMenuTriggerProps as MenuTriggerProps,
TagGroup,
type SpectrumTagGroupProps as TagGroupProps,
} from '@adobe/react-spectrum';
24 changes: 24 additions & 0 deletions packages/components/src/spectrum/content.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@
export {
Avatar,
type SpectrumAvatarProps as AvatarProps,
Content,
type ContentProps,
Divider,
type SpectrumDividerProps as DividerProps,
Footer,
type FooterProps,
Heading,
type HeadingProps,
IllustratedMessage,
type SpectrumIllustratedMessageProps as IllustratedMessageProps,
Image,
type SpectrumImageProps as ImageProps,
Keyboard,
type KeyboardProps,
Text,
type TextProps,
View,
type ViewProps,
Well,
type SpectrumWellProps as WellProps,
} from '@adobe/react-spectrum';
14 changes: 14 additions & 0 deletions packages/components/src/spectrum/dateAndTime.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
export {
Calendar,
type SpectrumCalendarProps as CalendarProps,
DateField,
type SpectrumDateFieldProps as DateFieldProps,
DatePicker,
type SpectrumDatePickerProps as DatePickerProps,
DateRangePicker,
type SpectrumDateRangePickerProps as DateRangePickerProps,
RangeCalendar,
type SpectrumRangeCalendarProps as RangeCalendarProps,
TimeField,
type SpectrumTimeFieldProps as TimeFieldProps,
} from '@adobe/react-spectrum';
19 changes: 19 additions & 0 deletions packages/components/src/spectrum/forms.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
export {
CheckboxGroup,
type SpectrumCheckboxGroupProps as CheckboxGroupProps,
Form,
type SpectrumFormProps as FormProps,
NumberField,
type SpectrumNumberFieldProps as NumberFieldProps,
RangeSlider,
type SpectrumRangeSliderProps as RangeSliderProps,
Slider,
type SpectrumSliderProps as SliderProps,
Switch,
type SpectrumSwitchProps as SwitchProps,
TextArea,
TextField,
type SpectrumTextFieldProps as TextFieldProps,
} from '@adobe/react-spectrum';

export { type SpectrumTextAreaProps as TextAreaProps } from '@react-types/textfield';
21 changes: 18 additions & 3 deletions packages/components/src/spectrum/index.ts
Original file line number Diff line number Diff line change
@@ -1,4 +1,19 @@
export * from './Flex';
export * from './Item';
/**
* Re-exporting React Spectrum components + props.
*/
export * from './buttons';
export * from './collections';
export * from './content';
export * from './dateAndTime';
export * from './forms';
export * from './layout';
export * from './navigation';
export * from './overlays';
export * from './pickers';
export * from './shared';
export * from './status';

/**
* Custom DH components wrapping React Spectrum components.
*/
export * from './picker';
export * from './Section';
6 changes: 6 additions & 0 deletions packages/components/src/spectrum/layout.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
export {
Flex,
type FlexProps,
Grid,
type GridProps,
} from '@adobe/react-spectrum';
12 changes: 12 additions & 0 deletions packages/components/src/spectrum/navigation.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
export {
Breadcrumbs,
type SpectrumBreadcrumbsProps as BreadcrumbsProps,
Link,
type SpectrumLinkProps as LinkProps,
TabList,
type SpectrumTabListProps as TabListProps,
TabPanels,
type SpectrumTabPanelsProps as TabPanelsProps,
Tabs,
type SpectrumTabsProps as TabsProps,
} from '@adobe/react-spectrum';
12 changes: 12 additions & 0 deletions packages/components/src/spectrum/overlays.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
export {
AlertDialog,
type SpectrumAlertDialogProps as AlertDialogProps,
ContextualHelp,
type SpectrumContextualHelpProps as ContextualHelpProps,
Dialog,
type SpectrumDialogProps as DialogProps,
DialogContainer,
type SpectrumDialogContainerProps as DialogContainerProps,
DialogTrigger,
type SpectrumDialogTriggerProps as DialogTriggerProps,
} from '@adobe/react-spectrum';
3 changes: 1 addition & 2 deletions packages/components/src/spectrum/picker/Picker.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -14,8 +14,7 @@ import {
isNormalizedPickerSection,
} from './PickerUtils';
import { PickerItemContent } from './PickerItemContent';
import { Item } from '../Item';
import { Section } from '../Section';
import { Item, Section } from '../shared';

export type PickerProps = {
children: PickerItemOrSection | PickerItemOrSection[];
Expand Down
5 changes: 2 additions & 3 deletions packages/components/src/spectrum/picker/PickerUtils.test.tsx
Original file line number Diff line number Diff line change
@@ -1,5 +1,4 @@
import React, { createElement } from 'react';
import { Text } from '@adobe/react-spectrum';
import {
NormalizedPickerItem,
normalizeTooltipOptions,
Expand All @@ -13,8 +12,8 @@ import {
isNormalizedPickerSection,
} from './PickerUtils';
import type { PickerProps } from './Picker';
import { Item } from '../Item';
import { Section } from '../Section';
import { Item, Section } from '../shared';
import { Text } from '../content';

beforeEach(() => {
expect.hasAssertions();
Expand Down
3 changes: 1 addition & 2 deletions packages/components/src/spectrum/picker/PickerUtils.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2,8 +2,7 @@ import { isValidElement, Key, ReactElement, ReactNode } from 'react';
import { SpectrumPickerProps } from '@adobe/react-spectrum';
import type { ItemRenderer } from '@react-types/shared';
import Log from '@deephaven/log';
import { Item, ItemProps } from '../Item';
import { Section, SectionProps } from '../Section';
import { Item, ItemProps, Section, SectionProps } from '../shared';
import { PopperOptions } from '../../popper';

const log = Log.module('PickerUtils');
Expand Down
4 changes: 4 additions & 0 deletions packages/components/src/spectrum/pickers.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
export {
ComboBox,
type SpectrumComboBoxProps as ComboBoxProps,
} from '@adobe/react-spectrum';
11 changes: 11 additions & 0 deletions packages/components/src/spectrum/shared.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
/**
* Wrapping Spectrum `Item` and `Section` components will break functionality
* due to the way they are consumed by collection components. They are only used
* to pass data and don't render anything on their own, so they don't need to be
* wrapped. If we do ever need to wrap them for whatever reason, the static
* `getCollectionNode` method will need to be implemented.
* See https://github.com/adobe/react-spectrum/blob/main/packages/%40react-stately/collections/src/Item.ts#L17
* https://github.com/adobe/react-spectrum/blob/main/packages/%40react-stately/collections/src/Section.ts#L18
*/
export { Item, Section } from '@adobe/react-spectrum';
export type { ItemProps, SectionProps } from '@react-types/shared';
16 changes: 16 additions & 0 deletions packages/components/src/spectrum/status.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
export {
Badge,
type SpectrumBadgeProps as BadgeProps,
InlineAlert,
type SpectrumInlineAlertProps as InlineAlertProps,
LabeledValue,
type SpectrumLabeledValueProps as LabeledValueProps,
Meter,
type SpectrumMeterProps as MeterProps,
ProgressBar,
type SpectrumProgressBarProps as ProgressBarProps,
ProgressCircle,
type SpectrumProgressCircleProps as ProgressCircleProps,
StatusLight,
type SpectrumStatusLightProps as StatusLightProps,
} from '@adobe/react-spectrum';

0 comments on commit 4783092

Please sign in to comment.