@yahoo/uds 3.131.0 → 3.132.1

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 (105) hide show
  1. package/dist/automated-config/dist/utils/getConfigVariantProperties.d.cts +2 -2
  2. package/dist/automated-config/dist/utils/getConfigVariantProperties.d.ts +2 -2
  3. package/dist/components/Banner/Banner.cjs +5 -2
  4. package/dist/components/Banner/Banner.d.cts +9 -0
  5. package/dist/components/Banner/Banner.d.ts +9 -0
  6. package/dist/components/Banner/Banner.js +5 -2
  7. package/dist/components/Divider/Divider.d.cts +2 -2
  8. package/dist/components/Divider/Divider.d.ts +2 -2
  9. package/dist/components/Divider/DividerCore.cjs +17 -10
  10. package/dist/components/Divider/DividerCore.d.cts +10 -4
  11. package/dist/components/Divider/DividerCore.d.ts +10 -4
  12. package/dist/components/Divider/DividerCore.js +17 -10
  13. package/dist/components/Divider/DividerInternal.cjs +15 -11
  14. package/dist/components/Divider/DividerInternal.js +15 -11
  15. package/dist/components/Link.cjs +13 -6
  16. package/dist/components/Link.d.cts +10 -0
  17. package/dist/components/Link.d.ts +10 -0
  18. package/dist/components/Link.js +13 -6
  19. package/dist/components/client/Badge.cjs +10 -4
  20. package/dist/components/client/Badge.d.cts +12 -1
  21. package/dist/components/client/Badge.d.ts +12 -1
  22. package/dist/components/client/Badge.js +10 -4
  23. package/dist/components/client/Button.cjs +20 -9
  24. package/dist/components/client/Button.d.cts +12 -1
  25. package/dist/components/client/Button.d.ts +12 -1
  26. package/dist/components/client/Button.js +20 -9
  27. package/dist/components/client/Checkbox.cjs +14 -6
  28. package/dist/components/client/Checkbox.d.cts +9 -4
  29. package/dist/components/client/Checkbox.d.ts +9 -4
  30. package/dist/components/client/Checkbox.js +14 -6
  31. package/dist/components/client/Chip/Chip.d.cts +1 -1
  32. package/dist/components/client/Chip/Chip.d.ts +1 -1
  33. package/dist/components/client/IconButton.cjs +4 -2
  34. package/dist/components/client/IconButton.d.cts +10 -2
  35. package/dist/components/client/IconButton.d.ts +10 -2
  36. package/dist/components/client/IconButton.js +4 -2
  37. package/dist/components/client/Input/Input.cjs +16 -6
  38. package/dist/components/client/Input/Input.d.cts +3 -0
  39. package/dist/components/client/Input/Input.d.ts +3 -0
  40. package/dist/components/client/Input/Input.js +17 -7
  41. package/dist/components/client/Input/InputHelpTextInternal.cjs +16 -6
  42. package/dist/components/client/Input/InputHelpTextInternal.d.cts +10 -0
  43. package/dist/components/client/Input/InputHelpTextInternal.d.ts +10 -0
  44. package/dist/components/client/Input/InputHelpTextInternal.js +16 -6
  45. package/dist/components/client/Menu/Menu.Content.cjs +2 -1
  46. package/dist/components/client/Menu/Menu.Content.d.cts +7 -0
  47. package/dist/components/client/Menu/Menu.Content.d.ts +7 -0
  48. package/dist/components/client/Menu/Menu.Content.js +2 -1
  49. package/dist/components/client/Menu/Menu.Divider.cjs +8 -10
  50. package/dist/components/client/Menu/Menu.Divider.js +8 -10
  51. package/dist/components/client/Menu/Menu.Item.cjs +23 -14
  52. package/dist/components/client/Menu/Menu.Item.d.cts +11 -0
  53. package/dist/components/client/Menu/Menu.Item.d.ts +11 -0
  54. package/dist/components/client/Menu/Menu.Item.js +24 -15
  55. package/dist/components/client/Menu/Menu.ItemBase.cjs +17 -9
  56. package/dist/components/client/Menu/Menu.ItemBase.d.cts +9 -5
  57. package/dist/components/client/Menu/Menu.ItemBase.d.ts +9 -5
  58. package/dist/components/client/Menu/Menu.ItemBase.js +17 -9
  59. package/dist/components/client/Menu/Menu.ItemCheckbox.cjs +10 -10
  60. package/dist/components/client/Menu/Menu.ItemCheckbox.d.cts +1 -1
  61. package/dist/components/client/Menu/Menu.ItemCheckbox.d.ts +1 -1
  62. package/dist/components/client/Menu/Menu.ItemCheckbox.js +10 -10
  63. package/dist/components/client/Popover/PopoverContent.cjs +4 -1
  64. package/dist/components/client/Popover/PopoverContent.d.cts +3 -0
  65. package/dist/components/client/Popover/PopoverContent.d.ts +3 -0
  66. package/dist/components/client/Popover/PopoverContent.js +4 -1
  67. package/dist/components/client/Popover/UDSPopoverConfigProvider.d.cts +1 -1
  68. package/dist/components/client/Popover/UDSPopoverConfigProvider.d.ts +1 -1
  69. package/dist/components/client/Radio/Radio.cjs +18 -15
  70. package/dist/components/client/Radio/Radio.d.cts +9 -4
  71. package/dist/components/client/Radio/Radio.d.ts +9 -4
  72. package/dist/components/client/Radio/Radio.js +18 -15
  73. package/dist/components/client/Switch.cjs +14 -6
  74. package/dist/components/client/Switch.d.cts +9 -5
  75. package/dist/components/client/Switch.d.ts +9 -5
  76. package/dist/components/client/Switch.js +14 -6
  77. package/dist/components/client/Tabs/Tab.cjs +11 -5
  78. package/dist/components/client/Tabs/Tab.d.cts +14 -3
  79. package/dist/components/client/Tabs/Tab.d.ts +14 -3
  80. package/dist/components/client/Tabs/Tab.js +11 -5
  81. package/dist/components/client/Toast/UDSToastConfigProvider.d.cts +1 -1
  82. package/dist/components/client/Toast/UDSToastConfigProvider.d.ts +1 -1
  83. package/dist/components/client/Tooltip/TooltipContent.cjs +9 -3
  84. package/dist/components/client/Tooltip/TooltipContent.d.cts +14 -2
  85. package/dist/components/client/Tooltip/TooltipContent.d.ts +14 -2
  86. package/dist/components/client/Tooltip/TooltipContent.js +9 -3
  87. package/dist/components/experimental/client/SwitchV2.cjs +14 -6
  88. package/dist/components/experimental/client/SwitchV2.d.cts +9 -5
  89. package/dist/components/experimental/client/SwitchV2.d.ts +9 -5
  90. package/dist/components/experimental/client/SwitchV2.js +14 -6
  91. package/dist/components/index.d.cts +1 -1
  92. package/dist/components/index.d.ts +1 -1
  93. package/dist/index.d.cts +1 -1
  94. package/dist/index.d.ts +1 -1
  95. package/dist/styles/styler.d.cts +65 -65
  96. package/dist/styles/styler.d.ts +65 -65
  97. package/dist/types/dist/index.d.cts +3 -3
  98. package/dist/types/dist/index.d.ts +3 -3
  99. package/dist/uds/generated/componentData.cjs +1485 -1482
  100. package/dist/uds/generated/componentData.js +1485 -1482
  101. package/dist/uds/generated/tailwindPurge.cjs +73 -73
  102. package/dist/uds/generated/tailwindPurge.js +73 -73
  103. package/generated/componentData.json +2039 -2030
  104. package/generated/tailwindPurge.ts +1 -1
  105. package/package.json +1 -1
