@xenide-io/the-old-ui-theme 0.3.2 → 0.4.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (62) hide show
  1. package/dist/chunk-54ZR4VL5.mjs +4641 -0
  2. package/dist/chunk-G53YLHVE.mjs +1023 -0
  3. package/dist/{index-BgG8Homu.d.mts → index-B5NOyoKS.d.mts} +100 -100
  4. package/dist/{index-BgG8Homu.d.ts → index-B5NOyoKS.d.ts} +100 -100
  5. package/dist/index.d.mts +9 -145
  6. package/dist/index.d.ts +9 -145
  7. package/dist/index.js +653 -1111
  8. package/dist/index.mjs +86 -342
  9. package/dist/suite.d.mts +760 -0
  10. package/dist/suite.d.ts +760 -0
  11. package/dist/suite.js +2800 -0
  12. package/dist/suite.mjs +2441 -0
  13. package/dist/ui.d.mts +1 -2
  14. package/dist/ui.d.ts +1 -2
  15. package/dist/ui.js +14 -10
  16. package/dist/ui.mjs +13 -11
  17. package/package.json +43 -24
  18. package/src/components/icons/icons.tsx +0 -2
  19. package/src/components/icons/index.ts +0 -3
  20. package/src/components/sections/IconShowcase.tsx +1 -110
  21. package/src/components/sections/NewComponentsShowcase.tsx +4 -4
  22. package/src/components/sections/SidebarShowcase.tsx +3 -3
  23. package/src/components/sections/SuiteShowcase.tsx +669 -0
  24. package/src/components/ui/ComponentDocs.tsx +2 -2
  25. package/src/components/ui/ContextMenu.tsx +1 -1
  26. package/src/components/ui/Menubar.tsx +1 -1
  27. package/src/components/ui/Sidebar.tsx +10 -8
  28. package/src/styles/suite-skin.css +255 -0
  29. package/src/suite/components/ai-panel.tsx +202 -0
  30. package/src/suite/components/app-switcher.tsx +196 -0
  31. package/src/suite/components/command-palette-host.tsx +62 -0
  32. package/src/suite/components/deferred-chrome.tsx +12 -0
  33. package/src/suite/components/suite-app-layout.tsx +69 -0
  34. package/src/suite/components/suite-bottom-nav.tsx +113 -0
  35. package/src/suite/components/suite-layout.tsx +285 -0
  36. package/src/suite/components/suite-mobile-drawer.tsx +150 -0
  37. package/src/suite/components/suite-mobile-header.tsx +71 -0
  38. package/src/suite/components/suite-notification-bell.tsx +227 -0
  39. package/src/suite/components/suite-settings-mobile-nav.tsx +83 -0
  40. package/src/suite/components/suite-sidebar.tsx +198 -0
  41. package/src/suite/components/suite-skeleton.tsx +191 -0
  42. package/src/suite/components/suite-user-menu.tsx +109 -0
  43. package/src/suite/components/theme-provider.tsx +174 -0
  44. package/src/suite/components/today-calibrating.tsx +95 -0
  45. package/src/suite/components/today-page-frame.tsx +28 -0
  46. package/src/suite/components/today-ui.tsx +370 -0
  47. package/src/suite/icons/app-accents.ts +75 -0
  48. package/src/suite/icons/glyph-parts.tsx +67 -0
  49. package/src/suite/icons/glyphs.ts +203 -0
  50. package/src/suite/icons/index.ts +12 -0
  51. package/src/suite/icons/suite-app-icon.tsx +68 -0
  52. package/src/suite/icons/suite-icon.tsx +93 -0
  53. package/src/suite/index.ts +108 -0
  54. package/src/suite/lib/apps.ts +75 -0
  55. package/src/suite/lib/cn.ts +6 -0
  56. package/src/suite/lib/injected.ts +54 -0
  57. package/src/suite/lib/motion.tsx +48 -0
  58. package/src/suite/lib/use-idle-mount.ts +25 -0
  59. package/dist/chunk-5HSOBJ4F.mjs +0 -5968
  60. package/src/components/icons/lemon-brand-icons.tsx +0 -16
  61. package/src/components/icons/lemon-category-icons.tsx +0 -72
  62. package/src/components/icons/lemon-icons.tsx +0 -57
