@getufy/flint-ui-react 0.2.1 → 1.0.0
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/README.md +156 -12
- package/dist/accordion.d.ts +6 -0
- package/dist/accordion.js +63 -0
- package/dist/alert.d.ts +2 -0
- package/dist/alert.js +21 -0
- package/dist/app-bar.d.ts +1 -0
- package/dist/app-bar.js +12 -0
- package/dist/autocomplete.d.ts +2 -0
- package/dist/autocomplete.js +21 -0
- package/dist/avatar.d.ts +1 -0
- package/dist/avatar.js +12 -0
- package/dist/backdrop.d.ts +2 -0
- package/dist/backdrop.js +21 -0
- package/dist/badge.d.ts +1 -0
- package/dist/badge.js +12 -0
- package/dist/bottom-navigation.d.ts +3 -0
- package/dist/bottom-navigation.js +32 -0
- package/dist/box.d.ts +2 -0
- package/dist/box.js +21 -0
- package/dist/breadcrumbs.d.ts +1 -0
- package/dist/breadcrumbs.js +12 -0
- package/dist/button.d.ts +6 -0
- package/dist/button.js +63 -0
- package/dist/card.d.ts +6 -0
- package/dist/card.js +67 -0
- package/dist/carousel.d.ts +6 -0
- package/dist/carousel.js +65 -0
- package/dist/checkbox.d.ts +2 -0
- package/dist/checkbox.js +21 -0
- package/dist/chip.d.ts +2 -0
- package/dist/chip.js +23 -0
- package/dist/collapsible.d.ts +4 -0
- package/dist/collapsible.js +43 -0
- package/dist/command.d.ts +12 -0
- package/dist/command.js +127 -0
- package/dist/components/FlintAccordion.d.ts +19 -5
- package/dist/components/FlintAccordionActions.d.ts +6 -2
- package/dist/components/FlintAccordionDetails.d.ts +8 -2
- package/dist/components/FlintAccordionSummary.d.ts +11 -5
- package/dist/components/FlintAlert.d.ts +21 -5
- package/dist/components/FlintAppBar.d.ts +16 -2
- package/dist/components/FlintAutocomplete.d.ts +22 -5
- package/dist/components/FlintAvatar.d.ts +13 -2
- package/dist/components/FlintBackdrop.d.ts +19 -5
- package/dist/components/FlintBadge.d.ts +18 -2
- package/dist/components/FlintBottomNavigation.d.ts +16 -5
- package/dist/components/FlintBottomNavigationAction.d.ts +17 -2
- package/dist/components/FlintBox.d.ts +67 -5
- package/dist/components/FlintBreadcrumbs.d.ts +18 -2
- package/dist/components/FlintButton.d.ts +11 -2
- package/dist/components/FlintButtonGroup.d.ts +3 -2
- package/dist/components/FlintCard.d.ts +5 -2
- package/dist/components/FlintCardActionArea.d.ts +3 -2
- package/dist/components/FlintCardActions.d.ts +3 -2
- package/dist/components/FlintCardContent.d.ts +3 -2
- package/dist/components/FlintCardHeader.d.ts +12 -2
- package/dist/components/FlintCardMedia.d.ts +6 -2
- package/dist/components/FlintCarousel.d.ts +24 -5
- package/dist/components/FlintCarouselContent.d.ts +9 -2
- package/dist/components/FlintCarouselItem.d.ts +3 -2
- package/dist/components/FlintCarouselNext.d.ts +12 -2
- package/dist/components/FlintCarouselPrevious.d.ts +12 -2
- package/dist/components/FlintCheckbox.d.ts +33 -5
- package/dist/components/FlintChip.d.ts +29 -6
- package/dist/components/FlintCircularProgress.d.ts +18 -2
- package/dist/components/FlintCollapsible.d.ts +22 -5
- package/dist/components/FlintCollapsibleContent.d.ts +11 -2
- package/dist/components/FlintCollapsibleTrigger.d.ts +13 -2
- package/dist/components/FlintCommand.d.ts +11 -5
- package/dist/components/FlintCommandDialog.d.ts +17 -5
- package/dist/components/FlintCommandEmpty.d.ts +9 -2
- package/dist/components/FlintCommandGroup.d.ts +11 -2
- package/dist/components/FlintCommandInput.d.ts +11 -2
- package/dist/components/FlintCommandItem.d.ts +22 -5
- package/dist/components/FlintCommandList.d.ts +8 -2
- package/dist/components/FlintCommandSeparator.d.ts +6 -2
- package/dist/components/FlintCommandShortcut.d.ts +9 -2
- package/dist/components/FlintContainer.d.ts +9 -2
- package/dist/components/FlintCopyButton.d.ts +32 -6
- package/dist/components/FlintDateField.d.ts +34 -6
- package/dist/components/FlintDatePicker.d.ts +35 -5
- package/dist/components/FlintDatePickerCalendar.d.ts +20 -5
- package/dist/components/FlintDateRangeCalendar.d.ts +17 -5
- package/dist/components/FlintDateRangePicker.d.ts +36 -5
- package/dist/components/FlintDesktopTimePicker.d.ts +29 -5
- package/dist/components/FlintDialog.d.ts +23 -5
- package/dist/components/FlintDialogActions.d.ts +9 -2
- package/dist/components/FlintDialogContent.d.ts +6 -2
- package/dist/components/FlintDialogContentText.d.ts +6 -2
- package/dist/components/FlintDialogTitle.d.ts +7 -2
- package/dist/components/FlintDigitalClock.d.ts +17 -5
- package/dist/components/FlintDivider.d.ts +16 -2
- package/dist/components/FlintDrawer.d.ts +27 -5
- package/dist/components/FlintEmpty.d.ts +10 -2
- package/dist/components/FlintEmptyContent.d.ts +8 -2
- package/dist/components/FlintEmptyDescription.d.ts +8 -2
- package/dist/components/FlintEmptyHeader.d.ts +8 -2
- package/dist/components/FlintEmptyMedia.d.ts +10 -2
- package/dist/components/FlintEmptyTitle.d.ts +8 -2
- package/dist/components/FlintFab.d.ts +15 -2
- package/dist/components/FlintFormatDate.d.ts +39 -2
- package/dist/components/FlintFormatNumber.d.ts +39 -2
- package/dist/components/FlintGrid.d.ts +35 -2
- package/dist/components/FlintHoverCard.d.ts +13 -2
- package/dist/components/FlintHoverCardContent.d.ts +15 -2
- package/dist/components/FlintHoverCardTrigger.d.ts +9 -2
- package/dist/components/FlintImageComparer.d.ts +19 -5
- package/dist/components/FlintImageList.d.ts +19 -2
- package/dist/components/FlintImageListItem.d.ts +21 -2
- package/dist/components/FlintImageListItemBar.d.ts +12 -2
- package/dist/components/FlintInput.d.ts +44 -6
- package/dist/components/FlintInputOtp.d.ts +36 -6
- package/dist/components/FlintInputOtpGroup.d.ts +9 -2
- package/dist/components/FlintInputOtpSeparator.d.ts +7 -2
- package/dist/components/FlintInputOtpSlot.d.ts +15 -2
- package/dist/components/FlintItem.d.ts +15 -2
- package/dist/components/FlintItemActions.d.ts +9 -2
- package/dist/components/FlintItemContent.d.ts +8 -2
- package/dist/components/FlintItemDescription.d.ts +8 -2
- package/dist/components/FlintItemFooter.d.ts +10 -2
- package/dist/components/FlintItemGroup.d.ts +8 -2
- package/dist/components/FlintItemHeader.d.ts +10 -2
- package/dist/components/FlintItemMedia.d.ts +10 -2
- package/dist/components/FlintItemSeparator.d.ts +6 -2
- package/dist/components/FlintItemTitle.d.ts +8 -2
- package/dist/components/FlintKbd.d.ts +15 -2
- package/dist/components/FlintKbdGroup.d.ts +9 -2
- package/dist/components/FlintLinearProgress.d.ts +16 -2
- package/dist/components/FlintLink.d.ts +27 -2
- package/dist/components/FlintList.d.ts +10 -2
- package/dist/components/FlintListItem.d.ts +6 -2
- package/dist/components/FlintListItemAvatar.d.ts +6 -2
- package/dist/components/FlintListItemButton.d.ts +10 -2
- package/dist/components/FlintListItemIcon.d.ts +6 -2
- package/dist/components/FlintListItemText.d.ts +10 -2
- package/dist/components/FlintListSubheader.d.ts +6 -2
- package/dist/components/FlintMenu.d.ts +24 -5
- package/dist/components/FlintMenuDivider.d.ts +6 -2
- package/dist/components/FlintMenuGroup.d.ts +11 -2
- package/dist/components/FlintMenuItem.d.ts +23 -5
- package/dist/components/FlintMenubar.d.ts +11 -2
- package/dist/components/FlintMenubarCheckboxItem.d.ts +20 -5
- package/dist/components/FlintMenubarContent.d.ts +13 -5
- package/dist/components/FlintMenubarGroup.d.ts +8 -2
- package/dist/components/FlintMenubarItem.d.ts +21 -5
- package/dist/components/FlintMenubarMenu.d.ts +8 -2
- package/dist/components/FlintMenubarRadioGroup.d.ts +13 -5
- package/dist/components/FlintMenubarRadioItem.d.ts +18 -5
- package/dist/components/FlintMenubarSeparator.d.ts +6 -2
- package/dist/components/FlintMenubarShortcut.d.ts +8 -2
- package/dist/components/FlintMenubarSub.d.ts +7 -2
- package/dist/components/FlintMenubarSubContent.d.ts +9 -2
- package/dist/components/FlintMenubarSubTrigger.d.ts +14 -2
- package/dist/components/FlintMenubarTrigger.d.ts +12 -2
- package/dist/components/FlintMobileStepper.d.ts +21 -2
- package/dist/components/FlintMobileTimePicker.d.ts +24 -5
- package/dist/components/FlintMultiSectionDigitalClock.d.ts +17 -5
- package/dist/components/FlintNavigationMenu.d.ts +8 -2
- package/dist/components/FlintNavigationMenuContent.d.ts +20 -5
- package/dist/components/FlintNavigationMenuItem.d.ts +18 -6
- package/dist/components/FlintNavigationMenuLink.d.ts +16 -2
- package/dist/components/FlintNavigationMenuList.d.ts +12 -2
- package/dist/components/FlintNavigationMenuTrigger.d.ts +12 -5
- package/dist/components/FlintPagination.d.ts +48 -5
- package/dist/components/FlintPaper.d.ts +13 -2
- package/dist/components/FlintRadio.d.ts +25 -5
- package/dist/components/FlintRadioGroup.d.ts +27 -5
- package/dist/components/FlintRangeSlider.d.ts +23 -5
- package/dist/components/FlintRating.d.ts +31 -5
- package/dist/components/FlintRelativeTime.d.ts +17 -2
- package/dist/components/FlintResizableGroup.d.ts +16 -7
- package/dist/components/FlintResizableHandle.d.ts +8 -2
- package/dist/components/FlintResizablePanel.d.ts +15 -2
- package/dist/components/FlintRichTreeView.d.ts +50 -8
- package/dist/components/FlintScrollArea.d.ts +15 -2
- package/dist/components/FlintScrollBar.d.ts +11 -2
- package/dist/components/FlintSelect.d.ts +40 -5
- package/dist/components/FlintSimpleTreeView.d.ts +28 -6
- package/dist/components/FlintSingleInputDateRangeField.d.ts +31 -6
- package/dist/components/FlintSkeleton.d.ts +18 -2
- package/dist/components/FlintSlider.d.ts +35 -5
- package/dist/components/FlintSnackbar.d.ts +36 -6
- package/dist/components/FlintSpeedDial.d.ts +28 -2
- package/dist/components/FlintSpeedDialAction.d.ts +24 -5
- package/dist/components/FlintSplitPanel.d.ts +31 -5
- package/dist/components/FlintStack.d.ts +13 -2
- package/dist/components/FlintStaticTimePicker.d.ts +14 -5
- package/dist/components/FlintStep.d.ts +39 -5
- package/dist/components/FlintStepConnector.d.ts +7 -2
- package/dist/components/FlintStepContent.d.ts +10 -2
- package/dist/components/FlintStepLabel.d.ts +15 -2
- package/dist/components/FlintStepper.d.ts +20 -5
- package/dist/components/FlintSwitch.d.ts +33 -5
- package/dist/components/FlintTab.d.ts +23 -5
- package/dist/components/FlintTabList.d.ts +14 -5
- package/dist/components/FlintTabPanel.d.ts +5 -2
- package/dist/components/FlintTable.d.ts +8 -2
- package/dist/components/FlintTableBody.d.ts +8 -2
- package/dist/components/FlintTableCell.d.ts +12 -2
- package/dist/components/FlintTableContainer.d.ts +10 -2
- package/dist/components/FlintTableFooter.d.ts +6 -2
- package/dist/components/FlintTableHead.d.ts +6 -2
- package/dist/components/FlintTablePagination.d.ts +32 -6
- package/dist/components/FlintTableRow.d.ts +10 -2
- package/dist/components/FlintTableSortLabel.d.ts +7 -2
- package/dist/components/FlintTabs.d.ts +27 -5
- package/dist/components/FlintTextField.d.ts +36 -6
- package/dist/components/FlintTextarea.d.ts +52 -6
- package/dist/components/FlintTimeClock.d.ts +21 -6
- package/dist/components/FlintTimeField.d.ts +31 -6
- package/dist/components/FlintTimePicker.d.ts +26 -5
- package/dist/components/FlintToaster.d.ts +13 -2
- package/dist/components/FlintToggle.d.ts +27 -5
- package/dist/components/FlintToggleButton.d.ts +20 -5
- package/dist/components/FlintToggleButtonGroup.d.ts +17 -5
- package/dist/components/FlintTooltip.d.ts +19 -2
- package/dist/components/FlintTransferList.d.ts +25 -5
- package/dist/components/FlintTreeItem.d.ts +34 -6
- package/dist/components/FlintTypography.d.ts +22 -2
- package/dist/components/FlintVisuallyHidden.d.ts +11 -2
- package/dist/container.d.ts +1 -0
- package/dist/container.js +12 -0
- package/dist/copy-button.d.ts +2 -0
- package/dist/copy-button.js +23 -0
- package/dist/date-field.d.ts +2 -0
- package/dist/date-field.js +23 -0
- package/dist/date-picker.d.ts +4 -0
- package/dist/date-picker.js +41 -0
- package/dist/date-range-picker.d.ts +6 -0
- package/dist/date-range-picker.js +63 -0
- package/dist/dialog.d.ts +6 -0
- package/dist/dialog.js +65 -0
- package/dist/divider.d.ts +1 -0
- package/dist/divider.js +12 -0
- package/dist/drawer.d.ts +2 -0
- package/dist/drawer.js +21 -0
- package/dist/empty.d.ts +6 -0
- package/dist/empty.js +67 -0
- package/dist/fab.d.ts +1 -0
- package/dist/fab.js +12 -0
- package/dist/flint-range-slider.d.ts +2 -0
- package/dist/flint-range-slider.js +21 -0
- package/dist/format-date.d.ts +1 -0
- package/dist/format-date.js +12 -0
- package/dist/format-number.d.ts +1 -0
- package/dist/format-number.js +12 -0
- package/dist/grid.d.ts +1 -0
- package/dist/grid.js +12 -0
- package/dist/hover-card.d.ts +3 -0
- package/dist/hover-card.js +34 -0
- package/dist/image-comparer.d.ts +2 -0
- package/dist/image-comparer.js +21 -0
- package/dist/image-list.d.ts +3 -0
- package/dist/image-list.js +34 -0
- package/dist/input-otp.d.ts +5 -0
- package/dist/input-otp.js +56 -0
- package/dist/input.d.ts +2 -0
- package/dist/input.js +23 -0
- package/dist/item.d.ts +10 -0
- package/dist/item.js +111 -0
- package/dist/kbd.d.ts +2 -0
- package/dist/kbd.js +23 -0
- package/dist/link.d.ts +1 -0
- package/dist/link.js +12 -0
- package/dist/list.d.ts +7 -0
- package/dist/list.js +78 -0
- package/dist/menu.d.ts +6 -0
- package/dist/menu.js +63 -0
- package/dist/menubar.d.ts +19 -0
- package/dist/menubar.js +200 -0
- package/dist/navigation-menu.d.ts +9 -0
- package/dist/navigation-menu.js +96 -0
- package/dist/pagination.d.ts +2 -0
- package/dist/pagination.js +21 -0
- package/dist/paper.d.ts +1 -0
- package/dist/paper.js +12 -0
- package/dist/progress.d.ts +2 -0
- package/dist/progress.js +23 -0
- package/dist/radio.d.ts +4 -0
- package/dist/radio.js +41 -0
- package/dist/rating.d.ts +2 -0
- package/dist/rating.js +21 -0
- package/dist/relative-time.d.ts +1 -0
- package/dist/relative-time.js +12 -0
- package/dist/resizable.d.ts +4 -0
- package/dist/resizable.js +47 -0
- package/dist/scroll-area.d.ts +2 -0
- package/dist/scroll-area.js +23 -0
- package/dist/select.d.ts +2 -0
- package/dist/select.js +21 -0
- package/dist/skeleton.d.ts +1 -0
- package/dist/skeleton.js +12 -0
- package/dist/slider.d.ts +2 -0
- package/dist/slider.js +21 -0
- package/dist/snackbar.d.ts +2 -0
- package/dist/snackbar.js +23 -0
- package/dist/sonner.d.ts +1 -0
- package/dist/sonner.js +12 -0
- package/dist/speed-dial.d.ts +3 -0
- package/dist/speed-dial.js +32 -0
- package/dist/split-panel.d.ts +2 -0
- package/dist/split-panel.js +21 -0
- package/dist/stack.d.ts +1 -0
- package/dist/stack.js +12 -0
- package/dist/stepper.d.ts +8 -0
- package/dist/stepper.js +85 -0
- package/dist/switch.d.ts +2 -0
- package/dist/switch.js +21 -0
- package/dist/table.d.ts +10 -0
- package/dist/table.js +111 -0
- package/dist/tabs.d.ts +7 -0
- package/dist/tabs.js +72 -0
- package/dist/text-field.d.ts +2 -0
- package/dist/text-field.js +23 -0
- package/dist/textarea.d.ts +2 -0
- package/dist/textarea.js +23 -0
- package/dist/time-picker.d.ts +16 -0
- package/dist/time-picker.js +165 -0
- package/dist/toggle.d.ts +2 -0
- package/dist/toggle.js +21 -0
- package/dist/tooltip.d.ts +1 -0
- package/dist/tooltip.js +12 -0
- package/dist/transfer-list.d.ts +2 -0
- package/dist/transfer-list.js +21 -0
- package/dist/tree-view.d.ts +6 -0
- package/dist/tree-view.js +71 -0
- package/dist/typography.d.ts +1 -0
- package/dist/typography.js +12 -0
- package/dist/visually-hidden.d.ts +1 -0
- package/dist/visually-hidden.js +12 -0
- package/package.json +156 -148
|
@@ -1,4 +1,29 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { FlintLink as FlintLinkElement } from '@getufy/flint-ui/link/flint-link';
|
|
3
|
-
|
|
4
|
-
|
|
3
|
+
/**
|
|
4
|
+
* The Link component allows you to easily customize anchor elements
|
|
5
|
+
with theme colors and typography styles.
|
|
6
|
+
*
|
|
7
|
+
* @slot - Link text or content.
|
|
8
|
+
*/
|
|
9
|
+
export interface FlintLinkProps extends Omit<React.HTMLAttributes<FlintLinkElement>, 'color'> {
|
|
10
|
+
/** The URL of the link. */
|
|
11
|
+
href?: string;
|
|
12
|
+
/** Where to open the link. */
|
|
13
|
+
target?: '_self' | '_blank' | '_parent' | '_top';
|
|
14
|
+
/** Specifies the relationship of the target object. */
|
|
15
|
+
rel?: string;
|
|
16
|
+
/** The color of the link. */
|
|
17
|
+
color?: FlintLinkElement['color'];
|
|
18
|
+
/** Controls the underline behavior. */
|
|
19
|
+
underline?: 'none' | 'hover' | 'always';
|
|
20
|
+
/** Applies typography variant styles. */
|
|
21
|
+
variant?: FlintLinkElement['variant'];
|
|
22
|
+
/** If true, the link is disabled. */
|
|
23
|
+
disabled?: boolean;
|
|
24
|
+
/** The download attribute. */
|
|
25
|
+
download?: string;
|
|
26
|
+
/** The ARIA label. */
|
|
27
|
+
label?: string;
|
|
28
|
+
}
|
|
29
|
+
export declare const FlintLink: React.ForwardRefExoticComponent<FlintLinkProps & React.RefAttributes<FlintLinkElement>>;
|
|
@@ -1,4 +1,12 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { FlintList as FlintListElement } from '@getufy/flint-ui/list/flint-list';
|
|
3
|
-
|
|
4
|
-
|
|
3
|
+
/**
|
|
4
|
+
* flint-list: A wrapper for list items.
|
|
5
|
+
*/
|
|
6
|
+
export interface FlintListProps extends React.HTMLAttributes<FlintListElement> {
|
|
7
|
+
/** Whether to disable the default padding on the list. */
|
|
8
|
+
disablePadding?: boolean;
|
|
9
|
+
/** Whether to use compact spacing for list items. */
|
|
10
|
+
dense?: boolean;
|
|
11
|
+
}
|
|
12
|
+
export declare const FlintList: React.ForwardRefExoticComponent<FlintListProps & React.RefAttributes<FlintListElement>>;
|
|
@@ -1,4 +1,8 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { FlintListItem as FlintListItemElement } from '@getufy/flint-ui/list/flint-list';
|
|
3
|
-
|
|
4
|
-
|
|
3
|
+
/**
|
|
4
|
+
* flint-list-item: A common list item.
|
|
5
|
+
*/
|
|
6
|
+
export interface FlintListItemProps extends React.HTMLAttributes<FlintListItemElement> {
|
|
7
|
+
}
|
|
8
|
+
export declare const FlintListItem: React.ForwardRefExoticComponent<FlintListItemProps & React.RefAttributes<FlintListItemElement>>;
|
|
@@ -1,4 +1,8 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { FlintListItemAvatar as FlintListItemAvatarElement } from '@getufy/flint-ui/list/flint-list';
|
|
3
|
-
|
|
4
|
-
|
|
3
|
+
/**
|
|
4
|
+
* flint-list-item-avatar: An avatar wrapper inside a list item.
|
|
5
|
+
*/
|
|
6
|
+
export interface FlintListItemAvatarProps extends React.HTMLAttributes<FlintListItemAvatarElement> {
|
|
7
|
+
}
|
|
8
|
+
export declare const FlintListItemAvatar: React.ForwardRefExoticComponent<FlintListItemAvatarProps & React.RefAttributes<FlintListItemAvatarElement>>;
|
|
@@ -1,4 +1,12 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { FlintListItemButton as FlintListItemButtonElement } from '@getufy/flint-ui/list/flint-list';
|
|
3
|
-
|
|
4
|
-
|
|
3
|
+
/**
|
|
4
|
+
* flint-list-item-button: An action element inside a list item.
|
|
5
|
+
*/
|
|
6
|
+
export interface FlintListItemButtonProps extends React.HTMLAttributes<FlintListItemButtonElement> {
|
|
7
|
+
/** Whether the list item button is disabled. */
|
|
8
|
+
disabled?: boolean;
|
|
9
|
+
/** Whether the list item button is selected. */
|
|
10
|
+
selected?: boolean;
|
|
11
|
+
}
|
|
12
|
+
export declare const FlintListItemButton: React.ForwardRefExoticComponent<FlintListItemButtonProps & React.RefAttributes<FlintListItemButtonElement>>;
|
|
@@ -1,4 +1,8 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { FlintListItemIcon as FlintListItemIconElement } from '@getufy/flint-ui/list/flint-list';
|
|
3
|
-
|
|
4
|
-
|
|
3
|
+
/**
|
|
4
|
+
* flint-list-item-icon: An icon wrapper inside a list item.
|
|
5
|
+
*/
|
|
6
|
+
export interface FlintListItemIconProps extends React.HTMLAttributes<FlintListItemIconElement> {
|
|
7
|
+
}
|
|
8
|
+
export declare const FlintListItemIcon: React.ForwardRefExoticComponent<FlintListItemIconProps & React.RefAttributes<FlintListItemIconElement>>;
|
|
@@ -1,4 +1,12 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { FlintListItemText as FlintListItemTextElement } from '@getufy/flint-ui/list/flint-list';
|
|
3
|
-
|
|
4
|
-
|
|
3
|
+
/**
|
|
4
|
+
* flint-list-item-text: A container for text content.
|
|
5
|
+
*/
|
|
6
|
+
export interface FlintListItemTextProps extends React.HTMLAttributes<FlintListItemTextElement> {
|
|
7
|
+
/** Primary text content of the list item. */
|
|
8
|
+
primary?: string;
|
|
9
|
+
/** Secondary text content of the list item. */
|
|
10
|
+
secondary?: string;
|
|
11
|
+
}
|
|
12
|
+
export declare const FlintListItemText: React.ForwardRefExoticComponent<FlintListItemTextProps & React.RefAttributes<FlintListItemTextElement>>;
|
|
@@ -1,4 +1,8 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { FlintListSubheader as FlintListSubheaderElement } from '@getufy/flint-ui/list/flint-list';
|
|
3
|
-
|
|
4
|
-
|
|
3
|
+
/**
|
|
4
|
+
* flint-list-subheader: A label for a nested list.
|
|
5
|
+
*/
|
|
6
|
+
export interface FlintListSubheaderProps extends React.HTMLAttributes<FlintListSubheaderElement> {
|
|
7
|
+
}
|
|
8
|
+
export declare const FlintListSubheader: React.ForwardRefExoticComponent<FlintListSubheaderProps & React.RefAttributes<FlintListSubheaderElement>>;
|
|
@@ -1,7 +1,26 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { type EventName } from '@lit/react';
|
|
3
2
|
import { FlintMenu as FlintMenuElement } from '@getufy/flint-ui/menu/flint-menu';
|
|
4
|
-
export
|
|
5
|
-
|
|
6
|
-
}
|
|
7
|
-
|
|
3
|
+
export interface FlintMenuCloseDetail {
|
|
4
|
+
open: boolean;
|
|
5
|
+
}
|
|
6
|
+
/**
|
|
7
|
+
* A menu displays a list of choices on a temporary surface.
|
|
8
|
+
Place it as a sibling to its anchor element inside a `position:relative` container.
|
|
9
|
+
*
|
|
10
|
+
* @slot - Menu content (flint-menu-item elements).
|
|
11
|
+
*/
|
|
12
|
+
export interface FlintMenuProps extends React.HTMLAttributes<FlintMenuElement> {
|
|
13
|
+
/** Whether the menu is open/visible. */
|
|
14
|
+
open?: boolean;
|
|
15
|
+
/** Menu placement relative to its anchor container. */
|
|
16
|
+
placement?: string;
|
|
17
|
+
/** When true, selecting an item automatically fires flint-menu-close. */
|
|
18
|
+
closeOnSelect?: boolean;
|
|
19
|
+
/** When true, constrains height to --flint-menu-max-height (default 300px) and enables scrolling. */
|
|
20
|
+
scrollable?: boolean;
|
|
21
|
+
/** Accessible label for the menu surface (aria-label on role="menu"). */
|
|
22
|
+
label?: string;
|
|
23
|
+
/** Fired when the menu requests to be closed (backdrop click, Escape, or item select). detail: `{ open: false }` */
|
|
24
|
+
onFlintMenuClose?: (event: CustomEvent<FlintMenuCloseDetail>) => void;
|
|
25
|
+
}
|
|
26
|
+
export declare const FlintMenu: React.ForwardRefExoticComponent<FlintMenuProps & React.RefAttributes<FlintMenuElement>>;
|
|
@@ -1,4 +1,8 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { FlintMenuDivider as FlintMenuDividerElement } from '@getufy/flint-ui/menu/flint-menu';
|
|
3
|
-
|
|
4
|
-
|
|
3
|
+
/**
|
|
4
|
+
* A hairline separator for grouping items in a menu.
|
|
5
|
+
*/
|
|
6
|
+
export interface FlintMenuDividerProps extends React.HTMLAttributes<FlintMenuDividerElement> {
|
|
7
|
+
}
|
|
8
|
+
export declare const FlintMenuDivider: React.ForwardRefExoticComponent<FlintMenuDividerProps & React.RefAttributes<FlintMenuDividerElement>>;
|
|
@@ -1,4 +1,13 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { FlintMenuGroup as FlintMenuGroupElement } from '@getufy/flint-ui/menu/flint-menu';
|
|
3
|
-
|
|
4
|
-
|
|
3
|
+
/**
|
|
4
|
+
* A labelled group of menu items. Wraps items in a `role="group"` for
|
|
5
|
+
screen-reader announcements.
|
|
6
|
+
*
|
|
7
|
+
* @slot - Group items (flint-menu-item elements).
|
|
8
|
+
*/
|
|
9
|
+
export interface FlintMenuGroupProps extends React.HTMLAttributes<FlintMenuGroupElement> {
|
|
10
|
+
/** Visible heading rendered above the group items. */
|
|
11
|
+
label?: string;
|
|
12
|
+
}
|
|
13
|
+
export declare const FlintMenuGroup: React.ForwardRefExoticComponent<FlintMenuGroupProps & React.RefAttributes<FlintMenuGroupElement>>;
|
|
@@ -1,7 +1,25 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { type EventName } from '@lit/react';
|
|
3
2
|
import { FlintMenuItem as FlintMenuItemElement } from '@getufy/flint-ui/menu/flint-menu';
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
3
|
+
/**
|
|
4
|
+
* A single option inside a `flint-menu`.
|
|
5
|
+
*
|
|
6
|
+
* @slot - Item label text.
|
|
7
|
+
* @slot icon - Leading icon.
|
|
8
|
+
* @slot end-icon - Trailing icon or shortcut hint.
|
|
9
|
+
*/
|
|
10
|
+
export interface FlintMenuItemProps extends React.HTMLAttributes<FlintMenuItemElement> {
|
|
11
|
+
/** Marks this item as the currently selected option. */
|
|
12
|
+
selected?: boolean;
|
|
13
|
+
/** Disables the item — it becomes non-interactive. */
|
|
14
|
+
disabled?: boolean;
|
|
15
|
+
/** Dense padding mode (for desktop-density menus). */
|
|
16
|
+
dense?: boolean;
|
|
17
|
+
/** Renders a hairline separator below this item. */
|
|
18
|
+
divider?: boolean;
|
|
19
|
+
/** The machine-readable value carried in the `flint-menu-item-select` event detail. */
|
|
20
|
+
value?: string;
|
|
21
|
+
/** Fired when the item is activated.
|
|
22
|
+
detail: { value: string | null, label: string } */
|
|
23
|
+
onFlintMenuItemSelect?: (event: CustomEvent) => void;
|
|
24
|
+
}
|
|
25
|
+
export declare const FlintMenuItem: React.ForwardRefExoticComponent<FlintMenuItemProps & React.RefAttributes<FlintMenuItemElement>>;
|
|
@@ -1,4 +1,13 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { FlintMenubar as FlintMenubarElement } from '@getufy/flint-ui/menubar/flint-menubar';
|
|
3
|
-
|
|
4
|
-
|
|
3
|
+
/**
|
|
4
|
+
* A visually persistent horizontal menu bar, common in desktop applications.
|
|
5
|
+
Hosts one or more `<flint-menubar-menu>` children.
|
|
6
|
+
*
|
|
7
|
+
* @slot - One or more `<flint-menubar-menu>` elements.
|
|
8
|
+
*/
|
|
9
|
+
export interface FlintMenubarProps extends React.HTMLAttributes<FlintMenubarElement> {
|
|
10
|
+
/** Accessible label for the menubar region. Defaults to "Menu bar". */
|
|
11
|
+
label?: string;
|
|
12
|
+
}
|
|
13
|
+
export declare const FlintMenubar: React.ForwardRefExoticComponent<FlintMenubarProps & React.RefAttributes<FlintMenubarElement>>;
|
|
@@ -1,7 +1,22 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { type EventName } from '@lit/react';
|
|
3
2
|
import { FlintMenubarCheckboxItem as FlintMenubarCheckboxItemElement } from '@getufy/flint-ui/menubar/flint-menubar';
|
|
4
|
-
export
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
3
|
+
export interface FlintMenubarCheckboxChangeDetail {
|
|
4
|
+
checked: boolean;
|
|
5
|
+
value: string;
|
|
6
|
+
}
|
|
7
|
+
/**
|
|
8
|
+
* A toggleable checkbox menu item.
|
|
9
|
+
*/
|
|
10
|
+
export interface FlintMenubarCheckboxItemProps extends React.HTMLAttributes<FlintMenubarCheckboxItemElement> {
|
|
11
|
+
/** Whether the checkbox item is currently checked. */
|
|
12
|
+
checked?: boolean;
|
|
13
|
+
/** Whether the item is non-interactive. */
|
|
14
|
+
disabled?: boolean;
|
|
15
|
+
/** Whether the item is visually highlighted (e.g. via keyboard or hover). */
|
|
16
|
+
highlighted?: boolean;
|
|
17
|
+
/** Explicit value for the change event. Falls back to label text (excludes shortcut). */
|
|
18
|
+
value?: string;
|
|
19
|
+
/** detail: `{ checked: boolean, value: string }` */
|
|
20
|
+
onFlintMenubarCheckboxChange?: (event: CustomEvent<FlintMenubarCheckboxChangeDetail>) => void;
|
|
21
|
+
}
|
|
22
|
+
export declare const FlintMenubarCheckboxItem: React.ForwardRefExoticComponent<FlintMenubarCheckboxItemProps & React.RefAttributes<FlintMenubarCheckboxItemElement>>;
|
|
@@ -1,7 +1,15 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { type EventName } from '@lit/react';
|
|
3
2
|
import { FlintMenubarContent as FlintMenubarContentElement } from '@getufy/flint-ui/menubar/flint-menubar';
|
|
4
|
-
export
|
|
5
|
-
|
|
6
|
-
}
|
|
7
|
-
|
|
3
|
+
export interface FlintMenubarRequestCloseDetail {
|
|
4
|
+
open: boolean;
|
|
5
|
+
}
|
|
6
|
+
/**
|
|
7
|
+
* The dropdown content panel for a menubar menu.
|
|
8
|
+
Positioned absolutely below the trigger.
|
|
9
|
+
*/
|
|
10
|
+
export interface FlintMenubarContentProps extends React.HTMLAttributes<FlintMenubarContentElement> {
|
|
11
|
+
/** Whether the content dropdown panel is visible. */
|
|
12
|
+
open?: boolean;
|
|
13
|
+
onFlintMenubarRequestClose?: (event: CustomEvent<FlintMenubarRequestCloseDetail>) => void;
|
|
14
|
+
}
|
|
15
|
+
export declare const FlintMenubarContent: React.ForwardRefExoticComponent<FlintMenubarContentProps & React.RefAttributes<FlintMenubarContentElement>>;
|
|
@@ -1,4 +1,10 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { FlintMenubarGroup as FlintMenubarGroupElement } from '@getufy/flint-ui/menubar/flint-menubar';
|
|
3
|
-
|
|
4
|
-
|
|
3
|
+
/**
|
|
4
|
+
* Groups related menu items. Optional `heading` shows a label.
|
|
5
|
+
*/
|
|
6
|
+
export interface FlintMenubarGroupProps extends React.HTMLAttributes<FlintMenubarGroupElement> {
|
|
7
|
+
/** Label text displayed above the group. */
|
|
8
|
+
heading?: string;
|
|
9
|
+
}
|
|
10
|
+
export declare const FlintMenubarGroup: React.ForwardRefExoticComponent<FlintMenubarGroupProps & React.RefAttributes<FlintMenubarGroupElement>>;
|
|
@@ -1,7 +1,23 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { type EventName } from '@lit/react';
|
|
3
2
|
import { FlintMenubarItem as FlintMenubarItemElement } from '@getufy/flint-ui/menubar/flint-menubar';
|
|
4
|
-
export
|
|
5
|
-
|
|
6
|
-
}
|
|
7
|
-
|
|
3
|
+
export interface FlintMenubarItemSelectDetail {
|
|
4
|
+
value: string;
|
|
5
|
+
}
|
|
6
|
+
/**
|
|
7
|
+
* A single interactive option inside a menubar dropdown.
|
|
8
|
+
*
|
|
9
|
+
* @slot - Item label text plus optional `<flint-menubar-shortcut>`.
|
|
10
|
+
*/
|
|
11
|
+
export interface FlintMenubarItemProps extends React.HTMLAttributes<FlintMenubarItemElement> {
|
|
12
|
+
/** Whether the item is non-interactive. */
|
|
13
|
+
disabled?: boolean;
|
|
14
|
+
/** Whether the item is visually highlighted (e.g. via keyboard or hover). */
|
|
15
|
+
highlighted?: boolean;
|
|
16
|
+
/** Whether the item label is inset to align with checkbox/radio items. */
|
|
17
|
+
inset?: boolean;
|
|
18
|
+
/** Explicit value for the select event. Falls back to label text (excludes shortcut). */
|
|
19
|
+
value?: string;
|
|
20
|
+
/** Fired on activation. detail: `{ value: string }` */
|
|
21
|
+
onFlintMenubarItemSelect?: (event: CustomEvent<FlintMenubarItemSelectDetail>) => void;
|
|
22
|
+
}
|
|
23
|
+
export declare const FlintMenubarItem: React.ForwardRefExoticComponent<FlintMenubarItemProps & React.RefAttributes<FlintMenubarItemElement>>;
|
|
@@ -1,4 +1,10 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { FlintMenubarMenu as FlintMenubarMenuElement } from '@getufy/flint-ui/menubar/flint-menubar';
|
|
3
|
-
|
|
4
|
-
|
|
3
|
+
/**
|
|
4
|
+
* Wraps a trigger and content pair for a single menu in the menubar.
|
|
5
|
+
*/
|
|
6
|
+
export interface FlintMenubarMenuProps extends React.HTMLAttributes<FlintMenubarMenuElement> {
|
|
7
|
+
/** Disables this menu: the trigger is non-interactive and keyboard nav skips it. */
|
|
8
|
+
disabled?: boolean;
|
|
9
|
+
}
|
|
10
|
+
export declare const FlintMenubarMenu: React.ForwardRefExoticComponent<FlintMenubarMenuProps & React.RefAttributes<FlintMenubarMenuElement>>;
|
|
@@ -1,7 +1,15 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { type EventName } from '@lit/react';
|
|
3
2
|
import { FlintMenubarRadioGroup as FlintMenubarRadioGroupElement } from '@getufy/flint-ui/menubar/flint-menubar';
|
|
4
|
-
export
|
|
5
|
-
|
|
6
|
-
}
|
|
7
|
-
|
|
3
|
+
export interface FlintMenubarRadioChangeDetail {
|
|
4
|
+
value: string;
|
|
5
|
+
}
|
|
6
|
+
/**
|
|
7
|
+
* Manages single-select radio items.
|
|
8
|
+
*/
|
|
9
|
+
export interface FlintMenubarRadioGroupProps extends React.HTMLAttributes<FlintMenubarRadioGroupElement> {
|
|
10
|
+
/** The value of the currently selected radio item. */
|
|
11
|
+
value?: string;
|
|
12
|
+
/** detail: `{ value: string }` */
|
|
13
|
+
onFlintMenubarRadioChange?: (event: CustomEvent<FlintMenubarRadioChangeDetail>) => void;
|
|
14
|
+
}
|
|
15
|
+
export declare const FlintMenubarRadioGroup: React.ForwardRefExoticComponent<FlintMenubarRadioGroupProps & React.RefAttributes<FlintMenubarRadioGroupElement>>;
|
|
@@ -1,7 +1,20 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { type EventName } from '@lit/react';
|
|
3
2
|
import { FlintMenubarRadioItem as FlintMenubarRadioItemElement } from '@getufy/flint-ui/menubar/flint-menubar';
|
|
4
|
-
export
|
|
5
|
-
|
|
6
|
-
}
|
|
7
|
-
|
|
3
|
+
export interface FlintMenubarRadioSelectDetail {
|
|
4
|
+
value: string;
|
|
5
|
+
}
|
|
6
|
+
/**
|
|
7
|
+
* A radio option inside a `<flint-menubar-radio-group>`.
|
|
8
|
+
*/
|
|
9
|
+
export interface FlintMenubarRadioItemProps extends React.HTMLAttributes<FlintMenubarRadioItemElement> {
|
|
10
|
+
/** Value identifying this radio option within its group. */
|
|
11
|
+
value?: string;
|
|
12
|
+
/** Whether this radio item is currently selected. */
|
|
13
|
+
checked?: boolean;
|
|
14
|
+
/** Whether the item is non-interactive. */
|
|
15
|
+
disabled?: boolean;
|
|
16
|
+
/** Whether the item is visually highlighted (e.g. via keyboard or hover). */
|
|
17
|
+
highlighted?: boolean;
|
|
18
|
+
onFlintMenubarRadioSelect?: (event: CustomEvent<FlintMenubarRadioSelectDetail>) => void;
|
|
19
|
+
}
|
|
20
|
+
export declare const FlintMenubarRadioItem: React.ForwardRefExoticComponent<FlintMenubarRadioItemProps & React.RefAttributes<FlintMenubarRadioItemElement>>;
|
|
@@ -1,4 +1,8 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { FlintMenubarSeparator as FlintMenubarSeparatorElement } from '@getufy/flint-ui/menubar/flint-menubar';
|
|
3
|
-
|
|
4
|
-
|
|
3
|
+
/**
|
|
4
|
+
* A hairline separator between menu groups.
|
|
5
|
+
*/
|
|
6
|
+
export interface FlintMenubarSeparatorProps extends React.HTMLAttributes<FlintMenubarSeparatorElement> {
|
|
7
|
+
}
|
|
8
|
+
export declare const FlintMenubarSeparator: React.ForwardRefExoticComponent<FlintMenubarSeparatorProps & React.RefAttributes<FlintMenubarSeparatorElement>>;
|
|
@@ -1,4 +1,10 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { FlintMenubarShortcut as FlintMenubarShortcutElement } from '@getufy/flint-ui/menubar/flint-menubar';
|
|
3
|
-
|
|
4
|
-
|
|
3
|
+
/**
|
|
4
|
+
* Displays a keyboard shortcut hint inside a menu item.
|
|
5
|
+
*
|
|
6
|
+
* @slot - Shortcut text, e.g. `⌘T` or `Ctrl+N`.
|
|
7
|
+
*/
|
|
8
|
+
export interface FlintMenubarShortcutProps extends React.HTMLAttributes<FlintMenubarShortcutElement> {
|
|
9
|
+
}
|
|
10
|
+
export declare const FlintMenubarShortcut: React.ForwardRefExoticComponent<FlintMenubarShortcutProps & React.RefAttributes<FlintMenubarShortcutElement>>;
|
|
@@ -1,4 +1,9 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { FlintMenubarSub as FlintMenubarSubElement } from '@getufy/flint-ui/menubar/flint-menubar';
|
|
3
|
-
|
|
4
|
-
|
|
3
|
+
/**
|
|
4
|
+
* Wraps a sub-trigger and sub-content pair.
|
|
5
|
+
Opens on hover/focus and ArrowRight; closes on ArrowLeft or blur.
|
|
6
|
+
*/
|
|
7
|
+
export interface FlintMenubarSubProps extends React.HTMLAttributes<FlintMenubarSubElement> {
|
|
8
|
+
}
|
|
9
|
+
export declare const FlintMenubarSub: React.ForwardRefExoticComponent<FlintMenubarSubProps & React.RefAttributes<FlintMenubarSubElement>>;
|
|
@@ -1,4 +1,11 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { FlintMenubarSubContent as FlintMenubarSubContentElement } from '@getufy/flint-ui/menubar/flint-menubar';
|
|
3
|
-
|
|
4
|
-
|
|
3
|
+
/**
|
|
4
|
+
* The dropdown panel of a sub-menu. Positioned to the right of the trigger.
|
|
5
|
+
Auto-flips left when the panel would overflow the viewport edge.
|
|
6
|
+
*/
|
|
7
|
+
export interface FlintMenubarSubContentProps extends React.HTMLAttributes<FlintMenubarSubContentElement> {
|
|
8
|
+
/** Whether the sub-menu dropdown panel is visible. */
|
|
9
|
+
open?: boolean;
|
|
10
|
+
}
|
|
11
|
+
export declare const FlintMenubarSubContent: React.ForwardRefExoticComponent<FlintMenubarSubContentProps & React.RefAttributes<FlintMenubarSubContentElement>>;
|
|
@@ -1,4 +1,16 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { FlintMenubarSubTrigger as FlintMenubarSubTriggerElement } from '@getufy/flint-ui/menubar/flint-menubar';
|
|
3
|
-
|
|
4
|
-
|
|
3
|
+
/**
|
|
4
|
+
* Trigger for a sub-menu. Shows an arrow indicator.
|
|
5
|
+
*/
|
|
6
|
+
export interface FlintMenubarSubTriggerProps extends React.HTMLAttributes<FlintMenubarSubTriggerElement> {
|
|
7
|
+
/** Whether the trigger is visually highlighted (e.g. via keyboard or hover). */
|
|
8
|
+
highlighted?: boolean;
|
|
9
|
+
/** Whether the trigger is non-interactive. */
|
|
10
|
+
disabled?: boolean;
|
|
11
|
+
/** Whether the trigger label is inset to align with checkbox/radio items. */
|
|
12
|
+
inset?: boolean;
|
|
13
|
+
/** Set by the parent `flint-menubar-sub` to reflect open state for aria-expanded. */
|
|
14
|
+
expanded?: boolean;
|
|
15
|
+
}
|
|
16
|
+
export declare const FlintMenubarSubTrigger: React.ForwardRefExoticComponent<FlintMenubarSubTriggerProps & React.RefAttributes<FlintMenubarSubTriggerElement>>;
|
|
@@ -1,4 +1,14 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { FlintMenubarTrigger as FlintMenubarTriggerElement } from '@getufy/flint-ui/menubar/flint-menubar';
|
|
3
|
-
|
|
4
|
-
|
|
3
|
+
/**
|
|
4
|
+
* The trigger button for a menubar menu.
|
|
5
|
+
*
|
|
6
|
+
* @slot - Trigger label text.
|
|
7
|
+
*/
|
|
8
|
+
export interface FlintMenubarTriggerProps extends React.HTMLAttributes<FlintMenubarTriggerElement> {
|
|
9
|
+
/** Whether the trigger's associated menu is currently open. */
|
|
10
|
+
active?: boolean;
|
|
11
|
+
/** Whether the trigger is non-interactive. */
|
|
12
|
+
disabled?: boolean;
|
|
13
|
+
}
|
|
14
|
+
export declare const FlintMenubarTrigger: React.ForwardRefExoticComponent<FlintMenubarTriggerProps & React.RefAttributes<FlintMenubarTriggerElement>>;
|
|
@@ -1,4 +1,23 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { FlintMobileStepper as FlintMobileStepperElement } from '@getufy/flint-ui/stepper/flint-stepper';
|
|
3
|
-
|
|
4
|
-
|
|
3
|
+
/**
|
|
4
|
+
* Mobile Stepper: a compact stepper for mobile layouts.
|
|
5
|
+
*
|
|
6
|
+
* @slot back-button - Back navigation button.
|
|
7
|
+
* @slot next-button - Next navigation button.
|
|
8
|
+
*/
|
|
9
|
+
export interface FlintMobileStepperProps extends React.HTMLAttributes<FlintMobileStepperElement> {
|
|
10
|
+
/** Total number of steps. */
|
|
11
|
+
steps?: number;
|
|
12
|
+
/** Zero-based index of the currently active step. */
|
|
13
|
+
activeStep?: number;
|
|
14
|
+
/** Progress indicator style: text counter, dot indicators, or a progress bar. */
|
|
15
|
+
variant?: 'text' | 'dots' | 'progress';
|
|
16
|
+
/** Positioning of the mobile stepper within its container. */
|
|
17
|
+
position?: 'top' | 'bottom' | 'static';
|
|
18
|
+
/** Label text for the Back navigation button (supports i18n). */
|
|
19
|
+
backLabel?: string;
|
|
20
|
+
/** Label text for the Next navigation button (supports i18n). */
|
|
21
|
+
nextLabel?: string;
|
|
22
|
+
}
|
|
23
|
+
export declare const FlintMobileStepper: React.ForwardRefExoticComponent<FlintMobileStepperProps & React.RefAttributes<FlintMobileStepperElement>>;
|
|
@@ -1,7 +1,26 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { type EventName } from '@lit/react';
|
|
3
2
|
import { FlintMobileTimePicker as FlintMobileTimePickerElement } from '@getufy/flint-ui/time-picker/flint-time-picker';
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
export
|
|
3
|
+
/**
|
|
4
|
+
* Mobile Time Picker: a time field with a modal clock dialog.
|
|
5
|
+
*/
|
|
6
|
+
export interface FlintMobileTimePickerProps extends Omit<React.HTMLAttributes<FlintMobileTimePickerElement>, 'onChange'> {
|
|
7
|
+
/** Time value in HH:MM:SS format. */
|
|
8
|
+
value?: string;
|
|
9
|
+
/** Field label text. */
|
|
10
|
+
label?: string;
|
|
11
|
+
/** Whether to use 12-hour (AM/PM) format instead of 24-hour. */
|
|
12
|
+
ampm?: boolean;
|
|
13
|
+
/** Whether to show a seconds segment. */
|
|
14
|
+
seconds?: boolean;
|
|
15
|
+
/** Disables the picker and prevents interaction. */
|
|
16
|
+
disabled?: boolean;
|
|
17
|
+
/** Displays the picker in an error state. */
|
|
18
|
+
error?: boolean;
|
|
19
|
+
/** Helper text shown below the field. */
|
|
20
|
+
helperText?: string;
|
|
21
|
+
/** Error message displayed below the field when in error state. */
|
|
22
|
+
errorMessage?: string;
|
|
23
|
+
/** Fired when the time value changes. */
|
|
24
|
+
onChange?: (event: CustomEvent) => void;
|
|
25
|
+
}
|
|
26
|
+
export declare const FlintMobileTimePicker: React.ForwardRefExoticComponent<FlintMobileTimePickerProps & React.RefAttributes<FlintMobileTimePickerElement>>;
|
|
@@ -1,7 +1,19 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { type EventName } from '@lit/react';
|
|
3
2
|
import { FlintMultiSectionDigitalClock as FlintMultiSectionDigitalClockElement } from '@getufy/flint-ui/time-picker/flint-time-picker';
|
|
4
|
-
export
|
|
5
|
-
|
|
6
|
-
}
|
|
7
|
-
|
|
3
|
+
export interface ChangeDetail {
|
|
4
|
+
value: string;
|
|
5
|
+
}
|
|
6
|
+
/**
|
|
7
|
+
* Multi Section Digital Clock: hours, minutes, and optional seconds columns.
|
|
8
|
+
*/
|
|
9
|
+
export interface FlintMultiSectionDigitalClockProps extends Omit<React.HTMLAttributes<FlintMultiSectionDigitalClockElement>, 'onChange'> {
|
|
10
|
+
/** Time value in HH:MM:SS format. */
|
|
11
|
+
value?: string;
|
|
12
|
+
/** Whether to use 12-hour (AM/PM) format instead of 24-hour. */
|
|
13
|
+
ampm?: boolean;
|
|
14
|
+
/** Whether to show a seconds column. */
|
|
15
|
+
seconds?: boolean;
|
|
16
|
+
/** Fired when the time value changes. */
|
|
17
|
+
onChange?: (event: CustomEvent<ChangeDetail>) => void;
|
|
18
|
+
}
|
|
19
|
+
export declare const FlintMultiSectionDigitalClock: React.ForwardRefExoticComponent<FlintMultiSectionDigitalClockProps & React.RefAttributes<FlintMultiSectionDigitalClockElement>>;
|
|
@@ -1,4 +1,10 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { FlintNavigationMenu as FlintNavigationMenuElement } from '@getufy/flint-ui/navigation-menu/flint-navigation-menu';
|
|
3
|
-
|
|
4
|
-
|
|
3
|
+
/**
|
|
4
|
+
* @slot default - The menu content (NavigationMenuList)
|
|
5
|
+
*/
|
|
6
|
+
export interface FlintNavigationMenuProps extends Omit<React.HTMLAttributes<FlintNavigationMenuElement>, 'dir'> {
|
|
7
|
+
/** The direction of the menu (ltr or rtl) */
|
|
8
|
+
dir?: 'ltr' | 'rtl';
|
|
9
|
+
}
|
|
10
|
+
export declare const FlintNavigationMenu: React.ForwardRefExoticComponent<FlintNavigationMenuProps & React.RefAttributes<FlintNavigationMenuElement>>;
|
|
@@ -1,7 +1,22 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { type EventName } from '@lit/react';
|
|
3
2
|
import { FlintNavigationMenuContent as FlintNavigationMenuContentElement } from '@getufy/flint-ui/navigation-menu/flint-navigation-menu-content';
|
|
4
|
-
export
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
3
|
+
export interface FlintNavigationMenuContentToggleDetail {
|
|
4
|
+
contentId: string;
|
|
5
|
+
open: boolean;
|
|
6
|
+
}
|
|
7
|
+
/**
|
|
8
|
+
* @slot default - Menu content items
|
|
9
|
+
*/
|
|
10
|
+
export interface FlintNavigationMenuContentProps extends Omit<React.HTMLAttributes<FlintNavigationMenuContentElement>, 'id' | 'dir'> {
|
|
11
|
+
/** Unique identifier for this content panel */
|
|
12
|
+
id?: string;
|
|
13
|
+
/** Whether the content is open/visible */
|
|
14
|
+
open?: boolean;
|
|
15
|
+
/** The direction (ltr or rtl) */
|
|
16
|
+
dir?: 'ltr' | 'rtl';
|
|
17
|
+
/** Gap between items in the content */
|
|
18
|
+
gap?: number;
|
|
19
|
+
/** Fired when the content panel opens or closes. */
|
|
20
|
+
onFlintNavigationMenuContentToggle?: (event: CustomEvent<FlintNavigationMenuContentToggleDetail>) => void;
|
|
21
|
+
}
|
|
22
|
+
export declare const FlintNavigationMenuContent: React.ForwardRefExoticComponent<FlintNavigationMenuContentProps & React.RefAttributes<FlintNavigationMenuContentElement>>;
|