@@ -34,9 +34,9 @@ declare const useToastConfig: (sizeProp?: ToastSize | undefined, variantProp?: T
34
34
  backgroundColor: {
35
35
  warning: "primary" | "secondary" | "accent" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "always/white" | "always/black" | "always/transparent" | "always/current" | "always/brand" | "always/accent" | "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | "gray-0" | "gray-1" | "gray-2" | "gray-3" | "gray-4" | "gray-5" | "gray-6" | "gray-7" | "gray-8" | "gray-9" | "gray-10" | "gray-11" | "gray-12" | "gray-13" | "gray-14" | "gray-15" | "purple-0" | "purple-1" | "purple-2" | "purple-3" | "purple-4" | "purple-5" | "purple-6" | "purple-7" | "purple-8" | "purple-9" | "purple-10" | "purple-11" | "purple-12" | "purple-13" | "purple-14" | "purple-15" | "indigo-0" | "indigo-1" | "indigo-2" | "indigo-3" | "indigo-4" | "indigo-5" | "indigo-6" | "indigo-7" | "indigo-8" | "indigo-9" | "indigo-10" | "indigo-11" | "indigo-12" | "indigo-13" | "indigo-14" | "indigo-15" | "blue-0" | "blue-1" | "blue-2" | "blue-3" | "blue-4" | "blue-5" | "blue-6" | "blue-7" | "blue-8" | "blue-9" | "blue-10" | "blue-11" | "blue-12" | "blue-13" | "blue-14" | "blue-15" | "cyan-0" | "cyan-1" | "cyan-2" | "cyan-3" | "cyan-4" | "cyan-5" | "cyan-6" | "cyan-7" | "cyan-8" | "cyan-9" | "cyan-10" | "cyan-11" | "cyan-12" | "cyan-13" | "cyan-14" | "cyan-15" | "teal-0" | "teal-1" | "teal-2" | "teal-3" | "teal-4" | "teal-5" | "teal-6" | "teal-7" | "teal-8" | "teal-9" | "teal-10" | "teal-11" | "teal-12" | "teal-13" | "teal-14" | "teal-15" | "mint-0" | "mint-1" | "mint-2" | "mint-3" | "mint-4" | "mint-5" | "mint-6" | "mint-7" | "mint-8" | "mint-9" | "mint-10" | "mint-11" | "mint-12" | "mint-13" | "mint-14" | "mint-15" | "green-0" | "green-1" | "green-2" | "green-3" | "green-4" | "green-5" | "green-6" | "green-7" | "green-8" | "green-9" | "green-10" | "green-11" | "green-12" | "green-13" | "green-14" | "green-15" | "lime-0" | "lime-1" | "lime-2" | "lime-3" | "lime-4" | "lime-5" | "lime-6" | "lime-7" | "lime-8" | "lime-9" | "lime-10" | "lime-11" | "lime-12" | "lime-13" | "lime-14" | "lime-15" | "citron-0" | "citron-1" | "citron-2" | "citron-3" | "citron-4" | "citron-5" | "citron-6" | "citron-7" | "citron-8" | "citron-9" | "citron-10" | "citron-11" | "citron-12" | "citron-13" | "citron-14" | "citron-15" | "yellow-0" | "yellow-1" | "yellow-2" | "yellow-3" | "yellow-4" | "yellow-5" | "yellow-6" | "yellow-7" | "yellow-8" | "yellow-9" | "yellow-10" | "yellow-11" | "yellow-12" | "yellow-13" | "yellow-14" | "yellow-15" | "brown-0" | "brown-1" | "brown-2" | "brown-3" | "brown-4" | "brown-5" | "brown-6" | "brown-7" | "brown-8" | "brown-9" | "brown-10" | "brown-11" | "brown-12" | "brown-13" | "brown-14" | "brown-15" | "nude-0" | "nude-1" | "nude-2" | "nude-3" | "nude-4" | "nude-5" | "nude-6" | "nude-7" | "nude-8" | "nude-9" | "nude-10" | "nude-11" | "nude-12" | "nude-13" | "nude-14" | "nude-15" | "orange-0" | "orange-1" | "orange-2" | "orange-3" | "orange-4" | "orange-5" | "orange-6" | "orange-7" | "orange-8" | "orange-9" | "orange-10" | "orange-11" | "orange-12" | "orange-13" | "orange-14" | "orange-15" | "sunset-0" | "sunset-1" | "sunset-2" | "sunset-3" | "sunset-4" | "sunset-5" | "sunset-6" | "sunset-7" | "sunset-8" | "sunset-9" | "sunset-10" | "sunset-11" | "sunset-12" | "sunset-13" | "sunset-14" | "sunset-15" | "red-0" | "red-1" | "red-2" | "red-3" | "red-4" | "red-5" | "red-6" | "red-7" | "red-8" | "red-9" | "red-10" | "red-11" | "red-12" | "red-13" | "red-14" | "red-15" | "rose-0" | "rose-1" | "rose-2" | "rose-3" | "rose-4" | "rose-5" | "rose-6" | "rose-7" | "rose-8" | "rose-9" | "rose-10" | "rose-11" | "rose-12" | "rose-13" | "rose-14" | "rose-15" | "pink-0" | "pink-1" | "pink-2" | "pink-3" | "pink-4" | "pink-5" | "pink-6" | "pink-7" | "pink-8" | "pink-9" | "pink-10" | "pink-11" | "pink-12" | "pink-13" | "pink-14" | "pink-15" | "magenta-0" | "magenta-1" | "magenta-2" | "magenta-3" | "magenta-4" | "magenta-5" | "magenta-6" | "magenta-7" | "magenta-8" | "magenta-9" | "magenta-10" | "magenta-11" | "magenta-12" | "magenta-13" | "magenta-14" | "magenta-15" | "carbon-0" | "carbon-1" | "carbon-2" | "carbon-3" | "carbon-4" | "carbon-5" | "carbon-6" | "carbon-7" | "carbon-8" | "carbon-9" | "carbon-10" | "carbon-11" | "carbon-12" | "carbon-13" | "carbon-14" | "carbon-15";
36
36
  info: "primary" | "secondary" | "accent" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "always/white" | "always/black" | "always/transparent" | "always/current" | "always/brand" | "always/accent" | "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | "gray-0" | "gray-1" | "gray-2" | "gray-3" | "gray-4" | "gray-5" | "gray-6" | "gray-7" | "gray-8" | "gray-9" | "gray-10" | "gray-11" | "gray-12" | "gray-13" | "gray-14" | "gray-15" | "purple-0" | "purple-1" | "purple-2" | "purple-3" | "purple-4" | "purple-5" | "purple-6" | "purple-7" | "purple-8" | "purple-9" | "purple-10" | "purple-11" | "purple-12" | "purple-13" | "purple-14" | "purple-15" | "indigo-0" | "indigo-1" | "indigo-2" | "indigo-3" | "indigo-4" | "indigo-5" | "indigo-6" | "indigo-7" | "indigo-8" | "indigo-9" | "indigo-10" | "indigo-11" | "indigo-12" | "indigo-13" | "indigo-14" | "indigo-15" | "blue-0" | "blue-1" | "blue-2" | "blue-3" | "blue-4" | "blue-5" | "blue-6" | "blue-7" | "blue-8" | "blue-9" | "blue-10" | "blue-11" | "blue-12" | "blue-13" | "blue-14" | "blue-15" | "cyan-0" | "cyan-1" | "cyan-2" | "cyan-3" | "cyan-4" | "cyan-5" | "cyan-6" | "cyan-7" | "cyan-8" | "cyan-9" | "cyan-10" | "cyan-11" | "cyan-12" | "cyan-13" | "cyan-14" | "cyan-15" | "teal-0" | "teal-1" | "teal-2" | "teal-3" | "teal-4" | "teal-5" | "teal-6" | "teal-7" | "teal-8" | "teal-9" | "teal-10" | "teal-11" | "teal-12" | "teal-13" | "teal-14" | "teal-15" | "mint-0" | "mint-1" | "mint-2" | "mint-3" | "mint-4" | "mint-5" | "mint-6" | "mint-7" | "mint-8" | "mint-9" | "mint-10" | "mint-11" | "mint-12" | "mint-13" | "mint-14" | "mint-15" | "green-0" | "green-1" | "green-2" | "green-3" | "green-4" | "green-5" | "green-6" | "green-7" | "green-8" | "green-9" | "green-10" | "green-11" | "green-12" | "green-13" | "green-14" | "green-15" | "lime-0" | "lime-1" | "lime-2" | "lime-3" | "lime-4" | "lime-5" | "lime-6" | "lime-7" | "lime-8" | "lime-9" | "lime-10" | "lime-11" | "lime-12" | "lime-13" | "lime-14" | "lime-15" | "citron-0" | "citron-1" | "citron-2" | "citron-3" | "citron-4" | "citron-5" | "citron-6" | "citron-7" | "citron-8" | "citron-9" | "citron-10" | "citron-11" | "citron-12" | "citron-13" | "citron-14" | "citron-15" | "yellow-0" | "yellow-1" | "yellow-2" | "yellow-3" | "yellow-4" | "yellow-5" | "yellow-6" | "yellow-7" | "yellow-8" | "yellow-9" | "yellow-10" | "yellow-11" | "yellow-12" | "yellow-13" | "yellow-14" | "yellow-15" | "brown-0" | "brown-1" | "brown-2" | "brown-3" | "brown-4" | "brown-5" | "brown-6" | "brown-7" | "brown-8" | "brown-9" | "brown-10" | "brown-11" | "brown-12" | "brown-13" | "brown-14" | "brown-15" | "nude-0" | "nude-1" | "nude-2" | "nude-3" | "nude-4" | "nude-5" | "nude-6" | "nude-7" | "nude-8" | "nude-9" | "nude-10" | "nude-11" | "nude-12" | "nude-13" | "nude-14" | "nude-15" | "orange-0" | "orange-1" | "orange-2" | "orange-3" | "orange-4" | "orange-5" | "orange-6" | "orange-7" | "orange-8" | "orange-9" | "orange-10" | "orange-11" | "orange-12" | "orange-13" | "orange-14" | "orange-15" | "sunset-0" | "sunset-1" | "sunset-2" | "sunset-3" | "sunset-4" | "sunset-5" | "sunset-6" | "sunset-7" | "sunset-8" | "sunset-9" | "sunset-10" | "sunset-11" | "sunset-12" | "sunset-13" | "sunset-14" | "sunset-15" | "red-0" | "red-1" | "red-2" | "red-3" | "red-4" | "red-5" | "red-6" | "red-7" | "red-8" | "red-9" | "red-10" | "red-11" | "red-12" | "red-13" | "red-14" | "red-15" | "rose-0" | "rose-1" | "rose-2" | "rose-3" | "rose-4" | "rose-5" | "rose-6" | "rose-7" | "rose-8" | "rose-9" | "rose-10" | "rose-11" | "rose-12" | "rose-13" | "rose-14" | "rose-15" | "pink-0" | "pink-1" | "pink-2" | "pink-3" | "pink-4" | "pink-5" | "pink-6" | "pink-7" | "pink-8" | "pink-9" | "pink-10" | "pink-11" | "pink-12" | "pink-13" | "pink-14" | "pink-15" | "magenta-0" | "magenta-1" | "magenta-2" | "magenta-3" | "magenta-4" | "magenta-5" | "magenta-6" | "magenta-7" | "magenta-8" | "magenta-9" | "magenta-10" | "magenta-11" | "magenta-12" | "magenta-13" | "magenta-14" | "magenta-15" | "carbon-0" | "carbon-1" | "carbon-2" | "carbon-3" | "carbon-4" | "carbon-5" | "carbon-6" | "carbon-7" | "carbon-8" | "carbon-9" | "carbon-10" | "carbon-11" | "carbon-12" | "carbon-13" | "carbon-14" | "carbon-15";
37
+ loading: "primary" | "secondary" | "accent" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "always/white" | "always/black" | "always/transparent" | "always/current" | "always/brand" | "always/accent" | "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | "gray-0" | "gray-1" | "gray-2" | "gray-3" | "gray-4" | "gray-5" | "gray-6" | "gray-7" | "gray-8" | "gray-9" | "gray-10" | "gray-11" | "gray-12" | "gray-13" | "gray-14" | "gray-15" | "purple-0" | "purple-1" | "purple-2" | "purple-3" | "purple-4" | "purple-5" | "purple-6" | "purple-7" | "purple-8" | "purple-9" | "purple-10" | "purple-11" | "purple-12" | "purple-13" | "purple-14" | "purple-15" | "indigo-0" | "indigo-1" | "indigo-2" | "indigo-3" | "indigo-4" | "indigo-5" | "indigo-6" | "indigo-7" | "indigo-8" | "indigo-9" | "indigo-10" | "indigo-11" | "indigo-12" | "indigo-13" | "indigo-14" | "indigo-15" | "blue-0" | "blue-1" | "blue-2" | "blue-3" | "blue-4" | "blue-5" | "blue-6" | "blue-7" | "blue-8" | "blue-9" | "blue-10" | "blue-11" | "blue-12" | "blue-13" | "blue-14" | "blue-15" | "cyan-0" | "cyan-1" | "cyan-2" | "cyan-3" | "cyan-4" | "cyan-5" | "cyan-6" | "cyan-7" | "cyan-8" | "cyan-9" | "cyan-10" | "cyan-11" | "cyan-12" | "cyan-13" | "cyan-14" | "cyan-15" | "teal-0" | "teal-1" | "teal-2" | "teal-3" | "teal-4" | "teal-5" | "teal-6" | "teal-7" | "teal-8" | "teal-9" | "teal-10" | "teal-11" | "teal-12" | "teal-13" | "teal-14" | "teal-15" | "mint-0" | "mint-1" | "mint-2" | "mint-3" | "mint-4" | "mint-5" | "mint-6" | "mint-7" | "mint-8" | "mint-9" | "mint-10" | "mint-11" | "mint-12" | "mint-13" | "mint-14" | "mint-15" | "green-0" | "green-1" | "green-2" | "green-3" | "green-4" | "green-5" | "green-6" | "green-7" | "green-8" | "green-9" | "green-10" | "green-11" | "green-12" | "green-13" | "green-14" | "green-15" | "lime-0" | "lime-1" | "lime-2" | "lime-3" | "lime-4" | "lime-5" | "lime-6" | "lime-7" | "lime-8" | "lime-9" | "lime-10" | "lime-11" | "lime-12" | "lime-13" | "lime-14" | "lime-15" | "citron-0" | "citron-1" | "citron-2" | "citron-3" | "citron-4" | "citron-5" | "citron-6" | "citron-7" | "citron-8" | "citron-9" | "citron-10" | "citron-11" | "citron-12" | "citron-13" | "citron-14" | "citron-15" | "yellow-0" | "yellow-1" | "yellow-2" | "yellow-3" | "yellow-4" | "yellow-5" | "yellow-6" | "yellow-7" | "yellow-8" | "yellow-9" | "yellow-10" | "yellow-11" | "yellow-12" | "yellow-13" | "yellow-14" | "yellow-15" | "brown-0" | "brown-1" | "brown-2" | "brown-3" | "brown-4" | "brown-5" | "brown-6" | "brown-7" | "brown-8" | "brown-9" | "brown-10" | "brown-11" | "brown-12" | "brown-13" | "brown-14" | "brown-15" | "nude-0" | "nude-1" | "nude-2" | "nude-3" | "nude-4" | "nude-5" | "nude-6" | "nude-7" | "nude-8" | "nude-9" | "nude-10" | "nude-11" | "nude-12" | "nude-13" | "nude-14" | "nude-15" | "orange-0" | "orange-1" | "orange-2" | "orange-3" | "orange-4" | "orange-5" | "orange-6" | "orange-7" | "orange-8" | "orange-9" | "orange-10" | "orange-11" | "orange-12" | "orange-13" | "orange-14" | "orange-15" | "sunset-0" | "sunset-1" | "sunset-2" | "sunset-3" | "sunset-4" | "sunset-5" | "sunset-6" | "sunset-7" | "sunset-8" | "sunset-9" | "sunset-10" | "sunset-11" | "sunset-12" | "sunset-13" | "sunset-14" | "sunset-15" | "red-0" | "red-1" | "red-2" | "red-3" | "red-4" | "red-5" | "red-6" | "red-7" | "red-8" | "red-9" | "red-10" | "red-11" | "red-12" | "red-13" | "red-14" | "red-15" | "rose-0" | "rose-1" | "rose-2" | "rose-3" | "rose-4" | "rose-5" | "rose-6" | "rose-7" | "rose-8" | "rose-9" | "rose-10" | "rose-11" | "rose-12" | "rose-13" | "rose-14" | "rose-15" | "pink-0" | "pink-1" | "pink-2" | "pink-3" | "pink-4" | "pink-5" | "pink-6" | "pink-7" | "pink-8" | "pink-9" | "pink-10" | "pink-11" | "pink-12" | "pink-13" | "pink-14" | "pink-15" | "magenta-0" | "magenta-1" | "magenta-2" | "magenta-3" | "magenta-4" | "magenta-5" | "magenta-6" | "magenta-7" | "magenta-8" | "magenta-9" | "magenta-10" | "magenta-11" | "magenta-12" | "magenta-13" | "magenta-14" | "magenta-15" | "carbon-0" | "carbon-1" | "carbon-2" | "carbon-3" | "carbon-4" | "carbon-5" | "carbon-6" | "carbon-7" | "carbon-8" | "carbon-9" | "carbon-10" | "carbon-11" | "carbon-12" | "carbon-13" | "carbon-14" | "carbon-15";
37
38
  success: "primary" | "secondary" | "accent" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "always/white" | "always/black" | "always/transparent" | "always/current" | "always/brand" | "always/accent" | "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | "gray-0" | "gray-1" | "gray-2" | "gray-3" | "gray-4" | "gray-5" | "gray-6" | "gray-7" | "gray-8" | "gray-9" | "gray-10" | "gray-11" | "gray-12" | "gray-13" | "gray-14" | "gray-15" | "purple-0" | "purple-1" | "purple-2" | "purple-3" | "purple-4" | "purple-5" | "purple-6" | "purple-7" | "purple-8" | "purple-9" | "purple-10" | "purple-11" | "purple-12" | "purple-13" | "purple-14" | "purple-15" | "indigo-0" | "indigo-1" | "indigo-2" | "indigo-3" | "indigo-4" | "indigo-5" | "indigo-6" | "indigo-7" | "indigo-8" | "indigo-9" | "indigo-10" | "indigo-11" | "indigo-12" | "indigo-13" | "indigo-14" | "indigo-15" | "blue-0" | "blue-1" | "blue-2" | "blue-3" | "blue-4" | "blue-5" | "blue-6" | "blue-7" | "blue-8" | "blue-9" | "blue-10" | "blue-11" | "blue-12" | "blue-13" | "blue-14" | "blue-15" | "cyan-0" | "cyan-1" | "cyan-2" | "cyan-3" | "cyan-4" | "cyan-5" | "cyan-6" | "cyan-7" | "cyan-8" | "cyan-9" | "cyan-10" | "cyan-11" | "cyan-12" | "cyan-13" | "cyan-14" | "cyan-15" | "teal-0" | "teal-1" | "teal-2" | "teal-3" | "teal-4" | "teal-5" | "teal-6" | "teal-7" | "teal-8" | "teal-9" | "teal-10" | "teal-11" | "teal-12" | "teal-13" | "teal-14" | "teal-15" | "mint-0" | "mint-1" | "mint-2" | "mint-3" | "mint-4" | "mint-5" | "mint-6" | "mint-7" | "mint-8" | "mint-9" | "mint-10" | "mint-11" | "mint-12" | "mint-13" | "mint-14" | "mint-15" | "green-0" | "green-1" | "green-2" | "green-3" | "green-4" | "green-5" | "green-6" | "green-7" | "green-8" | "green-9" | "green-10" | "green-11" | "green-12" | "green-13" | "green-14" | "green-15" | "lime-0" | "lime-1" | "lime-2" | "lime-3" | "lime-4" | "lime-5" | "lime-6" | "lime-7" | "lime-8" | "lime-9" | "lime-10" | "lime-11" | "lime-12" | "lime-13" | "lime-14" | "lime-15" | "citron-0" | "citron-1" | "citron-2" | "citron-3" | "citron-4" | "citron-5" | "citron-6" | "citron-7" | "citron-8" | "citron-9" | "citron-10" | "citron-11" | "citron-12" | "citron-13" | "citron-14" | "citron-15" | "yellow-0" | "yellow-1" | "yellow-2" | "yellow-3" | "yellow-4" | "yellow-5" | "yellow-6" | "yellow-7" | "yellow-8" | "yellow-9" | "yellow-10" | "yellow-11" | "yellow-12" | "yellow-13" | "yellow-14" | "yellow-15" | "brown-0" | "brown-1" | "brown-2" | "brown-3" | "brown-4" | "brown-5" | "brown-6" | "brown-7" | "brown-8" | "brown-9" | "brown-10" | "brown-11" | "brown-12" | "brown-13" | "brown-14" | "brown-15" | "nude-0" | "nude-1" | "nude-2" | "nude-3" | "nude-4" | "nude-5" | "nude-6" | "nude-7" | "nude-8" | "nude-9" | "nude-10" | "nude-11" | "nude-12" | "nude-13" | "nude-14" | "nude-15" | "orange-0" | "orange-1" | "orange-2" | "orange-3" | "orange-4" | "orange-5" | "orange-6" | "orange-7" | "orange-8" | "orange-9" | "orange-10" | "orange-11" | "orange-12" | "orange-13" | "orange-14" | "orange-15" | "sunset-0" | "sunset-1" | "sunset-2" | "sunset-3" | "sunset-4" | "sunset-5" | "sunset-6" | "sunset-7" | "sunset-8" | "sunset-9" | "sunset-10" | "sunset-11" | "sunset-12" | "sunset-13" | "sunset-14" | "sunset-15" | "red-0" | "red-1" | "red-2" | "red-3" | "red-4" | "red-5" | "red-6" | "red-7" | "red-8" | "red-9" | "red-10" | "red-11" | "red-12" | "red-13" | "red-14" | "red-15" | "rose-0" | "rose-1" | "rose-2" | "rose-3" | "rose-4" | "rose-5" | "rose-6" | "rose-7" | "rose-8" | "rose-9" | "rose-10" | "rose-11" | "rose-12" | "rose-13" | "rose-14" | "rose-15" | "pink-0" | "pink-1" | "pink-2" | "pink-3" | "pink-4" | "pink-5" | "pink-6" | "pink-7" | "pink-8" | "pink-9" | "pink-10" | "pink-11" | "pink-12" | "pink-13" | "pink-14" | "pink-15" | "magenta-0" | "magenta-1" | "magenta-2" | "magenta-3" | "magenta-4" | "magenta-5" | "magenta-6" | "magenta-7" | "magenta-8" | "magenta-9" | "magenta-10" | "magenta-11" | "magenta-12" | "magenta-13" | "magenta-14" | "magenta-15" | "carbon-0" | "carbon-1" | "carbon-2" | "carbon-3" | "carbon-4" | "carbon-5" | "carbon-6" | "carbon-7" | "carbon-8" | "carbon-9" | "carbon-10" | "carbon-11" | "carbon-12" | "carbon-13" | "carbon-14" | "carbon-15";
38
39
  error: "primary" | "secondary" | "accent" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "always/white" | "always/black" | "always/transparent" | "always/current" | "always/brand" | "always/accent" | "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | "gray-0" | "gray-1" | "gray-2" | "gray-3" | "gray-4" | "gray-5" | "gray-6" | "gray-7" | "gray-8" | "gray-9" | "gray-10" | "gray-11" | "gray-12" | "gray-13" | "gray-14" | "gray-15" | "purple-0" | "purple-1" | "purple-2" | "purple-3" | "purple-4" | "purple-5" | "purple-6" | "purple-7" | "purple-8" | "purple-9" | "purple-10" | "purple-11" | "purple-12" | "purple-13" | "purple-14" | "purple-15" | "indigo-0" | "indigo-1" | "indigo-2" | "indigo-3" | "indigo-4" | "indigo-5" | "indigo-6" | "indigo-7" | "indigo-8" | "indigo-9" | "indigo-10" | "indigo-11" | "indigo-12" | "indigo-13" | "indigo-14" | "indigo-15" | "blue-0" | "blue-1" | "blue-2" | "blue-3" | "blue-4" | "blue-5" | "blue-6" | "blue-7" | "blue-8" | "blue-9" | "blue-10" | "blue-11" | "blue-12" | "blue-13" | "blue-14" | "blue-15" | "cyan-0" | "cyan-1" | "cyan-2" | "cyan-3" | "cyan-4" | "cyan-5" | "cyan-6" | "cyan-7" | "cyan-8" | "cyan-9" | "cyan-10" | "cyan-11" | "cyan-12" | "cyan-13" | "cyan-14" | "cyan-15" | "teal-0" | "teal-1" | "teal-2" | "teal-3" | "teal-4" | "teal-5" | "teal-6" | "teal-7" | "teal-8" | "teal-9" | "teal-10" | "teal-11" | "teal-12" | "teal-13" | "teal-14" | "teal-15" | "mint-0" | "mint-1" | "mint-2" | "mint-3" | "mint-4" | "mint-5" | "mint-6" | "mint-7" | "mint-8" | "mint-9" | "mint-10" | "mint-11" | "mint-12" | "mint-13" | "mint-14" | "mint-15" | "green-0" | "green-1" | "green-2" | "green-3" | "green-4" | "green-5" | "green-6" | "green-7" | "green-8" | "green-9" | "green-10" | "green-11" | "green-12" | "green-13" | "green-14" | "green-15" | "lime-0" | "lime-1" | "lime-2" | "lime-3" | "lime-4" | "lime-5" | "lime-6" | "lime-7" | "lime-8" | "lime-9" | "lime-10" | "lime-11" | "lime-12" | "lime-13" | "lime-14" | "lime-15" | "citron-0" | "citron-1" | "citron-2" | "citron-3" | "citron-4" | "citron-5" | "citron-6" | "citron-7" | "citron-8" | "citron-9" | "citron-10" | "citron-11" | "citron-12" | "citron-13" | "citron-14" | "citron-15" | "yellow-0" | "yellow-1" | "yellow-2" | "yellow-3" | "yellow-4" | "yellow-5" | "yellow-6" | "yellow-7" | "yellow-8" | "yellow-9" | "yellow-10" | "yellow-11" | "yellow-12" | "yellow-13" | "yellow-14" | "yellow-15" | "brown-0" | "brown-1" | "brown-2" | "brown-3" | "brown-4" | "brown-5" | "brown-6" | "brown-7" | "brown-8" | "brown-9" | "brown-10" | "brown-11" | "brown-12" | "brown-13" | "brown-14" | "brown-15" | "nude-0" | "nude-1" | "nude-2" | "nude-3" | "nude-4" | "nude-5" | "nude-6" | "nude-7" | "nude-8" | "nude-9" | "nude-10" | "nude-11" | "nude-12" | "nude-13" | "nude-14" | "nude-15" | "orange-0" | "orange-1" | "orange-2" | "orange-3" | "orange-4" | "orange-5" | "orange-6" | "orange-7" | "orange-8" | "orange-9" | "orange-10" | "orange-11" | "orange-12" | "orange-13" | "orange-14" | "orange-15" | "sunset-0" | "sunset-1" | "sunset-2" | "sunset-3" | "sunset-4" | "sunset-5" | "sunset-6" | "sunset-7" | "sunset-8" | "sunset-9" | "sunset-10" | "sunset-11" | "sunset-12" | "sunset-13" | "sunset-14" | "sunset-15" | "red-0" | "red-1" | "red-2" | "red-3" | "red-4" | "red-5" | "red-6" | "red-7" | "red-8" | "red-9" | "red-10" | "red-11" | "red-12" | "red-13" | "red-14" | "red-15" | "rose-0" | "rose-1" | "rose-2" | "rose-3" | "rose-4" | "rose-5" | "rose-6" | "rose-7" | "rose-8" | "rose-9" | "rose-10" | "rose-11" | "rose-12" | "rose-13" | "rose-14" | "rose-15" | "pink-0" | "pink-1" | "pink-2" | "pink-3" | "pink-4" | "pink-5" | "pink-6" | "pink-7" | "pink-8" | "pink-9" | "pink-10" | "pink-11" | "pink-12" | "pink-13" | "pink-14" | "pink-15" | "magenta-0" | "magenta-1" | "magenta-2" | "magenta-3" | "magenta-4" | "magenta-5" | "magenta-6" | "magenta-7" | "magenta-8" | "magenta-9" | "magenta-10" | "magenta-11" | "magenta-12" | "magenta-13" | "magenta-14" | "magenta-15" | "carbon-0" | "carbon-1" | "carbon-2" | "carbon-3" | "carbon-4" | "carbon-5" | "carbon-6" | "carbon-7" | "carbon-8" | "carbon-9" | "carbon-10" | "carbon-11" | "carbon-12" | "carbon-13" | "carbon-14" | "carbon-15";
39
- loading: "primary" | "secondary" | "accent" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "always/white" | "always/black" | "always/transparent" | "always/current" | "always/brand" | "always/accent" | "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | "gray-0" | "gray-1" | "gray-2" | "gray-3" | "gray-4" | "gray-5" | "gray-6" | "gray-7" | "gray-8" | "gray-9" | "gray-10" | "gray-11" | "gray-12" | "gray-13" | "gray-14" | "gray-15" | "purple-0" | "purple-1" | "purple-2" | "purple-3" | "purple-4" | "purple-5" | "purple-6" | "purple-7" | "purple-8" | "purple-9" | "purple-10" | "purple-11" | "purple-12" | "purple-13" | "purple-14" | "purple-15" | "indigo-0" | "indigo-1" | "indigo-2" | "indigo-3" | "indigo-4" | "indigo-5" | "indigo-6" | "indigo-7" | "indigo-8" | "indigo-9" | "indigo-10" | "indigo-11" | "indigo-12" | "indigo-13" | "indigo-14" | "indigo-15" | "blue-0" | "blue-1" | "blue-2" | "blue-3" | "blue-4" | "blue-5" | "blue-6" | "blue-7" | "blue-8" | "blue-9" | "blue-10" | "blue-11" | "blue-12" | "blue-13" | "blue-14" | "blue-15" | "cyan-0" | "cyan-1" | "cyan-2" | "cyan-3" | "cyan-4" | "cyan-5" | "cyan-6" | "cyan-7" | "cyan-8" | "cyan-9" | "cyan-10" | "cyan-11" | "cyan-12" | "cyan-13" | "cyan-14" | "cyan-15" | "teal-0" | "teal-1" | "teal-2" | "teal-3" | "teal-4" | "teal-5" | "teal-6" | "teal-7" | "teal-8" | "teal-9" | "teal-10" | "teal-11" | "teal-12" | "teal-13" | "teal-14" | "teal-15" | "mint-0" | "mint-1" | "mint-2" | "mint-3" | "mint-4" | "mint-5" | "mint-6" | "mint-7" | "mint-8" | "mint-9" | "mint-10" | "mint-11" | "mint-12" | "mint-13" | "mint-14" | "mint-15" | "green-0" | "green-1" | "green-2" | "green-3" | "green-4" | "green-5" | "green-6" | "green-7" | "green-8" | "green-9" | "green-10" | "green-11" | "green-12" | "green-13" | "green-14" | "green-15" | "lime-0" | "lime-1" | "lime-2" | "lime-3" | "lime-4" | "lime-5" | "lime-6" | "lime-7" | "lime-8" | "lime-9" | "lime-10" | "lime-11" | "lime-12" | "lime-13" | "lime-14" | "lime-15" | "citron-0" | "citron-1" | "citron-2" | "citron-3" | "citron-4" | "citron-5" | "citron-6" | "citron-7" | "citron-8" | "citron-9" | "citron-10" | "citron-11" | "citron-12" | "citron-13" | "citron-14" | "citron-15" | "yellow-0" | "yellow-1" | "yellow-2" | "yellow-3" | "yellow-4" | "yellow-5" | "yellow-6" | "yellow-7" | "yellow-8" | "yellow-9" | "yellow-10" | "yellow-11" | "yellow-12" | "yellow-13" | "yellow-14" | "yellow-15" | "brown-0" | "brown-1" | "brown-2" | "brown-3" | "brown-4" | "brown-5" | "brown-6" | "brown-7" | "brown-8" | "brown-9" | "brown-10" | "brown-11" | "brown-12" | "brown-13" | "brown-14" | "brown-15" | "nude-0" | "nude-1" | "nude-2" | "nude-3" | "nude-4" | "nude-5" | "nude-6" | "nude-7" | "nude-8" | "nude-9" | "nude-10" | "nude-11" | "nude-12" | "nude-13" | "nude-14" | "nude-15" | "orange-0" | "orange-1" | "orange-2" | "orange-3" | "orange-4" | "orange-5" | "orange-6" | "orange-7" | "orange-8" | "orange-9" | "orange-10" | "orange-11" | "orange-12" | "orange-13" | "orange-14" | "orange-15" | "sunset-0" | "sunset-1" | "sunset-2" | "sunset-3" | "sunset-4" | "sunset-5" | "sunset-6" | "sunset-7" | "sunset-8" | "sunset-9" | "sunset-10" | "sunset-11" | "sunset-12" | "sunset-13" | "sunset-14" | "sunset-15" | "red-0" | "red-1" | "red-2" | "red-3" | "red-4" | "red-5" | "red-6" | "red-7" | "red-8" | "red-9" | "red-10" | "red-11" | "red-12" | "red-13" | "red-14" | "red-15" | "rose-0" | "rose-1" | "rose-2" | "rose-3" | "rose-4" | "rose-5" | "rose-6" | "rose-7" | "rose-8" | "rose-9" | "rose-10" | "rose-11" | "rose-12" | "rose-13" | "rose-14" | "rose-15" | "pink-0" | "pink-1" | "pink-2" | "pink-3" | "pink-4" | "pink-5" | "pink-6" | "pink-7" | "pink-8" | "pink-9" | "pink-10" | "pink-11" | "pink-12" | "pink-13" | "pink-14" | "pink-15" | "magenta-0" | "magenta-1" | "magenta-2" | "magenta-3" | "magenta-4" | "magenta-5" | "magenta-6" | "magenta-7" | "magenta-8" | "magenta-9" | "magenta-10" | "magenta-11" | "magenta-12" | "magenta-13" | "magenta-14" | "magenta-15" | "carbon-0" | "carbon-1" | "carbon-2" | "carbon-3" | "carbon-4" | "carbon-5" | "carbon-6" | "carbon-7" | "carbon-8" | "carbon-9" | "carbon-10" | "carbon-11" | "carbon-12" | "carbon-13" | "carbon-14" | "carbon-15";
40
40
  };
41
41
  };