package/dist/ui.d.mts CHANGED
@@ -1,4 +1,3 @@
1
- export { A as Accordion, a as Alert, b as AlertDialog, c as AlertDialogProps, d as AlertProps, e as AlertStatus, f as AppLayout, g as AppLayoutProps, h as AuthCard, i as AuthCardProps, j as AuthDivider, k as AuthDividerProps, l as AuthLayout, m as AuthLayoutProps, n as Autocomplete, o as AutocompleteOption, p as AutocompleteProps, q as Avatar, r as AvatarGroup, s as AvatarGroupProps, t as AvatarProps, u as AvatarSize, v as AvatarStatus, B as Badge, w as BadgeProps, x as BadgeSize, y as BadgeVariant, z as Banner, C as BannerProps, D as BannerType, E as BreadcrumbItem, F as Breadcrumbs, G as BreadcrumbsProps, H as Button, I as ButtonChrome, J as ButtonChromeProps, K as ButtonGroup, L as ButtonGroupProps, M as ButtonProps, N as ButtonShape, O as ButtonSize, P as ButtonVariant, R as Calendar, S as CanonicalIconName, T as Caption, U as Card, V as CardProps, W as CardVariant, X as ChatBubble, Y as ChatBubbleProps, Z as ChatBubbleVariant, _ as Checkbox, $ as CheckboxProps, a0 as Chip, a1 as ChipProps, a2 as CodeBlock, a3 as Collapsible, a4 as CollapsibleProps, a5 as CollapsibleSection, a6 as Combobox, a7 as ComboboxOption, a8 as ComboboxProps, a9 as CommandPalette, aa as ComponentDocs, ab as ComponentDocsProps, ac as ComponentPropRow, ad as ContextMenu, ae as ContextMenuItem, af as ContextMenuProps, ag as DataTable, ah as DataTableColumn, ai as DataTableProps, aj as DatePicker, ak as DatePickerProps, al as Dialog, am as DialogProps, an as Display, ao as Divider, ap as DividerProps, aq as Dot, ar as DotProps, as as Drawer, at as DrawerProps, au as DrawerSide, av as DrawerSize, aw as DropdownAlign, ax as DropdownButton, ay as DropdownButtonProps, az as DropdownItem, aA as DropdownItemProps, aB as DropdownMenu, aC as DropdownMenuProps, aD as DropdownRadioGroup, aE as DropdownRadioGroupProps, aF as DropdownRadioItem, aG as DropdownRadioItemProps, aH as DropdownSide, aI as EmptyState, aJ as FileUpload, aK as FileUploadProps, aL as FilterBar, aM as FilterBarProps, aN as FilterChip, aO as FilterChips, aP as FilterChipsProps, aQ as FilterControls, aR as FilterControlsProps, aS as FilterMenu, aT as FilterMenuOption, aU as FilterMenuProps, aV as FormField, aW as FormFieldControlProps, aX as FormFieldProps, aY as H1, aZ as H2, a_ as H3, a$ as H4, b0 as H5, b1 as HoverCard, b7 as Icon, b3 as IconAliasName, bc as IconByName, bN as IconName, bU as IconProps, cj as Indicator, ck as IndicatorPosition, cl as IndicatorProps, cm as Input, cn as InputGroup, co as InputGroupProps, cp as InputProps, cq as InputSize, cr as InputVariant, cs as Kbd, ct as KbdPlatform, cu as KbdProps, cv as KbdVariant, cw as Label, cx as Lead, cy as Lettermark, cz as LettermarkProps, cA as Link, cB as LinkProps, cC as Loader, cD as LoaderProps, cE as LoaderSize, cF as LoaderVariant, cG as LoadingBar, cH as LoadingBarProps, cI as LoadingState, cJ as LoadingStateProps, cK as Menubar, cL as MenubarItem, cM as MenubarProps, cN as Metric, cO as MetricProps, cP as Modal, cQ as ModalProps, cR as ModalSize, cS as Mono, cT as NumberField, cU as NumberFieldProps, cW as Overline, cX as P, c_ as Pagination, c$ as PaginationProps, d0 as Panel, d1 as PanelProps, d2 as Popover, d3 as PopoverProps, d4 as Progress, d5 as ProgressCircle, d6 as ProgressCircleProps, d7 as ProgressProps, d8 as Radio, d9 as RadioProps, da as Range, db as RangeProps, dc as Rating, dd as RatingProps, de as Resizable, df as ResizableProps, dg as Row, dh as RowProps, di as ScrollArea, dj as ScrollAreaProps, dk as SearchGroup, dl as SearchGroupProps, dm as SearchInput, dn as SearchInputProps, dp as SegmentedControl, dq as Select, dr as SelectProps, ds as SettingsLayout, dt as SettingsLayoutProps, du as SettingsNav, dv as SettingsNavGroup, dw as SettingsNavItem, dx as SettingsNavProps, dy as ShowcaseWrapper, dz as Sidebar, dA as SidebarGroup, dB as SidebarItemDef, dC as SidebarProps, dD as Skeleton, dE as SkeletonProps, dF as SkeletonShape, dG as Small, dH as Snack, dI as SnackProps, dJ as SortMenu, dK as SortMenuProps, dL as Spinner, dM as SpinnerProps, dN as Splotch, dO as SplotchColor, dP as SplotchProps, dQ as Stat, dR as StatProps, dS as StatTone, dT as Stepper, dU as TabItem, dV as Table, dW as TableColumn, dX as TableProps, dY as Tabs, dZ as TabsProps, d_ as TabsVariant, d$ as Tag, e0 as TagProps, e1 as TagType, e2 as Terminal, e3 as TerminalProps, e4 as Textarea, e5 as TextareaProps, e6 as ThemeDomSync, e7 as ThemeManager, e8 as ThemeManagerProps, e9 as ThemeSwitcher, ea as ThemeSwitcherProps, eb as Timeline, ec as TimelineEvent, ed as TimelineProps, ee as Toast, ef as ToastProps, eg as ToastStack, eh as ToastStackProps, ei as ToastStatus, ej as Toggle, ek as ToggleButton, el as ToggleButtonProps, em as ToggleGroup, en as ToggleGroupProps, eo as ToggleProps, ep as Tooltip, eq as TooltipAlign, er as TooltipProps, es as TooltipProvider, et as TooltipProviderProps, eu as TooltipSide, ev as Widget, ew as WidgetProps } from './index-BgG8Homu.mjs';
1
+ export { A as Accordion, a as Alert, b as AlertDialog, c as AlertDialogProps, d as AlertProps, e as AlertStatus, f as AppLayout, g as AppLayoutProps, h as AuthCard, i as AuthCardProps, j as AuthDivider, k as AuthDividerProps, l as AuthLayout, m as AuthLayoutProps, n as Autocomplete, o as AutocompleteOption, p as AutocompleteProps, q as Avatar, r as AvatarGroup, s as AvatarGroupProps, t as AvatarProps, u as AvatarSize, v as AvatarStatus, B as Badge, w as BadgeProps, x as BadgeSize, y as BadgeVariant, z as Banner, C as BannerProps, D as BannerType, E as BreadcrumbItem, F as Breadcrumbs, G as BreadcrumbsProps, H as Button, I as ButtonChrome, J as ButtonChromeProps, K as ButtonGroup, L as ButtonGroupProps, M as ButtonProps, N as ButtonShape, O as ButtonSize, P as ButtonVariant, R as Calendar, S as CanonicalIconName, T as Caption, U as Card, V as CardProps, W as CardVariant, X as ChatBubble, Y as ChatBubbleProps, Z as ChatBubbleVariant, _ as Checkbox, $ as CheckboxProps, a0 as Chip, a1 as ChipProps, a2 as CodeBlock, a3 as Collapsible, a4 as CollapsibleProps, a5 as CollapsibleSection, a6 as Combobox, a7 as ComboboxOption, a8 as ComboboxProps, a9 as CommandPalette, aa as ComponentDocs, ab as ComponentDocsProps, ac as ComponentPropRow, ad as ContextMenu, ae as ContextMenuItem, af as ContextMenuProps, ag as DataTable, ah as DataTableColumn, ai as DataTableProps, aj as DatePicker, ak as DatePickerProps, al as Dialog, am as DialogProps, an as Display, ao as Divider, ap as DividerProps, aq as Dot, ar as DotProps, as as Drawer, at as DrawerProps, au as DrawerSide, av as DrawerSize, aw as DropdownAlign, ax as DropdownButton, ay as DropdownButtonProps, az as DropdownItem, aA as DropdownItemProps, aB as DropdownMenu, aC as DropdownMenuProps, aD as DropdownRadioGroup, aE as DropdownRadioGroupProps, aF as DropdownRadioItem, aG as DropdownRadioItemProps, aH as DropdownSide, aI as EmptyState, aJ as FileUpload, aK as FileUploadProps, aL as FilterBar, aM as FilterBarProps, aN as FilterChip, aO as FilterChips, aP as FilterChipsProps, aQ as FilterControls, aR as FilterControlsProps, aS as FilterMenu, aT as FilterMenuOption, aU as FilterMenuProps, aV as FormField, aW as FormFieldControlProps, aX as FormFieldProps, aY as H1, aZ as H2, a_ as H3, a$ as H4, b0 as H5, b1 as HoverCard, b7 as Icon, b3 as IconAliasName, bc as IconByName, bN as IconName, bU as IconProps, cj as Indicator, ck as IndicatorPosition, cl as IndicatorProps, cm as Input, cn as InputGroup, co as InputGroupProps, cp as InputProps, cq as InputSize, cr as InputVariant, cs as Kbd, ct as KbdPlatform, cu as KbdProps, cv as KbdVariant, cw as Label, cx as Lead, cy as Lettermark, cz as LettermarkProps, cA as Link, cB as LinkProps, cC as Loader, cD as LoaderProps, cE as LoaderSize, cF as LoaderVariant, cG as LoadingBar, cH as LoadingBarProps, cI as LoadingState, cJ as LoadingStateProps, cK as Menubar, cL as MenubarItem, cM as MenubarProps, cN as Metric, cO as MetricProps, cP as Modal, cQ as ModalProps, cR as ModalSize, cS as Mono, cT as NumberField, cU as NumberFieldProps, cW as Overline, cX as P, c_ as Pagination, c$ as PaginationProps, d0 as Panel, d1 as PanelProps, d2 as Popover, d3 as PopoverProps, d4 as Progress, d5 as ProgressCircle, d6 as ProgressCircleProps, d7 as ProgressProps, d8 as Radio, d9 as RadioProps, da as Range, db as RangeProps, dc as Rating, dd as RatingProps, de as Resizable, df as ResizableProps, dg as Row, dh as RowProps, di as ScrollArea, dj as ScrollAreaProps, dk as SearchGroup, dl as SearchGroupProps, dm as SearchInput, dn as SearchInputProps, dp as SegmentedControl, dq as Select, dr as SelectProps, ds as SettingsLayout, dt as SettingsLayoutProps, du as SettingsNav, dv as SettingsNavGroup, dw as SettingsNavItem, dx as SettingsNavProps, dy as ShowcaseWrapper, dz as Sidebar, dA as SidebarGroup, dB as SidebarItemDef, dC as SidebarProps, dD as Skeleton, dE as SkeletonProps, dF as SkeletonShape, dG as Small, dH as Snack, dI as SnackProps, dJ as SortMenu, dK as SortMenuProps, dL as Spinner, dM as SpinnerProps, dN as Splotch, dO as SplotchColor, dP as SplotchProps, dQ as Stat, dR as StatProps, dS as StatTone, dT as Stepper, dU as TabItem, dV as Table, dW as TableColumn, dX as TableProps, dY as Tabs, dZ as TabsProps, d_ as TabsVariant, d$ as Tag, e0 as TagProps, e1 as TagType, e2 as Terminal, e3 as TerminalProps, e4 as Textarea, e5 as TextareaProps, e6 as ThemeDomSync, e7 as ThemeManager, e8 as ThemeManagerProps, e9 as ThemeSwitcher, ea as ThemeSwitcherProps, eb as Timeline, ec as TimelineEvent, ed as TimelineProps, ee as Toast, ef as ToastProps, eg as ToastStack, eh as ToastStackProps, ei as ToastStatus, ej as Toggle, ek as ToggleButton, el as ToggleButtonProps, em as ToggleGroup, en as ToggleGroupProps, eo as ToggleProps, ep as Tooltip, eq as TooltipAlign, er as TooltipProps, es as TooltipProvider, et as TooltipProviderProps, eu as TooltipSide, ev as Widget, ew as WidgetProps } from './index-B5NOyoKS.mjs';
2
2
  import 'react';
