@geomak/ui 6.3.0 → 6.5.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.d.cts CHANGED
@@ -930,6 +930,92 @@ interface AccordionItemProps {
930
930
  }
931
931
  declare function AccordionItem({ value, title, icon, children, disabled, className }: AccordionItemProps): react_jsx_runtime.JSX.Element;
932
932
 
933
+ interface BreadcrumbItem {
934
+ /** Visible label. */
935
+ label: React__default.ReactNode;
936
+ /** Link target. Omit on the current (last) crumb. */
937
+ href?: string;
938
+ /** Optional leading icon. */
939
+ icon?: React__default.ReactNode;
940
+ /** Click handler (router navigation). */
941
+ onClick?: React__default.MouseEventHandler;
942
+ }
943
+ interface BreadcrumbsProps {
944
+ /** Ordered trail, root → current. The last item renders as the current page. */
945
+ items: BreadcrumbItem[];
946
+ /** Separator between crumbs. Default a chevron. */
947
+ separator?: React__default.ReactNode;
948
+ /**
949
+ * Collapse the middle of long trails into an expandable ellipsis once the
950
+ * count exceeds this. The first and last crumb always stay visible. Set `0`
951
+ * to never collapse. Default `0`.
952
+ */
953
+ maxItems?: number;
954
+ /** Accessible label for the nav landmark. Default `'Breadcrumb'`. */
955
+ 'aria-label'?: string;
956
+ className?: string;
957
+ style?: React__default.CSSProperties;
958
+ }
959
+ /**
960
+ * A breadcrumb trail. Renders a `<nav><ol>` of crumbs separated by a chevron;
961
+ * the last crumb is the current page (`aria-current="page"`, not a link). Long
962
+ * trails can collapse their middle into a clickable ellipsis via `maxItems`.
963
+ *
964
+ * @example
965
+ * ```tsx
966
+ * <Breadcrumbs
967
+ * items={[
968
+ * { label: 'Home', href: '/' },
969
+ * { label: 'Fleet', href: '/fleet' },
970
+ * { label: 'Aurora' },
971
+ * ]}
972
+ * />
973
+ * ```
974
+ */
975
+ declare function Breadcrumbs({ items, separator, maxItems, 'aria-label': ariaLabel, className, style, }: BreadcrumbsProps): react_jsx_runtime.JSX.Element;
976
+
977
+ type BadgeTone = 'neutral' | 'accent' | 'success' | 'warning' | 'error' | 'info';
978
+ type BadgeVariant = 'solid' | 'soft' | 'outline';
979
+ type BadgeSize = 'sm' | 'md';
980
+ interface BadgeProps {
981
+ /** Pill label (label mode) when no `count` / `dot` is given. */
982
+ children?: React__default.ReactNode;
983
+ /** Semantic colour. Default `'neutral'`. */
984
+ tone?: BadgeTone;
985
+ /** Fill style. Default `'soft'`. */
986
+ variant?: BadgeVariant;
987
+ /** Size preset. Default `'md'`. */
988
+ size?: BadgeSize;
989
+ /** Optional leading icon (label mode). */
990
+ icon?: React__default.ReactNode;
991
+ /**
992
+ * Indicator mode — a numeric counter. With `children` it overlays the
993
+ * top-right corner of the wrapped element; without, it renders inline.
994
+ */
995
+ count?: number;
996
+ /** Cap the displayed count (e.g. `99+`). Default `99`. */
997
+ max?: number;
998
+ /** Render a bare dot indicator (no number). Overrides `count` display. */
999
+ dot?: boolean;
1000
+ /** Show the indicator even when `count` is 0. Default `false`. */
1001
+ showZero?: boolean;
1002
+ className?: string;
1003
+ style?: React__default.CSSProperties;
1004
+ }
1005
+ /**
1006
+ * A small status / count indicator. Three uses:
1007
+ *
1008
+ * 1. **Label pill** — `<Badge tone="success">Active</Badge>`.
1009
+ * 2. **Inline count** — `<Badge count={5} tone="error" />`.
1010
+ * 3. **Overlay** — wrap an element to anchor a count/dot to its top-right:
1011
+ * `<Badge count={3} tone="error"><IconButton … /></Badge>`.
1012
+ *
1013
+ * @example
1014
+ * <Badge tone="accent" variant="soft">Beta</Badge>
1015
+ * <Badge dot tone="success"><Avatar … /></Badge>
1016
+ */
1017
+ declare function Badge({ children, tone, variant, size, icon, count, max, dot, showZero, className, style, }: BadgeProps): react_jsx_runtime.JSX.Element;
1018
+
933
1019
  /** ─────────────────── types ─────────────────── */
