@hyphen/hyphen-components 7.3.2 → 7.3.3
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/dist/css/utilities.css +1 -1
- package/dist/css/variables.css +18 -28
- package/dist/hyphen-components.cjs.development.js +5717 -5021
- package/dist/hyphen-components.cjs.development.js.map +1 -1
- package/dist/hyphen-components.cjs.production.min.js +18 -2
- package/dist/hyphen-components.cjs.production.min.js.map +1 -1
- package/dist/hyphen-components.esm.js +5618 -4846
- package/dist/hyphen-components.esm.js.map +1 -1
- package/dist/index.d.ts +2693 -57
- package/dist/index.js +0 -1
- package/package.json +18 -19
- package/src/components/Badge/Badge.module.scss +6 -0
- package/src/components/Badge/Badge.stories.tsx +1 -0
- package/src/components/Badge/Badge.test.tsx +3 -2
- package/src/components/Badge/Badge.tsx +5 -3
- package/src/components/Box/Box.tsx +5 -2
- package/src/components/Button/Button.module.scss +1 -1
- package/src/components/Button/Button.test.tsx +2 -2
- package/src/components/Calendar/Calendar.test.tsx +262 -0
- package/src/components/Card/Card.tsx +2 -0
- package/src/components/CheckboxInput/components/Checkbox.module.scss +1 -1
- package/src/components/CheckboxInput/components/Checkbox.tsx +2 -0
- package/src/components/Details/Details.module.scss +2 -2
- package/src/components/Details/Details.tsx +2 -0
- package/src/components/Drawer/Drawer.stories.tsx +1 -1
- package/src/components/Drawer/Drawer.test.tsx +494 -56
- package/src/components/Drawer/Drawer.tsx +7 -1
- package/src/components/DropdownMenu/DropdownMenu.test.tsx +532 -12
- package/src/components/FormControl/FormControl.tsx +2 -0
- package/src/components/Formik/Formik.stories.tsx +30 -7
- package/src/components/Formik/FormikSelectInput/FormikSelectInput.tsx +6 -5
- package/src/components/Formik/FormikToggleGroup/FormikToggleGroup.tsx +1 -1
- package/src/components/HelpText/HelpText.tsx +2 -0
- package/src/components/Icon/Icon.stories.tsx +1 -1
- package/src/components/Icon/Icon.tsx +2 -0
- package/src/components/Modal/Modal.test.tsx +630 -81
- package/src/components/Modal/Modal.tsx +2 -0
- package/src/components/Modal/components/ModalFooter/ModalFooter.test.tsx +2 -2
- package/src/components/Popover/Popover.tsx +2 -0
- package/src/components/RadioGroup/RadioInput/RadioInput.tsx +2 -0
- package/src/components/SelectInput/SelectInput.stories.tsx +22 -22
- package/src/components/SelectInput/SelectInput.tsx +13 -9
- package/src/components/SelectInputInset/SelectInputInset.tsx +2 -0
- package/src/components/Sidebar/Sidebar.module.scss +4 -0
- package/src/components/Sidebar/Sidebar.stories.tsx +8 -4
- package/src/components/Sidebar/Sidebar.test.tsx +7 -4
- package/src/components/Sidebar/Sidebar.tsx +7 -4
- package/src/components/Table/Table.stories.tsx +102 -52
- package/src/components/TextInput/TextInput.tsx +2 -0
- package/src/components/TextInputInset/TextInputInset.tsx +2 -0
- package/src/components/TextareaInputInset/TextareaInputInset.tsx +2 -0
- package/src/components/TimePickerNative/TimePickerNative.stories.tsx +0 -1
- package/src/components/Toast/Toast.store.ts +1 -1
- package/src/components/Toast/Toast.stories.tsx +3 -2
- package/src/components/Toast/Toast.test.tsx +8 -6
- package/src/components/Toggle/Toggle.tsx +2 -0
- package/src/components/ToggleGroup/ToggleGroup.tsx +2 -0
- package/src/docs/Colors.mdx +0 -13
- package/src/lib/getColumnKeys.ts +3 -3
- package/src/lib/mergeRefs.ts +1 -1
- package/src/lib/tokens.ts +4 -4
- package/dist/components/Alert/Alert.constants.d.ts +0 -8
- package/dist/components/Alert/Alert.d.ts +0 -42
- package/dist/components/Alert/Alert.stories.d.ts +0 -12
- package/dist/components/Alert/Alert.types.d.ts +0 -7
- package/dist/components/AspectRatio/AspectRatio.d.ts +0 -3
- package/dist/components/AspectRatio/AspectRatio.stories.d.ts +0 -6
- package/dist/components/Badge/Badge.d.ts +0 -24
- package/dist/components/Badge/Badge.stories.d.ts +0 -8
- package/dist/components/Box/Box.d.ts +0 -247
- package/dist/components/Box/Box.stories.d.ts +0 -46
- package/dist/components/Button/Button.constants.d.ts +0 -3
- package/dist/components/Button/Button.d.ts +0 -53
- package/dist/components/Button/Button.stories.d.ts +0 -16
- package/dist/components/Calendar/Calendar.d.ts +0 -7
- package/dist/components/Calendar/Calendar.stories.d.ts +0 -12
- package/dist/components/Card/Card.d.ts +0 -17
- package/dist/components/Card/Card.stories.d.ts +0 -8
- package/dist/components/Card/components/CardFooter/CardFooter.d.ts +0 -13
- package/dist/components/Card/components/CardHeader/CardHeader.d.ts +0 -13
- package/dist/components/Card/components/CardSection/CardSection.d.ts +0 -46
- package/dist/components/Card/components/index.d.ts +0 -3
- package/dist/components/CheckboxInput/CheckboxInput.d.ts +0 -72
- package/dist/components/CheckboxInput/CheckboxInput.stories.d.ts +0 -18
- package/dist/components/CheckboxInput/components/Checkbox.d.ts +0 -71
- package/dist/components/CheckboxInput/components/CheckboxIcon.d.ts +0 -27
- package/dist/components/Collapsible/Collapsible.d.ts +0 -5
- package/dist/components/Collapsible/Collapsible.stories.d.ts +0 -9
- package/dist/components/Details/Details.d.ts +0 -15
- package/dist/components/Details/Details.stories.d.ts +0 -6
- package/dist/components/Details/DetailsSummary.d.ts +0 -7
- package/dist/components/Drawer/Drawer.d.ts +0 -105
- package/dist/components/Drawer/Drawer.stories.d.ts +0 -62
- package/dist/components/DropdownMenu/DropdownMenu.d.ts +0 -25
- package/dist/components/DropdownMenu/DropdownMenu.stories.d.ts +0 -9
- package/dist/components/FormControl/FormControl.d.ts +0 -38
- package/dist/components/FormLabel/FormLabel.d.ts +0 -41
- package/dist/components/FormLabel/FormLabel.stories.d.ts +0 -6
- package/dist/components/Formik/Formik.stories.d.ts +0 -18
- package/dist/components/Formik/FormikCheckboxInput/FormikCheckboxInput.d.ts +0 -12
- package/dist/components/Formik/FormikRadioGroup/FormikRadioGroup.d.ts +0 -12
- package/dist/components/Formik/FormikSelectInput/FormikSelectInput.d.ts +0 -13
- package/dist/components/Formik/FormikSelectInputInset/FormikSelectInputInset.d.ts +0 -12
- package/dist/components/Formik/FormikSelectInputNative/FormikSelectInputNative.d.ts +0 -12
- package/dist/components/Formik/FormikSwitch/FormikSwitch.d.ts +0 -12
- package/dist/components/Formik/FormikTextInput/FormikTextInput.d.ts +0 -12
- package/dist/components/Formik/FormikTextInputInset/FormikTextInputInset.d.ts +0 -12
- package/dist/components/Formik/FormikTextareaInput/FormikTextareaInput.d.ts +0 -12
- package/dist/components/Formik/FormikTextareaInputInset/FormikTextareaInputInset.d.ts +0 -12
- package/dist/components/Formik/FormikTimePicker/FormikTimePicker.d.ts +0 -12
- package/dist/components/Formik/FormikTimePickerNative/FormikTimePickerNative.d.ts +0 -12
- package/dist/components/Formik/FormikToggleGroup/FormikToggleGroup.d.ts +0 -20
- package/dist/components/Formik/FormikToggleGroupMulti/FormikToggleGroupMulti.d.ts +0 -18
- package/dist/components/Heading/Heading.constants.d.ts +0 -10
- package/dist/components/Heading/Heading.d.ts +0 -35
- package/dist/components/Heading/Heading.stories.d.ts +0 -9
- package/dist/components/HelpText/HelpText.d.ts +0 -12
- package/dist/components/Icon/Icon.d.ts +0 -22
- package/dist/components/Icon/Icon.stories.d.ts +0 -10
- package/dist/components/InputValidationMessage/InputValidationMessage.d.ts +0 -9
- package/dist/components/Modal/Modal.d.ts +0 -83
- package/dist/components/Modal/Modal.stories.d.ts +0 -13
- package/dist/components/Modal/components/ModalBody/ModalBody.d.ts +0 -4
- package/dist/components/Modal/components/ModalFooter/ModalFooter.d.ts +0 -4
- package/dist/components/Modal/components/ModalHeader/ModalHeader.d.ts +0 -21
- package/dist/components/Modal/components/index.d.ts +0 -4
- package/dist/components/Pagination/Pagination.d.ts +0 -51
- package/dist/components/Pagination/Pagination.stories.d.ts +0 -8
- package/dist/components/Pagination/Pagination.utilities.d.ts +0 -10
- package/dist/components/Popover/Popover.d.ts +0 -8
- package/dist/components/Popover/Popover.stories.d.ts +0 -7
- package/dist/components/RadioGroup/RadioGroup.d.ts +0 -75
- package/dist/components/RadioGroup/RadioGroup.stories.d.ts +0 -16
- package/dist/components/RadioGroup/RadioInput/RadioInput.d.ts +0 -57
- package/dist/components/RadioGroup/RadioInput/RadioInputIcon.d.ts +0 -27
- package/dist/components/RangeInput/RangeInput.d.ts +0 -29
- package/dist/components/RangeInput/RangeInput.stories.d.ts +0 -7
- package/dist/components/ResponsiveProvider/ResponsiveProvider.d.ts +0 -17
- package/dist/components/ResponsiveProvider/ResponsiveProvider.stories.d.ts +0 -7
- package/dist/components/SelectInput/SelectInput.d.ts +0 -148
- package/dist/components/SelectInput/SelectInput.stories.d.ts +0 -24
- package/dist/components/SelectInputInset/SelectInputInset.d.ts +0 -92
- package/dist/components/SelectInputInset/SelectInputInset.stories.d.ts +0 -12
- package/dist/components/SelectInputNative/SelectInputNative.d.ts +0 -45
- package/dist/components/SelectInputNative/SelectInputNative.stories.d.ts +0 -19
- package/dist/components/Sidebar/Sidebar.d.ts +0 -57
- package/dist/components/Sidebar/Sidebar.stories.d.ts +0 -9
- package/dist/components/Spinner/Spinner.d.ts +0 -12
- package/dist/components/Spinner/Spinner.stories.d.ts +0 -8
- package/dist/components/Switch/Switch.d.ts +0 -64
- package/dist/components/Switch/Switch.stories.d.ts +0 -12
- package/dist/components/Table/Table.d.ts +0 -86
- package/dist/components/Table/Table.stories.d.ts +0 -31
- package/dist/components/Table/TableBody/TableBody.d.ts +0 -52
- package/dist/components/Table/TableBody/TableBodyCell/TableBodyCell.d.ts +0 -45
- package/dist/components/Table/TableHead/TableHead.d.ts +0 -46
- package/dist/components/Table/TableHead/TableHeaderCell/TableHeaderCell.d.ts +0 -65
- package/dist/components/Table/common/TableRow/TableRow.d.ts +0 -67
- package/dist/components/TextInput/TextInput.d.ts +0 -106
- package/dist/components/TextInput/TextInput.stories.d.ts +0 -19
- package/dist/components/TextInputInset/TextInputInset.d.ts +0 -102
- package/dist/components/TextInputInset/TextInputInset.stories.d.ts +0 -13
- package/dist/components/TextareaInput/TextareaInput.d.ts +0 -97
- package/dist/components/TextareaInput/TextareaInput.stories.d.ts +0 -23
- package/dist/components/TextareaInputInset/TextareaInputInset.d.ts +0 -105
- package/dist/components/TextareaInputInset/TextareaInputInset.stories.d.ts +0 -12
- package/dist/components/ThemeProvider/ThemeProvider.d.ts +0 -15
- package/dist/components/ThemeProvider/ThemeProvider.stories.d.ts +0 -6
- package/dist/components/TimePicker/TimePicker.d.ts +0 -35
- package/dist/components/TimePicker/TimePicker.stories.d.ts +0 -12
- package/dist/components/TimePickerNative/TimePickerNative.d.ts +0 -39
- package/dist/components/TimePickerNative/TimePickerNative.stories.d.ts +0 -11
- package/dist/components/Toast/Toast.store.d.ts +0 -36
- package/dist/components/Toast/Toast.stories.d.ts +0 -14
- package/dist/components/Toast/Toast.types.d.ts +0 -75
- package/dist/components/Toast/ToastContainer.d.ts +0 -43
- package/dist/components/Toast/ToastNotification.d.ts +0 -28
- package/dist/components/Toast/index.d.ts +0 -4
- package/dist/components/Toast/toast.d.ts +0 -20
- package/dist/components/Toast/useToasts.d.ts +0 -14
- package/dist/components/Toggle/Toggle.d.ts +0 -7
- package/dist/components/Toggle/Toggle.stories.d.ts +0 -11
- package/dist/components/ToggleGroup/ToggleGroup.d.ts +0 -19
- package/dist/components/ToggleGroup/ToggleGroup.stories.d.ts +0 -12
- package/dist/components/Tooltip/Tooltip.d.ts +0 -8
- package/dist/components/Tooltip/Tooltip.stories.d.ts +0 -8
- package/dist/constants/keyCodes.d.ts +0 -2
- package/dist/css/index.css +0 -36
- package/dist/hooks/index.d.ts +0 -6
- package/dist/hooks/useBreakpoint/useBreakpoint.d.ts +0 -9
- package/dist/hooks/useBreakpoint/useBreakpoint.stories.d.ts +0 -6
- package/dist/hooks/useIsMobile/useIsMobile.d.ts +0 -1
- package/dist/hooks/useIsMobile/useIsMobile.stories.d.ts +0 -6
- package/dist/hooks/useIsomorphicLayoutEffect/useIsomorphicLayoutEffect.d.ts +0 -2
- package/dist/hooks/useOpenClose/useOpenClose.d.ts +0 -39
- package/dist/hooks/useOpenClose/useOpenClose.stories.d.ts +0 -6
- package/dist/hooks/useTheme/useTheme.d.ts +0 -5
- package/dist/hooks/useTheme/useTheme.stories.d.ts +0 -6
- package/dist/hooks/useWindowSize/useWindowSize.d.ts +0 -7
- package/dist/hooks/useWindowSize/useWindowSize.stories.d.ts +0 -6
- package/dist/lib/cssShorthandToClasses.d.ts +0 -4
- package/dist/lib/doesStringIncludeCssUnit.d.ts +0 -1
- package/dist/lib/generateResponsiveClasses.d.ts +0 -2
- package/dist/lib/getAutoCompleteValue.d.ts +0 -1
- package/dist/lib/getColumnKeys.d.ts +0 -3
- package/dist/lib/getDimensionCss.d.ts +0 -12
- package/dist/lib/getElementType.d.ts +0 -14
- package/dist/lib/getFlexCss.d.ts +0 -9
- package/dist/lib/index.d.ts +0 -15
- package/dist/lib/isFunction.d.ts +0 -3
- package/dist/lib/mergeRefs.d.ts +0 -2
- package/dist/lib/prefersReducedMotion.d.ts +0 -1
- package/dist/lib/react-children-utilities/filter.d.ts +0 -3
- package/dist/lib/react-children-utilities/index.d.ts +0 -1
- package/dist/lib/reactRouterClickHandler.d.ts +0 -12
- package/dist/lib/resolveValue.d.ts +0 -3
- package/dist/lib/tokens.d.ts +0 -22
- package/dist/modes.d.ts +0 -8
- package/dist/types/index.d.ts +0 -103
- package/dist/types/lib.types.d.ts +0 -3
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
import { Button } from './Button';
|
|
2
|
-
import type { Meta, StoryObj } from '@storybook/react-vite';
|
|
3
|
-
declare const meta: Meta<typeof Button>;
|
|
4
|
-
export default meta;
|
|
5
|
-
type Story = StoryObj<typeof Button>;
|
|
6
|
-
export declare const Default: Story;
|
|
7
|
-
export declare const AsChild: Story;
|
|
8
|
-
export declare const Variants: Story;
|
|
9
|
-
export declare const Sizes: Story;
|
|
10
|
-
export declare const FullWidth: Story;
|
|
11
|
-
export declare const Icons: Story;
|
|
12
|
-
export declare const IconButton: Story;
|
|
13
|
-
export declare const Loading: Story;
|
|
14
|
-
export declare const Disabled: Story;
|
|
15
|
-
export declare const Shadow: Story;
|
|
16
|
-
export declare const InlineLink: Story;
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { DayPickerProps, Matcher } from 'react-day-picker';
|
|
3
|
-
import 'react-day-picker/style.css';
|
|
4
|
-
export type CalendarProps = DayPickerProps;
|
|
5
|
-
declare function Calendar({ captionLayout, className, ...props }: CalendarProps): React.JSX.Element;
|
|
6
|
-
export { Calendar };
|
|
7
|
-
export type { Matcher };
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
import { Calendar } from './Calendar';
|
|
2
|
-
import type { Meta } from '@storybook/react-vite';
|
|
3
|
-
import React from 'react';
|
|
4
|
-
declare const meta: Meta<typeof Calendar>;
|
|
5
|
-
export default meta;
|
|
6
|
-
export declare const BasicUsage: () => React.JSX.Element;
|
|
7
|
-
export declare const RangeSelection: () => React.JSX.Element;
|
|
8
|
-
export declare const MultipleSelection: () => React.JSX.Element;
|
|
9
|
-
export declare const Dropdown: () => React.JSX.Element;
|
|
10
|
-
export declare const FooterContent: () => React.JSX.Element;
|
|
11
|
-
export declare const DateInput: () => React.JSX.Element;
|
|
12
|
-
export declare const DateRangeInput: () => React.JSX.Element;
|
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
import { BoxProps } from '../Box/Box';
|
|
2
|
-
import { CardFooter, CardHeader, CardSection } from './components';
|
|
3
|
-
import React, { ReactNode } from 'react';
|
|
4
|
-
export interface CardProps extends BoxProps {
|
|
5
|
-
/**
|
|
6
|
-
* The Card's contents.
|
|
7
|
-
*/
|
|
8
|
-
children?: ReactNode;
|
|
9
|
-
}
|
|
10
|
-
export declare const CardBaseComponent: React.FC<CardProps>;
|
|
11
|
-
export interface CardStatic {
|
|
12
|
-
Header: typeof CardHeader;
|
|
13
|
-
Section: typeof CardSection;
|
|
14
|
-
Footer: typeof CardFooter;
|
|
15
|
-
}
|
|
16
|
-
export type CardWithStaticComponents = typeof CardBaseComponent & CardStatic;
|
|
17
|
-
export declare const Card: CardWithStaticComponents;
|
|
@@ -1,8 +0,0 @@
|
|
|
1
|
-
import { Card } from './Card';
|
|
2
|
-
import type { Meta } from '@storybook/react-vite';
|
|
3
|
-
import React from 'react';
|
|
4
|
-
declare const meta: Meta<typeof Card>;
|
|
5
|
-
export default meta;
|
|
6
|
-
export declare const OverviewCard: () => React.JSX.Element;
|
|
7
|
-
export declare const ExampleSignUpForm: () => React.JSX.Element;
|
|
8
|
-
export declare const ExampleFullBleedPhotos: () => React.JSX.Element;
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
import { BoxProps } from '../../../Box/Box';
|
|
2
|
-
import { FC, ReactNode } from 'react';
|
|
3
|
-
export interface CardFooterProps extends BoxProps {
|
|
4
|
-
/**
|
|
5
|
-
* Contents of the Footer.
|
|
6
|
-
*/
|
|
7
|
-
children?: ReactNode;
|
|
8
|
-
/**
|
|
9
|
-
* Additional props to be spread to rendered element
|
|
10
|
-
*/
|
|
11
|
-
[x: string]: any;
|
|
12
|
-
}
|
|
13
|
-
export declare const CardFooter: FC<CardFooterProps>;
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
import { FC, ReactNode } from 'react';
|
|
2
|
-
import { BoxProps } from '../../../Box/Box';
|
|
3
|
-
export interface CardHeaderProps extends BoxProps {
|
|
4
|
-
/**
|
|
5
|
-
* The title of the card
|
|
6
|
-
*/
|
|
7
|
-
title?: ReactNode;
|
|
8
|
-
/**
|
|
9
|
-
* Description of the card, or element below the title
|
|
10
|
-
*/
|
|
11
|
-
description?: ReactNode;
|
|
12
|
-
}
|
|
13
|
-
export declare const CardHeader: FC<CardHeaderProps>;
|
|
@@ -1,46 +0,0 @@
|
|
|
1
|
-
import { BoxProps } from '../../../Box/Box';
|
|
2
|
-
import { FC, ReactNode } from 'react';
|
|
3
|
-
export interface CardSectionProps extends BoxProps {
|
|
4
|
-
/**
|
|
5
|
-
* Any valid background color token, or a `url()` for an image
|
|
6
|
-
*/
|
|
7
|
-
background?: BoxProps['background'];
|
|
8
|
-
/**
|
|
9
|
-
* If defined as a prop, this value will take higher precedence than the corresponding component design token value
|
|
10
|
-
* Any valid border color token
|
|
11
|
-
* Or a responsive prop with borderColor for each breakpoint.
|
|
12
|
-
*/
|
|
13
|
-
borderColor?: BoxProps['borderColor'];
|
|
14
|
-
/**
|
|
15
|
-
* If defined as a prop, this value will take higher precedence than the corresponding component design token value
|
|
16
|
-
* Width of the section's border
|
|
17
|
-
* Can be a single [border width token](/?path=/docs/foundation-design-tokens--docs#border-width).
|
|
18
|
-
* Can also be a string of [border width tokens](/?path=/docs/foundation-design-tokens--docs#border-width)
|
|
19
|
-
* that models itself after the css shorthand property,
|
|
20
|
-
* where you can set the border width on all four sides of an element.
|
|
21
|
-
* e.g: "0 sm xs 0" --> top: 0, right: sm, bottom: xs, left: 0;
|
|
22
|
-
*/
|
|
23
|
-
borderWidth?: BoxProps['borderWidth'];
|
|
24
|
-
/**
|
|
25
|
-
* Contents of the Section.
|
|
26
|
-
*/
|
|
27
|
-
children?: ReactNode;
|
|
28
|
-
/**
|
|
29
|
-
* Custom class to be applied to section container.
|
|
30
|
-
*/
|
|
31
|
-
className?: string;
|
|
32
|
-
/**
|
|
33
|
-
* Visually subdued the appearance of the section.
|
|
34
|
-
*/
|
|
35
|
-
subdued?: boolean;
|
|
36
|
-
/**
|
|
37
|
-
* Title for the section.
|
|
38
|
-
*/
|
|
39
|
-
title?: ReactNode;
|
|
40
|
-
/**
|
|
41
|
-
* Additional props to be spread to rendered element
|
|
42
|
-
*/
|
|
43
|
-
[x: string]: any;
|
|
44
|
-
}
|
|
45
|
-
export declare const CardSection: FC<CardSectionProps>;
|
|
46
|
-
export default CardSection;
|
|
@@ -1,72 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { CheckboxSize, CheckboxProps } from './components/Checkbox';
|
|
3
|
-
export interface CheckboxInputProps {
|
|
4
|
-
/**
|
|
5
|
-
* The id attribute of the input.
|
|
6
|
-
*/
|
|
7
|
-
id: string;
|
|
8
|
-
/**
|
|
9
|
-
* The checkbox input "checked" attribute.
|
|
10
|
-
*/
|
|
11
|
-
isChecked: boolean;
|
|
12
|
-
/**
|
|
13
|
-
* Custom content to be displayed to right of checkbox.
|
|
14
|
-
*/
|
|
15
|
-
label: string;
|
|
16
|
-
/**
|
|
17
|
-
* Callback function when input is changed.
|
|
18
|
-
*/
|
|
19
|
-
onChange: (event: React.ChangeEvent<HTMLInputElement>) => void;
|
|
20
|
-
/**
|
|
21
|
-
* Additional classes to add.
|
|
22
|
-
*/
|
|
23
|
-
className?: string;
|
|
24
|
-
/**
|
|
25
|
-
* Mark the input field as invalid and display a validation message.
|
|
26
|
-
* Pass a string or node to render a validation message below the input.
|
|
27
|
-
*/
|
|
28
|
-
error?: React.ReactNode;
|
|
29
|
-
/**
|
|
30
|
-
* Additional clarifying text to help describe the input
|
|
31
|
-
*/
|
|
32
|
-
helpText?: React.ReactNode;
|
|
33
|
-
/**
|
|
34
|
-
* Determines if the label is not shown for stylistic reasons.
|
|
35
|
-
* Note the label is still a required prop and will be used as the aria-label for accessibility reasons.
|
|
36
|
-
*/
|
|
37
|
-
hideLabel?: boolean;
|
|
38
|
-
/**
|
|
39
|
-
* If the input should be disabled and not focusable.
|
|
40
|
-
*/
|
|
41
|
-
isDisabled?: boolean;
|
|
42
|
-
/**
|
|
43
|
-
* Whether the checkbox is rendered in an indeterminate state.
|
|
44
|
-
* NOTE: this change is only visual and it does not affect the checked or unchecked state of the checkbox.
|
|
45
|
-
*/
|
|
46
|
-
isIndeterminate?: CheckboxProps['isIndeterminate'];
|
|
47
|
-
/**
|
|
48
|
-
* The required and aria-required attributes on the input
|
|
49
|
-
*/
|
|
50
|
-
isRequired?: boolean;
|
|
51
|
-
/**
|
|
52
|
-
* Callback function when input is blurred.
|
|
53
|
-
*/
|
|
54
|
-
onBlur?: (event: React.FocusEvent<HTMLInputElement>) => void;
|
|
55
|
-
/**
|
|
56
|
-
* Callback function when input is focused.
|
|
57
|
-
*/
|
|
58
|
-
onFocus?: (event: React.FocusEvent<HTMLInputElement>) => void;
|
|
59
|
-
/**
|
|
60
|
-
* Visual indicator that the field is required, that gets appended to the label
|
|
61
|
-
*/
|
|
62
|
-
requiredIndicator?: React.ReactNode;
|
|
63
|
-
/**
|
|
64
|
-
* The size of the checkbox.
|
|
65
|
-
*/
|
|
66
|
-
size?: CheckboxSize;
|
|
67
|
-
/**
|
|
68
|
-
* Additional props to be spread to rendered element
|
|
69
|
-
*/
|
|
70
|
-
[x: string]: any;
|
|
71
|
-
}
|
|
72
|
-
export declare const CheckboxInput: React.FC<CheckboxInputProps>;
|
|
@@ -1,18 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import type { Meta } from '@storybook/react-vite';
|
|
3
|
-
import { CheckboxInput } from './CheckboxInput';
|
|
4
|
-
declare const meta: Meta<typeof CheckboxInput>;
|
|
5
|
-
export default meta;
|
|
6
|
-
export declare const Basic: () => React.JSX.Element;
|
|
7
|
-
export declare const Default: () => React.JSX.Element;
|
|
8
|
-
export declare const States: () => React.JSX.Element;
|
|
9
|
-
export declare const IndeterminateCheckboxes: () => React.JSX.Element;
|
|
10
|
-
export declare const Required: () => React.JSX.Element;
|
|
11
|
-
export declare const CustomRequiredIndicator: () => React.JSX.Element;
|
|
12
|
-
export declare const Sizes: () => React.JSX.Element;
|
|
13
|
-
export declare const HelpText: () => React.JSX.Element;
|
|
14
|
-
export declare const CheckedInitialState: () => React.JSX.Element;
|
|
15
|
-
export declare const HiddenLabel: () => React.JSX.Element;
|
|
16
|
-
export declare const DisabledAndUnchecked: () => React.JSX.Element;
|
|
17
|
-
export declare const DisabledAndChecked: () => React.JSX.Element;
|
|
18
|
-
export declare const Error: () => React.JSX.Element;
|
|
@@ -1,71 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { ResponsiveProp } from '../../../types';
|
|
3
|
-
import { BoxProps } from '../../Box/Box';
|
|
4
|
-
type BaseSize = 'sm' | 'md' | 'lg';
|
|
5
|
-
export type CheckboxSize = BaseSize | ResponsiveProp<BaseSize>;
|
|
6
|
-
export interface CheckboxProps extends Omit<BoxProps, 'radius' | 'background' | 'as' | 'height'> {
|
|
7
|
-
/**
|
|
8
|
-
* The id attribute of the input.
|
|
9
|
-
*/
|
|
10
|
-
id: string;
|
|
11
|
-
/**
|
|
12
|
-
* The checkbox input "checked" attribute.
|
|
13
|
-
*/
|
|
14
|
-
isChecked: boolean;
|
|
15
|
-
/**
|
|
16
|
-
* Custom content to be displayed to right of checkbox.
|
|
17
|
-
*/
|
|
18
|
-
label: string;
|
|
19
|
-
/**
|
|
20
|
-
* Callback function when input is changed.
|
|
21
|
-
*/
|
|
22
|
-
onChange: (event: React.ChangeEvent<HTMLInputElement>) => void;
|
|
23
|
-
/**
|
|
24
|
-
* Custom class to apply to the checkbox container.
|
|
25
|
-
*/
|
|
26
|
-
className?: string;
|
|
27
|
-
/**
|
|
28
|
-
* Mark the input field as invalid and display a validation message.
|
|
29
|
-
* Pass a string or node to render a validation message below the input.
|
|
30
|
-
*/
|
|
31
|
-
error?: React.ReactNode;
|
|
32
|
-
/**
|
|
33
|
-
* id of the element that labels the Checkbox
|
|
34
|
-
*/
|
|
35
|
-
labelledby?: string;
|
|
36
|
-
/**
|
|
37
|
-
* If the input should be disabled and not focusable.
|
|
38
|
-
*/
|
|
39
|
-
isDisabled?: boolean;
|
|
40
|
-
/**
|
|
41
|
-
* If the radio input should be hidden to make way for a custom checkbox.
|
|
42
|
-
*/
|
|
43
|
-
isHidden?: boolean;
|
|
44
|
-
/**
|
|
45
|
-
* Whether the checkbox is rendered in an indeterminate state.
|
|
46
|
-
* NOTE: this change is only visual and it does not affect the checked or unchecked state of the checkbox.
|
|
47
|
-
*/
|
|
48
|
-
isIndeterminate?: boolean;
|
|
49
|
-
/**
|
|
50
|
-
* The required and aria-required attributes on the input
|
|
51
|
-
*/
|
|
52
|
-
isRequired?: boolean;
|
|
53
|
-
/**
|
|
54
|
-
* Callback function when input is blurred.
|
|
55
|
-
*/
|
|
56
|
-
onBlur?: (event: React.FocusEvent<HTMLInputElement>) => void;
|
|
57
|
-
/**
|
|
58
|
-
* Callback function when input is focused.
|
|
59
|
-
*/
|
|
60
|
-
onFocus?: (event: React.FocusEvent<HTMLInputElement>) => void;
|
|
61
|
-
/**
|
|
62
|
-
* The size of the checkbox.
|
|
63
|
-
*/
|
|
64
|
-
size?: CheckboxSize;
|
|
65
|
-
/**
|
|
66
|
-
* Value of the checkbox input element
|
|
67
|
-
*/
|
|
68
|
-
value?: string | number;
|
|
69
|
-
}
|
|
70
|
-
export declare const Checkbox: React.FC<CheckboxProps>;
|
|
71
|
-
export {};
|
|
@@ -1,27 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { BoxProps } from '../../Box/Box';
|
|
3
|
-
import { CheckboxProps } from './Checkbox';
|
|
4
|
-
export interface CheckboxIconProps extends BoxProps {
|
|
5
|
-
/**
|
|
6
|
-
* Custom className to be applied to root node of component.
|
|
7
|
-
*/
|
|
8
|
-
className?: string;
|
|
9
|
-
/**
|
|
10
|
-
* Whether the input is in an error state. The icon will visually change accordingly.
|
|
11
|
-
*/
|
|
12
|
-
error?: CheckboxProps['error'];
|
|
13
|
-
/**
|
|
14
|
-
* The checkbox input "checked" attribute.
|
|
15
|
-
*/
|
|
16
|
-
isChecked?: CheckboxProps['isChecked'];
|
|
17
|
-
/**
|
|
18
|
-
* If the input should be disabled and not focusable.
|
|
19
|
-
*/
|
|
20
|
-
isDisabled?: CheckboxProps['isDisabled'];
|
|
21
|
-
/**
|
|
22
|
-
* Whether the checkbox is rendered in an indeterminate state.
|
|
23
|
-
* NOTE: this change is only visual and it does not affect the checked or unchecked state of the checkbox.
|
|
24
|
-
*/
|
|
25
|
-
isIndeterminate?: CheckboxProps['isIndeterminate'];
|
|
26
|
-
}
|
|
27
|
-
export declare const CheckboxIcon: React.FC<CheckboxIconProps>;
|
|
@@ -1,5 +0,0 @@
|
|
|
1
|
-
import * as CollapsiblePrimitive from '@radix-ui/react-collapsible';
|
|
2
|
-
declare const Collapsible: import("react").ForwardRefExoticComponent<CollapsiblePrimitive.CollapsibleProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
3
|
-
declare const CollapsibleTrigger: import("react").ForwardRefExoticComponent<CollapsiblePrimitive.CollapsibleTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
|
|
4
|
-
declare const CollapsibleContent: import("react").ForwardRefExoticComponent<CollapsiblePrimitive.CollapsibleContentProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
5
|
-
export { Collapsible, CollapsibleTrigger, CollapsibleContent };
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import type { Meta, StoryObj } from '@storybook/react-vite';
|
|
3
|
-
import { Collapsible } from './Collapsible';
|
|
4
|
-
declare const meta: Meta<typeof Collapsible>;
|
|
5
|
-
export default meta;
|
|
6
|
-
type Story = StoryObj<typeof Collapsible>;
|
|
7
|
-
export declare const Uncontrolled: () => React.JSX.Element;
|
|
8
|
-
export declare function Controlled(): React.JSX.Element;
|
|
9
|
-
export declare const ClickOpenCollapsible: Story;
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { DetailsSummary } from './DetailsSummary';
|
|
3
|
-
import { BoxProps } from '../Box/Box';
|
|
4
|
-
export interface DetailsProps extends BoxProps {
|
|
5
|
-
/**
|
|
6
|
-
* Whether the details below the summary are opened. Directly corresponds to `open` property in <details> element.
|
|
7
|
-
*/
|
|
8
|
-
isOpen: boolean;
|
|
9
|
-
}
|
|
10
|
-
export declare const DetailsBaseComponent: React.FC<DetailsProps>;
|
|
11
|
-
export interface DetailsStatic {
|
|
12
|
-
Summary: typeof DetailsSummary;
|
|
13
|
-
}
|
|
14
|
-
export type DetailsWithStaticComponents = typeof DetailsBaseComponent & DetailsStatic;
|
|
15
|
-
export declare const Details: DetailsWithStaticComponents;
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
import React, { MouseEvent, KeyboardEvent } from 'react';
|
|
2
|
-
import { BoxProps } from '../Box/Box';
|
|
3
|
-
export interface DetailsSummaryProps extends BoxProps {
|
|
4
|
-
isDetailsOpen: boolean;
|
|
5
|
-
onToggle?: (event: MouseEvent<HTMLElement> | KeyboardEvent<HTMLElement>) => void;
|
|
6
|
-
}
|
|
7
|
-
export declare const DetailsSummary: React.FC<DetailsSummaryProps>;
|
|
@@ -1,105 +0,0 @@
|
|
|
1
|
-
import React, { RefObject } from 'react';
|
|
2
|
-
import { DimensionSize, CssDimensionValue } from '../../types';
|
|
3
|
-
import { BoxProps } from '../Box/Box';
|
|
4
|
-
interface DrawerContextProps {
|
|
5
|
-
open: boolean;
|
|
6
|
-
setOpen: (open: boolean) => void;
|
|
7
|
-
toggleDrawer: () => void;
|
|
8
|
-
}
|
|
9
|
-
export declare function useDrawer(): DrawerContextProps;
|
|
10
|
-
interface DrawerProviderProps extends React.ComponentProps<'div'> {
|
|
11
|
-
defaultIsOpen?: boolean;
|
|
12
|
-
open?: boolean;
|
|
13
|
-
onOpenChange?: (open: boolean) => void;
|
|
14
|
-
}
|
|
15
|
-
export declare const DrawerProvider: React.ForwardRefExoticComponent<Omit<DrawerProviderProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
16
|
-
declare const DrawerTrigger: React.ForwardRefExoticComponent<Omit<React.ClassAttributes<HTMLButtonElement> & React.ButtonHTMLAttributes<HTMLButtonElement> & {
|
|
17
|
-
asChild?: boolean;
|
|
18
|
-
}, "ref"> & React.RefAttributes<HTMLButtonElement>>;
|
|
19
|
-
export type DrawerPlacementType = 'left' | 'right' | 'top' | 'bottom';
|
|
20
|
-
export interface DrawerProps {
|
|
21
|
-
/**
|
|
22
|
-
* If the drawer is open (controlled mode)
|
|
23
|
-
*/
|
|
24
|
-
isOpen?: boolean;
|
|
25
|
-
/**
|
|
26
|
-
* If the drawer starts open (uncontrolled mode)
|
|
27
|
-
*/
|
|
28
|
-
defaultIsOpen?: boolean;
|
|
29
|
-
/**
|
|
30
|
-
* Handle zoom/pinch gestures on iOS devices when scroll locking is enabled.
|
|
31
|
-
*/
|
|
32
|
-
allowPinchZoom?: boolean;
|
|
33
|
-
/**
|
|
34
|
-
* A drawer needs to be properly labeled to provide context for users with
|
|
35
|
-
* assistive technology such as screen readers. If a drawer is announced to
|
|
36
|
-
* the user without a label, it can be confusing and difficult to navigate.
|
|
37
|
-
*/
|
|
38
|
-
ariaLabel?: string;
|
|
39
|
-
/**
|
|
40
|
-
* The id of the element that should be used as the drawer's label by assistive technologies like screen readers.
|
|
41
|
-
*/
|
|
42
|
-
ariaLabelledBy?: string;
|
|
43
|
-
/**
|
|
44
|
-
* Contents of the dialog.
|
|
45
|
-
*/
|
|
46
|
-
children?: React.ReactNode;
|
|
47
|
-
/**
|
|
48
|
-
* Additional class names to add to the drawer content.
|
|
49
|
-
*/
|
|
50
|
-
className?: string;
|
|
51
|
-
/**
|
|
52
|
-
* If true, the drawer will close when the overlay is clicked
|
|
53
|
-
*/
|
|
54
|
-
closeOnOverlayClick?: boolean;
|
|
55
|
-
/**
|
|
56
|
-
* The ref of the container where the drawer will be inserted into the DOM.
|
|
57
|
-
* By default, drawers are inserted in the document.body, but if need be they can
|
|
58
|
-
* be scoped as necessary.
|
|
59
|
-
*/
|
|
60
|
-
containerRef?: React.RefObject<Node>;
|
|
61
|
-
/**
|
|
62
|
-
* By default, focus is trapped within the drawer.
|
|
63
|
-
* If true, focus will not be trapped within the contents of the drawer.
|
|
64
|
-
*/
|
|
65
|
-
dangerouslyBypassFocusLock?: boolean;
|
|
66
|
-
/**
|
|
67
|
-
* By default, the drawer locks scrolling on the body, but in some cases you may want to allow for scrolling.
|
|
68
|
-
* If true, this will allow the body to scroll while the drawer is open.
|
|
69
|
-
*/
|
|
70
|
-
dangerouslyBypassScrollLock?: boolean;
|
|
71
|
-
/**
|
|
72
|
-
* If true, the overlay will not be rendered, scrolling for the entire page will remain enabled,
|
|
73
|
-
* and focus will not be locked to the contents of the drawer
|
|
74
|
-
*/
|
|
75
|
-
hideOverlay?: boolean;
|
|
76
|
-
/**
|
|
77
|
-
* By default the first focusable element will receive focus when the dialog
|
|
78
|
-
* opens but you can provide a ref to focus instead.
|
|
79
|
-
*
|
|
80
|
-
* @see Docs https://reach.tech/dialog#dialog-initialfocusref
|
|
81
|
-
*/
|
|
82
|
-
initialFocusRef?: RefObject<HTMLDivElement>;
|
|
83
|
-
/**
|
|
84
|
-
* Which edge of the viewport should the drawer appear from
|
|
85
|
-
*/
|
|
86
|
-
placement?: DrawerPlacementType;
|
|
87
|
-
/**
|
|
88
|
-
* Function that is called whenever the user either hits
|
|
89
|
-
* the "Escape" key, clicks the close button icon, or clicks the overlay.
|
|
90
|
-
*/
|
|
91
|
-
onDismiss?: (event?: React.SyntheticEvent) => void;
|
|
92
|
-
/**
|
|
93
|
-
* The width of the Drawer when opened. Can be given a standard css value (px, rem, em, %),
|
|
94
|
-
* or a [width token](/?path=/story/design-tokens-design-tokens--page#width)
|
|
95
|
-
*/
|
|
96
|
-
width?: DimensionSize | CssDimensionValue;
|
|
97
|
-
}
|
|
98
|
-
declare const Drawer: React.FC<DrawerProps>;
|
|
99
|
-
declare const DrawerHeader: React.ForwardRefExoticComponent<Omit<BoxProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
100
|
-
declare const DrawerTitle: React.ForwardRefExoticComponent<Omit<BoxProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
101
|
-
declare const DrawerCloseButton: React.ForwardRefExoticComponent<import("../Button/Button").BaseButtonProps & React.ButtonHTMLAttributes<HTMLButtonElement> & {
|
|
102
|
-
onClose?: () => void;
|
|
103
|
-
} & React.RefAttributes<HTMLButtonElement>>;
|
|
104
|
-
declare const DrawerContent: React.ForwardRefExoticComponent<Omit<BoxProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
105
|
-
export { Drawer, DrawerContent, DrawerHeader, DrawerTitle, DrawerTrigger, DrawerCloseButton, };
|
|
@@ -1,62 +0,0 @@
|
|
|
1
|
-
import { Drawer } from './Drawer';
|
|
2
|
-
import type { Meta, StoryObj } from '@storybook/react-vite';
|
|
3
|
-
import React from 'react';
|
|
4
|
-
declare const meta: Meta<typeof Drawer>;
|
|
5
|
-
export default meta;
|
|
6
|
-
type Story = StoryObj<typeof Drawer>;
|
|
7
|
-
export declare const UncontrolledWithProvider: () => React.JSX.Element;
|
|
8
|
-
export declare const OpenUncontrolledWithProvider: Story;
|
|
9
|
-
export declare const ControlledWithoutProvider: {
|
|
10
|
-
(): React.JSX.Element;
|
|
11
|
-
parameters: {
|
|
12
|
-
chromatic: {
|
|
13
|
-
disableSnapshot: boolean;
|
|
14
|
-
};
|
|
15
|
-
};
|
|
16
|
-
};
|
|
17
|
-
export declare const OpenControlledControlledWithoutProvider: Story;
|
|
18
|
-
export declare const DefaultIsOpen: () => React.JSX.Element;
|
|
19
|
-
export declare const Placement: {
|
|
20
|
-
(): React.JSX.Element;
|
|
21
|
-
parameters: {
|
|
22
|
-
chromatic: {
|
|
23
|
-
disableSnapshot: boolean;
|
|
24
|
-
};
|
|
25
|
-
};
|
|
26
|
-
};
|
|
27
|
-
export declare const OpenBottomDrawer: Story;
|
|
28
|
-
export declare const Width: {
|
|
29
|
-
(): React.JSX.Element;
|
|
30
|
-
parameters: {
|
|
31
|
-
chromatic: {
|
|
32
|
-
disableSnapshot: boolean;
|
|
33
|
-
};
|
|
34
|
-
};
|
|
35
|
-
};
|
|
36
|
-
export declare const HiddenOverlay: {
|
|
37
|
-
(): React.JSX.Element;
|
|
38
|
-
parameters: {
|
|
39
|
-
chromatic: {
|
|
40
|
-
disableSnapshot: boolean;
|
|
41
|
-
};
|
|
42
|
-
};
|
|
43
|
-
};
|
|
44
|
-
export declare const OpenHiddenOverlay: Story;
|
|
45
|
-
export declare const InitialFocusRef: {
|
|
46
|
-
(): React.JSX.Element;
|
|
47
|
-
parameters: {
|
|
48
|
-
chromatic: {
|
|
49
|
-
disableSnapshot: boolean;
|
|
50
|
-
};
|
|
51
|
-
};
|
|
52
|
-
};
|
|
53
|
-
export declare const OpenInitialFocusRef: Story;
|
|
54
|
-
export declare const ContainedDrawer: {
|
|
55
|
-
(): React.JSX.Element;
|
|
56
|
-
parameters: {
|
|
57
|
-
chromatic: {
|
|
58
|
-
disableSnapshot: boolean;
|
|
59
|
-
};
|
|
60
|
-
};
|
|
61
|
-
};
|
|
62
|
-
export declare const OpenContainedDrawer: Story;
|
|
@@ -1,25 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
|
|
3
|
-
declare const DropdownMenu: React.FC<DropdownMenuPrimitive.DropdownMenuProps>;
|
|
4
|
-
declare const DropdownMenuTrigger: React.ForwardRefExoticComponent<DropdownMenuPrimitive.DropdownMenuTriggerProps & React.RefAttributes<HTMLButtonElement>>;
|
|
5
|
-
declare const DropdownMenuGroup: React.ForwardRefExoticComponent<DropdownMenuPrimitive.DropdownMenuGroupProps & React.RefAttributes<HTMLDivElement>>;
|
|
6
|
-
declare const DropdownMenuPortal: React.FC<DropdownMenuPrimitive.DropdownMenuPortalProps>;
|
|
7
|
-
declare const DropdownMenuSub: React.FC<DropdownMenuPrimitive.DropdownMenuSubProps>;
|
|
8
|
-
declare const DropdownMenuRadioGroup: React.ForwardRefExoticComponent<DropdownMenuPrimitive.DropdownMenuRadioGroupProps & React.RefAttributes<HTMLDivElement>>;
|
|
9
|
-
declare const DropdownMenuItem: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
|
|
10
|
-
inset?: boolean;
|
|
11
|
-
} & React.RefAttributes<HTMLDivElement>>;
|
|
12
|
-
declare const DropdownMenuContent: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
13
|
-
declare const DropdownMenuLabel: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuLabelProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
|
|
14
|
-
inset?: boolean;
|
|
15
|
-
} & React.RefAttributes<HTMLDivElement>>;
|
|
16
|
-
declare const DropdownMenuSeparator: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuSeparatorProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
17
|
-
declare const DropdownMenuShortcut: {
|
|
18
|
-
({ className, ...props }: React.HTMLAttributes<HTMLSpanElement>): React.JSX.Element;
|
|
19
|
-
displayName: string;
|
|
20
|
-
};
|
|
21
|
-
declare const DropdownMenuSubTrigger: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuSubTriggerProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
|
|
22
|
-
inset?: boolean;
|
|
23
|
-
} & React.RefAttributes<HTMLDivElement>>;
|
|
24
|
-
declare const DropdownMenuSubContent: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuSubContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
25
|
-
export { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuGroup, DropdownMenuPortal, DropdownMenuSub, DropdownMenuRadioGroup, };
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import type { Meta, StoryObj } from '@storybook/react-vite';
|
|
3
|
-
import { DropdownMenu } from './DropdownMenu';
|
|
4
|
-
declare const meta: Meta<typeof DropdownMenu>;
|
|
5
|
-
export default meta;
|
|
6
|
-
type Story = StoryObj<typeof DropdownMenu>;
|
|
7
|
-
export declare const Uncontrolled: () => React.JSX.Element;
|
|
8
|
-
export declare const Controlled: () => React.JSX.Element;
|
|
9
|
-
export declare const ClickOpenDropdown: Story;
|
|
@@ -1,38 +0,0 @@
|
|
|
1
|
-
import React, { ReactNode } from 'react';
|
|
2
|
-
import { BoxProps } from '../Box/Box';
|
|
3
|
-
export interface FormControlProps extends BoxProps {
|
|
4
|
-
/**
|
|
5
|
-
* The input's id attribute. Used to programmatically tie the input with its label.
|
|
6
|
-
*/
|
|
7
|
-
id: string;
|
|
8
|
-
/**
|
|
9
|
-
* Custom content to be displayed above the input. If the label is hidden, will be used to set aria-label attribute.
|
|
10
|
-
*/
|
|
11
|
-
label: string;
|
|
12
|
-
/**
|
|
13
|
-
* Mark the input field as invalid and display a validation message.
|
|
14
|
-
* Pass a string or node to render a validation message below the input.
|
|
15
|
-
*/
|
|
16
|
-
error?: ReactNode;
|
|
17
|
-
/**
|
|
18
|
-
* Visually hide the label.
|
|
19
|
-
*/
|
|
20
|
-
hideLabel?: boolean;
|
|
21
|
-
/**
|
|
22
|
-
* Additional clarifying text to help describe the input
|
|
23
|
-
*/
|
|
24
|
-
helpText?: ReactNode;
|
|
25
|
-
/**
|
|
26
|
-
* The input's disabled attribute
|
|
27
|
-
*/
|
|
28
|
-
isDisabled?: boolean;
|
|
29
|
-
/**
|
|
30
|
-
* The required and aria-required attributes on the input
|
|
31
|
-
*/
|
|
32
|
-
isRequired?: boolean;
|
|
33
|
-
/**
|
|
34
|
-
* Visual indicator that the field is required, that gets appended to the label
|
|
35
|
-
*/
|
|
36
|
-
requiredIndicator?: ReactNode;
|
|
37
|
-
}
|
|
38
|
-
export declare const FormControl: React.ForwardRefExoticComponent<Omit<FormControlProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
|