3
- import 'react/jsx-runtime';
4
3
  import '@radix-ui/react-dropdown-menu';
package/dist/ui.d.ts CHANGED
@@ -1,4 +1,3 @@
1
- export { A as Accordion, a as Alert, b as AlertDialog, c as AlertDialogProps, d as AlertProps, e as AlertStatus, f as AppLayout, g as AppLayoutProps, h as AuthCard, i as AuthCardProps, j as AuthDivider, k as AuthDividerProps, l as AuthLayout, m as AuthLayoutProps, n as Autocomplete, o as AutocompleteOption, p as AutocompleteProps, q as Avatar, r as AvatarGroup, s as AvatarGroupProps, t as AvatarProps, u as AvatarSize, v as AvatarStatus, B as Badge, w as BadgeProps, x as BadgeSize, y as BadgeVariant, z as Banner, C as BannerProps, D as BannerType, E as BreadcrumbItem, F as Breadcrumbs, G as BreadcrumbsProps, H as Button, I as ButtonChrome, J as ButtonChromeProps, K as ButtonGroup, L as ButtonGroupProps, M as ButtonProps, N as ButtonShape, O as ButtonSize, P as ButtonVariant, R as Calendar, S as CanonicalIconName, T as Caption, U as Card, V as CardProps, W as CardVariant, X as ChatBubble, Y as ChatBubbleProps, Z as ChatBubbleVariant, _ as Checkbox, $ as CheckboxProps, a0 as Chip, a1 as ChipProps, a2 as CodeBlock, a3 as Collapsible, a4 as CollapsibleProps, a5 as CollapsibleSection, a6 as Combobox, a7 as ComboboxOption, a8 as ComboboxProps, a9 as CommandPalette, aa as ComponentDocs, ab as ComponentDocsProps, ac as ComponentPropRow, ad as ContextMenu, ae as ContextMenuItem, af as ContextMenuProps, ag as DataTable, ah as DataTableColumn, ai as DataTableProps, aj as DatePicker, ak as DatePickerProps, al as Dialog, am as DialogProps, an as Display, ao as Divider, ap as DividerProps, aq as Dot, ar as DotProps, as as Drawer, at as DrawerProps, au as DrawerSide, av as DrawerSize, aw as DropdownAlign, ax as DropdownButton, ay as DropdownButtonProps, az as DropdownItem, aA as DropdownItemProps, aB as DropdownMenu, aC as DropdownMenuProps, aD as DropdownRadioGroup, aE as DropdownRadioGroupProps, aF as DropdownRadioItem, aG as DropdownRadioItemProps, aH as DropdownSide, aI as EmptyState, aJ as FileUpload, aK as FileUploadProps, aL as FilterBar, aM as FilterBarProps, aN as FilterChip, aO as FilterChips, aP as FilterChipsProps, aQ as FilterControls, aR as FilterControlsProps, aS as FilterMenu, aT as FilterMenuOption, aU as FilterMenuProps, aV as FormField, aW as FormFieldControlProps, aX as FormFieldProps, aY as H1, aZ as H2, a_ as H3, a$ as H4, b0 as H5, b1 as HoverCard, b7 as Icon, b3 as IconAliasName, bc as IconByName, bN as IconName, bU as IconProps, cj as Indicator, ck as IndicatorPosition, cl as IndicatorProps, cm as Input, cn as InputGroup, co as InputGroupProps, cp as InputProps, cq as InputSize, cr as InputVariant, cs as Kbd, ct as KbdPlatform, cu as KbdProps, cv as KbdVariant, cw as Label, cx as Lead, cy as Lettermark, cz as LettermarkProps, cA as Link, cB as LinkProps, cC as Loader, cD as LoaderProps, cE as LoaderSize, cF as LoaderVariant, cG as LoadingBar, cH as LoadingBarProps, cI as LoadingState, cJ as LoadingStateProps, cK as Menubar, cL as MenubarItem, cM as MenubarProps, cN as Metric, cO as MetricProps, cP as Modal, cQ as ModalProps, cR as ModalSize, cS as Mono, cT as NumberField, cU as NumberFieldProps, cW as Overline, cX as P, c_ as Pagination, c$ as PaginationProps, d0 as Panel, d1 as PanelProps, d2 as Popover, d3 as PopoverProps, d4 as Progress, d5 as ProgressCircle, d6 as ProgressCircleProps, d7 as ProgressProps, d8 as Radio, d9 as RadioProps, da as Range, db as RangeProps, dc as Rating, dd as RatingProps, de as Resizable, df as ResizableProps, dg as Row, dh as RowProps, di as ScrollArea, dj as ScrollAreaProps, dk as SearchGroup, dl as SearchGroupProps, dm as SearchInput, dn as SearchInputProps, dp as SegmentedControl, dq as Select, dr as SelectProps, ds as SettingsLayout, dt as SettingsLayoutProps, du as SettingsNav, dv as SettingsNavGroup, dw as SettingsNavItem, dx as SettingsNavProps, dy as ShowcaseWrapper, dz as Sidebar, dA as SidebarGroup, dB as SidebarItemDef, dC as SidebarProps, dD as Skeleton, dE as SkeletonProps, dF as SkeletonShape, dG as Small, dH as Snack, dI as SnackProps, dJ as SortMenu, dK as SortMenuProps, dL as Spinner, dM as SpinnerProps, dN as Splotch, dO as SplotchColor, dP as SplotchProps, dQ as Stat, dR as StatProps, dS as StatTone, dT as Stepper, dU as TabItem, dV as Table, dW as TableColumn, dX as TableProps, dY as Tabs, dZ as TabsProps, d_ as TabsVariant, d$ as Tag, e0 as TagProps, e1 as TagType, e2 as Terminal, e3 as TerminalProps, e4 as Textarea, e5 as TextareaProps, e6 as ThemeDomSync, e7 as ThemeManager, e8 as ThemeManagerProps, e9 as ThemeSwitcher, ea as ThemeSwitcherProps, eb as Timeline, ec as TimelineEvent, ed as TimelineProps, ee as Toast, ef as ToastProps, eg as ToastStack, eh as ToastStackProps, ei as ToastStatus, ej as Toggle, ek as ToggleButton, el as ToggleButtonProps, em as ToggleGroup, en as ToggleGroupProps, eo as ToggleProps, ep as Tooltip, eq as TooltipAlign, er as TooltipProps, es as TooltipProvider, et as TooltipProviderProps, eu as TooltipSide, ev as Widget, ew as WidgetProps } from './index-BgG8Homu.js';
1
+ export { A as Accordion, a as Alert, b as AlertDialog, c as AlertDialogProps, d as AlertProps, e as AlertStatus, f as AppLayout, g as AppLayoutProps, h as AuthCard, i as AuthCardProps, j as AuthDivider, k as AuthDividerProps, l as AuthLayout, m as AuthLayoutProps, n as Autocomplete, o as AutocompleteOption, p as AutocompleteProps, q as Avatar, r as AvatarGroup, s as AvatarGroupProps, t as AvatarProps, u as AvatarSize, v as AvatarStatus, B as Badge, w as BadgeProps, x as BadgeSize, y as BadgeVariant, z as Banner, C as BannerProps, D as BannerType, E as BreadcrumbItem, F as Breadcrumbs, G as BreadcrumbsProps, H as Button, I as ButtonChrome, J as ButtonChromeProps, K as ButtonGroup, L as ButtonGroupProps, M as ButtonProps, N as ButtonShape, O as ButtonSize, P as ButtonVariant, R as Calendar, S as CanonicalIconName, T as Caption, U as Card, V as CardProps, W as CardVariant, X as ChatBubble, Y as ChatBubbleProps, Z as ChatBubbleVariant, _ as Checkbox, $ as CheckboxProps, a0 as Chip, a1 as ChipProps, a2 as CodeBlock, a3 as Collapsible, a4 as CollapsibleProps, a5 as CollapsibleSection, a6 as Combobox, a7 as ComboboxOption, a8 as ComboboxProps, a9 as CommandPalette, aa as ComponentDocs, ab as ComponentDocsProps, ac as ComponentPropRow, ad as ContextMenu, ae as ContextMenuItem, af as ContextMenuProps, ag as DataTable, ah as DataTableColumn, ai as DataTableProps, aj as DatePicker, ak as DatePickerProps, al as Dialog, am as DialogProps, an as Display, ao as Divider, ap as DividerProps, aq as Dot, ar as DotProps, as as Drawer, at as DrawerProps, au as DrawerSide, av as DrawerSize, aw as DropdownAlign, ax as DropdownButton, ay as DropdownButtonProps, az as DropdownItem, aA as DropdownItemProps, aB as DropdownMenu, aC as DropdownMenuProps, aD as DropdownRadioGroup, aE as DropdownRadioGroupProps, aF as DropdownRadioItem, aG as DropdownRadioItemProps, aH as DropdownSide, aI as EmptyState, aJ as FileUpload, aK as FileUploadProps, aL as FilterBar, aM as FilterBarProps, aN as FilterChip, aO as FilterChips, aP as FilterChipsProps, aQ as FilterControls, aR as FilterControlsProps, aS as FilterMenu, aT as FilterMenuOption, aU as FilterMenuProps, aV as FormField, aW as FormFieldControlProps, aX as FormFieldProps, aY as H1, aZ as H2, a_ as H3, a$ as H4, b0 as H5, b1 as HoverCard, b7 as Icon, b3 as IconAliasName, bc as IconByName, bN as IconName, bU as IconProps, cj as Indicator, ck as IndicatorPosition, cl as IndicatorProps, cm as Input, cn as InputGroup, co as InputGroupProps, cp as InputProps, cq as InputSize, cr as InputVariant, cs as Kbd, ct as KbdPlatform, cu as KbdProps, cv as KbdVariant, cw as Label, cx as Lead, cy as Lettermark, cz as LettermarkProps, cA as Link, cB as LinkProps, cC as Loader, cD as LoaderProps, cE as LoaderSize, cF as LoaderVariant, cG as LoadingBar, cH as LoadingBarProps, cI as LoadingState, cJ as LoadingStateProps, cK as Menubar, cL as MenubarItem, cM as MenubarProps, cN as Metric, cO as MetricProps, cP as Modal, cQ as ModalProps, cR as ModalSize, cS as Mono, cT as NumberField, cU as NumberFieldProps, cW as Overline, cX as P, c_ as Pagination, c$ as PaginationProps, d0 as Panel, d1 as PanelProps, d2 as Popover, d3 as PopoverProps, d4 as Progress, d5 as ProgressCircle, d6 as ProgressCircleProps, d7 as ProgressProps, d8 as Radio, d9 as RadioProps, da as Range, db as RangeProps, dc as Rating, dd as RatingProps, de as Resizable, df as ResizableProps, dg as Row, dh as RowProps, di as ScrollArea, dj as ScrollAreaProps, dk as SearchGroup, dl as SearchGroupProps, dm as SearchInput, dn as SearchInputProps, dp as SegmentedControl, dq as Select, dr as SelectProps, ds as SettingsLayout, dt as SettingsLayoutProps, du as SettingsNav, dv as SettingsNavGroup, dw as SettingsNavItem, dx as SettingsNavProps, dy as ShowcaseWrapper, dz as Sidebar, dA as SidebarGroup, dB as SidebarItemDef, dC as SidebarProps, dD as Skeleton, dE as SkeletonProps, dF as SkeletonShape, dG as Small, dH as Snack, dI as SnackProps, dJ as SortMenu, dK as SortMenuProps, dL as Spinner, dM as SpinnerProps, dN as Splotch, dO as SplotchColor, dP as SplotchProps, dQ as Stat, dR as StatProps, dS as StatTone, dT as Stepper, dU as TabItem, dV as Table, dW as TableColumn, dX as TableProps, dY as Tabs, dZ as TabsProps, d_ as TabsVariant, d$ as Tag, e0 as TagProps, e1 as TagType, e2 as Terminal, e3 as TerminalProps, e4 as Textarea, e5 as TextareaProps, e6 as ThemeDomSync, e7 as ThemeManager, e8 as ThemeManagerProps, e9 as ThemeSwitcher, ea as ThemeSwitcherProps, eb as Timeline, ec as TimelineEvent, ed as TimelineProps, ee as Toast, ef as ToastProps, eg as ToastStack, eh as ToastStackProps, ei as ToastStatus, ej as Toggle, ek as ToggleButton, el as ToggleButtonProps, em as ToggleGroup, en as ToggleGroupProps, eo as ToggleProps, ep as Tooltip, eq as TooltipAlign, er as TooltipProps, es as TooltipProvider, et as TooltipProviderProps, eu as TooltipSide, ev as Widget, ew as WidgetProps } from './index-B5NOyoKS.js';
2
2
  import 'react';