934
1020
  type NotificationType = 'info' | 'success' | 'warning' | 'danger';
935
1021
  type NotificationPosition = 'top-right' | 'top-left' | 'top-center' | 'bottom-right' | 'bottom-left' | 'bottom-center';
@@ -3998,4 +4084,4 @@ declare function expiryError(value: string, now?: Date): string | undefined;
3998
4084
  /** Validate the CVV against the detected brand's expected length. */
3999
4085
  declare function cvvError(value: string, cardNumber: string): string | undefined;
4000
4086
 
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 };
4087
+ 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, 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
@@ -930,6 +930,92 @@ interface AccordionItemProps {
930
930
  }
931
931
  declare function AccordionItem({ value, title, icon, children, disabled, className }: AccordionItemProps): react_jsx_runtime.JSX.Element;
932
932
 
933
+ interface BreadcrumbItem {
934
+ /** Visible label. */
935
+ label: React__default.ReactNode;
936
+ /** Link target. Omit on the current (last) crumb. */
937
+ href?: string;
938
+ /** Optional leading icon. */
939
+ icon?: React__default.ReactNode;
940
+ /** Click handler (router navigation). */
941
+ onClick?: React__default.MouseEventHandler;
942
+ }
943
+ interface BreadcrumbsProps {
944
+ /** Ordered trail, root → current. The last item renders as the current page. */
945
+ items: BreadcrumbItem[];
946
+ /** Separator between crumbs. Default a chevron. */
947
+ separator?: React__default.ReactNode;
948
+ /**
949
+ * Collapse the middle of long trails into an expandable ellipsis once the
950
+ * count exceeds this. The first and last crumb always stay visible. Set `0`
951
+ * to never collapse. Default `0`.
952
+ */
953
+ maxItems?: number;
954
+ /** Accessible label for the nav landmark. Default `'Breadcrumb'`. */
955
+ 'aria-label'?: string;
956
+ className?: string;
957
+ style?: React__default.CSSProperties;
958
+ }
959
+ /**
960
+ * A breadcrumb trail. Renders a `<nav><ol>` of crumbs separated by a chevron;
961
+ * the last crumb is the current page (`aria-current="page"`, not a link). Long
962
+ * trails can collapse their middle into a clickable ellipsis via `maxItems`.
963
+ *
964
+ * @example
965
+ * ```tsx
966
+ * <Breadcrumbs
967
+ * items={[
968
+ * { label: 'Home', href: '/' },
969
+ * { label: 'Fleet', href: '/fleet' },
970
+ * { label: 'Aurora' },
971
+ * ]}
972
+ * />
973
+ * ```
974
+ */
975
+ declare function Breadcrumbs({ items, separator, maxItems, 'aria-label': ariaLabel, className, style, }: BreadcrumbsProps): react_jsx_runtime.JSX.Element;
976
+
977
+ type BadgeTone = 'neutral' | 'accent' | 'success' | 'warning' | 'error' | 'info';
978
+ type BadgeVariant = 'solid' | 'soft' | 'outline';
979
+ type BadgeSize = 'sm' | 'md';
980
+ interface BadgeProps {
981
+ /** Pill label (label mode) when no `count` / `dot` is given. */
982
+ children?: React__default.ReactNode;
983
+ /** Semantic colour. Default `'neutral'`. */
984
+ tone?: BadgeTone;
985
+ /** Fill style. Default `'soft'`. */
986
+ variant?: BadgeVariant;
987
+ /** Size preset. Default `'md'`. */
988
+ size?: BadgeSize;
989
+ /** Optional leading icon (label mode). */
990
+ icon?: React__default.ReactNode;
991
+ /**
992
+ * Indicator mode — a numeric counter. With `children` it overlays the
993
+ * top-right corner of the wrapped element; without, it renders inline.
994
+ */
995
+ count?: number;
996
+ /** Cap the displayed count (e.g. `99+`). Default `99`. */
997
+ max?: number;
998
+ /** Render a bare dot indicator (no number). Overrides `count` display. */
999
+ dot?: boolean;
1000
+ /** Show the indicator even when `count` is 0. Default `false`. */
1001
+ showZero?: boolean;
1002
+ className?: string;
1003
+ style?: React__default.CSSProperties;
1004
+ }
1005
+ /**
1006
+ * A small status / count indicator. Three uses:
1007
+ *
1008
+ * 1. **Label pill** — `<Badge tone="success">Active</Badge>`.
1009
+ * 2. **Inline count** — `<Badge count={5} tone="error" />`.
1010
+ * 3. **Overlay** — wrap an element to anchor a count/dot to its top-right:
1011
+ * `<Badge count={3} tone="error"><IconButton … /></Badge>`.
1012
+ *
1013
+ * @example
1014
+ * <Badge tone="accent" variant="soft">Beta</Badge>
1015
+ * <Badge dot tone="success"><Avatar … /></Badge>
1016
+ */
1017
+ declare function Badge({ children, tone, variant, size, icon, count, max, dot, showZero, className, style, }: BadgeProps): react_jsx_runtime.JSX.Element;
1018
+
933
1019
  /** ─────────────────── types ─────────────────── */