42
42
  //#endregion
@@ -21,7 +21,7 @@ let _ariakit_react = require("@ariakit/react");
21
21
  const ARROW_HEIGHT = 8;
22
22
  const ARROW_WIDTH = 12;
23
23
  const ARROW_TIP_RADIUS_FRACTION = .5;
24
- const TooltipContent = (0, react.forwardRef)(function TooltipContent({ children, maxWidth, startTitleIcon, title, endContent, className, id }, ref) {
24
+ const TooltipContent = (0, react.forwardRef)(function TooltipContent({ children, maxWidth, startTitleIcon, title, endContent, className, id, slotProps }, ref) {
25
25
  const store = (0, _ariakit_react.useTooltipContext)();
26
26
  const open = (0, _ariakit_react.useStoreState)(store, "open");
27
27
  const internalContext = (0, react.useContext)(require_components_client_Tooltip_tooltipContext.TooltipInternalContext);
@@ -71,6 +71,7 @@ const TooltipContent = (0, react.forwardRef)(function TooltipContent({ children,
71
71
  return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_ariakit_react.Tooltip, {
72
72
  ref: mergedRef,
73
73
  className: classNames.root,
74
+ ...slotProps?.root,
74
75
  hideOnHoverOutside: internalContext?.isControlled ? false : void 0,
75
76
  hideOnInteractOutside: internalContext?.isControlled ? false : void 0,
76
77
  portal: internalContext ? internalContext.portal : true,
@@ -96,10 +97,12 @@ const TooltipContent = (0, react.forwardRef)(function TooltipContent({ children,
96
97
  children: [startTitleIcon && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_IconSlot.IconSlot, {
97
98
  iconProps: { variant: "fill" },
98
99
  icon: startTitleIcon,
99
- className: classNames.icon
100
+ className: classNames.icon,
101
+ ...slotProps?.icon
100
102
  }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_Text.Text, {
101
103
  className: classNames.title,
102
104
  color: "inherit",
105
+ ...slotProps?.title,
103
106
  children: title
104
107
  })]
105
108
  }), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_components_Box.Box, {
@@ -108,17 +111,20 @@ const TooltipContent = (0, react.forwardRef)(function TooltipContent({ children,
108
111
  children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_Text.Text, {
109
112
  className: classNames.body,
110
113
  color: "inherit",
114
+ ...slotProps?.body,
111
115
  children
112
116
  }), endContent && !(0, react.isValidElement)(endContent) ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_Text.Text, {
113
117
  className: classNames.endContent,
114
118
  color: "inherit",
119
+ ...slotProps?.endContent,
115
120
  children: endContent
116
121
  }) : endContent]
117
122
  })]
118
123
  })
119
124
  }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ariakit_react.TooltipArrow, {
120
125
  ref: arrowRef,
121
- style: { opacity: 0 }
126
+ style: { opacity: 0 },
127
+ ...slotProps?.arrow
122
128
  })]
123
129
  });