3
- import 'react/jsx-runtime';
4
3
  import '@radix-ui/react-dropdown-menu';
package/dist/ui.js CHANGED
@@ -3406,12 +3406,12 @@ function ComponentDocs({ title = "Props & variants", rows, defaultOpen = false,
3406
3406
  /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("th", { className: "px-4 py-2 font-semibold", children: "Use" })
3407
3407
  ] }) }),
3408
3408
  /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("tbody", { className: "divide-y divide-ph-border", children: rows.map((row) => {
3409
- var _a;
3409
+ var _a, _b;
3410
3410
  return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("tr", { children: [
3411
3411
  /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("td", { className: "px-4 py-3 align-top font-mono text-xs text-ph-ink", children: row.name }),
3412
3412
  /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("td", { className: "px-4 py-3 align-top font-mono text-xs text-ph-subtle", children: row.type }),
3413
3413
  /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("td", { className: "px-4 py-3 align-top font-mono text-xs text-ph-subtle", children: (_a = row.defaultValue) != null ? _a : "-" }),
3414
- /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("td", { className: "px-4 py-3 align-top text-ph-subtle", children: row.description })
3414
+ /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("td", { className: "px-4 py-3 align-top text-ph-subtle", children: (_b = row.description) != null ? _b : /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("span", { className: "text-ph-mutedtext", children: "\u2014" }) })
3415
3415
  ] }, row.name);
3416
3416
  }) })
