@geomak/ui 6.2.2 → 6.3.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 +307 -198
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +65 -1
- package/dist/index.d.ts +65 -1
- package/dist/index.js +124 -16
- package/dist/index.js.map +1 -1
- package/dist/styles.css +24 -0
- package/package.json +1 -1
package/dist/index.d.cts
CHANGED
|
@@ -866,6 +866,70 @@ interface TreeProps {
|
|
|
866
866
|
*/
|
|
867
867
|
declare function Tree({ nodes, onNodeClick, defaultExpandAll, defaultExpandedKeys, className, style, }: TreeProps): react_jsx_runtime.JSX.Element;
|
|
868
868
|
|
|
869
|
+
type AccordionVariant = 'separated' | 'contained';
|
|
870
|
+
interface AccordionProps {
|
|
871
|
+
/** `AccordionItem` children. */
|
|
872
|
+
children: React__default.ReactNode;
|
|
873
|
+
/**
|
|
874
|
+
* `'single'` (default) allows one open panel at a time; `'multiple'` lets
|
|
875
|
+
* any number be open together.
|
|
876
|
+
*/
|
|
877
|
+
type?: 'single' | 'multiple';
|
|
878
|
+
/** Uncontrolled initial open value(s). */
|
|
879
|
+
defaultValue?: string | string[];
|
|
880
|
+
/** Controlled open value(s). */
|
|
881
|
+
value?: string | string[];
|
|
882
|
+
/** Fires when the open set changes. */
|
|
883
|
+
onValueChange?: (value: string | string[]) => void;
|
|
884
|
+
/** In `single` mode, allow the open item to be collapsed. Default `true`. */
|
|
885
|
+
collapsible?: boolean;
|
|
886
|
+
/**
|
|
887
|
+
* Visual style:
|
|
888
|
+
* - `'separated'` (default) — each item is its own bordered card with gaps.
|
|
889
|
+
* - `'contained'` — one bordered surface with divider lines between items.
|
|
890
|
+
*/
|
|
891
|
+
variant?: AccordionVariant;
|
|
892
|
+
/** Extra classes merged onto the root. */
|
|
893
|
+
className?: string;
|
|
894
|
+
style?: React__default.CSSProperties;
|
|
895
|
+
}
|
|
896
|
+
/**
|
|
897
|
+
* Vertically stacked, collapsible panels built on `@radix-ui/react-accordion`.
|
|
898
|
+
* Radix handles open/close state, keyboard navigation (↑/↓/Home/End), and ARIA;
|
|
899
|
+
* the content height animates via the shared `accordion-down` / `accordion-up`
|
|
900
|
+
* keyframes (reduced-motion safe — the height var simply snaps).
|
|
901
|
+
*
|
|
902
|
+
* @example
|
|
903
|
+
* ```tsx
|
|
904
|
+
* <Accordion type="single" defaultValue="a" collapsible>
|
|
905
|
+
* <Accordion.Item value="a" title="What is included?">
|
|
906
|
+
* Everything in the Pro plan, plus priority support.
|
|
907
|
+
* </Accordion.Item>
|
|
908
|
+
* <Accordion.Item value="b" title="Can I cancel anytime?">
|
|
909
|
+
* Yes — cancel from billing settings, no questions asked.
|
|
910
|
+
* </Accordion.Item>
|
|
911
|
+
* </Accordion>
|
|
912
|
+
* ```
|
|
913
|
+
*/
|
|
914
|
+
declare function Accordion({ children, type, defaultValue, value, onValueChange, collapsible, variant, className, style, }: AccordionProps): react_jsx_runtime.JSX.Element;
|
|
915
|
+
declare namespace Accordion {
|
|
916
|
+
var Item: typeof AccordionItem;
|
|
917
|
+
}
|
|
918
|
+
interface AccordionItemProps {
|
|
919
|
+
/** Unique value identifying this panel (used for open state). */
|
|
920
|
+
value: string;
|
|
921
|
+
/** Header content — the always-visible trigger label. */
|
|
922
|
+
title: React__default.ReactNode;
|
|
923
|
+
/** Optional leading icon shown before the title. */
|
|
924
|
+
icon?: React__default.ReactNode;
|
|
925
|
+
/** Panel body, revealed when open. */
|
|
926
|
+
children: React__default.ReactNode;
|
|
927
|
+
/** Disable this item (header non-interactive, dimmed). */
|
|
928
|
+
disabled?: boolean;
|
|
929
|
+
className?: string;
|
|
930
|
+
}
|
|
931
|
+
declare function AccordionItem({ value, title, icon, children, disabled, className }: AccordionItemProps): react_jsx_runtime.JSX.Element;
|
|
932
|
+
|
|
869
933
|
/** ─────────────────── types ─────────────────── */
|
|
870
934
|
type NotificationType = 'info' | 'success' | 'warning' | 'danger';
|
|
871
935
|
type NotificationPosition = 'top-right' | 'top-left' | 'top-center' | 'bottom-right' | 'bottom-left' | 'bottom-center';
|
|
@@ -3934,4 +3998,4 @@ declare function expiryError(value: string, now?: Date): string | undefined;
|
|
|
3934
3998
|
/** Validate the CVV against the detected brand's expected length. */
|
|
3935
3999
|
declare function cvvError(value: string, cardNumber: string): string | undefined;
|
|
3936
4000
|
|
|
3937
|
-
export { AppShell, type AppShellProps, AutoComplete, type AutoCompleteProps, Avatar, type AvatarProps, type AvatarShape, type AvatarSize, type AvatarStatus, Box, type BoxBackground, type BoxBorder, type BoxProps, type BoxRadius, type BoxShadow, Button, type ButtonProps, CARD_BRANDS, type CardBrand, 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, 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, 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, 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 };
|
|
4001
|
+
export { Accordion, type AccordionItemProps, type AccordionProps, AppShell, type AppShellProps, AutoComplete, type AutoCompleteProps, Avatar, type AvatarProps, type AvatarShape, type AvatarSize, type AvatarStatus, Box, type BoxBackground, type BoxBorder, type BoxProps, type BoxRadius, type BoxShadow, Button, type ButtonProps, CARD_BRANDS, type CardBrand, 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, 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, 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, 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
|
@@ -866,6 +866,70 @@ interface TreeProps {
|
|
|
866
866
|
*/
|
|
867
867
|
declare function Tree({ nodes, onNodeClick, defaultExpandAll, defaultExpandedKeys, className, style, }: TreeProps): react_jsx_runtime.JSX.Element;
|
|
868
868
|
|
|
869
|
+
type AccordionVariant = 'separated' | 'contained';
|
|
870
|
+
interface AccordionProps {
|
|
871
|
+
/** `AccordionItem` children. */
|
|
872
|
+
children: React__default.ReactNode;
|
|
873
|
+
/**
|
|
874
|
+
* `'single'` (default) allows one open panel at a time; `'multiple'` lets
|
|
875
|
+
* any number be open together.
|
|
876
|
+
*/
|
|
877
|
+
type?: 'single' | 'multiple';
|
|
878
|
+
/** Uncontrolled initial open value(s). */
|
|
879
|
+
defaultValue?: string | string[];
|
|
880
|
+
/** Controlled open value(s). */
|
|
881
|
+
value?: string | string[];
|
|
882
|
+
/** Fires when the open set changes. */
|
|
883
|
+
onValueChange?: (value: string | string[]) => void;
|
|
884
|
+
/** In `single` mode, allow the open item to be collapsed. Default `true`. */
|
|
885
|
+
collapsible?: boolean;
|
|
886
|
+
/**
|
|
887
|
+
* Visual style:
|
|
888
|
+
* - `'separated'` (default) — each item is its own bordered card with gaps.
|
|
889
|
+
* - `'contained'` — one bordered surface with divider lines between items.
|
|
890
|
+
*/
|
|
891
|
+
variant?: AccordionVariant;
|
|
892
|
+
/** Extra classes merged onto the root. */
|
|
893
|
+
className?: string;
|
|
894
|
+
style?: React__default.CSSProperties;
|
|
895
|
+
}
|
|
896
|
+
/**
|
|
897
|
+
* Vertically stacked, collapsible panels built on `@radix-ui/react-accordion`.
|
|
898
|
+
* Radix handles open/close state, keyboard navigation (↑/↓/Home/End), and ARIA;
|
|
899
|
+
* the content height animates via the shared `accordion-down` / `accordion-up`
|
|
900
|
+
* keyframes (reduced-motion safe — the height var simply snaps).
|
|
901
|
+
*
|
|
902
|
+
* @example
|
|
903
|
+
* ```tsx
|
|
904
|
+
* <Accordion type="single" defaultValue="a" collapsible>
|
|
905
|
+
* <Accordion.Item value="a" title="What is included?">
|
|
906
|
+
* Everything in the Pro plan, plus priority support.
|
|
907
|
+
* </Accordion.Item>
|
|
908
|
+
* <Accordion.Item value="b" title="Can I cancel anytime?">
|
|
909
|
+
* Yes — cancel from billing settings, no questions asked.
|
|
910
|
+
* </Accordion.Item>
|
|
911
|
+
* </Accordion>
|
|
912
|
+
* ```
|
|
913
|
+
*/
|
|
914
|
+
declare function Accordion({ children, type, defaultValue, value, onValueChange, collapsible, variant, className, style, }: AccordionProps): react_jsx_runtime.JSX.Element;
|
|
915
|
+
declare namespace Accordion {
|
|
916
|
+
var Item: typeof AccordionItem;
|
|
917
|
+
}
|
|
918
|
+
interface AccordionItemProps {
|
|
919
|
+
/** Unique value identifying this panel (used for open state). */
|
|
920
|
+
value: string;
|
|
921
|
+
/** Header content — the always-visible trigger label. */
|
|
922
|
+
title: React__default.ReactNode;
|
|
923
|
+
/** Optional leading icon shown before the title. */
|
|
924
|
+
icon?: React__default.ReactNode;
|
|
925
|
+
/** Panel body, revealed when open. */
|
|
926
|
+
children: React__default.ReactNode;
|
|
927
|
+
/** Disable this item (header non-interactive, dimmed). */
|
|
928
|
+
disabled?: boolean;
|
|
929
|
+
className?: string;
|
|
930
|
+
}
|
|
931
|
+
declare function AccordionItem({ value, title, icon, children, disabled, className }: AccordionItemProps): react_jsx_runtime.JSX.Element;
|
|
932
|
+
|
|
869
933
|
/** ─────────────────── types ─────────────────── */
|
|
870
934
|
type NotificationType = 'info' | 'success' | 'warning' | 'danger';
|
|
871
935
|
type NotificationPosition = 'top-right' | 'top-left' | 'top-center' | 'bottom-right' | 'bottom-left' | 'bottom-center';
|
|
@@ -3934,4 +3998,4 @@ declare function expiryError(value: string, now?: Date): string | undefined;
|
|
|
3934
3998
|
/** Validate the CVV against the detected brand's expected length. */
|
|
3935
3999
|
declare function cvvError(value: string, cardNumber: string): string | undefined;
|
|
3936
4000
|
|
|
3937
|
-
export { AppShell, type AppShellProps, AutoComplete, type AutoCompleteProps, Avatar, type AvatarProps, type AvatarShape, type AvatarSize, type AvatarStatus, Box, type BoxBackground, type BoxBorder, type BoxProps, type BoxRadius, type BoxShadow, Button, type ButtonProps, CARD_BRANDS, type CardBrand, 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, 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, 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, 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 };
|
|
4001
|
+
export { Accordion, type AccordionItemProps, type AccordionProps, AppShell, type AppShellProps, AutoComplete, type AutoCompleteProps, Avatar, type AvatarProps, type AvatarShape, type AvatarSize, type AvatarStatus, Box, type BoxBackground, type BoxBorder, type BoxProps, type BoxRadius, type BoxShadow, Button, type ButtonProps, CARD_BRANDS, type CardBrand, 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, 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, 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, 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,14 +1,14 @@
|
|
|
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 React13, { 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';
|
|
8
8
|
import { useReducedMotion, AnimatePresence, motion } from 'framer-motion';
|
|
9
9
|
import * as TooltipPrimitive from '@radix-ui/react-tooltip';
|
|
10
10
|
import * as TabsPrimitive from '@radix-ui/react-tabs';
|
|
11
|
-
import * as
|
|
11
|
+
import * as AccordionPrimitive from '@radix-ui/react-accordion';
|
|
12
12
|
import * as ContextMenuPrimitive from '@radix-ui/react-context-menu';
|
|
13
13
|
import * as Popover from '@radix-ui/react-popover';
|
|
14
14
|
import * as SwitchPrimitive from '@radix-ui/react-switch';
|
|
@@ -1293,14 +1293,14 @@ function TreeNodeItem({
|
|
|
1293
1293
|
}
|
|
1294
1294
|
const initialOpen = defaultExpandAll || defaultExpandedKeys.includes(item.key) ? [item.key] : [];
|
|
1295
1295
|
return /* @__PURE__ */ jsx(
|
|
1296
|
-
|
|
1296
|
+
AccordionPrimitive.Root,
|
|
1297
1297
|
{
|
|
1298
1298
|
type: "multiple",
|
|
1299
1299
|
defaultValue: initialOpen,
|
|
1300
1300
|
style: { paddingLeft: depth * 12 },
|
|
1301
|
-
children: /* @__PURE__ */ jsxs(
|
|
1301
|
+
children: /* @__PURE__ */ jsxs(AccordionPrimitive.Item, { value: item.key, className: "border-none", children: [
|
|
1302
1302
|
/* @__PURE__ */ jsxs(
|
|
1303
|
-
|
|
1303
|
+
AccordionPrimitive.Trigger,
|
|
1304
1304
|
{
|
|
1305
1305
|
onClick: () => onNodeClick({
|
|
1306
1306
|
isParent: true,
|
|
@@ -1334,7 +1334,7 @@ function TreeNodeItem({
|
|
|
1334
1334
|
]
|
|
1335
1335
|
}
|
|
1336
1336
|
),
|
|
1337
|
-
/* @__PURE__ */ jsx(
|
|
1337
|
+
/* @__PURE__ */ jsx(AccordionPrimitive.Content, { className: "overflow-hidden data-[state=open]:animate-accordion-down data-[state=closed]:animate-accordion-up", children: /* @__PURE__ */ jsx("div", { className: "ml-3.5 border-l border-border py-0.5", children: item.children.map((child) => /* @__PURE__ */ jsx(
|
|
1338
1338
|
TreeNodeItem,
|
|
1339
1339
|
{
|
|
1340
1340
|
item: child,
|
|
@@ -1368,6 +1368,101 @@ function Tree({
|
|
|
1368
1368
|
item.key
|
|
1369
1369
|
)) });
|
|
1370
1370
|
}
|
|
1371
|
+
var AccordionCtx = createContext({ variant: "separated" });
|
|
1372
|
+
function Accordion2({
|
|
1373
|
+
children,
|
|
1374
|
+
type = "single",
|
|
1375
|
+
defaultValue,
|
|
1376
|
+
value,
|
|
1377
|
+
onValueChange,
|
|
1378
|
+
collapsible = true,
|
|
1379
|
+
variant = "separated",
|
|
1380
|
+
className = "",
|
|
1381
|
+
style
|
|
1382
|
+
}) {
|
|
1383
|
+
const common = {
|
|
1384
|
+
className: [
|
|
1385
|
+
variant === "contained" ? "rounded-lg border border-border bg-surface overflow-hidden divide-y divide-border" : "flex flex-col gap-2",
|
|
1386
|
+
className
|
|
1387
|
+
].filter(Boolean).join(" "),
|
|
1388
|
+
style
|
|
1389
|
+
};
|
|
1390
|
+
const inner = /* @__PURE__ */ jsx(AccordionCtx.Provider, { value: { variant }, children });
|
|
1391
|
+
if (type === "multiple") {
|
|
1392
|
+
return /* @__PURE__ */ jsx(
|
|
1393
|
+
AccordionPrimitive.Root,
|
|
1394
|
+
{
|
|
1395
|
+
type: "multiple",
|
|
1396
|
+
defaultValue,
|
|
1397
|
+
value,
|
|
1398
|
+
onValueChange,
|
|
1399
|
+
...common,
|
|
1400
|
+
children: inner
|
|
1401
|
+
}
|
|
1402
|
+
);
|
|
1403
|
+
}
|
|
1404
|
+
return /* @__PURE__ */ jsx(
|
|
1405
|
+
AccordionPrimitive.Root,
|
|
1406
|
+
{
|
|
1407
|
+
type: "single",
|
|
1408
|
+
collapsible,
|
|
1409
|
+
defaultValue,
|
|
1410
|
+
value,
|
|
1411
|
+
onValueChange,
|
|
1412
|
+
...common,
|
|
1413
|
+
children: inner
|
|
1414
|
+
}
|
|
1415
|
+
);
|
|
1416
|
+
}
|
|
1417
|
+
var Chevron2 = /* @__PURE__ */ jsx(
|
|
1418
|
+
"svg",
|
|
1419
|
+
{
|
|
1420
|
+
viewBox: "0 0 24 24",
|
|
1421
|
+
fill: "none",
|
|
1422
|
+
stroke: "currentColor",
|
|
1423
|
+
strokeWidth: 2,
|
|
1424
|
+
"aria-hidden": "true",
|
|
1425
|
+
className: "h-4 w-4 flex-shrink-0 text-foreground-muted transition-transform duration-200 group-data-[state=open]/acc:rotate-180 group-data-[state=open]/acc:text-accent",
|
|
1426
|
+
children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M19 9l-7 7-7-7" })
|
|
1427
|
+
}
|
|
1428
|
+
);
|
|
1429
|
+
function AccordionItem({ value, title, icon, children, disabled, className = "" }) {
|
|
1430
|
+
const { variant } = useContext(AccordionCtx);
|
|
1431
|
+
return /* @__PURE__ */ jsxs(
|
|
1432
|
+
AccordionPrimitive.Item,
|
|
1433
|
+
{
|
|
1434
|
+
value,
|
|
1435
|
+
disabled,
|
|
1436
|
+
className: [
|
|
1437
|
+
variant === "separated" ? "rounded-lg border border-border bg-surface overflow-hidden" : "",
|
|
1438
|
+
"data-[disabled]:opacity-60",
|
|
1439
|
+
className
|
|
1440
|
+
].filter(Boolean).join(" "),
|
|
1441
|
+
children: [
|
|
1442
|
+
/* @__PURE__ */ jsx(AccordionPrimitive.Header, { className: "m-0", children: /* @__PURE__ */ jsxs(
|
|
1443
|
+
AccordionPrimitive.Trigger,
|
|
1444
|
+
{
|
|
1445
|
+
className: "group/acc flex w-full items-center gap-3 px-4 py-3 text-left select-none\n text-sm font-medium text-foreground transition-colors\n hover:bg-surface-raised data-[state=open]:text-accent\n focus:outline-none focus-visible:ring-2 focus-visible:ring-accent focus-visible:ring-inset\n disabled:cursor-not-allowed",
|
|
1446
|
+
children: [
|
|
1447
|
+
icon && /* @__PURE__ */ jsx("span", { className: "flex h-5 w-5 flex-shrink-0 items-center justify-center text-foreground-muted group-data-[state=open]/acc:text-accent", children: icon }),
|
|
1448
|
+
/* @__PURE__ */ jsx("span", { className: "flex-1 min-w-0", children: title }),
|
|
1449
|
+
Chevron2
|
|
1450
|
+
]
|
|
1451
|
+
}
|
|
1452
|
+
) }),
|
|
1453
|
+
/* @__PURE__ */ jsx(
|
|
1454
|
+
AccordionPrimitive.Content,
|
|
1455
|
+
{
|
|
1456
|
+
className: "overflow-hidden data-[state=open]:animate-accordion-down data-[state=closed]:animate-accordion-up",
|
|
1457
|
+
children: /* @__PURE__ */ jsx("div", { className: "px-4 pb-4 pt-0 text-sm text-foreground-secondary leading-relaxed", children })
|
|
1458
|
+
}
|
|
1459
|
+
)
|
|
1460
|
+
]
|
|
1461
|
+
}
|
|
1462
|
+
);
|
|
1463
|
+
}
|
|
1464
|
+
Accordion2.Item = AccordionItem;
|
|
1465
|
+
var Accordion_default = Accordion2;
|
|
1371
1466
|
var NotificationContext = createContext({
|
|
1372
1467
|
open: () => void 0,
|
|
1373
1468
|
close: () => void 0
|
|
@@ -2471,7 +2566,7 @@ function Field({
|
|
|
2471
2566
|
);
|
|
2472
2567
|
}
|
|
2473
2568
|
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" }) });
|
|
2474
|
-
var SearchInput =
|
|
2569
|
+
var SearchInput = React13.forwardRef(function SearchInput2({ value, onChange, disabled, label, htmlFor, placeholder, name, inputStyle, style, layout = "vertical", size = "md", icon, helperText, className }, ref) {
|
|
2475
2570
|
return /* @__PURE__ */ jsx(Field, { className, label, htmlFor, layout, helperText, children: /* @__PURE__ */ jsxs(
|
|
2476
2571
|
"div",
|
|
2477
2572
|
{
|
|
@@ -2958,6 +3053,7 @@ function TableBody({
|
|
|
2958
3053
|
getRowKey
|
|
2959
3054
|
}) {
|
|
2960
3055
|
const [expanded, setExpanded] = useState(() => /* @__PURE__ */ new Set());
|
|
3056
|
+
const reduced = useReducedMotion();
|
|
2961
3057
|
const toggleRow = (rowKey) => {
|
|
2962
3058
|
setExpanded((prev) => {
|
|
2963
3059
|
const next = new Set(prev);
|
|
@@ -2971,7 +3067,7 @@ function TableBody({
|
|
|
2971
3067
|
return /* @__PURE__ */ jsx("tbody", { children: rows.map((row, i) => {
|
|
2972
3068
|
const rowKey = getRowKey(row, i);
|
|
2973
3069
|
const isExpanded = expanded.has(rowKey);
|
|
2974
|
-
return /* @__PURE__ */ jsxs(
|
|
3070
|
+
return /* @__PURE__ */ jsxs(React13.Fragment, { children: [
|
|
2975
3071
|
/* @__PURE__ */ jsxs(
|
|
2976
3072
|
"tr",
|
|
2977
3073
|
{
|
|
@@ -2999,7 +3095,19 @@ function TableBody({
|
|
|
2999
3095
|
]
|
|
3000
3096
|
}
|
|
3001
3097
|
),
|
|
3002
|
-
hasExpand &&
|
|
3098
|
+
hasExpand && /* @__PURE__ */ jsx("tr", { className: "bg-surface", children: /* @__PURE__ */ jsx("td", { colSpan: expandColCount, className: "p-0", children: /* @__PURE__ */ jsx(AnimatePresence, { initial: false, children: isExpanded && /* @__PURE__ */ jsx(
|
|
3099
|
+
motion.div,
|
|
3100
|
+
{
|
|
3101
|
+
initial: { height: 0, opacity: 0 },
|
|
3102
|
+
animate: { height: "auto", opacity: 1 },
|
|
3103
|
+
exit: { height: 0, opacity: 0 },
|
|
3104
|
+
transition: reduced ? { duration: 0 } : { height: { duration: 0.28, ease: [0.16, 1, 0.3, 1] }, opacity: { duration: 0.2 } },
|
|
3105
|
+
style: { overflow: "hidden" },
|
|
3106
|
+
className: "border-b border-border",
|
|
3107
|
+
children: /* @__PURE__ */ jsx("div", { className: "p-3", children: expandRow.expandComponent?.(row) })
|
|
3108
|
+
},
|
|
3109
|
+
"expand"
|
|
3110
|
+
) }) }) })
|
|
3003
3111
|
] }, rowKey);
|
|
3004
3112
|
}) });
|
|
3005
3113
|
}
|
|
@@ -3503,8 +3611,8 @@ function MegaMenuLink({ href, icon, description, active, onClick, children, clas
|
|
|
3503
3611
|
function MegaMenuFeatured({ children, className = "" }) {
|
|
3504
3612
|
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 });
|
|
3505
3613
|
}
|
|
3506
|
-
var elementsOfType = (children, type) =>
|
|
3507
|
-
(c) =>
|
|
3614
|
+
var elementsOfType = (children, type) => React13.Children.toArray(children).filter(
|
|
3615
|
+
(c) => React13.isValidElement(c) && c.type === type
|
|
3508
3616
|
);
|
|
3509
3617
|
var MOBILE_CHEVRON = /* @__PURE__ */ jsx(
|
|
3510
3618
|
"svg",
|
|
@@ -3541,9 +3649,9 @@ function MobileLinkRow({ link, onNavigate }) {
|
|
|
3541
3649
|
);
|
|
3542
3650
|
}
|
|
3543
3651
|
function MobilePanel({ panel, onNavigate }) {
|
|
3544
|
-
const nodes =
|
|
3652
|
+
const nodes = React13.Children.toArray(panel.props.children);
|
|
3545
3653
|
return /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-4 px-2 pb-3 pt-1", children: nodes.map((node, i) => {
|
|
3546
|
-
if (!
|
|
3654
|
+
if (!React13.isValidElement(node)) return null;
|
|
3547
3655
|
const el = node;
|
|
3548
3656
|
if (el.type === MegaMenuSection) {
|
|
3549
3657
|
const { title, children } = el.props;
|
|
@@ -3836,7 +3944,7 @@ function ThemeProvider({
|
|
|
3836
3944
|
className = "",
|
|
3837
3945
|
style
|
|
3838
3946
|
}) {
|
|
3839
|
-
const id =
|
|
3947
|
+
const id = React13.useId().replace(/:/g, "");
|
|
3840
3948
|
const scopeClass = `geo-th-${id}`;
|
|
3841
3949
|
const divRef = useRef(null);
|
|
3842
3950
|
useEffect(() => {
|
|
@@ -5840,7 +5948,7 @@ function OtpInput({
|
|
|
5840
5948
|
emit(valid.join(""));
|
|
5841
5949
|
focusBox(valid.length);
|
|
5842
5950
|
};
|
|
5843
|
-
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(
|
|
5951
|
+
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(React13.Fragment, { children: [
|
|
5844
5952
|
/* @__PURE__ */ jsx(
|
|
5845
5953
|
"input",
|
|
5846
5954
|
{
|
|
@@ -7054,6 +7162,6 @@ function CreditCardForm({
|
|
|
7054
7162
|
);
|
|
7055
7163
|
}
|
|
7056
7164
|
|
|
7057
|
-
export { AppShell, AutoComplete, Avatar, Box, Button, CARD_BRANDS, 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, 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, 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 };
|
|
7165
|
+
export { Accordion_default as Accordion, AppShell, AutoComplete, Avatar, Box, Button, CARD_BRANDS, 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, 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, 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 };
|
|
7058
7166
|
//# sourceMappingURL=index.js.map
|
|
7059
7167
|
//# sourceMappingURL=index.js.map
|