@geomak/ui 6.8.0 → 6.9.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/dist/index.cjs +302 -204
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +50 -1
- package/dist/index.d.ts +50 -1
- package/dist/index.js +111 -14
- package/dist/index.js.map +1 -1
- package/dist/styles.css +31 -0
- package/package.json +1 -1
package/dist/index.d.cts
CHANGED
|
@@ -1198,6 +1198,55 @@ interface StatisticProps {
|
|
|
1198
1198
|
*/
|
|
1199
1199
|
declare function Statistic({ label, value, prefix, suffix, icon, delta, helpText, size, align, className, style, }: StatisticProps): react_jsx_runtime.JSX.Element;
|
|
1200
1200
|
|
|
1201
|
+
type FABPosition = 'bottom-right' | 'bottom-left' | 'top-right' | 'top-left';
|
|
1202
|
+
type FABSize = 'md' | 'lg';
|
|
1203
|
+
type FABTone = 'accent' | 'neutral';
|
|
1204
|
+
interface FABAction {
|
|
1205
|
+
icon: React__default.ReactNode;
|
|
1206
|
+
/** Accessible label + the text shown on the action's pill. */
|
|
1207
|
+
label: string;
|
|
1208
|
+
onClick?: React__default.MouseEventHandler;
|
|
1209
|
+
}
|
|
1210
|
+
interface FABProps {
|
|
1211
|
+
/** Main button icon. */
|
|
1212
|
+
icon: React__default.ReactNode;
|
|
1213
|
+
/** Accessible label for the main button (required — it's icon-only). */
|
|
1214
|
+
label: string;
|
|
1215
|
+
/** Click handler. Ignored when `actions` is provided (the button toggles the dial). */
|
|
1216
|
+
onClick?: React__default.MouseEventHandler;
|
|
1217
|
+
/** Speed-dial sub-actions. When set, the main button opens/closes the dial. */
|
|
1218
|
+
actions?: FABAction[];
|
|
1219
|
+
/** Corner placement. Default `'bottom-right'`. */
|
|
1220
|
+
position?: FABPosition;
|
|
1221
|
+
/** Size preset. Default `'lg'`. */
|
|
1222
|
+
size?: FABSize;
|
|
1223
|
+
/** Colour. Default `'accent'`. */
|
|
1224
|
+
tone?: FABTone;
|
|
1225
|
+
/**
|
|
1226
|
+
* `position: fixed` to the viewport (default) or `absolute` to the nearest
|
|
1227
|
+
* positioned ancestor — set `false` to anchor inside a `relative` container.
|
|
1228
|
+
*/
|
|
1229
|
+
fixed?: boolean;
|
|
1230
|
+
className?: string;
|
|
1231
|
+
style?: React__default.CSSProperties;
|
|
1232
|
+
}
|
|
1233
|
+
/**
|
|
1234
|
+
* A floating action button. On its own it's a single round action; given
|
|
1235
|
+
* `actions`, it becomes a speed dial that expands a labelled stack on click.
|
|
1236
|
+
* Positions to a viewport corner by default (or a relative container with
|
|
1237
|
+
* `fixed={false}`).
|
|
1238
|
+
*
|
|
1239
|
+
* @example Single
|
|
1240
|
+
* <FAB icon={<PlusIcon />} label="New record" onClick={create} />
|
|
1241
|
+
*
|
|
1242
|
+
* @example Speed dial
|
|
1243
|
+
* <FAB icon={<PlusIcon />} label="Create" actions={[
|
|
1244
|
+
* { icon: <FileIcon />, label: 'Document', onClick: newDoc },
|
|
1245
|
+
* { icon: <FolderIcon />, label: 'Folder', onClick: newFolder },
|
|
1246
|
+
* ]} />
|
|
1247
|
+
*/
|
|
1248
|
+
declare function FAB({ icon, label, onClick, actions, position, size, tone, fixed, className, style, }: FABProps): react_jsx_runtime.JSX.Element;
|
|
1249
|
+
|
|
1201
1250
|
/** ─────────────────── types ─────────────────── */
|
|
1202
1251
|
type NotificationType = 'info' | 'success' | 'warning' | 'danger';
|
|
1203
1252
|
type NotificationPosition = 'top-right' | 'top-left' | 'top-center' | 'bottom-right' | 'bottom-left' | 'bottom-center';
|
|
@@ -4266,4 +4315,4 @@ declare function expiryError(value: string, now?: Date): string | undefined;
|
|
|
4266
4315
|
/** Validate the CVV against the detected brand's expected length. */
|
|
4267
4316
|
declare function cvvError(value: string, cardNumber: string): string | undefined;
|
|
4268
4317
|
|
|
4269
|
-
export { Accordion, type AccordionItemProps, type AccordionProps, AppShell, type AppShellProps, AutoComplete, type AutoCompleteProps, Avatar, type AvatarProps, type AvatarShape, type AvatarSize, type AvatarStatus, Badge, type BadgeProps, type BadgeSize, type BadgeTone, type BadgeVariant, Box, type BoxBackground, type BoxBorder, type BoxProps, type BoxRadius, type BoxShadow, type BreadcrumbItem, Breadcrumbs, type BreadcrumbsProps, Button, type ButtonProps, CARD_BRANDS, Card, type CardBodyProps, type CardBrand, CardCarousel, type CardCarouselProps, type CardFooterProps, type CardHeaderProps, type CardMediaProps, type CardProps, Catalog, CatalogCarousel, type CatalogCarouselProps, CatalogGrid, type CatalogGridProps, type CatalogProps, Checkbox, type CheckboxProps, ColorPicker, type ColorPickerProps, ContextMenu, type ContextMenuActionItem, type ContextMenuPosition, type ContextMenuProps, CreditCardForm, type CreditCardFormProps, type CreditCardValue, type DatePickerProps, type DateRange, DateRangePicker, type DateRangePickerProps, type DateRangePreset, type DeltaDirection, Drawer, type DrawerProps, Dropdown, type DropdownItem, type DropdownProps, type ErrorMap, type ExpandRowOptions, FadingBase, type FadingBaseProps, Field, type FieldArrayItem, type FieldBindings, FieldHelpIcon, type FieldKind, FieldLabel, type FieldLabelProps, type FieldProps, type FieldRule, type FieldRules, type FieldShellOptions, type FieldSize, type FieldSnapshot, FileInput, type FileInputProps, Flex, type FlexAlign, type FlexDirection, type FlexJustify, type FlexProps, type FlexWrap, Form, FormContext, FormField, type FormFieldProps, type FormProps, FormStore, type FormStoreOptions, type FormValues, Grid, GridCard, type GridCardItem, type GridCardProps, type GridProps, Icon, IconButton, type IconButtonProps, Kbd, type KbdProps, type KbdSize, List, type ListItem, type ListProps, LoadingSpinner, type LoadingSpinnerProps, MegaMenu, type MegaMenuFeaturedProps, type MegaMenuItemProps, type MegaMenuLinkProps, type MegaMenuPanelProps, type MegaMenuProps, type MegaMenuSectionProps, Modal, type ModalProps, type NotificationPayload, NotificationProvider, NumberInput, type NumberInputProps, OpaqueGridCard, type OpaqueGridCardProps, OtpInput, type OtpInputProps, type PaginationOptions, Password, type PasswordProps, Portal, type PortalProps, RadioGroup, type RadioGroupProps, type RadioOption, Rating, type RatingProps, type RulesMap, ScalableContainer, type ScalableContainerProps, SearchInput, type SearchInputProps, SegmentedControl, type SegmentedControlProps, type SegmentedOption, Sidebar, type SidebarItem, type SidebarProps, type SidebarSection, SkeletonBox, type SkeletonBoxProps, SkeletonCard, type SkeletonCardProps, SkeletonCircle, type SkeletonCircleProps, SkeletonText, type SkeletonTextProps, Slider, type SliderMark, type SliderProps, type SliderValue, type Spacing, Statistic, type StatisticDelta, type StatisticProps, type StatisticSize, Switch, type SwitchInputProps, Table, type TableColumn, type TableProps, Tabs, type TabsAddProps, type TabsListProps, type TabsOrientation, type TabsPanelProps, type TabsProps, type TabsSize, type TabsTriggerProps, type TabsVariant, TagsInput, type TagsInputProps, DatePicker as Temporal, type TemporalPickerProps, TextArea, type TextAreaProps, TextInput, type TextInputProps, type ThemeColors, type ThemeConfig, type ThemeDensity, type ThemeMotion, ThemeProvider, type ThemeProviderProps, type ThemeRadius, type ThemeShadows, ThemeSwitch, type ThemeSwitchProps, type ThemeTypography, TimePicker, type TimePickerProps, Tooltip, type TooltipProps, TooltipProvider, TopBar, type TopBarProps, Tree, type TreeItemClickPayload, type TreeNode, type TreeProps, TreeSelect, type TreeSelectProps, Typography, type TypographyAlign, type TypographyColor, type TypographyProps, type TypographyVariant, type TypographyWeight, type UseFieldArrayReturn, type UseFormFieldOptions, type UseFormReturn, type ValidateTrigger, Wizard, type WizardProps, type WizardStep, cardNumberError, cvvError, detectBrand, expiryError, fieldShell, formatCardNumber, formatExpiry, isRequired, luhnValid, onlyDigits, patterns, runFieldRules, useFieldArray, useForm, useFormField, useFormStore, useNotification };
|
|
4318
|
+
export { Accordion, type AccordionItemProps, type AccordionProps, AppShell, type AppShellProps, AutoComplete, type AutoCompleteProps, Avatar, type AvatarProps, type AvatarShape, type AvatarSize, type AvatarStatus, Badge, type BadgeProps, type BadgeSize, type BadgeTone, type BadgeVariant, Box, type BoxBackground, type BoxBorder, type BoxProps, type BoxRadius, type BoxShadow, type BreadcrumbItem, Breadcrumbs, type BreadcrumbsProps, Button, type ButtonProps, CARD_BRANDS, Card, type CardBodyProps, type CardBrand, CardCarousel, type CardCarouselProps, type CardFooterProps, type CardHeaderProps, type CardMediaProps, type CardProps, Catalog, CatalogCarousel, type CatalogCarouselProps, CatalogGrid, type CatalogGridProps, type CatalogProps, Checkbox, type CheckboxProps, ColorPicker, type ColorPickerProps, ContextMenu, type ContextMenuActionItem, type ContextMenuPosition, type ContextMenuProps, CreditCardForm, type CreditCardFormProps, type CreditCardValue, type DatePickerProps, type DateRange, DateRangePicker, type DateRangePickerProps, type DateRangePreset, type DeltaDirection, Drawer, type DrawerProps, Dropdown, type DropdownItem, type DropdownProps, type ErrorMap, type ExpandRowOptions, FAB, type FABAction, type FABPosition, type FABProps, type FABSize, type FABTone, FadingBase, type FadingBaseProps, Field, type FieldArrayItem, type FieldBindings, FieldHelpIcon, type FieldKind, FieldLabel, type FieldLabelProps, type FieldProps, type FieldRule, type FieldRules, type FieldShellOptions, type FieldSize, type FieldSnapshot, FileInput, type FileInputProps, Flex, type FlexAlign, type FlexDirection, type FlexJustify, type FlexProps, type FlexWrap, Form, FormContext, FormField, type FormFieldProps, type FormProps, FormStore, type FormStoreOptions, type FormValues, Grid, GridCard, type GridCardItem, type GridCardProps, type GridProps, Icon, IconButton, type IconButtonProps, Kbd, type KbdProps, type KbdSize, List, type ListItem, type ListProps, LoadingSpinner, type LoadingSpinnerProps, MegaMenu, type MegaMenuFeaturedProps, type MegaMenuItemProps, type MegaMenuLinkProps, type MegaMenuPanelProps, type MegaMenuProps, type MegaMenuSectionProps, Modal, type ModalProps, type NotificationPayload, NotificationProvider, NumberInput, type NumberInputProps, OpaqueGridCard, type OpaqueGridCardProps, OtpInput, type OtpInputProps, type PaginationOptions, Password, type PasswordProps, Portal, type PortalProps, RadioGroup, type RadioGroupProps, type RadioOption, Rating, type RatingProps, type RulesMap, ScalableContainer, type ScalableContainerProps, SearchInput, type SearchInputProps, SegmentedControl, type SegmentedControlProps, type SegmentedOption, Sidebar, type SidebarItem, type SidebarProps, type SidebarSection, SkeletonBox, type SkeletonBoxProps, SkeletonCard, type SkeletonCardProps, SkeletonCircle, type SkeletonCircleProps, SkeletonText, type SkeletonTextProps, Slider, type SliderMark, type SliderProps, type SliderValue, type Spacing, Statistic, type StatisticDelta, type StatisticProps, type StatisticSize, Switch, type SwitchInputProps, Table, type TableColumn, type TableProps, Tabs, type TabsAddProps, type TabsListProps, type TabsOrientation, type TabsPanelProps, type TabsProps, type TabsSize, type TabsTriggerProps, type TabsVariant, TagsInput, type TagsInputProps, DatePicker as Temporal, type TemporalPickerProps, TextArea, type TextAreaProps, TextInput, type TextInputProps, type ThemeColors, type ThemeConfig, type ThemeDensity, type ThemeMotion, ThemeProvider, type ThemeProviderProps, type ThemeRadius, type ThemeShadows, ThemeSwitch, type ThemeSwitchProps, type ThemeTypography, TimePicker, type TimePickerProps, Tooltip, type TooltipProps, TooltipProvider, TopBar, type TopBarProps, Tree, type TreeItemClickPayload, type TreeNode, type TreeProps, TreeSelect, type TreeSelectProps, Typography, type TypographyAlign, type TypographyColor, type TypographyProps, type TypographyVariant, type TypographyWeight, type UseFieldArrayReturn, type UseFormFieldOptions, type UseFormReturn, type ValidateTrigger, Wizard, type WizardProps, type WizardStep, cardNumberError, cvvError, detectBrand, expiryError, fieldShell, formatCardNumber, formatExpiry, isRequired, luhnValid, onlyDigits, patterns, runFieldRules, useFieldArray, useForm, useFormField, useFormStore, useNotification };
|
package/dist/index.d.ts
CHANGED
|
@@ -1198,6 +1198,55 @@ interface StatisticProps {
|
|
|
1198
1198
|
*/
|
|
1199
1199
|
declare function Statistic({ label, value, prefix, suffix, icon, delta, helpText, size, align, className, style, }: StatisticProps): react_jsx_runtime.JSX.Element;
|
|
1200
1200
|
|
|
1201
|
+
type FABPosition = 'bottom-right' | 'bottom-left' | 'top-right' | 'top-left';
|
|
1202
|
+
type FABSize = 'md' | 'lg';
|
|
1203
|
+
type FABTone = 'accent' | 'neutral';
|
|
1204
|
+
interface FABAction {
|
|
1205
|
+
icon: React__default.ReactNode;
|
|
1206
|
+
/** Accessible label + the text shown on the action's pill. */
|
|
1207
|
+
label: string;
|
|
1208
|
+
onClick?: React__default.MouseEventHandler;
|
|
1209
|
+
}
|
|
1210
|
+
interface FABProps {
|
|
1211
|
+
/** Main button icon. */
|
|
1212
|
+
icon: React__default.ReactNode;
|
|
1213
|
+
/** Accessible label for the main button (required — it's icon-only). */
|
|
1214
|
+
label: string;
|
|
1215
|
+
/** Click handler. Ignored when `actions` is provided (the button toggles the dial). */
|
|
1216
|
+
onClick?: React__default.MouseEventHandler;
|
|
1217
|
+
/** Speed-dial sub-actions. When set, the main button opens/closes the dial. */
|
|
1218
|
+
actions?: FABAction[];
|
|
1219
|
+
/** Corner placement. Default `'bottom-right'`. */
|
|
1220
|
+
position?: FABPosition;
|
|
1221
|
+
/** Size preset. Default `'lg'`. */
|
|
1222
|
+
size?: FABSize;
|
|
1223
|
+
/** Colour. Default `'accent'`. */
|
|
1224
|
+
tone?: FABTone;
|
|
1225
|
+
/**
|
|
1226
|
+
* `position: fixed` to the viewport (default) or `absolute` to the nearest
|
|
1227
|
+
* positioned ancestor — set `false` to anchor inside a `relative` container.
|
|
1228
|
+
*/
|
|
1229
|
+
fixed?: boolean;
|
|
1230
|
+
className?: string;
|
|
1231
|
+
style?: React__default.CSSProperties;
|
|
1232
|
+
}
|
|
1233
|
+
/**
|
|
1234
|
+
* A floating action button. On its own it's a single round action; given
|
|
1235
|
+
* `actions`, it becomes a speed dial that expands a labelled stack on click.
|
|
1236
|
+
* Positions to a viewport corner by default (or a relative container with
|
|
1237
|
+
* `fixed={false}`).
|
|
1238
|
+
*
|
|
1239
|
+
* @example Single
|
|
1240
|
+
* <FAB icon={<PlusIcon />} label="New record" onClick={create} />
|
|
1241
|
+
*
|
|
1242
|
+
* @example Speed dial
|
|
1243
|
+
* <FAB icon={<PlusIcon />} label="Create" actions={[
|
|
1244
|
+
* { icon: <FileIcon />, label: 'Document', onClick: newDoc },
|
|
1245
|
+
* { icon: <FolderIcon />, label: 'Folder', onClick: newFolder },
|
|
1246
|
+
* ]} />
|
|
1247
|
+
*/
|
|
1248
|
+
declare function FAB({ icon, label, onClick, actions, position, size, tone, fixed, className, style, }: FABProps): react_jsx_runtime.JSX.Element;
|
|
1249
|
+
|
|
1201
1250
|
/** ─────────────────── types ─────────────────── */
|
|
1202
1251
|
type NotificationType = 'info' | 'success' | 'warning' | 'danger';
|
|
1203
1252
|
type NotificationPosition = 'top-right' | 'top-left' | 'top-center' | 'bottom-right' | 'bottom-left' | 'bottom-center';
|
|
@@ -4266,4 +4315,4 @@ declare function expiryError(value: string, now?: Date): string | undefined;
|
|
|
4266
4315
|
/** Validate the CVV against the detected brand's expected length. */
|
|
4267
4316
|
declare function cvvError(value: string, cardNumber: string): string | undefined;
|
|
4268
4317
|
|
|
4269
|
-
export { Accordion, type AccordionItemProps, type AccordionProps, AppShell, type AppShellProps, AutoComplete, type AutoCompleteProps, Avatar, type AvatarProps, type AvatarShape, type AvatarSize, type AvatarStatus, Badge, type BadgeProps, type BadgeSize, type BadgeTone, type BadgeVariant, Box, type BoxBackground, type BoxBorder, type BoxProps, type BoxRadius, type BoxShadow, type BreadcrumbItem, Breadcrumbs, type BreadcrumbsProps, Button, type ButtonProps, CARD_BRANDS, Card, type CardBodyProps, type CardBrand, CardCarousel, type CardCarouselProps, type CardFooterProps, type CardHeaderProps, type CardMediaProps, type CardProps, Catalog, CatalogCarousel, type CatalogCarouselProps, CatalogGrid, type CatalogGridProps, type CatalogProps, Checkbox, type CheckboxProps, ColorPicker, type ColorPickerProps, ContextMenu, type ContextMenuActionItem, type ContextMenuPosition, type ContextMenuProps, CreditCardForm, type CreditCardFormProps, type CreditCardValue, type DatePickerProps, type DateRange, DateRangePicker, type DateRangePickerProps, type DateRangePreset, type DeltaDirection, Drawer, type DrawerProps, Dropdown, type DropdownItem, type DropdownProps, type ErrorMap, type ExpandRowOptions, FadingBase, type FadingBaseProps, Field, type FieldArrayItem, type FieldBindings, FieldHelpIcon, type FieldKind, FieldLabel, type FieldLabelProps, type FieldProps, type FieldRule, type FieldRules, type FieldShellOptions, type FieldSize, type FieldSnapshot, FileInput, type FileInputProps, Flex, type FlexAlign, type FlexDirection, type FlexJustify, type FlexProps, type FlexWrap, Form, FormContext, FormField, type FormFieldProps, type FormProps, FormStore, type FormStoreOptions, type FormValues, Grid, GridCard, type GridCardItem, type GridCardProps, type GridProps, Icon, IconButton, type IconButtonProps, Kbd, type KbdProps, type KbdSize, List, type ListItem, type ListProps, LoadingSpinner, type LoadingSpinnerProps, MegaMenu, type MegaMenuFeaturedProps, type MegaMenuItemProps, type MegaMenuLinkProps, type MegaMenuPanelProps, type MegaMenuProps, type MegaMenuSectionProps, Modal, type ModalProps, type NotificationPayload, NotificationProvider, NumberInput, type NumberInputProps, OpaqueGridCard, type OpaqueGridCardProps, OtpInput, type OtpInputProps, type PaginationOptions, Password, type PasswordProps, Portal, type PortalProps, RadioGroup, type RadioGroupProps, type RadioOption, Rating, type RatingProps, type RulesMap, ScalableContainer, type ScalableContainerProps, SearchInput, type SearchInputProps, SegmentedControl, type SegmentedControlProps, type SegmentedOption, Sidebar, type SidebarItem, type SidebarProps, type SidebarSection, SkeletonBox, type SkeletonBoxProps, SkeletonCard, type SkeletonCardProps, SkeletonCircle, type SkeletonCircleProps, SkeletonText, type SkeletonTextProps, Slider, type SliderMark, type SliderProps, type SliderValue, type Spacing, Statistic, type StatisticDelta, type StatisticProps, type StatisticSize, Switch, type SwitchInputProps, Table, type TableColumn, type TableProps, Tabs, type TabsAddProps, type TabsListProps, type TabsOrientation, type TabsPanelProps, type TabsProps, type TabsSize, type TabsTriggerProps, type TabsVariant, TagsInput, type TagsInputProps, DatePicker as Temporal, type TemporalPickerProps, TextArea, type TextAreaProps, TextInput, type TextInputProps, type ThemeColors, type ThemeConfig, type ThemeDensity, type ThemeMotion, ThemeProvider, type ThemeProviderProps, type ThemeRadius, type ThemeShadows, ThemeSwitch, type ThemeSwitchProps, type ThemeTypography, TimePicker, type TimePickerProps, Tooltip, type TooltipProps, TooltipProvider, TopBar, type TopBarProps, Tree, type TreeItemClickPayload, type TreeNode, type TreeProps, TreeSelect, type TreeSelectProps, Typography, type TypographyAlign, type TypographyColor, type TypographyProps, type TypographyVariant, type TypographyWeight, type UseFieldArrayReturn, type UseFormFieldOptions, type UseFormReturn, type ValidateTrigger, Wizard, type WizardProps, type WizardStep, cardNumberError, cvvError, detectBrand, expiryError, fieldShell, formatCardNumber, formatExpiry, isRequired, luhnValid, onlyDigits, patterns, runFieldRules, useFieldArray, useForm, useFormField, useFormStore, useNotification };
|
|
4318
|
+
export { Accordion, type AccordionItemProps, type AccordionProps, AppShell, type AppShellProps, AutoComplete, type AutoCompleteProps, Avatar, type AvatarProps, type AvatarShape, type AvatarSize, type AvatarStatus, Badge, type BadgeProps, type BadgeSize, type BadgeTone, type BadgeVariant, Box, type BoxBackground, type BoxBorder, type BoxProps, type BoxRadius, type BoxShadow, type BreadcrumbItem, Breadcrumbs, type BreadcrumbsProps, Button, type ButtonProps, CARD_BRANDS, Card, type CardBodyProps, type CardBrand, CardCarousel, type CardCarouselProps, type CardFooterProps, type CardHeaderProps, type CardMediaProps, type CardProps, Catalog, CatalogCarousel, type CatalogCarouselProps, CatalogGrid, type CatalogGridProps, type CatalogProps, Checkbox, type CheckboxProps, ColorPicker, type ColorPickerProps, ContextMenu, type ContextMenuActionItem, type ContextMenuPosition, type ContextMenuProps, CreditCardForm, type CreditCardFormProps, type CreditCardValue, type DatePickerProps, type DateRange, DateRangePicker, type DateRangePickerProps, type DateRangePreset, type DeltaDirection, Drawer, type DrawerProps, Dropdown, type DropdownItem, type DropdownProps, type ErrorMap, type ExpandRowOptions, FAB, type FABAction, type FABPosition, type FABProps, type FABSize, type FABTone, FadingBase, type FadingBaseProps, Field, type FieldArrayItem, type FieldBindings, FieldHelpIcon, type FieldKind, FieldLabel, type FieldLabelProps, type FieldProps, type FieldRule, type FieldRules, type FieldShellOptions, type FieldSize, type FieldSnapshot, FileInput, type FileInputProps, Flex, type FlexAlign, type FlexDirection, type FlexJustify, type FlexProps, type FlexWrap, Form, FormContext, FormField, type FormFieldProps, type FormProps, FormStore, type FormStoreOptions, type FormValues, Grid, GridCard, type GridCardItem, type GridCardProps, type GridProps, Icon, IconButton, type IconButtonProps, Kbd, type KbdProps, type KbdSize, List, type ListItem, type ListProps, LoadingSpinner, type LoadingSpinnerProps, MegaMenu, type MegaMenuFeaturedProps, type MegaMenuItemProps, type MegaMenuLinkProps, type MegaMenuPanelProps, type MegaMenuProps, type MegaMenuSectionProps, Modal, type ModalProps, type NotificationPayload, NotificationProvider, NumberInput, type NumberInputProps, OpaqueGridCard, type OpaqueGridCardProps, OtpInput, type OtpInputProps, type PaginationOptions, Password, type PasswordProps, Portal, type PortalProps, RadioGroup, type RadioGroupProps, type RadioOption, Rating, type RatingProps, type RulesMap, ScalableContainer, type ScalableContainerProps, SearchInput, type SearchInputProps, SegmentedControl, type SegmentedControlProps, type SegmentedOption, Sidebar, type SidebarItem, type SidebarProps, type SidebarSection, SkeletonBox, type SkeletonBoxProps, SkeletonCard, type SkeletonCardProps, SkeletonCircle, type SkeletonCircleProps, SkeletonText, type SkeletonTextProps, Slider, type SliderMark, type SliderProps, type SliderValue, type Spacing, Statistic, type StatisticDelta, type StatisticProps, type StatisticSize, Switch, type SwitchInputProps, Table, type TableColumn, type TableProps, Tabs, type TabsAddProps, type TabsListProps, type TabsOrientation, type TabsPanelProps, type TabsProps, type TabsSize, type TabsTriggerProps, type TabsVariant, TagsInput, type TagsInputProps, DatePicker as Temporal, type TemporalPickerProps, TextArea, type TextAreaProps, TextInput, type TextInputProps, type ThemeColors, type ThemeConfig, type ThemeDensity, type ThemeMotion, ThemeProvider, type ThemeProviderProps, type ThemeRadius, type ThemeShadows, ThemeSwitch, type ThemeSwitchProps, type ThemeTypography, TimePicker, type TimePickerProps, Tooltip, type TooltipProps, TooltipProvider, TopBar, type TopBarProps, Tree, type TreeItemClickPayload, type TreeNode, type TreeProps, TreeSelect, type TreeSelectProps, Typography, type TypographyAlign, type TypographyColor, type TypographyProps, type TypographyVariant, type TypographyWeight, type UseFieldArrayReturn, type UseFormFieldOptions, type UseFormReturn, type ValidateTrigger, Wizard, type WizardProps, type WizardStep, cardNumberError, cvvError, detectBrand, expiryError, fieldShell, formatCardNumber, formatExpiry, isRequired, luhnValid, onlyDigits, patterns, runFieldRules, useFieldArray, useForm, useFormField, useFormStore, useNotification };
|
package/dist/index.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { colors_default } from './chunk-GKXP6OJJ.js';
|
|
2
2
|
export { colors_default as COLORS, PALETTE as palette, semanticTokens, vars } from './chunk-GKXP6OJJ.js';
|
|
3
3
|
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
4
|
-
import
|
|
4
|
+
import React17, { createContext, useState, useEffect, useMemo, useId, useCallback, useRef, useContext, useLayoutEffect, useSyncExternalStore } from 'react';
|
|
5
5
|
import { createPortal } from 'react-dom';
|
|
6
6
|
import * as AvatarPrimitive from '@radix-ui/react-avatar';
|
|
7
7
|
import * as Dialog from '@radix-ui/react-dialog';
|
|
@@ -1630,7 +1630,7 @@ function Kbd({
|
|
|
1630
1630
|
style
|
|
1631
1631
|
}) {
|
|
1632
1632
|
if (keys && keys.length > 0) {
|
|
1633
|
-
return /* @__PURE__ */ jsx("span", { className: ["inline-flex items-center gap-1", className].filter(Boolean).join(" "), style, children: keys.map((k, i) => /* @__PURE__ */ jsxs(
|
|
1633
|
+
return /* @__PURE__ */ jsx("span", { className: ["inline-flex items-center gap-1", className].filter(Boolean).join(" "), style, children: keys.map((k, i) => /* @__PURE__ */ jsxs(React17.Fragment, { children: [
|
|
1634
1634
|
i > 0 && /* @__PURE__ */ jsx("span", { className: "text-foreground-muted text-xs select-none", children: separator }),
|
|
1635
1635
|
/* @__PURE__ */ jsx("kbd", { className: [cap, SIZE3[size]].join(" "), children: k })
|
|
1636
1636
|
] }, `${k}-${i}`)) });
|
|
@@ -1704,7 +1704,7 @@ function CardCarousel({
|
|
|
1704
1704
|
style
|
|
1705
1705
|
}) {
|
|
1706
1706
|
const scrollerRef = useRef(null);
|
|
1707
|
-
const slides =
|
|
1707
|
+
const slides = React17.Children.toArray(children);
|
|
1708
1708
|
const [active, setActive] = useState(0);
|
|
1709
1709
|
const [atStart, setAtStart] = useState(true);
|
|
1710
1710
|
const [atEnd, setAtEnd] = useState(false);
|
|
@@ -1826,6 +1826,103 @@ function Statistic({
|
|
|
1826
1826
|
}
|
|
1827
1827
|
);
|
|
1828
1828
|
}
|
|
1829
|
+
var POS = {
|
|
1830
|
+
"bottom-right": "bottom-6 right-6 items-end",
|
|
1831
|
+
"bottom-left": "bottom-6 left-6 items-start",
|
|
1832
|
+
"top-right": "top-6 right-6 items-end",
|
|
1833
|
+
"top-left": "top-6 left-6 items-start"
|
|
1834
|
+
};
|
|
1835
|
+
var SIZE4 = {
|
|
1836
|
+
md: "h-12 w-12",
|
|
1837
|
+
lg: "h-14 w-14"
|
|
1838
|
+
};
|
|
1839
|
+
var TONE3 = {
|
|
1840
|
+
accent: "bg-accent text-accent-fg hover:bg-accent-hover",
|
|
1841
|
+
neutral: "bg-foreground-secondary text-background hover:opacity-90"
|
|
1842
|
+
};
|
|
1843
|
+
function FAB({
|
|
1844
|
+
icon,
|
|
1845
|
+
label,
|
|
1846
|
+
onClick,
|
|
1847
|
+
actions,
|
|
1848
|
+
position = "bottom-right",
|
|
1849
|
+
size = "lg",
|
|
1850
|
+
tone = "accent",
|
|
1851
|
+
fixed = true,
|
|
1852
|
+
className = "",
|
|
1853
|
+
style
|
|
1854
|
+
}) {
|
|
1855
|
+
const [open, setOpen] = useState(false);
|
|
1856
|
+
const reduced = useReducedMotion();
|
|
1857
|
+
const hasDial = !!actions && actions.length > 0;
|
|
1858
|
+
const bottom = position.startsWith("bottom");
|
|
1859
|
+
const alignRight = position.endsWith("right");
|
|
1860
|
+
const dial = hasDial && /* @__PURE__ */ jsx(AnimatePresence, { children: open && /* @__PURE__ */ jsx(
|
|
1861
|
+
motion.ul,
|
|
1862
|
+
{
|
|
1863
|
+
className: `flex flex-col gap-3 ${bottom ? "mb-3" : "mt-3 order-last"} ${alignRight ? "items-end" : "items-start"}`,
|
|
1864
|
+
initial: "hidden",
|
|
1865
|
+
animate: "show",
|
|
1866
|
+
exit: "hidden",
|
|
1867
|
+
variants: { show: { transition: { staggerChildren: reduced ? 0 : 0.04, staggerDirection: bottom ? -1 : 1 } } },
|
|
1868
|
+
children: actions.map((a, i) => /* @__PURE__ */ jsxs(
|
|
1869
|
+
motion.li,
|
|
1870
|
+
{
|
|
1871
|
+
className: `flex items-center gap-2 ${alignRight ? "flex-row" : "flex-row-reverse"}`,
|
|
1872
|
+
variants: {
|
|
1873
|
+
hidden: { opacity: 0, y: reduced ? 0 : bottom ? 8 : -8, scale: reduced ? 1 : 0.9 },
|
|
1874
|
+
show: { opacity: 1, y: 0, scale: 1 }
|
|
1875
|
+
},
|
|
1876
|
+
children: [
|
|
1877
|
+
/* @__PURE__ */ jsx("span", { className: "rounded-md bg-surface px-2 py-1 text-xs font-medium text-foreground shadow-md border border-border whitespace-nowrap", children: a.label }),
|
|
1878
|
+
/* @__PURE__ */ jsx(
|
|
1879
|
+
"button",
|
|
1880
|
+
{
|
|
1881
|
+
type: "button",
|
|
1882
|
+
"aria-label": a.label,
|
|
1883
|
+
onClick: (e) => {
|
|
1884
|
+
a.onClick?.(e);
|
|
1885
|
+
setOpen(false);
|
|
1886
|
+
},
|
|
1887
|
+
className: "flex h-11 w-11 items-center justify-center rounded-full bg-surface text-foreground-secondary shadow-lg border border-border transition hover:text-foreground hover:bg-surface-raised focus:outline-none focus-visible:ring-2 focus-visible:ring-accent",
|
|
1888
|
+
children: /* @__PURE__ */ jsx("span", { className: "h-5 w-5 inline-flex items-center justify-center", children: a.icon })
|
|
1889
|
+
}
|
|
1890
|
+
)
|
|
1891
|
+
]
|
|
1892
|
+
},
|
|
1893
|
+
i
|
|
1894
|
+
))
|
|
1895
|
+
}
|
|
1896
|
+
) });
|
|
1897
|
+
return /* @__PURE__ */ jsxs(
|
|
1898
|
+
"div",
|
|
1899
|
+
{
|
|
1900
|
+
className: [fixed ? "fixed" : "absolute", "z-40 flex flex-col", POS[position], className].filter(Boolean).join(" "),
|
|
1901
|
+
style,
|
|
1902
|
+
children: [
|
|
1903
|
+
bottom && dial,
|
|
1904
|
+
/* @__PURE__ */ jsx(
|
|
1905
|
+
"button",
|
|
1906
|
+
{
|
|
1907
|
+
type: "button",
|
|
1908
|
+
"aria-label": label,
|
|
1909
|
+
"aria-expanded": hasDial ? open : void 0,
|
|
1910
|
+
onClick: (e) => hasDial ? setOpen((o) => !o) : onClick?.(e),
|
|
1911
|
+
className: [
|
|
1912
|
+
"flex items-center justify-center rounded-full shadow-lg transition-[background-color,transform] duration-200",
|
|
1913
|
+
"focus:outline-none focus-visible:ring-2 focus-visible:ring-accent focus-visible:ring-offset-2",
|
|
1914
|
+
SIZE4[size],
|
|
1915
|
+
TONE3[tone],
|
|
1916
|
+
hasDial && open ? "rotate-45" : ""
|
|
1917
|
+
].filter(Boolean).join(" "),
|
|
1918
|
+
children: /* @__PURE__ */ jsx("span", { className: "h-6 w-6 inline-flex items-center justify-center", children: icon })
|
|
1919
|
+
}
|
|
1920
|
+
),
|
|
1921
|
+
!bottom && dial
|
|
1922
|
+
]
|
|
1923
|
+
}
|
|
1924
|
+
);
|
|
1925
|
+
}
|
|
1829
1926
|
var NotificationContext = createContext({
|
|
1830
1927
|
open: () => void 0,
|
|
1831
1928
|
close: () => void 0
|
|
@@ -2929,7 +3026,7 @@ function Field({
|
|
|
2929
3026
|
);
|
|
2930
3027
|
}
|
|
2931
3028
|
var SearchIcon = /* @__PURE__ */ jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", className: "w-4 h-4", "aria-hidden": "true", children: /* @__PURE__ */ jsx("path", { fillRule: "evenodd", d: "M10.5 3.75a6.75 6.75 0 100 13.5 6.75 6.75 0 000-13.5zM2.25 10.5a8.25 8.25 0 1114.59 5.28l4.69 4.69a.75.75 0 11-1.06 1.06l-4.69-4.69A8.25 8.25 0 012.25 10.5z", clipRule: "evenodd" }) });
|
|
2932
|
-
var SearchInput =
|
|
3029
|
+
var SearchInput = React17.forwardRef(function SearchInput2({ value, onChange, disabled, label, htmlFor, placeholder, name, inputStyle, style, layout = "vertical", size = "md", icon, helperText, className }, ref) {
|
|
2933
3030
|
return /* @__PURE__ */ jsx(Field, { className, label, htmlFor, layout, helperText, children: /* @__PURE__ */ jsxs(
|
|
2934
3031
|
"div",
|
|
2935
3032
|
{
|
|
@@ -3430,7 +3527,7 @@ function TableBody({
|
|
|
3430
3527
|
return /* @__PURE__ */ jsx("tbody", { children: rows.map((row, i) => {
|
|
3431
3528
|
const rowKey = getRowKey(row, i);
|
|
3432
3529
|
const isExpanded = expanded.has(rowKey);
|
|
3433
|
-
return /* @__PURE__ */ jsxs(
|
|
3530
|
+
return /* @__PURE__ */ jsxs(React17.Fragment, { children: [
|
|
3434
3531
|
/* @__PURE__ */ jsxs(
|
|
3435
3532
|
"tr",
|
|
3436
3533
|
{
|
|
@@ -3974,8 +4071,8 @@ function MegaMenuLink({ href, icon, description, active, onClick, children, clas
|
|
|
3974
4071
|
function MegaMenuFeatured({ children, className = "" }) {
|
|
3975
4072
|
return /* @__PURE__ */ jsx("div", { className: ["min-w-0 rounded-lg bg-surface-raised border border-border p-4 flex flex-col", className].filter(Boolean).join(" "), children });
|
|
3976
4073
|
}
|
|
3977
|
-
var elementsOfType = (children, type) =>
|
|
3978
|
-
(c) =>
|
|
4074
|
+
var elementsOfType = (children, type) => React17.Children.toArray(children).filter(
|
|
4075
|
+
(c) => React17.isValidElement(c) && c.type === type
|
|
3979
4076
|
);
|
|
3980
4077
|
var MOBILE_CHEVRON = /* @__PURE__ */ jsx(
|
|
3981
4078
|
"svg",
|
|
@@ -4012,9 +4109,9 @@ function MobileLinkRow({ link, onNavigate }) {
|
|
|
4012
4109
|
);
|
|
4013
4110
|
}
|
|
4014
4111
|
function MobilePanel({ panel, onNavigate }) {
|
|
4015
|
-
const nodes =
|
|
4112
|
+
const nodes = React17.Children.toArray(panel.props.children);
|
|
4016
4113
|
return /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-4 px-2 pb-3 pt-1", children: nodes.map((node, i) => {
|
|
4017
|
-
if (!
|
|
4114
|
+
if (!React17.isValidElement(node)) return null;
|
|
4018
4115
|
const el = node;
|
|
4019
4116
|
if (el.type === MegaMenuSection) {
|
|
4020
4117
|
const { title, children } = el.props;
|
|
@@ -4307,7 +4404,7 @@ function ThemeProvider({
|
|
|
4307
4404
|
className = "",
|
|
4308
4405
|
style
|
|
4309
4406
|
}) {
|
|
4310
|
-
const id =
|
|
4407
|
+
const id = React17.useId().replace(/:/g, "");
|
|
4311
4408
|
const scopeClass = `geo-th-${id}`;
|
|
4312
4409
|
const divRef = useRef(null);
|
|
4313
4410
|
useEffect(() => {
|
|
@@ -5902,7 +5999,7 @@ function TextArea({
|
|
|
5902
5999
|
}
|
|
5903
6000
|
);
|
|
5904
6001
|
}
|
|
5905
|
-
var
|
|
6002
|
+
var SIZE5 = {
|
|
5906
6003
|
sm: { h: "h-control-sm", text: "text-xs", pad: "px-2.5" },
|
|
5907
6004
|
md: { h: "h-control-md", text: "text-sm", pad: "px-3.5" },
|
|
5908
6005
|
lg: { h: "h-control-lg", text: "text-sm", pad: "px-4" }
|
|
@@ -5924,7 +6021,7 @@ function SegmentedControl({
|
|
|
5924
6021
|
errorMessage,
|
|
5925
6022
|
"aria-label": ariaLabel
|
|
5926
6023
|
}) {
|
|
5927
|
-
const sz =
|
|
6024
|
+
const sz = SIZE5[size];
|
|
5928
6025
|
const groupId = useId();
|
|
5929
6026
|
const errorId = useId();
|
|
5930
6027
|
const hasError = errorMessage != null;
|
|
@@ -6311,7 +6408,7 @@ function OtpInput({
|
|
|
6311
6408
|
emit(valid.join(""));
|
|
6312
6409
|
focusBox(valid.length);
|
|
6313
6410
|
};
|
|
6314
|
-
return /* @__PURE__ */ jsx(Field, { className, label, htmlFor, errorId, errorMessage, required, layout, helperText, children: /* @__PURE__ */ jsx("div", { className: "flex items-center gap-2", role: "group", "aria-label": typeof label === "string" ? label : "One-time code", children: chars.map((char, idx) => /* @__PURE__ */ jsxs(
|
|
6411
|
+
return /* @__PURE__ */ jsx(Field, { className, label, htmlFor, errorId, errorMessage, required, layout, helperText, children: /* @__PURE__ */ jsx("div", { className: "flex items-center gap-2", role: "group", "aria-label": typeof label === "string" ? label : "One-time code", children: chars.map((char, idx) => /* @__PURE__ */ jsxs(React17.Fragment, { children: [
|
|
6315
6412
|
/* @__PURE__ */ jsx(
|
|
6316
6413
|
"input",
|
|
6317
6414
|
{
|
|
@@ -7525,6 +7622,6 @@ function CreditCardForm({
|
|
|
7525
7622
|
);
|
|
7526
7623
|
}
|
|
7527
7624
|
|
|
7528
|
-
export { Accordion_default as Accordion, AppShell, AutoComplete, Avatar, Badge, Box, Breadcrumbs, Button, CARD_BRANDS, Card_default as Card, CardCarousel, Catalog, CatalogCarousel, CatalogGrid, Checkbox, ColorPicker, ContextMenu, CreditCardForm, DateRangePicker, Drawer, Dropdown, FadingBase, Field, FieldHelpIcon, FieldLabel, FileInput, Flex, Form, FormContext, FormField, FormStore, Grid2 as Grid, GridCard, icons_default as Icon, IconButton, Kbd, List2 as List, LoadingSpinner, MegaMenu_default as MegaMenu, Modal, NotificationProvider, NumberInput, OpaqueGridCard, OtpInput, Password, Portal, RadioGroup, Rating, ScalableContainer, SearchInput_default as SearchInput, SegmentedControl, Sidebar, SkeletonBox, SkeletonCard, SkeletonCircle, SkeletonText, Slider, Statistic, Switch, Table, Tabs_default as Tabs, TagsInput, DatePicker as Temporal, TextArea, TextInput, ThemeProvider, ThemeSwitch, TimePicker, Tooltip, TooltipProvider, TopBar, Tree, TreeSelect, Typography, Wizard, cardNumberError, cvvError, detectBrand, expiryError, fieldShell, formatCardNumber, formatExpiry, isRequired, luhnValid, onlyDigits, patterns, runFieldRules, useFieldArray, useForm, useFormField, useFormStore, useNotification };
|
|
7625
|
+
export { Accordion_default as Accordion, AppShell, AutoComplete, Avatar, Badge, Box, Breadcrumbs, Button, CARD_BRANDS, Card_default as Card, CardCarousel, Catalog, CatalogCarousel, CatalogGrid, Checkbox, ColorPicker, ContextMenu, CreditCardForm, DateRangePicker, Drawer, Dropdown, FAB, FadingBase, Field, FieldHelpIcon, FieldLabel, FileInput, Flex, Form, FormContext, FormField, FormStore, Grid2 as Grid, GridCard, icons_default as Icon, IconButton, Kbd, List2 as List, LoadingSpinner, MegaMenu_default as MegaMenu, Modal, NotificationProvider, NumberInput, OpaqueGridCard, OtpInput, Password, Portal, RadioGroup, Rating, ScalableContainer, SearchInput_default as SearchInput, SegmentedControl, Sidebar, SkeletonBox, SkeletonCard, SkeletonCircle, SkeletonText, Slider, Statistic, Switch, Table, Tabs_default as Tabs, TagsInput, DatePicker as Temporal, TextArea, TextInput, ThemeProvider, ThemeSwitch, TimePicker, Tooltip, TooltipProvider, TopBar, Tree, TreeSelect, Typography, Wizard, cardNumberError, cvvError, detectBrand, expiryError, fieldShell, formatCardNumber, formatExpiry, isRequired, luhnValid, onlyDigits, patterns, runFieldRules, useFieldArray, useForm, useFormField, useFormStore, useNotification };
|
|
7529
7626
|
//# sourceMappingURL=index.js.map
|
|
7530
7627
|
//# sourceMappingURL=index.js.map
|