3417
3417
  ] }) })
@@ -5538,23 +5538,27 @@ function AppLayout({ sidebar, children, sidebarWidth = 240, className }) {
5538
5538
 
5539
5539
  // src/components/ui/Sidebar.tsx
5540
5540
  var import_jsx_runtime82 = require("react/jsx-runtime");
5541
- function Sidebar({ groups, className, header, footer, collapsed = false, onCollapse }) {
5541
+ function Sidebar({ groups, className, header, footer, children, collapsed = false, onCollapse }) {
5542
5542
  return /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)("nav", { className: cn("ph-sidebar flex flex-col h-full", collapsed && "ph-sidebar--collapsed", className), children: [
5543
5543
  header && /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("div", { className: "ph-sidebar__header px-3 py-3 border-b border-ph-border-subtle", children: header }),
5544
- /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("div", { className: "ph-sidebar__body flex-1 overflow-y-auto px-2 py-3 space-y-5", children: groups.map((group) => /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)("div", { className: "ph-sidebar__group", children: [
5545
- !collapsed && /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("h3", { className: "ph-sidebar__group-label px-2 mb-1 text-[10px] font-semibold uppercase tracking-wider text-ph-mutedtext", children: group.label }),
5546
- /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("div", { className: "ph-sidebar__items space-y-0.5", children: group.items.map((item) => /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(SidebarItem, __spreadProps(__spreadValues({}, item), { collapsed }), item.label)) })
5547
- ] }, group.label)) }),
5544
+ /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("div", { className: "ph-sidebar__body flex-1 overflow-y-auto px-2 py-3 space-y-5", children: groups.map((group) => {
5545
+ var _a;
5546
+ return /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)("div", { className: "ph-sidebar__group", children: [
5547
+ group.label && !collapsed && /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("h3", { className: "ph-sidebar__group-label px-2 mb-1 text-[10px] font-semibold uppercase tracking-wider text-ph-mutedtext", children: group.label }),
5548
+ /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("div", { className: "ph-sidebar__items space-y-0.5", children: group.items.map((item) => /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(SidebarItem, __spreadProps(__spreadValues({}, item), { collapsed }), item.label)) })
5549
+ ] }, (_a = group.label) != null ? _a : "default");
5550
+ }) }),
5551
+ children,
5548
5552
  footer && /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("div", { className: "ph-sidebar__footer px-3 py-3 border-t border-ph-border-subtle", children: footer })
5549
5553
  ] });
5550
5554
  }
