@optiaxiom/react 0.1.0-next.13 → 0.1.0-next.15

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 (125) hide show
  1. package/dist/{PopoverContent-_Tn-IzNJ.d.ts → PopoverContent-DHQm-nPQ.d.ts} +25 -27
  2. package/dist/accordion-trigger/AccordionTrigger-css.js +1 -1
  3. package/dist/alert/Alert-css.js +1 -1
  4. package/dist/alert-dialog/AlertDialog.js +17 -47
  5. package/dist/alert-dialog-action/AlertDialogAction.js +14 -0
  6. package/dist/alert-dialog-cancel/AlertDialogCancel.js +14 -0
  7. package/dist/alert-dialog-content/AlertDialogContent-css.js +8 -0
  8. package/dist/alert-dialog-content/AlertDialogContent.js +20 -0
  9. package/dist/alert-dialog-context/AlertDialogContext.js +5 -0
  10. package/dist/alert-dialog-description/AlertDialogDescription-css.js +7 -0
  11. package/dist/alert-dialog-description/AlertDialogDescription.js +12 -0
  12. package/dist/alert-dialog-footer/AlertDialogFooter-css.js +8 -0
  13. package/dist/alert-dialog-footer/AlertDialogFooter.js +11 -0
  14. package/dist/alert-dialog-title/AlertDialogTitle.js +23 -0
  15. package/dist/alert-dialog-trigger/AlertDialogTrigger.js +14 -0
  16. package/dist/animate-presence/AnimatePresence.js +4 -3
  17. package/dist/assets/src/{alert-dialog/AlertDialog.css.ts.vanilla-WdIe6m3g.css → alert-dialog-content/AlertDialogContent.css.ts.vanilla-CLM10r0f.css} +5 -11
  18. package/dist/assets/src/alert-dialog-description/AlertDialogDescription.css.ts.vanilla-B7BawTGq.css +6 -0
  19. package/dist/assets/src/alert-dialog-footer/AlertDialogFooter.css.ts.vanilla-3HiYmspb.css +6 -0
  20. package/dist/assets/src/box/{Box.css.ts.vanilla-D1mbecuN.css → Box.css.ts.vanilla-DLsoitAb.css} +5 -0
  21. package/dist/assets/src/button/{Button.css.ts.vanilla-BVWox07Y.css → Button.css.ts.vanilla-DeHH8Xkd.css} +43 -34
  22. package/dist/assets/src/{dialog/Dialog.css.ts.vanilla-BlNHlzx8.css → dialog-content/DialogContent.css.ts.vanilla-B-pX7DR_.css} +6 -6
  23. package/dist/assets/src/{menu-content/MenuContent.css.ts.vanilla-BVK7SB5f.css → dropdown-menu-content/DropdownMenuContent.css.ts.vanilla-EXOZ-w-n.css} +1 -1
  24. package/dist/assets/src/dropdown-menu-item/DropdownMenuItem.css.ts.vanilla-iU0t5wQu.css +30 -0
  25. package/dist/assets/src/input-base/{InputBase.css.ts.vanilla-By5uGeYP.css → InputBase.css.ts.vanilla-CXpyZISC.css} +1 -0
  26. package/dist/assets/src/{search/Search.css.ts.vanilla-8Mi7WZBC.css → search-input/SearchInput.css.ts.vanilla-BTRVQpev.css} +1 -1
  27. package/dist/assets/src/sprinkles/{sprinkles.css.ts.vanilla-I48qUKRQ.css → sprinkles.css.ts.vanilla-o1FSIYj0.css} +2276 -2251
  28. package/dist/assets/src/styles/{theme.css.ts.vanilla-EbjT5N3_.css → theme.css.ts.vanilla-BZP-0Wgr.css} +8 -6
  29. package/dist/assets/src/table/Table.css.ts.vanilla-C9ntYW9X.css +9 -0
  30. package/dist/assets/src/table-body/TableBody.css.ts.vanilla-WI2VmycQ.css +6 -0
  31. package/dist/assets/src/table-cell/TableCell.css.ts.vanilla-Bn9ccAMh.css +10 -0
  32. package/dist/assets/src/table-header-cell/TableHeaderCell.css.ts.vanilla-DEMkJMmk.css +6 -0
  33. package/dist/assets/src/toast/{Toast.css.ts.vanilla-N6bXbnrT.css → Toast.css.ts.vanilla-D1qN8JIH.css} +6 -7
  34. package/dist/avatar/Avatar-css.js +2 -2
  35. package/dist/avatar-group/AvatarGroup-css.js +1 -1
  36. package/dist/axiom-provider/AxiomProvider.js +3 -1
  37. package/dist/badge/Badge-css.js +1 -1
  38. package/dist/box/Box-css.js +2 -2
  39. package/dist/{breadcrumbs/Breadcrumbs.js → breadcrumb/Breadcrumb.js} +5 -7
  40. package/dist/breadcrumb-ellipsis/BreadcrumbEllipsis.js +10 -0
  41. package/dist/breadcrumb-item/BreadcrumbItem.js +11 -4
  42. package/dist/breadcrumb-link/BreadcrumbLink.js +12 -0
  43. package/dist/breadcrumb-page/BreadcrumbPage.js +12 -0
  44. package/dist/breadcrumb-separator/BreadcrumbSeparator.js +14 -0
  45. package/dist/button/Button-css.js +9 -7
  46. package/dist/button/Button.js +19 -10
  47. package/dist/button-group/ButtonGroup-css.js +1 -1
  48. package/dist/checkbox/Checkbox-css.js +1 -1
  49. package/dist/checkbox/Checkbox.js +7 -10
  50. package/dist/combobox/Combobox.js +3 -3
  51. package/dist/combobox-content/ComboboxContent.js +2 -2
  52. package/dist/command-item/CommandItem-css.js +1 -1
  53. package/dist/control-base/ControlBase-css.js +2 -2
  54. package/dist/control-base/ControlBase.js +12 -4
  55. package/dist/dialog/Dialog.js +27 -39
  56. package/dist/dialog-body/DialogBody-css.js +1 -1
  57. package/dist/{menu-trigger/MenuTrigger.js → dialog-close/DialogClose.js} +5 -6
  58. package/dist/{dialog/Dialog-css.js → dialog-content/DialogContent-css.js} +4 -4
  59. package/dist/dialog-content/DialogContent.js +38 -0
  60. package/dist/dialog-context/DialogContext.js +5 -0
  61. package/dist/dialog-description/DialogDescription.js +23 -0
  62. package/dist/dialog-title/DialogTitle.js +15 -11
  63. package/dist/dialog-trigger/DialogTrigger.js +16 -0
  64. package/dist/{menu/Menu.js → dropdown-menu/DropdownMenu.js} +7 -7
  65. package/dist/{menu-content/MenuContent-css.js → dropdown-menu-content/DropdownMenuContent-css.js} +2 -2
  66. package/dist/{menu-content/MenuContent.js → dropdown-menu-content/DropdownMenuContent.js} +6 -6
  67. package/dist/dropdown-menu-context/DropdownMenuContext.js +5 -0
  68. package/dist/dropdown-menu-item/DropdownMenuItem-css.js +8 -0
  69. package/dist/{menu-item/MenuItem.js → dropdown-menu-item/DropdownMenuItem.js} +4 -4
  70. package/dist/{menu-label/MenuLabel.js → dropdown-menu-label/DropdownMenuLabel.js} +3 -3
  71. package/dist/dropdown-menu-separator/DropdownMenuSeparator.js +9 -0
  72. package/dist/dropdown-menu-trigger/DropdownMenuTrigger.js +15 -0
  73. package/dist/grid/Grid.js +1 -1
  74. package/dist/heading/Heading.js +2 -2
  75. package/dist/hover-card/HoverCard.js +3 -3
  76. package/dist/index.d.ts +278 -169
  77. package/dist/index.js +20 -9
  78. package/dist/input/Input-css.js +1 -1
  79. package/dist/input/Input.js +2 -2
  80. package/dist/input-base/InputBase-css.js +3 -3
  81. package/dist/link/Link-css.js +1 -1
  82. package/dist/pagination/Pagination-css.js +1 -1
  83. package/dist/pill/Pill-css.js +1 -1
  84. package/dist/popover/Popover.js +3 -3
  85. package/dist/radio-group/RadioGroup.js +26 -8
  86. package/dist/radio-group-item/RadioGroupItem-css.js +1 -1
  87. package/dist/radio-group-item/RadioGroupItem.js +4 -7
  88. package/dist/search-input/SearchInput-css.js +8 -0
  89. package/dist/{search/Search.js → search-input/SearchInput.js} +4 -4
  90. package/dist/spinner/Spinner.js +56 -0
  91. package/dist/sprinkles/sprinkles-css.js +3 -3
  92. package/dist/styles/theme-css.js +2 -2
  93. package/dist/switch/Switch-css.js +1 -1
  94. package/dist/switch/Switch.js +4 -7
  95. package/dist/table/Table-css.js +8 -0
  96. package/dist/table/Table.js +11 -0
  97. package/dist/table-body/TableBody-css.js +7 -0
  98. package/dist/table-body/TableBody.js +11 -0
  99. package/dist/table-cell/TableCell-css.js +9 -0
  100. package/dist/table-cell/TableCell.js +13 -0
  101. package/dist/table-head/TableHead.js +10 -0
  102. package/dist/table-header-cell/TableHeaderCell-css.js +7 -0
  103. package/dist/table-header-cell/TableHeaderCell.js +11 -0
  104. package/dist/table-row/TableRow-css.js +7 -0
  105. package/dist/table-row/TableRow.js +11 -0
  106. package/dist/tabs-list/TabsList-css.js +1 -1
  107. package/dist/tabs-trigger/TabsTrigger-css.js +1 -1
  108. package/dist/toast/Toast-css.js +3 -2
  109. package/dist/toast/Toast.js +2 -2
  110. package/dist/toast-action/ToastAction.js +1 -1
  111. package/dist/toast-provider/ToastProvider-css.js +1 -1
  112. package/dist/toggle/Toggle.js +13 -0
  113. package/dist/tokens/colors.js +4 -3
  114. package/dist/transition/Transition.js +1 -1
  115. package/dist/unstable.d.ts +110 -36
  116. package/dist/unstable.js +12 -0
  117. package/package.json +7 -7
  118. package/dist/alert-dialog/AlertDialog-css.js +0 -11
  119. package/dist/assets/src/menu-item/MenuItem.css.ts.vanilla-BjEdkhqZ.css +0 -30
  120. package/dist/breadcrumbs/useBreadcrumbItems.js +0 -35
  121. package/dist/menu-context/MenuContext.js +0 -5
  122. package/dist/menu-item/MenuItem-css.js +0 -8
  123. package/dist/menu-separator/MenuSeparator.js +0 -11
  124. package/dist/search/Search-css.js +0 -8
  125. /package/dist/assets/src/{avatar-group/AvatarGroup.css.ts.vanilla-4BGjgIuZ.css → table-row/TableRow.css.ts.vanilla-4BGjgIuZ.css} +0 -0