124
130
  });
@@ -1,8 +1,20 @@
1
1
 
2
- import { UniversalTooltipContentProps } from "../../../types/dist/index.cjs";
2
+ import { IconPropsWithSVGProps, UniversalTooltipContentProps } from "../../../types/dist/index.cjs";
3
3
  import * as react from "react";
4
4
 
5
5
  //#region src/components/client/Tooltip/TooltipContent.d.ts
6
- declare const TooltipContent: react.ForwardRefExoticComponent<UniversalTooltipContentProps & react.RefAttributes<HTMLInputElement>>;
6
+ type DataAttributes = {
7
+ [name: `data-${string}`]: string;
8
+ };
9
+ declare const TooltipContent: react.ForwardRefExoticComponent<UniversalTooltipContentProps & {
10
+ slotProps?: {
11
+ root?: Partial<React.HTMLAttributes<HTMLDivElement> & DataAttributes>;
12
+ title?: Partial<Omit<React.HTMLAttributes<HTMLSpanElement>, "color"> & DataAttributes>;
13
+ body?: Partial<Omit<React.HTMLAttributes<HTMLSpanElement>, "color"> & DataAttributes>;
14
+ endContent?: Partial<Omit<React.HTMLAttributes<HTMLSpanElement>, "color"> & DataAttributes>;
15
+ icon?: Partial<IconPropsWithSVGProps & DataAttributes>;
16
+ arrow?: Partial<React.HTMLAttributes<HTMLDivElement> & DataAttributes>;
17
+ };
18
+ } & react.RefAttributes<HTMLInputElement>>;
7
19
  //#endregion