5551
- function SidebarItem({ label, icon, badge, active, onClick, collapsed }) {
5555
+ function SidebarItem({ label, icon, badge, active, href, onClick, collapsed }) {
5552
5556
  const Comp = onClick ? "button" : "a";
5553
5557
  return /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)(
5554
5558
  Comp,
5555
5559
  {
5556
5560
  type: onClick ? "button" : void 0,
5557
- href: onClick ? void 0 : void 0,
5561
+ href: onClick ? void 0 : href,
5558
5562
  onClick,
5559
5563
  className: cn(
5560
5564
  "ph-sidebar__item flex items-center gap-2.5 w-full rounded-md px-2.5 py-2 text-sm text-left transition",
@@ -5563,7 +5567,7 @@ function SidebarItem({ label, icon, badge, active, onClick, collapsed }) {
5563
5567
  ),
5564
5568
  title: collapsed ? label : void 0,
5565
5569
  children: [
5566
- icon && /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("span", { className: "ph-sidebar__item-icon shrink-0 w-4 h-4 flex items-center justify-center", children: icon }),
5570
+ icon && /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("span", { className: cn("ph-sidebar__item-icon shrink-0 flex items-center justify-center", collapsed ? "w-5 h-5" : "w-4 h-4"), children: icon }),
5567
5571
  !collapsed && /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("span", { className: "ph-sidebar__item-label truncate flex-1", children: label }),
5568
5572
  !collapsed && badge && /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("span", { className: "ph-sidebar__item-badge shrink-0", children: badge })
5569
5573
  ]
package/dist/ui.mjs CHANGED
@@ -14,7 +14,6 @@ import {
14
14
  Banner,
15
15
  Breadcrumbs,
16
16
  Button,
17
- ButtonChrome,
18
17
  ButtonGroup,
19
18
  Calendar,
20
19
  Caption,
@@ -36,11 +35,6 @@ import {
36
35
  Divider,
37
36
  Dot,
38
37
  Drawer,
39
- DropdownButton,
40
- DropdownItem,
41
- DropdownMenu,
42
- DropdownRadioGroup,
43
- DropdownRadioItem,
44
38
  EmptyState,
45
39
  FileUpload,
46
40
  FilterBar,
@@ -54,8 +48,6 @@ import {
54
48
  H4,
55
49
  H5,
56
50
  HoverCard,
57
- IconBase,
58
- IconByName,
59
51
  Indicator,
60
52
  Input,
61
53
  InputGroup,
@@ -115,10 +107,20 @@ import {
115
107
  Toggle,
116
108
  ToggleButton,
117
109
  ToggleGroup,
118
- Tooltip,
119
- TooltipProvider,
120
110
  Widget
121
- } from "./chunk-5HSOBJ4F.mjs";
111
+ } from "./chunk-54ZR4VL5.mjs";
112
+ import {
113
+ ButtonChrome,
114
+ DropdownButton,
115
+ DropdownItem,
116
+ DropdownMenu,
117
+ DropdownRadioGroup,
118
+ DropdownRadioItem,
119
+ IconBase,
120
+ IconByName,
121
+ Tooltip,
122
+ TooltipProvider
123
+ } from "./chunk-G53YLHVE.mjs";
122
124
  import "./chunk-FWCSY2DS.mjs";
123
125
  export {
124
126
  Accordion,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@xenide-io/the-old-ui-theme",
3
- "version": "0.3.2",
3
+ "version": "0.4.3",
4
4
  "description": "Props-driven React components and theme tokens inspired by classic interface design — optimized for Next.js apps and internal tools.",
5
5
  "author": "Xenide",
6
6
  "license": "MIT",
@@ -42,6 +42,12 @@
42
42
  "require": "./dist/ui.js",
43
43
  "default": "./dist/ui.mjs"
44
44
  },
45
+ "./suite": {
46
+ "types": "./dist/suite.d.ts",
47
+ "import": "./dist/suite.mjs",
48
+ "require": "./dist/suite.js",
49
+ "default": "./dist/suite.mjs"
50
+ },
45
51
  "./tailwind-preset": {
46
52
  "types": "./dist/tailwind-preset.d.ts",
47
53
  "import": "./dist/tailwind-preset.mjs",
@@ -53,13 +59,14 @@
53
59
  "dist",
54
60
  "src/app/globals.css",
55
61
  "src/components",
62
+ "src/suite",
56
63
  "src/styles",
57
64
  "tailwind-preset.ts"
58
65
  ],
59
66
  "scripts": {
60
67
  "dev": "next dev",
61
68
  "build": "next build",
62
- "build:lib": "tsup --entry.index src/index.ts --entry.ui src/components/ui/index.ts --entry.tailwind-preset tailwind-preset.ts --format cjs,esm --dts --external react,react-dom,next --clean --tsconfig ./tsconfig.lib.json",
69
+ "build:lib": "tsup --entry.index src/index.ts --entry.ui src/components/ui/index.ts --entry.suite src/suite/index.ts --entry.tailwind-preset tailwind-preset.ts --format cjs,esm --dts --external react,react-dom,next,iconoir-react,motion --clean --tsconfig ./tsconfig.lib.json",
63
70
  "start": "next start",
64
71
  "lint": "next lint",
65
72
  "typecheck": "tsc --noEmit",
@@ -72,45 +79,57 @@
72
79
  "release": "bun run check && npm publish"
73
80
  },
74
81
  "peerDependencies": {
75
- "react": "^18.0.0",
76
- "react-dom": "^18.0.0",
82
+ "react": "^18.0.0 || ^19.0.0",
83
+ "react-dom": "^18.0.0 || ^19.0.0",
77
84
  "next": ">=16.2.7",
78
85
  "tailwindcss": "^3.4.0",
79
- "d3-scale": "^4.0.2"
86
+ "d3-scale": "^4.0.2",
87
+ "iconoir-react": ">=7.11.1",
88
+ "motion": ">=12"
80
89
  },
81
90
  "peerDependenciesMeta": {
82
91
  "d3-scale": {
83
92
  "optional": true
93
+ },
94
+ "iconoir-react": {
95
+ "optional": true
96
+ },
97
+ "motion": {
98
+ "optional": true
84
99
  }
85
100
  },
86
101
  "devDependencies": {
87
102
  "@playwright/test": "1.54.1",
88
- "@testing-library/dom": "10",
89
- "@testing-library/jest-dom": "6",
90
- "@testing-library/react": "16",
91
- "@testing-library/user-event": "14",
103
+ "@testing-library/dom": "^10.4.1",
104
+ "@testing-library/jest-dom": "^6.10.0",
105
+ "@testing-library/react": "^16.3.2",
106
+ "@testing-library/user-event": "^14.6.3",
92
107
  "@types/d3-scale": "^4.0.9",
93
- "@types/node": "^20.14.10",
94
- "@types/react": "^18.3.3",
95
- "@types/react-dom": "^18.3.0",
96
- "autoprefixer": "^10.4.19",
108
+ "@types/node": "^20.19.43",
109
+ "@types/react": "^19.2.18",
110
+ "@types/react-dom": "^19.2.4",
111
+ "autoprefixer": "^10.5.4",
112
+ "iconoir-react": "^7.11.1",
113
+ "motion": "^12.43.0",
97
114
  "d3-scale": "^4.0.2",
98
- "jsdom": "26",
99
- "next": "^16.2.7",
100
- "postcss": "^8.4.39",
101
- "react": "^18.0.0",
102
- "react-dom": "^18.0.0",
103
- "tailwindcss": "^3.4.4",
115
+ "jsdom": "^26.1.0",
116
+ "next": "^16.3.0",
117
+ "postcss": "^8.5.25",
118
+ "react": "^18.3.1",
119
+ "react-dom": "^18.3.1",
120
+ "tailwindcss": "^3.4.19",
104
121
  "tsup": "^8.5.1",
105
- "typescript": "^5.5.3",
106
- "vitest": "3"
122
+ "typescript": "^6.0.3",
123
+ "vitest": "^3.2.7",
124
+ "typescript7": "npm:typescript@^7.0.2"
107
125
  },
108
126
  "publishConfig": {
109
127
  "access": "public"
110
128
  },
111
129
  "dependencies": {
112
- "@radix-ui/react-dialog": "^1.1.20",
113
- "@radix-ui/react-dropdown-menu": "^2.1.21",
114
- "lucide-react": "^1.27.0"
130
+ "@radix-ui/react-dialog": "^1.1.23",
131
+ "@radix-ui/react-dropdown-menu": "^2.1.24",
132
+ "clsx": "^2.1.1",
133
+ "tailwind-merge": "^3.6.0"
115
134
  }
116
135
  }
@@ -5,8 +5,6 @@ import { forwardRef } from "react";
5
5
  import type { IconProps } from "@/components/icons/IconBase";
6
6
  import { createIconBase, createIconBasePath } from "@/components/icons/createIconBase";
7
7
  import { cn } from "@/lib/cn";
8
- import * as LemonIcons from "@/components/icons/lemon-icons";
9
- import * as LemonBrandIcons from "@/components/icons/lemon-brand-icons";
10
8
 
11
9
  const fill = (d: string) => <path d={d} fill="currentColor" />;
12
10
 
@@ -1,6 +1,3 @@
1
1
  export { IconBase, type IconProps } from "@/components/icons/IconBase";
2
2
  export { createIconBase, createIconBasePath } from "@/components/icons/createIconBase";
3
3
  export * from "@/components/icons/icons";
4
- export * from "@/components/icons/lemon-icons";
5
- export * from "@/components/icons/lemon-brand-icons";
6
- export * from "@/components/icons/lemon-category-icons";
@@ -3,17 +3,6 @@ import {
3
3
  CANONICAL_ICONS,
4
4
  OLD_UI_ICONS,
5
5
  IconAreaChart, IconDatabase, IconFlag, IconFlask, IconGridView, IconRecording, IconSurveys,
6
- IconChrome, IconFirefox, IconSafari, IconFacebook, IconGoogle, IconGitlab, IconSlack, IconMicrosoftTeams,
7
- IconMacOS, IconAppleIOS, IconWindows, IconLinux, IconAndroidOS,
8
- IconWeb, IconMonitor, IconBold, IconItalic, IconLink, IconPreview, IconEyeHidden,
9
- IconFullScreen, IconMenu, IconGhost, IconReplay, IconHeatmap, IconPauseCircle,
10
- IconSkipBackward, IconSkipStart, IconSkipEnd, IconDragHandle, IconFingerprint, IconNodeJS, IconStamphog,
11
- IconPalette, IconMegaphone, IconMap, IconMapPin, IconCoffee, IconBook, IconCalendar,
12
- IconClock, IconGlobe, IconCloud, IconBug, IconCrown, IconConfetti, IconLightBulb,
13
- IconHourglass, IconStore, IconCart, IconEye, IconPeople, IconGroups, IconDocument,
14
- IconAI, IconArchive, IconAtSign, IconBinary, IconGear, IconChat, IconFolder,
15
- IconHeart, IconHomeFilled, IconImage, IconLock, IconMic, IconMusic, IconPhone,
16
- IconRefresh, IconReply, IconReport, IconFilter, IconPlus, IconCheck, IconClose,
17
6
  type CanonicalIconName,
18
7
  type IconProps,
19
8
  } from "@/components/icons";
@@ -29,64 +18,6 @@ const originalIcons = Object.entries(OLD_UI_ICONS) as Array<[
29
18
  ComponentType<IconProps>,
30
19
  ]>;
31
20
 
32
- const categoryIcons = [
33
- { Icon: IconPalette, label: "Palette" }, { Icon: IconMegaphone, label: "Megaphone" },
34
- { Icon: IconMap, label: "Map" }, { Icon: IconMapPin, label: "Pin" },
35
- { Icon: IconCoffee, label: "Coffee" }, { Icon: IconBook, label: "Book" },
36
- { Icon: IconCalendar, label: "Calendar" }, { Icon: IconClock, label: "Clock" },
37
- { Icon: IconGlobe, label: "Globe" }, { Icon: IconCloud, label: "Cloud" },
38
- { Icon: IconBug, label: "Bug" }, { Icon: IconCrown, label: "Crown" },
39
- { Icon: IconConfetti, label: "Confetti" }, { Icon: IconLightBulb, label: "Bulb" },
40
- { Icon: IconHourglass, label: "Hourglass" }, { Icon: IconStore, label: "Store" },
41
- { Icon: IconCart, label: "Cart" }, { Icon: IconEye, label: "Eye" },
42
- { Icon: IconPeople, label: "People" }, { Icon: IconGroups, label: "Groups" },
43
- { Icon: IconDocument, label: "Document" }, { Icon: IconAI, label: "AI" },
44
- { Icon: IconArchive, label: "Archive" }, { Icon: IconAtSign, label: "At" },
45
- { Icon: IconBinary, label: "Binary" }, { Icon: IconGear, label: "Gear" },
46
- { Icon: IconChat, label: "Chat" }, { Icon: IconFolder, label: "Folder" },
47
- { Icon: IconHeart, label: "Heart" }, { Icon: IconImage, label: "Image" },
48
- { Icon: IconLock, label: "Lock" }, { Icon: IconMic, label: "Mic" },
49
- { Icon: IconMusic, label: "Music" }, { Icon: IconPhone, label: "Phone" },
50
- { Icon: IconRefresh, label: "Refresh" }, { Icon: IconReply, label: "Reply" },
51
- { Icon: IconReport, label: "Report" }, { Icon: IconFilter, label: "Filter" },
52
- ];
53
-
54
- const lemonIcons = [
55
- { Icon: IconChrome, label: "Chrome" },
56
- { Icon: IconFirefox, label: "Firefox" },
57
- { Icon: IconSafari, label: "Safari" },
58
- { Icon: IconFacebook, label: "Facebook" },
59
- { Icon: IconGoogle, label: "Google" },
60
- { Icon: IconGitlab, label: "Gitlab" },
61
- { Icon: IconSlack, label: "Slack" },
62
- { Icon: IconMicrosoftTeams, label: "Teams" },
63
- { Icon: IconMacOS, label: "macOS" },
64
- { Icon: IconAppleIOS, label: "iOS" },
65
- { Icon: IconWindows, label: "Windows" },
66
- { Icon: IconLinux, label: "Linux" },
67
- { Icon: IconAndroidOS, label: "Android" },
68
- { Icon: IconWeb, label: "Web" },
69
- { Icon: IconMonitor, label: "Monitor" },
70
- { Icon: IconBold, label: "Bold" },
71
- { Icon: IconItalic, label: "Italic" },
72
- { Icon: IconLink, label: "Link" },
73
- { Icon: IconPreview, label: "Preview" },
74
- { Icon: IconEyeHidden, label: "EyeHidden" },
75
- { Icon: IconFullScreen, label: "FullScreen" },
76
- { Icon: IconMenu, label: "Menu" },
77
- { Icon: IconGhost, label: "Ghost" },
78
- { Icon: IconReplay, label: "Replay" },
79
- { Icon: IconHeatmap, label: "Heatmap" },
80
- { Icon: IconPauseCircle, label: "Pause" },
81
- { Icon: IconSkipBackward, label: "SkipBack" },
82
- { Icon: IconSkipStart, label: "SkipStart" },
83
- { Icon: IconSkipEnd, label: "SkipEnd" },
84
- { Icon: IconDragHandle, label: "DragHandle" },
85
- { Icon: IconFingerprint, label: "Fingerprint" },
86
- { Icon: IconNodeJS, label: "NodeJS" },
87
- { Icon: IconStamphog, label: "Stamphog" },
88
- ];
89
-
90
21
  const productTiles = [
91
22
  { label: "Session replay", Icon: IconRecording, color: "--ph-product-session-replay" },
92
23
  { label: "Product analytics", Icon: IconAreaChart, color: "--ph-product-product-analytics" },
@@ -115,7 +46,7 @@ export default function IconShowcase() {
115
46
  return (
116
47
  <ShowcaseWrapper
117
48
  title="Icons"
118
- description="A canonical filled SVG registry with PostHog/Material foundations and clearly identified Old UI originals."
49
+ description="A canonical filled SVG registry with clearly identified Old UI originals and the new suite icon system."
119
50
  code={code}
120
51
  filename="IconExample.tsx"
121
52
  >
@@ -160,46 +91,6 @@ export default function IconShowcase() {
160
91
  </div>
161
92
  </section>
162
93
 
163
- <section className="ph-panel space-y-4">
164
- <div>
165
- <h3 className="text-xs font-semibold uppercase tracking-wider text-ph-mutedtext">Common icons (PostHog categories)</h3>
166
- <p className="mt-2 max-w-3xl text-sm leading-relaxed text-ph-subtle">
167
- Everyday UI icons ported from PostHog&apos;s categories set.
168
- </p>
169
- </div>
170
- <div className="grid grid-cols-4 gap-3 sm:grid-cols-6 md:grid-cols-8 lg:grid-cols-10">
171
- {categoryIcons.map(({ Icon, label }) => (
172
- <div key={label} className="flex min-w-0 flex-col items-center gap-2 rounded-lg border border-ph-border-subtle bg-ph-raised p-3 text-center">
173
- <div className="flex h-8 items-center gap-2 text-ph-ink">
174
- <Icon size={16} />
175
- <Icon size={24} />
176
- </div>
177
- <span className="max-w-full break-words text-[10px] font-medium tracking-wide text-ph-mutedtext">{label}</span>
178
- </div>
179
- ))}
180
- </div>
181
- </section>
182
-
183
- <section className="ph-panel space-y-4">
184
- <div>
185
- <h3 className="text-xs font-semibold uppercase tracking-wider text-ph-mutedtext">Lemon icons (PostHog port)</h3>
186
- <p className="mt-2 max-w-3xl text-sm leading-relaxed text-ph-subtle">
187
- Browser, OS, brand, and UI icons ported from PostHog&apos;s lemon-ui icon set.
188
- </p>
189
- </div>
190
- <div className="grid grid-cols-4 gap-3 sm:grid-cols-6 md:grid-cols-8 lg:grid-cols-10">
191
- {lemonIcons.map(({ Icon, label }) => (
192
- <div key={label} className="flex min-w-0 flex-col items-center gap-2 rounded-lg border border-ph-border-subtle bg-ph-raised p-3 text-center">
193
- <div className="flex h-8 items-center gap-2 text-ph-ink">
194
- <Icon size={16} />
195
- <Icon size={24} />
196
- </div>
197
- <span className="max-w-full break-words text-[10px] font-medium tracking-wide text-ph-mutedtext">{label}</span>
198
- </div>
199
- ))}
200
- </div>
201
- </section>
202
-
203
94
  <section className="ph-panel space-y-4">
204
95
  <div>
205
96
  <h3 className="text-xs font-semibold uppercase tracking-wider text-ph-mutedtext">Product hues</h3>
@@ -11,7 +11,7 @@ import {
11
11
  ComponentDocs, ShowcaseWrapper,
12
12
  Button, Card, Badge, Dialog, Input, Checkbox, Textarea, Select,
13
13
  } from "@/components/ui";
14
- import { Bell, Sliders, User, Search, Plus } from "lucide-react";
14
+ import { Bell, Settings, User, Search, Plus } from "iconoir-react";
15
15
 
16
16
  const bannerCode = `import { Banner } from "@xenide-io/the-old-ui-theme";
17
17
 
@@ -42,10 +42,10 @@ const progressCircleCode = `import { ProgressCircle } from "@xenide-io/the-old-u
42
42
  </ProgressCircle>`;
43
43
 
44
44
  const rowCode = `import { Row } from "@xenide-io/the-old-ui-theme";
45
- import { User, Sliders } from "lucide-react";
45
+ import { User, Settings } from "iconoir-react";
46
46
 
47
47
  <Row icon={<User className="h-4 w-4" />}>User profile</Row>
48
- <Row sideIcon={<Sliders className="h-4 w-4" />}>Settings</Row>`;
48
+ <Row sideIcon={<Settings className="h-4 w-4" />}>Settings</Row>`;
49
49
 
50
50
  const widgetCode = `import { Widget } from "@xenide-io/the-old-ui-theme";
51
51
 
@@ -251,7 +251,7 @@ export default function NewComponentsShowcase() {
251
251
  >
252
252
  <div className="space-y-3">
253
253
  <Row icon={<User className="h-4 w-4" />}>User profile</Row>
254
- <Row sideIcon={<Sliders className="h-4 w-4" />}>Settings</Row>
254
+ <Row sideIcon={<Settings className="h-4 w-4" />}>Settings</Row>
255
255
  <Row icon={<Bell className="h-4 w-4" />} sideIcon={<Badge variant="danger">3</Badge>}>
256
256
  Notifications
257
257
  </Row>
@@ -2,7 +2,7 @@
2
2
 
3
3
  import { useState } from "react";
4
4
  import { AppLayout, Sidebar, ShowcaseWrapper, Badge, Button } from "@/components/ui";
5
- import { Home, Bell, Flag, User, Search, Zap } from "lucide-react";
5
+ import { Home, Bell, TriangleFlag, User, Search, Flash } from "iconoir-react";
6
6
 
7
7
  const sampleGroups = [
8
8
  {
@@ -16,9 +16,9 @@ const sampleGroups = [
16
16
  {
17
17
  label: "Workspace",
18
18
  items: [
19
- { label: "Projects", icon: <Flag className="h-4 w-4" /> },
19
+ { label: "Projects", icon: <TriangleFlag className="h-4 w-4" /> },
20
20
  { label: "People", icon: <User className="h-4 w-4" /> },
21
- { label: "Automations", icon: <Zap className="h-4 w-4" /> },
21
+ { label: "Automations", icon: <Flash className="h-4 w-4" /> },
22
22
  ],
23
23
  },
24
24
  ];