@@ -1,20 +1,20 @@
1
- import * as react_jsx_runtime from 'react/jsx-runtime';
2
- import * as RadixPopover from '@radix-ui/react-popover';
3
1
  import * as react from 'react';
4
2
  import { ElementType, ComponentPropsWithoutRef } from 'react';
3
+ import * as react_jsx_runtime from 'react/jsx-runtime';
4
+ import * as RadixPopover from '@radix-ui/react-popover';
5
5
  import * as _vanilla_extract_sprinkles from '@vanilla-extract/sprinkles';
6
6
 
7
7
  declare const sprinkles: ((props: {
8
- animation?: "ping" | "pulse" | undefined;
9
- backgroundColor?: "transparent" | "brand.50" | "brand.500" | "brand.600" | "neutral.1200/18" | "purple.50" | "red.50" | "red.500" | "red.600" | "blue.50" | "blue.600" | "neutral.1200/5" | "neutral.75" | "neutral.800" | "neutral.900" | "neutral.200" | "neutral.300" | "green.50" | "green.500" | "green.600" | "yellow.50" | "yellow.500" | "yellow.600" | "neutral.500" | "neutral.600" | "neutral.150" | "neutral.100" | "blue.500" | "magenta.600" | "purple.600" | "brand.700" | "white" | "neutral.1200/32" | "red.700" | "purple.500" | "neutral.700" | "green.700" | "yellow.700" | "brand.300" | "neutral.1000" | "purple.900" | "blue.900" | "slate.800" | "green.900" | "gray.800" | "blue.200" | "magenta.200" | "purple.200" | "red.200" | "gray.100" | "slate.400" | "green.200" | "neutral.50/32" | "gray.900" | "bg.brand" | "bg.brand.solid" | "bg.brand.solid.hover" | "bg.disabled" | "bg.discovery" | "bg.error" | "bg.error.solid" | "bg.error.solid.hover" | "bg.information" | "bg.information.solid" | "bg.input.disabled" | "bg.neutral" | "bg.neutral.inverse" | "bg.neutral.inverse.hover" | "bg.neutral.solid" | "bg.neutral.solid.hover" | "bg.success" | "bg.success.solid" | "bg.success.solid.hover" | "bg.warning" | "bg.warning.solid" | "bg.warning.solid.hover" | "border.active" | "border.active.hover" | "border.brand" | "border.default" | "border.disabled" | "border.error" | "border.secondary" | "border.success" | "border.tertiary" | "border.warning" | "fg.accent.blue" | "fg.accent.magenta" | "fg.accent.purple" | "fg.accent.red" | "fg.brand" | "fg.default" | "fg.default.inverse" | "fg.disabled" | "fg.error" | "fg.information" | "fg.link" | "fg.link.hover" | "fg.link.visited" | "fg.secondary" | "fg.success" | "fg.tertiary" | "fg.warning" | "outline.brand" | "overlay" | "surface" | "current" | "black" | "aqua.50" | "aqua.200" | "aqua.500" | "aqua.600" | "brand.100" | "brand.200" | "brand.400" | "brand.800" | "brand.900" | "dark.50" | "dark.200" | "dark.500" | "dark.600" | "gray.50" | "gray.200" | "gray.300" | "gray.400" | "gray.500" | "gray.600" | "gray.700" | "green.100" | "green.300" | "green.400" | "green.800" | "magenta.50" | "magenta.500" | "neutral.50" | "neutral.1100" | "neutral.1200" | "neutral.1200/12" | "neutral.1200/22" | "orange.50" | "orange.200" | "orange.500" | "orange.600" | "red.100" | "red.300" | "red.400" | "red.800" | "red.900" | "slate.50" | "slate.100" | "slate.200" | "slate.300" | "slate.500" | "slate.600" | "slate.700" | "slate.900" | "slate.950" | "yellow.100" | "yellow.200" | "yellow.300" | "yellow.400" | "yellow.800" | "yellow.900" | undefined;
8
+ animation?: "ping" | "pulse" | "spin" | undefined;
9
+ backgroundColor?: "transparent" | "brand.50" | "brand.500" | "brand.600" | "neutral.1200/18" | "purple.50" | "red.50" | "red.500" | "red.600" | "blue.50" | "blue.600" | "neutral.1200/4" | "neutral.75" | "neutral.800" | "neutral.900" | "neutral.200" | "neutral.300" | "green.50" | "green.500" | "green.600" | "yellow.50" | "yellow.500" | "yellow.600" | "neutral.500" | "neutral.600" | "neutral.150" | "neutral.100" | "blue.500" | "magenta.600" | "purple.600" | "brand.700" | "white" | "neutral.1200/32" | "red.700" | "purple.500" | "neutral.700" | "green.700" | "yellow.700" | "brand.300" | "neutral.1000" | "purple.900" | "blue.900" | "slate.800" | "green.900" | "gray.800" | "blue.200" | "magenta.200" | "purple.200" | "red.200" | "gray.100" | "slate.400" | "green.200" | "neutral.50/32" | "gray.900" | "bg.brand" | "bg.brand.solid" | "bg.brand.solid.hover" | "bg.disabled" | "bg.discovery" | "bg.error" | "bg.error.solid" | "bg.error.solid.hover" | "bg.information" | "bg.information.solid" | "bg.input.disabled" | "bg.neutral" | "bg.neutral.inverse" | "bg.neutral.inverse.hover" | "bg.neutral.solid" | "bg.neutral.solid.hover" | "bg.success" | "bg.success.solid" | "bg.success.solid.hover" | "bg.warning" | "bg.warning.solid" | "bg.warning.solid.hover" | "border.active" | "border.active.hover" | "border.brand" | "border.default" | "border.disabled" | "border.error" | "border.secondary" | "border.success" | "border.tertiary" | "border.warning" | "fg.accent.blue" | "fg.accent.magenta" | "fg.accent.purple" | "fg.accent.red" | "fg.brand" | "fg.default" | "fg.default.inverse" | "fg.disabled" | "fg.error" | "fg.information" | "fg.link" | "fg.link.hover" | "fg.link.visited" | "fg.secondary" | "fg.success" | "fg.tertiary" | "fg.warning" | "outline.brand" | "overlay" | "surface" | "current" | "black" | "aqua.50" | "aqua.200" | "aqua.500" | "aqua.600" | "brand.100" | "brand.200" | "brand.400" | "brand.800" | "brand.900" | "dark.50" | "dark.200" | "dark.500" | "dark.600" | "gray.50" | "gray.200" | "gray.300" | "gray.400" | "gray.500" | "gray.600" | "gray.700" | "green.100" | "green.300" | "green.400" | "green.800" | "magenta.50" | "magenta.500" | "neutral.50" | "neutral.1100" | "neutral.1200" | "neutral.50/6" | "neutral.1200/12" | "neutral.1200/22" | "orange.50" | "orange.200" | "orange.500" | "orange.600" | "red.100" | "red.300" | "red.400" | "red.800" | "red.900" | "slate.50" | "slate.100" | "slate.200" | "slate.300" | "slate.500" | "slate.600" | "slate.700" | "slate.900" | "slate.950" | "yellow.100" | "yellow.200" | "yellow.300" | "yellow.400" | "yellow.800" | "yellow.900" | undefined;
10
10
  borderBottomWidth?: "2" | "4" | "0" | "1" | undefined;
11
- borderColor?: "transparent" | "brand.50" | "brand.500" | "brand.600" | "neutral.1200/18" | "purple.50" | "red.50" | "red.500" | "red.600" | "blue.50" | "blue.600" | "neutral.1200/5" | "neutral.75" | "neutral.800" | "neutral.900" | "neutral.200" | "neutral.300" | "green.50" | "green.500" | "green.600" | "yellow.50" | "yellow.500" | "yellow.600" | "neutral.500" | "neutral.600" | "neutral.150" | "neutral.100" | "blue.500" | "magenta.600" | "purple.600" | "brand.700" | "white" | "neutral.1200/32" | "red.700" | "purple.500" | "neutral.700" | "green.700" | "yellow.700" | "brand.300" | "neutral.1000" | "purple.900" | "blue.900" | "slate.800" | "green.900" | "gray.800" | "blue.200" | "magenta.200" | "purple.200" | "red.200" | "gray.100" | "slate.400" | "green.200" | "neutral.50/32" | "gray.900" | "bg.brand" | "bg.brand.solid" | "bg.brand.solid.hover" | "bg.disabled" | "bg.discovery" | "bg.error" | "bg.error.solid" | "bg.error.solid.hover" | "bg.information" | "bg.information.solid" | "bg.input.disabled" | "bg.neutral" | "bg.neutral.inverse" | "bg.neutral.inverse.hover" | "bg.neutral.solid" | "bg.neutral.solid.hover" | "bg.success" | "bg.success.solid" | "bg.success.solid.hover" | "bg.warning" | "bg.warning.solid" | "bg.warning.solid.hover" | "border.active" | "border.active.hover" | "border.brand" | "border.default" | "border.disabled" | "border.error" | "border.secondary" | "border.success" | "border.tertiary" | "border.warning" | "fg.accent.blue" | "fg.accent.magenta" | "fg.accent.purple" | "fg.accent.red" | "fg.brand" | "fg.default" | "fg.default.inverse" | "fg.disabled" | "fg.error" | "fg.information" | "fg.link" | "fg.link.hover" | "fg.link.visited" | "fg.secondary" | "fg.success" | "fg.tertiary" | "fg.warning" | "outline.brand" | "overlay" | "surface" | "current" | "black" | "aqua.50" | "aqua.200" | "aqua.500" | "aqua.600" | "brand.100" | "brand.200" | "brand.400" | "brand.800" | "brand.900" | "dark.50" | "dark.200" | "dark.500" | "dark.600" | "gray.50" | "gray.200" | "gray.300" | "gray.400" | "gray.500" | "gray.600" | "gray.700" | "green.100" | "green.300" | "green.400" | "green.800" | "magenta.50" | "magenta.500" | "neutral.50" | "neutral.1100" | "neutral.1200" | "neutral.1200/12" | "neutral.1200/22" | "orange.50" | "orange.200" | "orange.500" | "orange.600" | "red.100" | "red.300" | "red.400" | "red.800" | "red.900" | "slate.50" | "slate.100" | "slate.200" | "slate.300" | "slate.500" | "slate.600" | "slate.700" | "slate.900" | "slate.950" | "yellow.100" | "yellow.200" | "yellow.300" | "yellow.400" | "yellow.800" | "yellow.900" | undefined;
11
+ borderColor?: "transparent" | "brand.50" | "brand.500" | "brand.600" | "neutral.1200/18" | "purple.50" | "red.50" | "red.500" | "red.600" | "blue.50" | "blue.600" | "neutral.1200/4" | "neutral.75" | "neutral.800" | "neutral.900" | "neutral.200" | "neutral.300" | "green.50" | "green.500" | "green.600" | "yellow.50" | "yellow.500" | "yellow.600" | "neutral.500" | "neutral.600" | "neutral.150" | "neutral.100" | "blue.500" | "magenta.600" | "purple.600" | "brand.700" | "white" | "neutral.1200/32" | "red.700" | "purple.500" | "neutral.700" | "green.700" | "yellow.700" | "brand.300" | "neutral.1000" | "purple.900" | "blue.900" | "slate.800" | "green.900" | "gray.800" | "blue.200" | "magenta.200" | "purple.200" | "red.200" | "gray.100" | "slate.400" | "green.200" | "neutral.50/32" | "gray.900" | "bg.brand" | "bg.brand.solid" | "bg.brand.solid.hover" | "bg.disabled" | "bg.discovery" | "bg.error" | "bg.error.solid" | "bg.error.solid.hover" | "bg.information" | "bg.information.solid" | "bg.input.disabled" | "bg.neutral" | "bg.neutral.inverse" | "bg.neutral.inverse.hover" | "bg.neutral.solid" | "bg.neutral.solid.hover" | "bg.success" | "bg.success.solid" | "bg.success.solid.hover" | "bg.warning" | "bg.warning.solid" | "bg.warning.solid.hover" | "border.active" | "border.active.hover" | "border.brand" | "border.default" | "border.disabled" | "border.error" | "border.secondary" | "border.success" | "border.tertiary" | "border.warning" | "fg.accent.blue" | "fg.accent.magenta" | "fg.accent.purple" | "fg.accent.red" | "fg.brand" | "fg.default" | "fg.default.inverse" | "fg.disabled" | "fg.error" | "fg.information" | "fg.link" | "fg.link.hover" | "fg.link.visited" | "fg.secondary" | "fg.success" | "fg.tertiary" | "fg.warning" | "outline.brand" | "overlay" | "surface" | "current" | "black" | "aqua.50" | "aqua.200" | "aqua.500" | "aqua.600" | "brand.100" | "brand.200" | "brand.400" | "brand.800" | "brand.900" | "dark.50" | "dark.200" | "dark.500" | "dark.600" | "gray.50" | "gray.200" | "gray.300" | "gray.400" | "gray.500" | "gray.600" | "gray.700" | "green.100" | "green.300" | "green.400" | "green.800" | "magenta.50" | "magenta.500" | "neutral.50" | "neutral.1100" | "neutral.1200" | "neutral.50/6" | "neutral.1200/12" | "neutral.1200/22" | "orange.50" | "orange.200" | "orange.500" | "orange.600" | "red.100" | "red.300" | "red.400" | "red.800" | "red.900" | "slate.50" | "slate.100" | "slate.200" | "slate.300" | "slate.500" | "slate.600" | "slate.700" | "slate.900" | "slate.950" | "yellow.100" | "yellow.200" | "yellow.300" | "yellow.400" | "yellow.800" | "yellow.900" | undefined;
12
12
  borderLeftWidth?: "2" | "4" | "0" | "1" | undefined;
13
13
  borderRadius?: "sm" | "md" | "lg" | "xs" | "xl" | "full" | "none" | "inherit" | undefined;
14
14
  borderRightWidth?: "2" | "4" | "0" | "1" | undefined;
15
15
  borderTopWidth?: "2" | "4" | "0" | "1" | undefined;
16
16
  boxShadow?: "sm" | "md" | "lg" | "xs" | "xl" | "none" | "inner" | undefined;
17
- color?: "transparent" | "brand.50" | "brand.500" | "brand.600" | "neutral.1200/18" | "purple.50" | "red.50" | "red.500" | "red.600" | "blue.50" | "blue.600" | "neutral.1200/5" | "neutral.75" | "neutral.800" | "neutral.900" | "neutral.200" | "neutral.300" | "green.50" | "green.500" | "green.600" | "yellow.50" | "yellow.500" | "yellow.600" | "neutral.500" | "neutral.600" | "neutral.150" | "neutral.100" | "blue.500" | "magenta.600" | "purple.600" | "brand.700" | "white" | "neutral.1200/32" | "red.700" | "purple.500" | "neutral.700" | "green.700" | "yellow.700" | "brand.300" | "neutral.1000" | "purple.900" | "blue.900" | "slate.800" | "green.900" | "gray.800" | "blue.200" | "magenta.200" | "purple.200" | "red.200" | "gray.100" | "slate.400" | "green.200" | "neutral.50/32" | "gray.900" | "bg.brand" | "bg.brand.solid" | "bg.brand.solid.hover" | "bg.disabled" | "bg.discovery" | "bg.error" | "bg.error.solid" | "bg.error.solid.hover" | "bg.information" | "bg.information.solid" | "bg.input.disabled" | "bg.neutral" | "bg.neutral.inverse" | "bg.neutral.inverse.hover" | "bg.neutral.solid" | "bg.neutral.solid.hover" | "bg.success" | "bg.success.solid" | "bg.success.solid.hover" | "bg.warning" | "bg.warning.solid" | "bg.warning.solid.hover" | "border.active" | "border.active.hover" | "border.brand" | "border.default" | "border.disabled" | "border.error" | "border.secondary" | "border.success" | "border.tertiary" | "border.warning" | "fg.accent.blue" | "fg.accent.magenta" | "fg.accent.purple" | "fg.accent.red" | "fg.brand" | "fg.default" | "fg.default.inverse" | "fg.disabled" | "fg.error" | "fg.information" | "fg.link" | "fg.link.hover" | "fg.link.visited" | "fg.secondary" | "fg.success" | "fg.tertiary" | "fg.warning" | "outline.brand" | "overlay" | "surface" | "current" | "black" | "aqua.50" | "aqua.200" | "aqua.500" | "aqua.600" | "brand.100" | "brand.200" | "brand.400" | "brand.800" | "brand.900" | "dark.50" | "dark.200" | "dark.500" | "dark.600" | "gray.50" | "gray.200" | "gray.300" | "gray.400" | "gray.500" | "gray.600" | "gray.700" | "green.100" | "green.300" | "green.400" | "green.800" | "magenta.50" | "magenta.500" | "neutral.50" | "neutral.1100" | "neutral.1200" | "neutral.1200/12" | "neutral.1200/22" | "orange.50" | "orange.200" | "orange.500" | "orange.600" | "red.100" | "red.300" | "red.400" | "red.800" | "red.900" | "slate.50" | "slate.100" | "slate.200" | "slate.300" | "slate.500" | "slate.600" | "slate.700" | "slate.900" | "slate.950" | "yellow.100" | "yellow.200" | "yellow.300" | "yellow.400" | "yellow.800" | "yellow.900" | undefined;
17
+ color?: "transparent" | "brand.50" | "brand.500" | "brand.600" | "neutral.1200/18" | "purple.50" | "red.50" | "red.500" | "red.600" | "blue.50" | "blue.600" | "neutral.1200/4" | "neutral.75" | "neutral.800" | "neutral.900" | "neutral.200" | "neutral.300" | "green.50" | "green.500" | "green.600" | "yellow.50" | "yellow.500" | "yellow.600" | "neutral.500" | "neutral.600" | "neutral.150" | "neutral.100" | "blue.500" | "magenta.600" | "purple.600" | "brand.700" | "white" | "neutral.1200/32" | "red.700" | "purple.500" | "neutral.700" | "green.700" | "yellow.700" | "brand.300" | "neutral.1000" | "purple.900" | "blue.900" | "slate.800" | "green.900" | "gray.800" | "blue.200" | "magenta.200" | "purple.200" | "red.200" | "gray.100" | "slate.400" | "green.200" | "neutral.50/32" | "gray.900" | "bg.brand" | "bg.brand.solid" | "bg.brand.solid.hover" | "bg.disabled" | "bg.discovery" | "bg.error" | "bg.error.solid" | "bg.error.solid.hover" | "bg.information" | "bg.information.solid" | "bg.input.disabled" | "bg.neutral" | "bg.neutral.inverse" | "bg.neutral.inverse.hover" | "bg.neutral.solid" | "bg.neutral.solid.hover" | "bg.success" | "bg.success.solid" | "bg.success.solid.hover" | "bg.warning" | "bg.warning.solid" | "bg.warning.solid.hover" | "border.active" | "border.active.hover" | "border.brand" | "border.default" | "border.disabled" | "border.error" | "border.secondary" | "border.success" | "border.tertiary" | "border.warning" | "fg.accent.blue" | "fg.accent.magenta" | "fg.accent.purple" | "fg.accent.red" | "fg.brand" | "fg.default" | "fg.default.inverse" | "fg.disabled" | "fg.error" | "fg.information" | "fg.link" | "fg.link.hover" | "fg.link.visited" | "fg.secondary" | "fg.success" | "fg.tertiary" | "fg.warning" | "outline.brand" | "overlay" | "surface" | "current" | "black" | "aqua.50" | "aqua.200" | "aqua.500" | "aqua.600" | "brand.100" | "brand.200" | "brand.400" | "brand.800" | "brand.900" | "dark.50" | "dark.200" | "dark.500" | "dark.600" | "gray.50" | "gray.200" | "gray.300" | "gray.400" | "gray.500" | "gray.600" | "gray.700" | "green.100" | "green.300" | "green.400" | "green.800" | "magenta.50" | "magenta.500" | "neutral.50" | "neutral.1100" | "neutral.1200" | "neutral.50/6" | "neutral.1200/12" | "neutral.1200/22" | "orange.50" | "orange.200" | "orange.500" | "orange.600" | "red.100" | "red.300" | "red.400" | "red.800" | "red.900" | "slate.50" | "slate.100" | "slate.200" | "slate.300" | "slate.500" | "slate.600" | "slate.700" | "slate.900" | "slate.950" | "yellow.100" | "yellow.200" | "yellow.300" | "yellow.400" | "yellow.800" | "yellow.900" | undefined;
18
18
  cursor?: "pointer" | "default" | "text" | undefined;
19
19
  empty?: "hidden" | undefined;
20
20
  fontFamily?: "mono" | "sans" | undefined;
@@ -25,10 +25,10 @@ declare const sprinkles: ((props: {
25
25
  overflowY?: "auto" | "hidden" | "visible" | undefined;
26
26
  textAlign?: "end" | "start" | "center" | "justify" | undefined;
27
27
  textTransform?: "none" | "capitalize" | "uppercase" | undefined;
28
- transition?: "colors" | "all" | "transform" | undefined;
28
+ transition?: "colors" | "opacity" | "transform" | "all" | undefined;
29
29
  whiteSpace?: "nowrap" | undefined;
30
30
  zIndex?: "0" | "10" | "20" | "30" | "40" | "auto" | "50" | "popover" | "toast" | undefined;
31
- bg?: "transparent" | "brand.50" | "brand.500" | "brand.600" | "neutral.1200/18" | "purple.50" | "red.50" | "red.500" | "red.600" | "blue.50" | "blue.600" | "neutral.1200/5" | "neutral.75" | "neutral.800" | "neutral.900" | "neutral.200" | "neutral.300" | "green.50" | "green.500" | "green.600" | "yellow.50" | "yellow.500" | "yellow.600" | "neutral.500" | "neutral.600" | "neutral.150" | "neutral.100" | "blue.500" | "magenta.600" | "purple.600" | "brand.700" | "white" | "neutral.1200/32" | "red.700" | "purple.500" | "neutral.700" | "green.700" | "yellow.700" | "brand.300" | "neutral.1000" | "purple.900" | "blue.900" | "slate.800" | "green.900" | "gray.800" | "blue.200" | "magenta.200" | "purple.200" | "red.200" | "gray.100" | "slate.400" | "green.200" | "neutral.50/32" | "gray.900" | "bg.brand" | "bg.brand.solid" | "bg.brand.solid.hover" | "bg.disabled" | "bg.discovery" | "bg.error" | "bg.error.solid" | "bg.error.solid.hover" | "bg.information" | "bg.information.solid" | "bg.input.disabled" | "bg.neutral" | "bg.neutral.inverse" | "bg.neutral.inverse.hover" | "bg.neutral.solid" | "bg.neutral.solid.hover" | "bg.success" | "bg.success.solid" | "bg.success.solid.hover" | "bg.warning" | "bg.warning.solid" | "bg.warning.solid.hover" | "border.active" | "border.active.hover" | "border.brand" | "border.default" | "border.disabled" | "border.error" | "border.secondary" | "border.success" | "border.tertiary" | "border.warning" | "fg.accent.blue" | "fg.accent.magenta" | "fg.accent.purple" | "fg.accent.red" | "fg.brand" | "fg.default" | "fg.default.inverse" | "fg.disabled" | "fg.error" | "fg.information" | "fg.link" | "fg.link.hover" | "fg.link.visited" | "fg.secondary" | "fg.success" | "fg.tertiary" | "fg.warning" | "outline.brand" | "overlay" | "surface" | "current" | "black" | "aqua.50" | "aqua.200" | "aqua.500" | "aqua.600" | "brand.100" | "brand.200" | "brand.400" | "brand.800" | "brand.900" | "dark.50" | "dark.200" | "dark.500" | "dark.600" | "gray.50" | "gray.200" | "gray.300" | "gray.400" | "gray.500" | "gray.600" | "gray.700" | "green.100" | "green.300" | "green.400" | "green.800" | "magenta.50" | "magenta.500" | "neutral.50" | "neutral.1100" | "neutral.1200" | "neutral.1200/12" | "neutral.1200/22" | "orange.50" | "orange.200" | "orange.500" | "orange.600" | "red.100" | "red.300" | "red.400" | "red.800" | "red.900" | "slate.50" | "slate.100" | "slate.200" | "slate.300" | "slate.500" | "slate.600" | "slate.700" | "slate.900" | "slate.950" | "yellow.100" | "yellow.200" | "yellow.300" | "yellow.400" | "yellow.800" | "yellow.900" | undefined;
31
+ bg?: "transparent" | "brand.50" | "brand.500" | "brand.600" | "neutral.1200/18" | "purple.50" | "red.50" | "red.500" | "red.600" | "blue.50" | "blue.600" | "neutral.1200/4" | "neutral.75" | "neutral.800" | "neutral.900" | "neutral.200" | "neutral.300" | "green.50" | "green.500" | "green.600" | "yellow.50" | "yellow.500" | "yellow.600" | "neutral.500" | "neutral.600" | "neutral.150" | "neutral.100" | "blue.500" | "magenta.600" | "purple.600" | "brand.700" | "white" | "neutral.1200/32" | "red.700" | "purple.500" | "neutral.700" | "green.700" | "yellow.700" | "brand.300" | "neutral.1000" | "purple.900" | "blue.900" | "slate.800" | "green.900" | "gray.800" | "blue.200" | "magenta.200" | "purple.200" | "red.200" | "gray.100" | "slate.400" | "green.200" | "neutral.50/32" | "gray.900" | "bg.brand" | "bg.brand.solid" | "bg.brand.solid.hover" | "bg.disabled" | "bg.discovery" | "bg.error" | "bg.error.solid" | "bg.error.solid.hover" | "bg.information" | "bg.information.solid" | "bg.input.disabled" | "bg.neutral" | "bg.neutral.inverse" | "bg.neutral.inverse.hover" | "bg.neutral.solid" | "bg.neutral.solid.hover" | "bg.success" | "bg.success.solid" | "bg.success.solid.hover" | "bg.warning" | "bg.warning.solid" | "bg.warning.solid.hover" | "border.active" | "border.active.hover" | "border.brand" | "border.default" | "border.disabled" | "border.error" | "border.secondary" | "border.success" | "border.tertiary" | "border.warning" | "fg.accent.blue" | "fg.accent.magenta" | "fg.accent.purple" | "fg.accent.red" | "fg.brand" | "fg.default" | "fg.default.inverse" | "fg.disabled" | "fg.error" | "fg.information" | "fg.link" | "fg.link.hover" | "fg.link.visited" | "fg.secondary" | "fg.success" | "fg.tertiary" | "fg.warning" | "outline.brand" | "overlay" | "surface" | "current" | "black" | "aqua.50" | "aqua.200" | "aqua.500" | "aqua.600" | "brand.100" | "brand.200" | "brand.400" | "brand.800" | "brand.900" | "dark.50" | "dark.200" | "dark.500" | "dark.600" | "gray.50" | "gray.200" | "gray.300" | "gray.400" | "gray.500" | "gray.600" | "gray.700" | "green.100" | "green.300" | "green.400" | "green.800" | "magenta.50" | "magenta.500" | "neutral.50" | "neutral.1100" | "neutral.1200" | "neutral.50/6" | "neutral.1200/12" | "neutral.1200/22" | "orange.50" | "orange.200" | "orange.500" | "orange.600" | "red.100" | "red.300" | "red.400" | "red.800" | "red.900" | "slate.50" | "slate.100" | "slate.200" | "slate.300" | "slate.500" | "slate.600" | "slate.700" | "slate.900" | "slate.950" | "yellow.100" | "yellow.200" | "yellow.300" | "yellow.400" | "yellow.800" | "yellow.900" | undefined;
32
32
  border?: "2" | "4" | "0" | "1" | undefined;
33
33
  borderB?: "2" | "4" | "0" | "1" | undefined;
34
34
  borderL?: "2" | "4" | "0" | "1" | undefined;
@@ -196,18 +196,6 @@ declare const sprinkles: ((props: {
196
196
  readonly md?: "2" | "4" | "6" | "8" | "12" | "0" | "16" | "20" | "24" | "32" | "40" | "48" | "1" | "64" | "80" | "320" | "384" | "56" | "96" | "112" | "128" | "144" | "160" | "176" | "192" | "208" | "224" | "240" | "256" | "288" | "auto" | "sm" | "md" | "lg" | "xs" | "xl" | "full" | "5xl" | "1/2" | "1/3" | "2/3" | "1/4" | "2/4" | "3/4" | "fit" | "max" | "min" | undefined;
197
197
  readonly lg?: "2" | "4" | "6" | "8" | "12" | "0" | "16" | "20" | "24" | "32" | "40" | "48" | "1" | "64" | "80" | "320" | "384" | "56" | "96" | "112" | "128" | "144" | "160" | "176" | "192" | "208" | "224" | "240" | "256" | "288" | "auto" | "sm" | "md" | "lg" | "xs" | "xl" | "full" | "5xl" | "1/2" | "1/3" | "2/3" | "1/4" | "2/4" | "3/4" | "fit" | "max" | "min" | undefined;
198
198
  } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<2 | 3 | 1, "2" | "4" | "6" | "8" | "12" | "0" | "16" | "20" | "24" | "32" | "40" | "48" | "1" | "64" | "80" | "320" | "384" | "56" | "96" | "112" | "128" | "144" | "160" | "176" | "192" | "208" | "224" | "240" | "256" | "288" | "auto" | "sm" | "md" | "lg" | "xs" | "xl" | "full" | "5xl" | "1/2" | "1/3" | "2/3" | "1/4" | "2/4" | "3/4" | "fit" | "max" | "min" | null>;
199
- colSpan?: ("2" | "4" | "1" | "3" | {
200
- readonly base?: "2" | "4" | "1" | "3" | undefined;
201
- readonly sm?: "2" | "4" | "1" | "3" | undefined;
202
- readonly md?: "2" | "4" | "1" | "3" | undefined;
203
- readonly lg?: "2" | "4" | "1" | "3" | undefined;
204
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<2 | 3 | 1, "2" | "4" | "1" | "3" | null>;
205
- cols?: ("2" | "4" | "1" | "3" | {
206
- readonly base?: "2" | "4" | "1" | "3" | undefined;
207
- readonly sm?: "2" | "4" | "1" | "3" | undefined;
208
- readonly md?: "2" | "4" | "1" | "3" | undefined;
209
- readonly lg?: "2" | "4" | "1" | "3" | undefined;
210
- } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<2 | 3 | 1, "2" | "4" | "1" | "3" | null>;
211
199
  h?: ("2" | "4" | "6" | "8" | "12" | "0" | "16" | "20" | "24" | "32" | "40" | "48" | "1" | "64" | "80" | "320" | "384" | "56" | "96" | "112" | "128" | "144" | "160" | "176" | "192" | "208" | "224" | "240" | "256" | "288" | "auto" | "sm" | "md" | "lg" | "xs" | "xl" | "full" | "5xl" | "1/2" | "1/3" | "2/3" | "1/4" | "2/4" | "3/4" | "fit" | "max" | "min" | {
212
200
  readonly base?: "2" | "4" | "6" | "8" | "12" | "0" | "16" | "20" | "24" | "32" | "40" | "48" | "1" | "64" | "80" | "320" | "384" | "56" | "96" | "112" | "128" | "144" | "160" | "176" | "192" | "208" | "224" | "240" | "256" | "288" | "auto" | "sm" | "md" | "lg" | "xs" | "xl" | "full" | "5xl" | "1/2" | "1/3" | "2/3" | "1/4" | "2/4" | "3/4" | "fit" | "max" | "min" | undefined;
213
201
  readonly sm?: "2" | "4" | "6" | "8" | "12" | "0" | "16" | "20" | "24" | "32" | "40" | "48" | "1" | "64" | "80" | "320" | "384" | "56" | "96" | "112" | "128" | "144" | "160" | "176" | "192" | "208" | "224" | "240" | "256" | "288" | "auto" | "sm" | "md" | "lg" | "xs" | "xl" | "full" | "5xl" | "1/2" | "1/3" | "2/3" | "1/4" | "2/4" | "3/4" | "fit" | "max" | "min" | undefined;
@@ -329,7 +317,7 @@ declare const sprinkles: ((props: {
329
317
  readonly lg?: "2" | "4" | "6" | "8" | "12" | "0" | "16" | "20" | "24" | "32" | "40" | "48" | "1" | "64" | "80" | "320" | "384" | "56" | "96" | "112" | "128" | "144" | "160" | "176" | "192" | "208" | "224" | "240" | "256" | "288" | "auto" | "sm" | "md" | "lg" | "xs" | "xl" | "full" | "5xl" | "1/2" | "1/3" | "2/3" | "1/4" | "2/4" | "3/4" | "fit" | "max" | "min" | undefined;
330
318
  } | undefined) | _vanilla_extract_sprinkles.ResponsiveArray<2 | 3 | 1, "2" | "4" | "6" | "8" | "12" | "0" | "16" | "20" | "24" | "32" | "40" | "48" | "1" | "64" | "80" | "320" | "384" | "56" | "96" | "112" | "128" | "144" | "160" | "176" | "192" | "208" | "224" | "240" | "256" | "288" | "auto" | "sm" | "md" | "lg" | "xs" | "xl" | "full" | "5xl" | "1/2" | "1/3" | "2/3" | "1/4" | "2/4" | "3/4" | "fit" | "max" | "min" | null>;
331
319
  }) => string) & {
332
- properties: Set<"borderRadius" | "boxShadow" | "fontFamily" | "fontSize" | "letterSpacing" | "lineHeight" | "size" | "zIndex" | "backgroundColor" | "borderBottomWidth" | "borderColor" | "borderLeftWidth" | "borderRightWidth" | "borderTopWidth" | "color" | "animation" | "cursor" | "empty" | "fontWeight" | "objectFit" | "overflowX" | "overflowY" | "textAlign" | "textTransform" | "transition" | "whiteSpace" | "bg" | "border" | "borderB" | "borderL" | "borderR" | "borderT" | "overflow" | "rounded" | "shadow" | "tracking" | "z" | "gap" | "height" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "width" | "alignItems" | "alignSelf" | "display" | "flex" | "flexDirection" | "flexWrap" | "gridColumn" | "gridTemplateColumns" | "justifyContent" | "justifyItems" | "placeItems" | "colSpan" | "cols" | "h" | "leading" | "m" | "maxH" | "maxW" | "mb" | "ml" | "mr" | "mt" | "mx" | "my" | "p" | "pb" | "pl" | "pr" | "pt" | "px" | "py" | "w">;
320
+ properties: Set<"borderRadius" | "boxShadow" | "fontFamily" | "fontSize" | "letterSpacing" | "lineHeight" | "size" | "zIndex" | "backgroundColor" | "borderBottomWidth" | "borderColor" | "borderLeftWidth" | "borderRightWidth" | "borderTopWidth" | "color" | "animation" | "cursor" | "empty" | "fontWeight" | "objectFit" | "overflowX" | "overflowY" | "textAlign" | "textTransform" | "transition" | "whiteSpace" | "bg" | "border" | "borderB" | "borderL" | "borderR" | "borderT" | "overflow" | "rounded" | "shadow" | "tracking" | "z" | "gap" | "height" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "width" | "alignItems" | "alignSelf" | "display" | "flex" | "flexDirection" | "flexWrap" | "gridColumn" | "gridTemplateColumns" | "justifyContent" | "justifyItems" | "placeItems" | "h" | "leading" | "m" | "maxH" | "maxW" | "mb" | "ml" | "mr" | "mt" | "mx" | "my" | "p" | "pb" | "pl" | "pr" | "pt" | "px" | "py" | "w">;
333
321
  };
334
322
  declare const mapResponsiveValue: <OutputValue extends string | number | boolean | null | undefined, Value extends _vanilla_extract_sprinkles.ConditionalValue<{
335
323
  conditions: {
@@ -341,7 +329,7 @@ declare const mapResponsiveValue: <OutputValue extends string | number | boolean
341
329
  };
342
330
  styles: {};
343
331
  }, string | number | boolean>>(value: Value, fn: (inputValue: Value extends _vanilla_extract_sprinkles.ResponsiveArray<1, string | number | boolean | null> | _vanilla_extract_sprinkles.ResponsiveArray<2 | 1, string | number | boolean | null> | _vanilla_extract_sprinkles.ResponsiveArray<2 | 3 | 1, string | number | boolean | null> | _vanilla_extract_sprinkles.ResponsiveArray<2 | 3 | 1 | 4, string | number | boolean | null> | _vanilla_extract_sprinkles.ResponsiveArray<2 | 3 | 1 | 5 | 4, string | number | boolean | null> | _vanilla_extract_sprinkles.ResponsiveArray<2 | 3 | 1 | 5 | 4 | 6, string | number | boolean | null> | _vanilla_extract_sprinkles.ResponsiveArray<2 | 3 | 1 | 5 | 4 | 6 | 7, string | number | boolean | null> | _vanilla_extract_sprinkles.ResponsiveArray<2 | 3 | 1 | 5 | 4 | 8 | 6 | 7, string | number | boolean | null> ? NonNullable<Value[number]> : Value extends Partial<Record<string, string | number | boolean>> ? NonNullable<Value[keyof Value]> : Value, key: "sm" | "md" | "lg" | "base") => OutputValue) => Value extends string | number | boolean ? OutputValue : Partial<Record<"sm" | "md" | "lg" | "base", OutputValue>>;
344
- type LonghandProps = keyof Pick<Parameters<typeof sprinkles>[0], "backgroundColor" | "borderBottomWidth" | "borderLeftWidth" | "borderRadius" | "borderRightWidth" | "borderTopWidth" | "boxShadow" | "gridColumn" | "gridTemplateColumns" | "height" | "letterSpacing" | "lineHeight" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "width" | "zIndex">;
332
+ type LonghandProps = keyof Pick<Parameters<typeof sprinkles>[0], "backgroundColor" | "borderBottomWidth" | "borderLeftWidth" | "borderRadius" | "borderRightWidth" | "borderTopWidth" | "boxShadow" | "height" | "letterSpacing" | "lineHeight" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "width" | "zIndex">;
345
333
  type Sprinkles = Omit<Parameters<typeof sprinkles>[0], LonghandProps>;
346
334
 
347
335
  type ExtendProps<T1, T2> = Omit<T1, keyof T1 & keyof T2> & T2;
@@ -355,15 +343,25 @@ declare const Box: react.ForwardRefExoticComponent<Omit<Omit<react.DetailedHTMLP
355
343
  className?: string;
356
344
  } & Sprinkles, never> & react.RefAttributes<HTMLDivElement>>;
357
345
 
346
+ declare const Link: react.ForwardRefExoticComponent<Omit<Omit<react.DetailedHTMLProps<react.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, "ref">, "color" | "className"> & Omit<{
347
+ asChild?: boolean;
348
+ className?: string;
349
+ } & Sprinkles, never> & {
350
+ disabled?: boolean;
351
+ external?: boolean;
352
+ } & {
353
+ colorScheme?: "primary" | "secondary" | "neutral" | undefined;
354
+ } & react.RefAttributes<HTMLAnchorElement>>;
355
+
358
356
  type PopoverProps = BoxProps<typeof RadixPopover.Root>;
359
- declare const Popover: {
360
- ({ children, defaultOpen, onOpenChange, open: openProp, ...props }: PopoverProps): react_jsx_runtime.JSX.Element;
361
- displayName: string;
362
- };
357
+ declare function Popover({ children, defaultOpen, onOpenChange, open: openProp, ...props }: PopoverProps): react_jsx_runtime.JSX.Element;
358
+ declare namespace Popover {
359
+ var displayName: string;
360
+ }
363
361
 
364
362
  type PopoverContentProps = BoxProps<typeof RadixPopover.Content, {
365
363
  withArrow?: boolean;
366
364
  }>;
367
365
  declare const PopoverContent: react.ForwardRefExoticComponent<Omit<PopoverContentProps, "ref"> & react.RefAttributes<HTMLDivElement>>;
368
366
 
369
- export { type BoxProps as B, type ExtendProps as E, Popover as P, type Sprinkles as S, Box as a, PopoverContent as b, mapResponsiveValue as m, sprinkles as s };
367
+ export { type BoxProps as B, type ExtendProps as E, Link as L, Popover as P, type Sprinkles as S, Box as a, PopoverContent as b, mapResponsiveValue as m, sprinkles as s };
@@ -1,5 +1,5 @@
1
1
  import './../assets/src/styles/layers.css.ts.vanilla-D5zCXZwe.css';
2
- import './../assets/src/styles/theme.css.ts.vanilla-EbjT5N3_.css';
2
+ import './../assets/src/styles/theme.css.ts.vanilla-BZP-0Wgr.css';
3
3
  import './../assets/src/accordion-trigger/AccordionTrigger.css.ts.vanilla-DWIMlWE2.css';
4
4
  import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
5
5
 
@@ -1,5 +1,5 @@
1
1
  import './../assets/src/styles/layers.css.ts.vanilla-D5zCXZwe.css';
2
- import './../assets/src/styles/theme.css.ts.vanilla-EbjT5N3_.css';
2
+ import './../assets/src/styles/theme.css.ts.vanilla-BZP-0Wgr.css';
3
3
  import './../assets/src/alert/Alert.css.ts.vanilla-SoeL3DzR.css';
4
4
  import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
5
5
 
@@ -1,52 +1,22 @@
1
- import { jsx, jsxs } from 'react/jsx-runtime';
1
+ import { jsx } from 'react/jsx-runtime';
2
2
  import * as RadixAlertDialog from '@radix-ui/react-alert-dialog';
3
- import { forwardRef } from 'react';
4
- import { AnimatePresence } from '../animate-presence/AnimatePresence.js';
5
- import '../animate-presence/PresenceContext.js';
6
- import { Box } from '../box/Box.js';
7
- import { Button } from '../button/Button.js';
8
- import { Flex } from '../flex/Flex.js';
9
- import { Heading } from '../heading/Heading.js';
10
- import { Transition } from '../transition/Transition.js';
11
- import { overlay, content, description, footer } from './AlertDialog-css.js';
3
+ import { useControllableState } from '@radix-ui/react-use-controllable-state';
4
+ import { AlertDialogContextProvider } from '../alert-dialog-context/AlertDialogContext.js';
12
5
 
13
- const AlertDialog = forwardRef(
14
- ({
15
- action,
16
- appearance = "primary",
17
- cancel = "Cancel",
18
- children,
19
- onAction,
20
- onCancel,
21
- open,
22
- size = "sm",
23
- title,
24
- ...props
25
- }, ref) => {
26
- return /* @__PURE__ */ jsx(RadixAlertDialog.Root, { open, children: /* @__PURE__ */ jsx(AnimatePresence, { children: open && /* @__PURE__ */ jsxs(RadixAlertDialog.Portal, { forceMount: true, children: [
27
- /* @__PURE__ */ jsx(Transition, { children: /* @__PURE__ */ jsx(Box, { asChild: true, ...overlay(), children: /* @__PURE__ */ jsx(RadixAlertDialog.Overlay, {}) }) }),
28
- /* @__PURE__ */ jsx(Transition, { "data-side": "bottom", type: "fade", children: /* @__PURE__ */ jsx(Box, { asChild: true, ...content({ size }), children: /* @__PURE__ */ jsxs(RadixAlertDialog.Content, { ref, ...props, children: [
29
- /* @__PURE__ */ jsx(
30
- Heading,
31
- {
32
- asChild: true,
33
- fontWeight: "500",
34
- level: "3",
35
- pb: "16",
36
- pt: "24",
37
- px: "24",
38
- children: /* @__PURE__ */ jsx(RadixAlertDialog.Title, { children: title })
39
- }
40
- ),
41
- /* @__PURE__ */ jsx(Box, { asChild: true, ...description(), children: /* @__PURE__ */ jsx(RadixAlertDialog.Description, { children }) }),
42
- /* @__PURE__ */ jsxs(Flex, { ...footer(), children: [
43
- /* @__PURE__ */ jsx(RadixAlertDialog.Cancel, { asChild: true, children: /* @__PURE__ */ jsx(Button, { appearance: "secondary", onClick: onCancel, children: cancel }) }),
44
- /* @__PURE__ */ jsx(RadixAlertDialog.Action, { asChild: true, children: /* @__PURE__ */ jsx(Button, { appearance, onClick: onAction, children: action }) })
45
- ] })
46
- ] }) }) })
47
- ] }) }) });
48
- }
49
- );
6
+ function AlertDialog({
7
+ children,
8
+ defaultOpen,
9
+ onOpenChange,
10
+ open: openProp,
11
+ ...props
12
+ }) {
13
+ const [open, setOpen] = useControllableState({
14
+ defaultProp: defaultOpen,
15
+ onChange: onOpenChange,
16
+ prop: openProp
17
+ });
18
+ return /* @__PURE__ */ jsx(RadixAlertDialog.Root, { onOpenChange: setOpen, open, ...props, children: /* @__PURE__ */ jsx(AlertDialogContextProvider, { open, children }) });
19
+ }
50
20
  AlertDialog.displayName = "@optiaxiom/react/AlertDialog";
51
21
 
52
22
  export { AlertDialog };
@@ -0,0 +1,14 @@
1
+ import { jsx } from 'react/jsx-runtime';
2
+ import * as RadixAlertDialog from '@radix-ui/react-alert-dialog';
3
+ import { forwardRef } from 'react';
4
+ import { Button } from '../button/Button.js';
5
+ import { extractSprinkles } from '../sprinkles/extractSprinkles.js';
6
+ import '../sprinkles/sprinkles-css.js';
7
+
8
+ const AlertDialogAction = forwardRef(({ asChild, children, ...props }, ref) => {
9
+ const { restProps, sprinkleProps } = extractSprinkles(props);
10
+ return /* @__PURE__ */ jsx(RadixAlertDialog.Action, { asChild: true, ref, ...sprinkleProps, children: asChild ? children : /* @__PURE__ */ jsx(Button, { appearance: "danger", ...restProps, children }) });
11
+ });
12
+ AlertDialogAction.displayName = "@optiaxiom/react/AlertDialogAction";
13
+
14
+ export { AlertDialogAction };
@@ -0,0 +1,14 @@
1
+ import { jsx } from 'react/jsx-runtime';
2
+ import * as RadixAlertDialog from '@radix-ui/react-alert-dialog';
3
+ import { forwardRef } from 'react';
4
+ import { Button } from '../button/Button.js';
5
+ import { extractSprinkles } from '../sprinkles/extractSprinkles.js';
6
+ import '../sprinkles/sprinkles-css.js';
7
+
8
+ const AlertDialogCancel = forwardRef(({ asChild, children = "Cancel", ...props }, ref) => {
9
+ const { restProps, sprinkleProps } = extractSprinkles(props);
10
+ return /* @__PURE__ */ jsx(RadixAlertDialog.Cancel, { asChild: true, ref, ...sprinkleProps, children: asChild ? children : /* @__PURE__ */ jsx(Button, { appearance: "secondary", ...restProps, children }) });
11
+ });
12
+ AlertDialogCancel.displayName = "@optiaxiom/react/AlertDialogCancel";
13
+
14
+ export { AlertDialogCancel };
@@ -0,0 +1,8 @@
1
+ import './../assets/src/styles/layers.css.ts.vanilla-D5zCXZwe.css';
2
+ import './../assets/src/alert-dialog-content/AlertDialogContent.css.ts.vanilla-CLM10r0f.css';
3
+ import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
4
+
5
+ var content = recipeRuntime({base:[{bg:'surface',rounded:'lg',shadow:'md',z:'popover'},'_9uddf50'],variants:{size:{sm:'_9uddf51',md:'_9uddf52',lg:'_9uddf53'}}});
6
+ var overlay = recipeRuntime({base:[{bg:'overlay',z:'popover'},'_9uddf54']});
7
+
8
+ export { content, overlay };
@@ -0,0 +1,20 @@
1
+ import { jsx, jsxs } from 'react/jsx-runtime';
2
+ import * as RadixAlertDialog from '@radix-ui/react-alert-dialog';
3
+ import { forwardRef } from 'react';
4
+ import { useAlertDialogContext, AlertDialogContextProvider } from '../alert-dialog-context/AlertDialogContext.js';
5
+ import { AnimatePresence } from '../animate-presence/AnimatePresence.js';
6
+ import '../animate-presence/PresenceContext.js';
7
+ import { Box } from '../box/Box.js';
8
+ import { Transition } from '../transition/Transition.js';
9
+ import { overlay, content } from './AlertDialogContent-css.js';
10
+
11
+ const AlertDialogContent = forwardRef(({ children, size = "sm", ...props }, ref) => {
12
+ const { open } = useAlertDialogContext("AlertDialogContent");
13
+ return /* @__PURE__ */ jsx(AnimatePresence, { children: open && /* @__PURE__ */ jsxs(RadixAlertDialog.Portal, { forceMount: true, children: [
14
+ /* @__PURE__ */ jsx(Transition, { children: /* @__PURE__ */ jsx(Box, { asChild: true, ...overlay(), children: /* @__PURE__ */ jsx(RadixAlertDialog.Overlay, {}) }) }),
15
+ /* @__PURE__ */ jsx(Transition, { "data-side": "bottom", type: "fade", children: /* @__PURE__ */ jsx(Box, { asChild: true, ...content({ size }), children: /* @__PURE__ */ jsx(RadixAlertDialog.Content, { ref, ...props, children: /* @__PURE__ */ jsx(AlertDialogContextProvider, { open, children }) }) }) })
16
+ ] }) });
17
+ });
18
+ AlertDialogContent.displayName = "@optiaxiom/react/AlertDialogContent";
19
+
20
+ export { AlertDialogContent };
@@ -0,0 +1,5 @@
1
+ import { createContext } from '@radix-ui/react-context';
2
+
3
+ const [AlertDialogContextProvider, useAlertDialogContext] = createContext("AlertDialog");
4
+
5
+ export { AlertDialogContextProvider, useAlertDialogContext };
@@ -0,0 +1,7 @@
1
+ import './../assets/src/styles/layers.css.ts.vanilla-D5zCXZwe.css';
2
+ import './../assets/src/alert-dialog-description/AlertDialogDescription.css.ts.vanilla-B7BawTGq.css';
3
+ import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
4
+
5
+ var body = recipeRuntime({base:[{fontSize:'md',overflow:'auto',px:'24',py:'16'},'_7i0wck0']});
6
+
7
+ export { body };
@@ -0,0 +1,12 @@
1
+ import { jsx } from 'react/jsx-runtime';
2
+ import * as RadixAlertDialog from '@radix-ui/react-alert-dialog';
3
+ import { forwardRef } from 'react';
4
+ import { Box } from '../box/Box.js';
5
+ import { body } from './AlertDialogDescription-css.js';
6
+
7
+ const AlertDialogDescription = forwardRef(({ children, className, ...props }, ref) => {
8
+ return /* @__PURE__ */ jsx(Box, { asChild: true, ...body({}, className), ref, ...props, children: /* @__PURE__ */ jsx(RadixAlertDialog.Description, { children }) });
9
+ });
10
+ AlertDialogDescription.displayName = "@optiaxiom/react/AlertDialogDescription";
11
+
12
+ export { AlertDialogDescription };
@@ -0,0 +1,8 @@
1
+ import './../assets/src/styles/layers.css.ts.vanilla-D5zCXZwe.css';
2
+ import './../assets/src/styles/theme.css.ts.vanilla-BZP-0Wgr.css';
3
+ import './../assets/src/alert-dialog-footer/AlertDialogFooter.css.ts.vanilla-3HiYmspb.css';
4
+ import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
5
+
6
+ var footer = recipeRuntime({base:[{flexDirection:['column-reverse','row'],gap:'md',justifyContent:'end',px:'24',py:'20'},'i5jye80']});
7
+
8
+ export { footer };
@@ -0,0 +1,11 @@
1
+ import { jsx } from 'react/jsx-runtime';
2
+ import { forwardRef } from 'react';
3
+ import { Flex } from '../flex/Flex.js';
4
+ import { footer } from './AlertDialogFooter-css.js';
5
+
6
+ const AlertDialogFooter = forwardRef(({ children, className, ...props }, ref) => {
7
+ return /* @__PURE__ */ jsx(Flex, { ...footer({}, className), ref, ...props, children });
8
+ });
9
+ AlertDialogFooter.displayName = "@optiaxiom/react/AlertDialogFooter";
10
+
11
+ export { AlertDialogFooter };
@@ -0,0 +1,23 @@
1
+ import { jsx } from 'react/jsx-runtime';
2
+ import * as RadixAlertDialog from '@radix-ui/react-alert-dialog';
3
+ import { forwardRef } from 'react';
4
+ import { Heading } from '../heading/Heading.js';
5
+
6
+ const AlertDialogTitle = forwardRef(({ children, ...props }, ref) => {
7
+ return /* @__PURE__ */ jsx(
8
+ Heading,
9
+ {
10
+ asChild: true,
11
+ fontWeight: "500",
12
+ level: "3",
13
+ p: "lg",
14
+ pb: "md",
15
+ ref,
16
+ ...props,
17
+ children: /* @__PURE__ */ jsx(RadixAlertDialog.Title, { children })
18
+ }
19
+ );
20
+ });
21
+ AlertDialogTitle.displayName = "@optiaxiom/react/AlertDialogTitle";
22
+
23
+ export { AlertDialogTitle };
@@ -0,0 +1,14 @@
1
+ import { jsx } from 'react/jsx-runtime';
2
+ import * as RadixAlertDialog from '@radix-ui/react-alert-dialog';
3
+ import { forwardRef } from 'react';
4
+ import { Button } from '../button/Button.js';
5
+ import { extractSprinkles } from '../sprinkles/extractSprinkles.js';
6
+ import '../sprinkles/sprinkles-css.js';
7
+
8
+ const AlertDialogTrigger = forwardRef(({ asChild, children, ...props }, ref) => {
9
+ const { restProps, sprinkleProps } = extractSprinkles(props);
10
+ return /* @__PURE__ */ jsx(RadixAlertDialog.Trigger, { asChild: true, ref, ...sprinkleProps, children: asChild ? children : /* @__PURE__ */ jsx(Button, { ...restProps, children }) });
11
+ });
12
+ AlertDialogTrigger.displayName = "@optiaxiom/react/AlertDialogTrigger";
13
+
14
+ export { AlertDialogTrigger };
@@ -2,9 +2,9 @@ import { jsx } from 'react/jsx-runtime';
2
2
  import { useState, useRef, useCallback, useEffect } from 'react';
3
3
  import { PresenceContext } from './PresenceContext.js';
4
4
 
5
- const AnimatePresence = ({
5
+ function AnimatePresence({
6
6
  children
7
- }) => {
7
+ }) {
8
8
  const [exiting, setExiting] = useState(
9
9
  /* @__PURE__ */ new Map()
10
10
  );
@@ -31,6 +31,7 @@ const AnimatePresence = ({
31
31
  }
32
32
  }, [exiting, isPresent]);
33
33
  return /* @__PURE__ */ jsx(PresenceContext.Provider, { value: { isPresent, onExitComplete, register }, children: children || ([...exiting.values()].some(Boolean) ? lastChildren.current : null) });
34
- };
34
+ }
35
+ AnimatePresence.displayName = "@optiaxiom/react/AnimatePresence";
35
36
 
36
37
  export { AnimatePresence };
@@ -1,29 +1,23 @@
1
1
  @layer optiaxiom._1kfj4ga1;
2
2
  @layer optiaxiom._1kfj4ga1 {
3
- .ot5vc20 {
3
+ ._9uddf50 {
4
4
  left: 50%;
5
5
  max-width: calc(100dvw - 2 * 24px);
6
6
  position: fixed;
7
7
  top: 50%;
8
8
  translate: -50% -50%;
9
9
  }
10
- .ot5vc21 {
10
+ ._9uddf51 {
11
11
  width: 400px;
12
12
  }
13
- .ot5vc22 {
13
+ ._9uddf52 {
14
14
  width: 600px;
15
15
  }
16
- .ot5vc23 {
16
+ ._9uddf53 {
17
17
  width: 800px;
18
18
  }
19
- .ot5vc24 {
19
+ ._9uddf54 {
20
20
  inset: 0;
21
21
  position: fixed;
22
22
  }
23
- .ot5vc25 {
24
- border-top: 1px solid var(--ax-colors-border-secondary);
25
- }
26
- .ot5vc26 {
27
- max-height: 50dvh;
28
- }
29
23
  }
@@ -0,0 +1,6 @@
1
+ @layer optiaxiom._1kfj4ga1;
2
+ @layer optiaxiom._1kfj4ga1 {
3
+ ._7i0wck0 {
4
+ max-height: 50dvh;
5
+ }
6
+ }
@@ -0,0 +1,6 @@
1
+ @layer optiaxiom._1kfj4ga1;
2
+ @layer optiaxiom._1kfj4ga1 {
3
+ .i5jye80 {
4
+ border-top: 1px solid var(--ax-colors-border-secondary);
5
+ }
6
+ }
@@ -29,6 +29,11 @@
29
29
  font-feature-settings: normal;
30
30
  font-size: 1em;
31
31
  }
32
+ ._1jn0ep0:is(table) {
33
+ border-collapse: collapse;
34
+ border-color: inherit;
35
+ text-indent: 0;
36
+ }
32
37
  ._1jn0ep0:is(button, input, optgroup, select, textarea) {
33
38
  color: inherit;
34
39
  font-size: 100%;