8
20
  export { TooltipContent };
@@ -1,9 +1,21 @@
1
1
 
2
2
  "use client";
3
- import { UniversalTooltipContentProps } from "../../../types/dist/index.js";
3
+ import { IconPropsWithSVGProps, UniversalTooltipContentProps } from "../../../types/dist/index.js";
4
4
  import * as react from "react";
5
5
 
6
6
  //#region src/components/client/Tooltip/TooltipContent.d.ts
7
- declare const TooltipContent: react.ForwardRefExoticComponent<UniversalTooltipContentProps & react.RefAttributes<HTMLInputElement>>;
7
+ type DataAttributes = {
8
+ [name: `data-${string}`]: string;
9
+ };
10
+ declare const TooltipContent: react.ForwardRefExoticComponent<UniversalTooltipContentProps & {
11
+ slotProps?: {
12
+ root?: Partial<React.HTMLAttributes<HTMLDivElement> & DataAttributes>;
13
+ title?: Partial<Omit<React.HTMLAttributes<HTMLSpanElement>, "color"> & DataAttributes>;
14
+ body?: Partial<Omit<React.HTMLAttributes<HTMLSpanElement>, "color"> & DataAttributes>;
15
+ endContent?: Partial<Omit<React.HTMLAttributes<HTMLSpanElement>, "color"> & DataAttributes>;
16
+ icon?: Partial<IconPropsWithSVGProps & DataAttributes>;
17
+ arrow?: Partial<React.HTMLAttributes<HTMLDivElement> & DataAttributes>;
18
+ };
19
+ } & react.RefAttributes<HTMLInputElement>>;
8
20
  //#endregion