934
1020
  type NotificationType = 'info' | 'success' | 'warning' | 'danger';
935
1021
  type NotificationPosition = 'top-right' | 'top-left' | 'top-center' | 'bottom-right' | 'bottom-left' | 'bottom-center';
@@ -3998,4 +4084,4 @@ declare function expiryError(value: string, now?: Date): string | undefined;
3998
4084
  /** Validate the CVV against the detected brand's expected length. */
3999
4085
  declare function cvvError(value: string, cardNumber: string): string | undefined;
4000
4086
 
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 };
4087
+ 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, 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,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 React13, { createContext, useState, useEffect, useMemo, useId, useCallback, useRef, useContext, useLayoutEffect, useSyncExternalStore } from 'react';
4
+ import React14, { 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';
@@ -1463,6 +1463,159 @@ function AccordionItem({ value, title, icon, children, disabled, className = ""
1463
1463
  }
1464
1464
  Accordion2.Item = AccordionItem;
1465
1465
  var Accordion_default = Accordion2;
1466
+ var DefaultSeparator = /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, "aria-hidden": "true", className: "h-3.5 w-3.5 text-foreground-muted", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M9 5l7 7-7 7" }) });
1467
+ var crumbBase = "inline-flex items-center gap-1.5 rounded px-1 -mx-1 text-sm transition-colors focus:outline-none focus-visible:ring-2 focus-visible:ring-accent";
1468
+ function Crumb({ item, current }) {
1469
+ const inner = /* @__PURE__ */ jsxs(Fragment, { children: [
1470
+ item.icon && /* @__PURE__ */ jsx("span", { className: "flex h-4 w-4 flex-shrink-0 items-center justify-center", children: item.icon }),
1471
+ /* @__PURE__ */ jsx("span", { className: "truncate", children: item.label })
1472
+ ] });
1473
+ if (current) {
1474
+ return /* @__PURE__ */ jsx("span", { "aria-current": "page", className: `${crumbBase} font-medium text-foreground max-w-[16rem]`, children: inner });
1475
+ }
1476
+ if (item.href || item.onClick) {
1477
+ return /* @__PURE__ */ jsx("a", { href: item.href, onClick: item.onClick, className: `${crumbBase} text-foreground-secondary hover:text-foreground max-w-[12rem]`, children: inner });
1478
+ }
1479
+ return /* @__PURE__ */ jsx("span", { className: `${crumbBase} text-foreground-secondary max-w-[12rem]`, children: inner });
1480
+ }
1481
+ function Breadcrumbs({
1482
+ items,
1483
+ separator = DefaultSeparator,
1484
+ maxItems = 0,
1485
+ "aria-label": ariaLabel = "Breadcrumb",
1486
+ className = "",
1487
+ style
1488
+ }) {
1489
+ const [expanded, setExpanded] = useState(false);
1490
+ const shouldCollapse = maxItems > 0 && items.length > maxItems && !expanded;
1491
+ const visible = [];
1492
+ if (shouldCollapse) {
1493
+ const tailCount = Math.max(1, maxItems - 1);
1494
+ visible.push({ item: items[0], index: 0 });
1495
+ visible.push("ellipsis");
1496
+ for (let i = items.length - tailCount; i < items.length; i++) visible.push({ item: items[i], index: i });
1497
+ } else {
1498
+ items.forEach((item, index) => visible.push({ item, index }));
1499
+ }
1500
+ return /* @__PURE__ */ jsx("nav", { "aria-label": ariaLabel, className: ["min-w-0", className].filter(Boolean).join(" "), style, children: /* @__PURE__ */ jsx("ol", { className: "flex items-center gap-1.5 flex-nowrap min-w-0", children: visible.map((entry, i) => {
1501
+ const isLast = i === visible.length - 1;
1502
+ return /* @__PURE__ */ jsxs("li", { className: "flex items-center gap-1.5 min-w-0", children: [
1503
+ entry === "ellipsis" ? /* @__PURE__ */ jsx(
1504
+ "button",
1505
+ {
1506
+ type: "button",
1507
+ onClick: () => setExpanded(true),
1508
+ "aria-label": "Show hidden breadcrumbs",
1509
+ className: "inline-flex h-6 items-center rounded px-1.5 text-sm text-foreground-secondary hover:bg-surface-raised hover:text-foreground focus:outline-none focus-visible:ring-2 focus-visible:ring-accent",
1510
+ children: "\u2026"
1511
+ }
1512
+ ) : /* @__PURE__ */ jsx(Crumb, { item: entry.item, current: entry.index === items.length - 1 }),
1513
+ !isLast && /* @__PURE__ */ jsx("span", { className: "flex-shrink-0", children: separator })
1514
+ ] }, entry === "ellipsis" ? "ellipsis" : entry.index);
1515
+ }) }) });
1516
+ }
1517
+ var TONE = {
1518
+ neutral: {
1519
+ solid: "bg-foreground-secondary text-background",
1520
+ soft: "bg-surface-raised text-foreground-secondary",
1521
+ outline: "border border-border text-foreground-secondary",
1522
+ dot: "bg-foreground-secondary"
1523
+ },
1524
+ accent: {
1525
+ solid: "bg-accent text-accent-fg",
1526
+ soft: "bg-accent/10 text-accent",
1527
+ outline: "border border-accent text-accent",
1528
+ dot: "bg-accent"
1529
+ },
1530
+ success: {
1531
+ solid: "bg-status-success text-white",
1532
+ soft: "bg-status-success/12 text-status-success",
1533
+ outline: "border border-status-success text-status-success",
1534
+ dot: "bg-status-success"
1535
+ },
1536
+ warning: {
1537
+ solid: "bg-status-warning text-white",
1538
+ soft: "bg-status-warning/15 text-status-warning",
1539
+ outline: "border border-status-warning text-status-warning",
1540
+ dot: "bg-status-warning"
1541
+ },
1542
+ error: {
1543
+ solid: "bg-status-error text-white",
1544
+ soft: "bg-status-error/12 text-status-error",
1545
+ outline: "border border-status-error text-status-error",
1546
+ dot: "bg-status-error"
1547
+ },
1548
+ info: {
1549
+ solid: "bg-status-info text-white",
1550
+ soft: "bg-status-info/12 text-status-info",
1551
+ outline: "border border-status-info text-status-info",
1552
+ dot: "bg-status-info"
1553
+ }
1554
+ };
1555
+ var SIZE2 = {
1556
+ sm: "h-[18px] px-1.5 text-[11px] gap-1 rounded-full",
1557
+ md: "h-5 px-2 text-xs gap-1 rounded-full"
1558
+ };
1559
+ function Badge({
1560
+ children,
1561
+ tone = "neutral",
1562
+ variant = "soft",
1563
+ size = "md",
1564
+ icon,
1565
+ count,
1566
+ max = 99,
1567
+ dot = false,
1568
+ showZero = false,
1569
+ className = "",
1570
+ style
1571
+ }) {
1572
+ const isIndicator = dot || count != null;
1573
+ const hidden = !dot && count != null && count === 0 && !showZero;
1574
+ const display2 = count != null && count > max ? `${max}+` : count;
1575
+ if (!isIndicator) {
1576
+ return /* @__PURE__ */ jsxs(
1577
+ "span",
1578
+ {
1579
+ className: [
1580
+ "inline-flex items-center font-medium select-none whitespace-nowrap leading-none",
1581
+ SIZE2[size],
1582
+ TONE[tone][variant],
1583
+ className
1584
+ ].filter(Boolean).join(" "),
1585
+ style,
1586
+ children: [
1587
+ icon && /* @__PURE__ */ jsx("span", { className: "flex h-3.5 w-3.5 items-center justify-center", children: icon }),
1588
+ children
1589
+ ]
1590
+ }
1591
+ );
1592
+ }
1593
+ const indicator = dot ? /* @__PURE__ */ jsx(
1594
+ "span",
1595
+ {
1596
+ className: ["inline-block rounded-full", size === "sm" ? "h-2 w-2" : "h-2.5 w-2.5", TONE[tone].dot, className].filter(Boolean).join(" "),
1597
+ style: children ? void 0 : style,
1598
+ "aria-hidden": children ? true : void 0
1599
+ }
1600
+ ) : /* @__PURE__ */ jsx(
1601
+ "span",
1602
+ {
1603
+ className: [
1604
+ "inline-flex items-center justify-center rounded-full font-semibold leading-none tabular-nums",
1605
+ size === "sm" ? "h-4 min-w-4 px-1 text-[10px]" : "h-[18px] min-w-[18px] px-1.5 text-[11px]",
1606
+ TONE[tone].solid,
1607
+ className
1608
+ ].filter(Boolean).join(" "),
1609
+ style: children ? void 0 : style,
1610
+ children: display2
1611
+ }
1612
+ );
1613
+ if (!children) return hidden ? null : indicator;
1614
+ return /* @__PURE__ */ jsxs("span", { className: "relative inline-flex", style, children: [
1615
+ children,
1616
+ !hidden && /* @__PURE__ */ jsx("span", { className: "absolute -top-1 -right-1 flex", children: indicator })
1617
+ ] });
1618
+ }
1466
1619
  var NotificationContext = createContext({
1467
1620
  open: () => void 0,
1468
1621
  close: () => void 0
@@ -2566,7 +2719,7 @@ function Field({
2566
2719
  );
2567
2720
  }
2568
2721
  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" }) });
2569
- var SearchInput = React13.forwardRef(function SearchInput2({ value, onChange, disabled, label, htmlFor, placeholder, name, inputStyle, style, layout = "vertical", size = "md", icon, helperText, className }, ref) {
2722
+ var SearchInput = React14.forwardRef(function SearchInput2({ value, onChange, disabled, label, htmlFor, placeholder, name, inputStyle, style, layout = "vertical", size = "md", icon, helperText, className }, ref) {
2570
2723
  return /* @__PURE__ */ jsx(Field, { className, label, htmlFor, layout, helperText, children: /* @__PURE__ */ jsxs(
2571
2724
  "div",
2572
2725
  {
@@ -3067,7 +3220,7 @@ function TableBody({
3067
3220
  return /* @__PURE__ */ jsx("tbody", { children: rows.map((row, i) => {
3068
3221
  const rowKey = getRowKey(row, i);
3069
3222
  const isExpanded = expanded.has(rowKey);
3070
- return /* @__PURE__ */ jsxs(React13.Fragment, { children: [
3223
+ return /* @__PURE__ */ jsxs(React14.Fragment, { children: [
3071
3224
  /* @__PURE__ */ jsxs(
3072
3225
  "tr",
3073
3226
  {
@@ -3611,8 +3764,8 @@ function MegaMenuLink({ href, icon, description, active, onClick, children, clas
3611
3764
  function MegaMenuFeatured({ children, className = "" }) {
3612
3765
  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 });
3613
3766
  }
3614
- var elementsOfType = (children, type) => React13.Children.toArray(children).filter(
3615
- (c) => React13.isValidElement(c) && c.type === type
3767
+ var elementsOfType = (children, type) => React14.Children.toArray(children).filter(
3768
+ (c) => React14.isValidElement(c) && c.type === type
3616
3769
  );
3617
3770
  var MOBILE_CHEVRON = /* @__PURE__ */ jsx(
3618
3771
  "svg",
@@ -3649,9 +3802,9 @@ function MobileLinkRow({ link, onNavigate }) {
3649
3802
  );
3650
3803
  }
3651
3804
  function MobilePanel({ panel, onNavigate }) {
3652
- const nodes = React13.Children.toArray(panel.props.children);
3805
+ const nodes = React14.Children.toArray(panel.props.children);
3653
3806
  return /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-4 px-2 pb-3 pt-1", children: nodes.map((node, i) => {
3654
- if (!React13.isValidElement(node)) return null;
3807
+ if (!React14.isValidElement(node)) return null;
3655
3808
  const el = node;
3656
3809
  if (el.type === MegaMenuSection) {
3657
3810
  const { title, children } = el.props;
@@ -3944,7 +4097,7 @@ function ThemeProvider({
3944
4097
  className = "",
3945
4098
  style
3946
4099
  }) {
3947
- const id = React13.useId().replace(/:/g, "");
4100
+ const id = React14.useId().replace(/:/g, "");
3948
4101
  const scopeClass = `geo-th-${id}`;
3949
4102
  const divRef = useRef(null);
3950
4103
  useEffect(() => {
@@ -5539,7 +5692,7 @@ function TextArea({
5539
5692
  }
5540
5693
  );
5541
5694
  }
5542
- var SIZE2 = {
5695
+ var SIZE3 = {
5543
5696
  sm: { h: "h-control-sm", text: "text-xs", pad: "px-2.5" },
5544
5697
  md: { h: "h-control-md", text: "text-sm", pad: "px-3.5" },
5545
5698
  lg: { h: "h-control-lg", text: "text-sm", pad: "px-4" }
@@ -5561,7 +5714,7 @@ function SegmentedControl({
5561
5714
  errorMessage,
5562
5715
  "aria-label": ariaLabel
5563
5716
  }) {
5564
- const sz = SIZE2[size];
5717
+ const sz = SIZE3[size];
5565
5718
  const groupId = useId();
5566
5719
  const errorId = useId();
5567
5720
  const hasError = errorMessage != null;
@@ -5948,7 +6101,7 @@ function OtpInput({
5948
6101
  emit(valid.join(""));
5949
6102
  focusBox(valid.length);
5950
6103
  };
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: [
6104
+ 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(React14.Fragment, { children: [
5952
6105
  /* @__PURE__ */ jsx(
5953
6106
  "input",
5954
6107
  {
@@ -7162,6 +7315,6 @@ function CreditCardForm({
7162
7315
  );
7163
7316
  }
7164
7317
 
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 };
7318
+ export { Accordion_default as Accordion, AppShell, AutoComplete, Avatar, Badge, Box, Breadcrumbs, 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 };
7166
7319
  //# sourceMappingURL=index.js.map
7167
7320
  //# sourceMappingURL=index.js.map