9
21
  export { TooltipContent };
@@ -19,7 +19,7 @@ import { Tooltip, TooltipArrow, useStoreState, useTooltipContext } from "@ariaki
19
19
  const ARROW_HEIGHT = 8;
20
20
  const ARROW_WIDTH = 12;
21
21
  const ARROW_TIP_RADIUS_FRACTION = .5;
22
- const TooltipContent = forwardRef(function TooltipContent({ children, maxWidth, startTitleIcon, title, endContent, className, id }, ref) {
22
+ const TooltipContent = forwardRef(function TooltipContent({ children, maxWidth, startTitleIcon, title, endContent, className, id, slotProps }, ref) {
23
23
  const store = useTooltipContext();
24
24
  const open = useStoreState(store, "open");
25
25
  const internalContext = useContext(TooltipInternalContext);
@@ -69,6 +69,7 @@ const TooltipContent = forwardRef(function TooltipContent({ children, maxWidth,
69
69
  return /* @__PURE__ */ jsxs(Tooltip, {
70
70
  ref: mergedRef,
71
71
  className: classNames.root,
72
+ ...slotProps?.root,
72
73
  hideOnHoverOutside: internalContext?.isControlled ? false : void 0,
73
74
  hideOnInteractOutside: internalContext?.isControlled ? false : void 0,
74
75
  portal: internalContext ? internalContext.portal : true,
@@ -94,10 +95,12 @@ const TooltipContent = forwardRef(function TooltipContent({ children, maxWidth,
94
95
  children: [startTitleIcon && /* @__PURE__ */ jsx(IconSlot, {
95
96
  iconProps: { variant: "fill" },
96
97
  icon: startTitleIcon,
97
- className: classNames.icon
98
+ className: classNames.icon,
99
+ ...slotProps?.icon
98
100
  }), /* @__PURE__ */ jsx(Text, {
99
101
  className: classNames.title,
100
102
  color: "inherit",
103
+ ...slotProps?.title,
101
104
  children: title
102
105
  })]
103
106
  }), /* @__PURE__ */ jsxs(Box, {
@@ -106,17 +109,20 @@ const TooltipContent = forwardRef(function TooltipContent({ children, maxWidth,
106
109
  children: [/* @__PURE__ */ jsx(Text, {
107
110
  className: classNames.body,
108
111
  color: "inherit",
112
+ ...slotProps?.body,
109
113
  children
110
114
  }), endContent && !isValidElement(endContent) ? /* @__PURE__ */ jsx(Text, {
111
115
  className: classNames.endContent,
112
116
  color: "inherit",
117
+ ...slotProps?.endContent,
113
118
  children: endContent
114
119
  }) : endContent]
115
120
  })]
116
121
  })
117
122
  }), /* @__PURE__ */ jsx(TooltipArrow, {
118
123
  ref: arrowRef,
119
- style: { opacity: 0 }
124
+ style: { opacity: 0 },
125
+ ...slotProps?.arrow
120
126
  })]
121
127
  });
122
128
  });
@@ -41,9 +41,13 @@ const MotionBox = motion_react_m.create(require_components_Box.Box);
41
41
  *
42
42
  * @related [Checkbox](https://uds.build/docs/components/checkbox).
43
43
  **/
44
- const SwitchV2 = (0, react.forwardRef)(function Switch({ id, isOn: isOnProp, defaultIsOn, onChange, label, labelPosition = "start", size = "md", onIcon, offIcon, reduceMotion: forceReduceMotion, disabled, required, onFocus, onBlur, className, layerClassNames, ...switchProps }, parentRef) {
44
+ const SwitchV2 = (0, react.forwardRef)(function Switch({ id, isOn: isOnProp, defaultIsOn, onChange, label, labelPosition = "start", size = "md", onIcon, offIcon, reduceMotion: forceReduceMotion, disabled, required, onFocus, onBlur, className, slotProps, ...switchProps }, parentRef) {
45
45
  const generatedId = (0, react.useId)();
46
46
  const uid = id ?? `uds-input-${generatedId}`;
47
+ const rootSlotProps = slotProps?.root ?? {};
48
+ const switchSlotProps = slotProps?.switch ?? {};
49
+ const handleSlotProps = slotProps?.handle ?? {};
50
+ const labelSlotProps = slotProps?.label ?? {};
47
51
  const innerRef = (0, react.useRef)(null);
48
52
  /**
49
53
  * State
@@ -76,18 +80,18 @@ const SwitchV2 = (0, react.forwardRef)(function Switch({ id, isOn: isOnProp, def
76
80
  switchSizeRoot: size,
77
81
  switchVariantRoot: "default",
78
82
  switchVariantActiveRoot: isOn ? "on" : "off",
79
- className: require_styles_styler.cx("group", "flex", "items-center", labelPosition === "start" ? "flex-row" : "flex-row-reverse", ...disabled ? ["cursor-default", "opacity-50"] : ["cursor-pointer"], layerClassNames?.root, className)
83
+ className: require_styles_styler.cx("group", "flex", "items-center", labelPosition === "start" ? "flex-row" : "flex-row-reverse", ...disabled ? ["cursor-default", "opacity-50"] : ["cursor-pointer"], className)
80
84
  }),
81
85
  switch: require_styles_styler.getStyles({
82
86
  switchVariantSwitch: "default",
83
87
  switchSizeSwitch: size,
84
88
  switchVariantActiveSwitch: isOn ? "on" : "off",
85
- className: require_styles_styler.cx("uds-ring", "uds-ring-within", "relative", "uds-border-radius-full", "items-center", cssAnimationDuration, "transition-[background-color,box-shadow]", layerClassNames?.switch)
89
+ className: require_styles_styler.cx("uds-ring", "uds-ring-within", "relative", "uds-border-radius-full", "items-center", cssAnimationDuration, "transition-[background-color,box-shadow]")
86
90
  }),
87
91
  handleContainer: require_styles_styler.cx("pointer-events-none", "relative", "w-full", "h-full"),
88
92
  handle: require_styles_styler.getStyles({
89
93
  switchSizeHandle: size,
90
- className: require_styles_styler.cx("absolute", "top-0", "bottom-0", isOn ? "right-0" : "left-0", layerClassNames?.handle)
94
+ className: require_styles_styler.cx("absolute", "top-0", "bottom-0", isOn ? "right-0" : "left-0")
91
95
  }),
92
96
  handleContents: require_styles_styler.cx("relative", "w-full", "h-full", "uds-border-radius-full", "overflow-hidden", !disabled && "group-hover:scale-105", "opacity-95", !disabled && "group-hover:opacity-100", cssAnimationDuration, "transition-[transform,opacity]"),
93
97
  handleCircle: require_styles_styler.getStyles({
@@ -102,7 +106,7 @@ const SwitchV2 = (0, react.forwardRef)(function Switch({ id, isOn: isOnProp, def
102
106
  className: require_styles_styler.cx("absolute", "opacity-0", "top-1/2", "left-1/2", "transform", "translate-x-[-50%]", "translate-y-[-50%]", cssAnimationDuration, "transition-opacity")
103
107
  }),
104
108
  htmlCheckbox: require_styles_styler.cx("cursor-[inherit]", "absolute", "opacity-0", "top-1/2", "left-1/2", "w-[calc(100%+2px)]", "h-[calc(100%+2px)]", "transform", "translate-x-[-50%]", "translate-y-[-50%]"),
105
- label: require_styles_styler.cx(labelPosition === "start" ? "text-start" : "text-end", layerClassNames?.label)
109
+ label: require_styles_styler.cx(labelPosition === "start" ? "text-start" : "text-end")
106
110
  };
107
111
  return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_client_SpringMotionConfig.SpringMotionConfig, {
108
112
  reducedMotion: reduceMotion,
@@ -113,8 +117,10 @@ const SwitchV2 = (0, react.forwardRef)(function Switch({ id, isOn: isOnProp, def
113
117
  className: classNames.root,
114
118
  "data-testid": "switch-root",
115
119
  tabIndex: -1,
120
+ ...rootSlotProps,
116
121
  children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_components_Box.Box, {
117
122
  className: classNames.switch,
123
+ ...switchSlotProps,
118
124
  children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
119
125
  type: "checkbox",
120
126
  ...switchProps,
@@ -139,6 +145,7 @@ const SwitchV2 = (0, react.forwardRef)(function Switch({ id, isOn: isOnProp, def
139
145
  className: classNames.handle,
140
146
  layout: "position",
141
147
  layoutDependency: isOn,
148
+ ...handleSlotProps,
142
149
  children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_components_Box.Box, {
143
150
  className: classNames.handleContents,
144
151
  children: [
@@ -171,7 +178,8 @@ const SwitchV2 = (0, react.forwardRef)(function Switch({ id, isOn: isOnProp, def
171
178
  color: "inherit",
172
179
  required,
173
180
  label,
174
- className: classNames.label
181
+ className: classNames.label,
182
+ ...labelSlotProps
175
183
  })]
176
184
  })
177
185
  });
@@ -5,12 +5,16 @@ import React from "react";
5
5
 
6
6
  //#region src/components/experimental/client/SwitchV2.d.ts
7
7
  type NativeInputProps = Omit<React.InputHTMLAttributes<HTMLInputElement>, 'type' | 'checked' | 'size' | 'height' | 'width' | 'color' | 'defaultChecked' | 'children'>;
8
+ type DataAttributes = {
9
+ [name: `data-${string}`]: string;
10
+ };
8
11
  interface SwitchV2Props extends NativeInputProps, UniversalSwitchProps {
9
- layerClassNames?: {
10
- root?: string;
11
- switch?: string;
12
- handle?: string;
13
- label?: string;
12
+ /** Props to be passed into various slots within the component. */
13
+ slotProps?: {
14
+ root?: DataAttributes;
15
+ switch?: DataAttributes;
16
+ handle?: DataAttributes;
17
+ label?: DataAttributes;
14
18
  };
15
19
  }
16
20
  /**
@@ -6,12 +6,16 @@ import React from "react";
6
6
 
7
7
  //#region src/components/experimental/client/SwitchV2.d.ts
8
8
  type NativeInputProps = Omit<React.InputHTMLAttributes<HTMLInputElement>, 'type' | 'checked' | 'size' | 'height' | 'width' | 'color' | 'defaultChecked' | 'children'>;
9
+ type DataAttributes = {
10
+ [name: `data-${string}`]: string;
11
+ };
9
12
  interface SwitchV2Props extends NativeInputProps, UniversalSwitchProps {
10
- layerClassNames?: {
11
- root?: string;
12
- switch?: string;
13
- handle?: string;
14
- label?: string;
13
+ /** Props to be passed into various slots within the component. */
14
+ slotProps?: {
15
+ root?: DataAttributes;
16
+ switch?: DataAttributes;
17
+ handle?: DataAttributes;
18
+ label?: DataAttributes;
15
19
  };
16
20
  }
17
21
  /**
@@ -37,9 +37,13 @@ const MotionBox = m.create(Box);
37
37
  *
38
38
  * @related [Checkbox](https://uds.build/docs/components/checkbox).
39
39
  **/
40
- const SwitchV2 = forwardRef(function Switch({ id, isOn: isOnProp, defaultIsOn, onChange, label, labelPosition = "start", size = "md", onIcon, offIcon, reduceMotion: forceReduceMotion, disabled, required, onFocus, onBlur, className, layerClassNames, ...switchProps }, parentRef) {
40
+ const SwitchV2 = forwardRef(function Switch({ id, isOn: isOnProp, defaultIsOn, onChange, label, labelPosition = "start", size = "md", onIcon, offIcon, reduceMotion: forceReduceMotion, disabled, required, onFocus, onBlur, className, slotProps, ...switchProps }, parentRef) {
41
41
  const generatedId = useId();
42
42
  const uid = id ?? `uds-input-${generatedId}`;
43
+ const rootSlotProps = slotProps?.root ?? {};
44
+ const switchSlotProps = slotProps?.switch ?? {};
45
+ const handleSlotProps = slotProps?.handle ?? {};
46
+ const labelSlotProps = slotProps?.label ?? {};
43
47
  const innerRef = useRef(null);
44
48
  /**
45
49
  * State
@@ -72,18 +76,18 @@ const SwitchV2 = forwardRef(function Switch({ id, isOn: isOnProp, defaultIsOn, o
72
76
  switchSizeRoot: size,
73
77
  switchVariantRoot: "default",
74
78
  switchVariantActiveRoot: isOn ? "on" : "off",
75
- className: cx("group", "flex", "items-center", labelPosition === "start" ? "flex-row" : "flex-row-reverse", ...disabled ? ["cursor-default", "opacity-50"] : ["cursor-pointer"], layerClassNames?.root, className)
79
+ className: cx("group", "flex", "items-center", labelPosition === "start" ? "flex-row" : "flex-row-reverse", ...disabled ? ["cursor-default", "opacity-50"] : ["cursor-pointer"], className)
76
80
  }),
77
81
  switch: getStyles({
78
82
  switchVariantSwitch: "default",
79
83
  switchSizeSwitch: size,
80
84
  switchVariantActiveSwitch: isOn ? "on" : "off",
81
- className: cx("uds-ring", "uds-ring-within", "relative", "uds-border-radius-full", "items-center", cssAnimationDuration, "transition-[background-color,box-shadow]", layerClassNames?.switch)
85
+ className: cx("uds-ring", "uds-ring-within", "relative", "uds-border-radius-full", "items-center", cssAnimationDuration, "transition-[background-color,box-shadow]")
82
86
  }),
83
87
  handleContainer: cx("pointer-events-none", "relative", "w-full", "h-full"),
84
88
  handle: getStyles({
85
89
  switchSizeHandle: size,
86
- className: cx("absolute", "top-0", "bottom-0", isOn ? "right-0" : "left-0", layerClassNames?.handle)
90
+ className: cx("absolute", "top-0", "bottom-0", isOn ? "right-0" : "left-0")
87
91
  }),
88
92
  handleContents: cx("relative", "w-full", "h-full", "uds-border-radius-full", "overflow-hidden", !disabled && "group-hover:scale-105", "opacity-95", !disabled && "group-hover:opacity-100", cssAnimationDuration, "transition-[transform,opacity]"),
89
93
  handleCircle: getStyles({
@@ -98,7 +102,7 @@ const SwitchV2 = forwardRef(function Switch({ id, isOn: isOnProp, defaultIsOn, o
98
102
  className: cx("absolute", "opacity-0", "top-1/2", "left-1/2", "transform", "translate-x-[-50%]", "translate-y-[-50%]", cssAnimationDuration, "transition-opacity")
99
103
  }),
100
104
  htmlCheckbox: cx("cursor-[inherit]", "absolute", "opacity-0", "top-1/2", "left-1/2", "w-[calc(100%+2px)]", "h-[calc(100%+2px)]", "transform", "translate-x-[-50%]", "translate-y-[-50%]"),
101
- label: cx(labelPosition === "start" ? "text-start" : "text-end", layerClassNames?.label)
105
+ label: cx(labelPosition === "start" ? "text-start" : "text-end")
102
106
  };
103
107
  return /* @__PURE__ */ jsx(SpringMotionConfig, {
104
108
  reducedMotion: reduceMotion,
@@ -109,8 +113,10 @@ const SwitchV2 = forwardRef(function Switch({ id, isOn: isOnProp, defaultIsOn, o
109
113
  className: classNames.root,
110
114
  "data-testid": "switch-root",
111
115
  tabIndex: -1,
116
+ ...rootSlotProps,
112
117
  children: [/* @__PURE__ */ jsxs(Box, {
113
118
  className: classNames.switch,
119
+ ...switchSlotProps,
114
120
  children: [/* @__PURE__ */ jsx("input", {
115
121
  type: "checkbox",
116
122
  ...switchProps,
@@ -135,6 +141,7 @@ const SwitchV2 = forwardRef(function Switch({ id, isOn: isOnProp, defaultIsOn, o
135
141
  className: classNames.handle,
136
142
  layout: "position",
137
143
  layoutDependency: isOn,
144
+ ...handleSlotProps,
138
145
  children: /* @__PURE__ */ jsxs(Box, {
139
146
  className: classNames.handleContents,
140
147
  children: [
@@ -167,7 +174,8 @@ const SwitchV2 = forwardRef(function Switch({ id, isOn: isOnProp, defaultIsOn, o
167
174
  color: "inherit",
168
175
  required,
169
176
  label,
170
- className: classNames.label
177
+ className: classNames.label,
178
+ ...labelSlotProps
171
179
  })]
172
180
  })
173
181
  });
@@ -6,6 +6,7 @@ import { BannerDescription, BannerDescriptionProps } from "./Banner/BannerDescri
6
6
  import { BannerTitle, BannerTitleProps } from "./Banner/BannerTitle.cjs";
7
7
  import "./Banner/index.cjs";
8
8
  import { Box, BoxProps } from "./Box.cjs";
9
+ import { Text, TextProps } from "./Text.cjs";
9
10
  import { Divider, DividerProps } from "./Divider/Divider.cjs";
10
11
  import "./Divider/index.cjs";
11
12
  import { FormLabel, FormLabelProps } from "./FormLabel.cjs";
@@ -14,7 +15,6 @@ import { Icon, IconProps } from "./Icon.cjs";
14
15
  import { Image, ImageProps } from "./Image.cjs";
15
16
  import { Link, LinkProps } from "./Link.cjs";
16
17
  import { Scrim, ScrimProps } from "./Scrim.cjs";
17
- import { Text, TextProps } from "./Text.cjs";
18
18
  import { VStack, VStackProps } from "./VStack.cjs";
19
19
  import { SpringMotionConfig, SpringMotionConfigProps } from "./client/SpringMotionConfig.cjs";
20
20
  import { AvatarIcon, AvatarIconProps } from "./client/Avatar/AvatarIcon.cjs";
@@ -6,6 +6,7 @@ import { BannerDescription, BannerDescriptionProps } from "./Banner/BannerDescri
6
6
  import { BannerTitle, BannerTitleProps } from "./Banner/BannerTitle.js";
7
7
  import "./Banner/index.js";
8
8
  import { Box, BoxProps } from "./Box.js";
9
+ import { Text, TextProps } from "./Text.js";
9
10
  import { Divider, DividerProps } from "./Divider/Divider.js";
10
11
  import "./Divider/index.js";
11
12
  import { FormLabel, FormLabelProps } from "./FormLabel.js";
@@ -14,7 +15,6 @@ import { Icon, IconProps } from "./Icon.js";
14
15
  import { Image, ImageProps } from "./Image.js";
15
16
  import { Link, LinkProps } from "./Link.js";
16
17
  import { Scrim, ScrimProps } from "./Scrim.js";
17
- import { Text, TextProps } from "./Text.js";
18
18
  import { VStack, VStackProps } from "./VStack.js";
19
19
  import { SpringMotionConfig, SpringMotionConfigProps } from "./client/SpringMotionConfig.js";
20
20
  import { AvatarIcon, AvatarIconProps } from "./client/Avatar/AvatarIcon.js";
package/dist/index.d.cts CHANGED
@@ -38,6 +38,7 @@ import { BannerContent, BannerContentProps } from "./components/Banner/BannerCon
38
38
  import { BannerDescription, BannerDescriptionProps } from "./components/Banner/BannerDescription.cjs";
39
39
  import { BannerTitle, BannerTitleProps } from "./components/Banner/BannerTitle.cjs";
40
40
  import { Box, BoxProps } from "./components/Box.cjs";
41
+ import { Text, TextProps } from "./components/Text.cjs";
41
42
  import { Divider, DividerProps } from "./components/Divider/Divider.cjs";
42
43
  import { FormLabel, FormLabelProps } from "./components/FormLabel.cjs";
43
44
  import { HStack, HStackProps } from "./components/HStack.cjs";
@@ -45,7 +46,6 @@ import { Icon, IconProps } from "./components/Icon.cjs";
45
46
  import { Image, ImageProps } from "./components/Image.cjs";
46
47
  import { Link, LinkProps } from "./components/Link.cjs";
47
48
  import { Scrim, ScrimProps } from "./components/Scrim.cjs";
48
- import { Text, TextProps } from "./components/Text.cjs";
49
49
  import { VStack, VStackProps } from "./components/VStack.cjs";
50
50
  import { SpringMotionConfig, SpringMotionConfigProps } from "./components/client/SpringMotionConfig.cjs";
51
51
  import { AvatarIcon, AvatarIconProps } from "./components/client/Avatar/AvatarIcon.cjs";
package/dist/index.d.ts CHANGED
@@ -38,6 +38,7 @@ import { BannerContent, BannerContentProps } from "./components/Banner/BannerCon
38
38
  import { BannerDescription, BannerDescriptionProps } from "./components/Banner/BannerDescription.js";
39
39
  import { BannerTitle, BannerTitleProps } from "./components/Banner/BannerTitle.js";
40
40
  import { Box, BoxProps } from "./components/Box.js";
41
+ import { Text, TextProps } from "./components/Text.js";
41
42
  import { Divider, DividerProps } from "./components/Divider/Divider.js";
42
43
  import { FormLabel, FormLabelProps } from "./components/FormLabel.js";
43
44
  import { HStack, HStackProps } from "./components/HStack.js";
@@ -45,7 +46,6 @@ import { Icon, IconProps } from "./components/Icon.js";
45
46
  import { Image, ImageProps } from "./components/Image.js";
46
47
  import { Link, LinkProps } from "./components/Link.js";
47
48
  import { Scrim, ScrimProps } from "./components/Scrim.js";
48
- import { Text, TextProps } from "./components/Text.js";
49
49
  import { VStack, VStackProps } from "./components/VStack.js";
50
50
  import { SpringMotionConfig, SpringMotionConfigProps } from "./components/client/SpringMotionConfig.js";
51
51
  import { AvatarIcon, AvatarIconProps } from "./components/client/Avatar/AvatarIcon.js";