@yahoo/uds 3.103.0 → 3.104.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (57) hide show
  1. package/dist/automated-config/dist/generated/generatedConfigs.cjs +710 -52
  2. package/dist/automated-config/dist/generated/generatedConfigs.d.cts +4 -4
  3. package/dist/automated-config/dist/generated/generatedConfigs.d.ts +4 -4
  4. package/dist/automated-config/dist/generated/generatedConfigs.js +710 -52
  5. package/dist/automated-config/dist/utils/getConfigVariantProperties.d.cts +2 -2
  6. package/dist/automated-config/dist/utils/getConfigVariantProperties.d.ts +2 -2
  7. package/dist/cli/commands/sync.cjs +1 -1
  8. package/dist/cli/commands/sync.js +1 -1
  9. package/dist/components/client/Menu/Menu.ItemCheckbox.d.cts +1 -1
  10. package/dist/components/client/Menu/Menu.ItemCheckbox.d.ts +1 -1
  11. package/dist/components/experimental/client/Accordion.cjs +32 -21
  12. package/dist/components/experimental/client/Accordion.d.cts +2 -0
  13. package/dist/components/experimental/client/Accordion.d.ts +2 -0
  14. package/dist/components/experimental/client/Accordion.js +32 -21
  15. package/dist/config/dist/index.cjs +19870 -19870
  16. package/dist/config/dist/index.d.cts +6 -1
  17. package/dist/config/dist/index.d.ts +6 -1
  18. package/dist/config/dist/index.js +19870 -19870
  19. package/dist/index.d.cts +3 -3
  20. package/dist/index.d.ts +3 -3
  21. package/dist/palette/dist/index.cjs +0 -390
  22. package/dist/palette/dist/index.d.cts +1 -7
  23. package/dist/palette/dist/index.d.ts +1 -7
  24. package/dist/palette/dist/index.js +1 -389
  25. package/dist/styles/styler.d.cts +45 -45
  26. package/dist/styles/styler.d.ts +45 -45
  27. package/dist/tailwind/dist/tailwind/utils/getFontStyles.d.cts +1 -1
  28. package/dist/tailwind/dist/tailwind/utils/getFontStyles.d.ts +1 -1
  29. package/dist/tailwind/dist/tailwind/utils/getShadowStyles.d.cts +4 -4
  30. package/dist/tailwind/dist/tailwind/utils/getShadowStyles.d.ts +4 -4
  31. package/dist/tokens/configs/palette/index.cjs +0 -2
  32. package/dist/tokens/configs/palette/index.d.cts +2 -2
  33. package/dist/tokens/configs/palette/index.d.ts +2 -2
  34. package/dist/tokens/configs/palette/index.js +2 -2
  35. package/dist/tokens/index.d.cts +3 -4
  36. package/dist/tokens/index.d.ts +3 -4
  37. package/dist/tokens/types.d.cts +3 -3
  38. package/dist/tokens/types.d.ts +3 -3
  39. package/dist/types/dist/index.d.cts +11 -3
  40. package/dist/types/dist/index.d.ts +11 -3
  41. package/dist/uds/generated/tailwindPurge.cjs +3 -1
  42. package/dist/uds/generated/tailwindPurge.js +3 -1
  43. package/dist/uds/package.cjs +1 -1
  44. package/dist/uds/package.js +1 -1
  45. package/package.json +2 -2
  46. package/dist/tokens/configs/colorMode.cjs +0 -19
  47. package/dist/tokens/configs/colorMode.d.cts +0 -8
  48. package/dist/tokens/configs/colorMode.d.ts +0 -8
  49. package/dist/tokens/configs/colorMode.js +0 -18
  50. package/dist/tokens/configs/palette/darkPalette.cjs +0 -5
  51. package/dist/tokens/configs/palette/darkPalette.d.cts +0 -3
  52. package/dist/tokens/configs/palette/darkPalette.d.ts +0 -3
  53. package/dist/tokens/configs/palette/darkPalette.js +0 -4
  54. package/dist/tokens/configs/palette/lightPalette.cjs +0 -5
  55. package/dist/tokens/configs/palette/lightPalette.d.cts +0 -3
  56. package/dist/tokens/configs/palette/lightPalette.d.ts +0 -3
  57. package/dist/tokens/configs/palette/lightPalette.js +0 -4
@@ -11,8 +11,8 @@ import { SelectedConfigurableProperty } from "../properties.cjs";
11
11
  * @returns A Record of layer names to their properties, or null if no properties are found
12
12
  */
13
13
  declare function getConfigVariantProperties(variant?: VariantConfig): {
14
- [x: string]: Readonly<Record<string, SelectedConfigurableProperty<"textTransform" | "fontSize" | "fontWeight" | "lineHeight" | "fontFamily" | "letterSpacing" | "backgroundColor" | "borderWidth" | "strokeWidth" | "borderRadius" | "borderRadiusVar" | "borderColor" | "stroke" | "buttonSize" | "buttonVariant" | "fontVariationSettings" | "gap" | "color" | "opacity" | "fillOpacity" | "iconSize" | "spacing" | "iconVariant" | "spacingHorizontal" | "spacingVertical" | "textVariant" | "textDecorationLine" | "shadow" | "shadowVar" | "insetShadow" | "height" | "width" | "scaleEffect" | "backdropBlur" | "blurBackgroundColor" | "blurBackgroundColorFallback", string, readonly ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases" | "elevationAliases")[] | readonly ("elevationAliases" | "borderWidths" | "spacingAliases")[] | readonly "borderRadii"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "elevationAliases" | "linePaletteColors")[] | readonly "buttonSizes"[] | readonly "buttonVariantsFlat"[] | readonly "textVariants"[] | readonly "spacingAliases"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "foregroundPaletteColors")[] | readonly "opacitySteps"[] | readonly "iconSizes"[] | readonly "iconVariants"[] | readonly "textDecorationLines"[] | readonly ("elevationAliases" | "shadowVariants" | "shadowVariantConfig")[] | readonly ("shadowVariantConfig" | "shadowVariantsWithInvert")[] | readonly "scaleEffects"[] | readonly "positiveIntegers"[], readonly (readonly unknown[])[]>>>;
15
- root: Readonly<Record<string, SelectedConfigurableProperty<"textTransform" | "fontSize" | "fontWeight" | "lineHeight" | "fontFamily" | "letterSpacing" | "backgroundColor" | "borderWidth" | "strokeWidth" | "borderRadius" | "borderRadiusVar" | "borderColor" | "stroke" | "buttonSize" | "buttonVariant" | "fontVariationSettings" | "gap" | "color" | "opacity" | "fillOpacity" | "iconSize" | "spacing" | "iconVariant" | "spacingHorizontal" | "spacingVertical" | "textVariant" | "textDecorationLine" | "shadow" | "shadowVar" | "insetShadow" | "height" | "width" | "scaleEffect" | "backdropBlur" | "blurBackgroundColor" | "blurBackgroundColorFallback", string, readonly ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases" | "elevationAliases")[] | readonly ("elevationAliases" | "borderWidths" | "spacingAliases")[] | readonly "borderRadii"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "elevationAliases" | "linePaletteColors")[] | readonly "buttonSizes"[] | readonly "buttonVariantsFlat"[] | readonly "textVariants"[] | readonly "spacingAliases"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "foregroundPaletteColors")[] | readonly "opacitySteps"[] | readonly "iconSizes"[] | readonly "iconVariants"[] | readonly "textDecorationLines"[] | readonly ("elevationAliases" | "shadowVariants" | "shadowVariantConfig")[] | readonly ("shadowVariantConfig" | "shadowVariantsWithInvert")[] | readonly "scaleEffects"[] | readonly "positiveIntegers"[], readonly (readonly unknown[])[]>>>;
14
+ [x: string]: Readonly<Record<string, SelectedConfigurableProperty<"backgroundColor" | "borderWidth" | "strokeWidth" | "borderRadius" | "borderRadiusVar" | "borderColor" | "stroke" | "buttonSize" | "buttonVariant" | "fontFamily" | "fontSize" | "fontVariationSettings" | "lineHeight" | "textTransform" | "letterSpacing" | "gap" | "color" | "opacity" | "fillOpacity" | "fontWeight" | "iconSize" | "spacing" | "iconVariant" | "spacingHorizontal" | "spacingVertical" | "textVariant" | "textDecorationLine" | "shadow" | "shadowVar" | "insetShadow" | "height" | "width" | "scaleEffect" | "backdropBlur" | "blurBackgroundColor" | "blurBackgroundColorFallback", string, readonly ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases" | "elevationAliases")[] | readonly ("elevationAliases" | "borderWidths" | "spacingAliases")[] | readonly "borderRadii"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "elevationAliases" | "linePaletteColors")[] | readonly "buttonSizes"[] | readonly "buttonVariantsFlat"[] | readonly "textVariants"[] | readonly "spacingAliases"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "foregroundPaletteColors")[] | readonly "opacitySteps"[] | readonly "iconSizes"[] | readonly "iconVariants"[] | readonly "textDecorationLines"[] | readonly ("elevationAliases" | "shadowVariants" | "shadowVariantConfig")[] | readonly ("shadowVariantConfig" | "shadowVariantsWithInvert")[] | readonly "scaleEffects"[] | readonly "positiveIntegers"[], readonly (readonly unknown[])[]>>>;
15
+ root: Readonly<Record<string, SelectedConfigurableProperty<"backgroundColor" | "borderWidth" | "strokeWidth" | "borderRadius" | "borderRadiusVar" | "borderColor" | "stroke" | "buttonSize" | "buttonVariant" | "fontFamily" | "fontSize" | "fontVariationSettings" | "lineHeight" | "textTransform" | "letterSpacing" | "gap" | "color" | "opacity" | "fillOpacity" | "fontWeight" | "iconSize" | "spacing" | "iconVariant" | "spacingHorizontal" | "spacingVertical" | "textVariant" | "textDecorationLine" | "shadow" | "shadowVar" | "insetShadow" | "height" | "width" | "scaleEffect" | "backdropBlur" | "blurBackgroundColor" | "blurBackgroundColorFallback", string, readonly ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases" | "elevationAliases")[] | readonly ("elevationAliases" | "borderWidths" | "spacingAliases")[] | readonly "borderRadii"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "elevationAliases" | "linePaletteColors")[] | readonly "buttonSizes"[] | readonly "buttonVariantsFlat"[] | readonly "textVariants"[] | readonly "spacingAliases"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "foregroundPaletteColors")[] | readonly "opacitySteps"[] | readonly "iconSizes"[] | readonly "iconVariants"[] | readonly "textDecorationLines"[] | readonly ("elevationAliases" | "shadowVariants" | "shadowVariantConfig")[] | readonly ("shadowVariantConfig" | "shadowVariantsWithInvert")[] | readonly "scaleEffects"[] | readonly "positiveIntegers"[], readonly (readonly unknown[])[]>>>;
16
16
  } | null; //#endregion
17
17
  //#endregion
18
18
  export { getConfigVariantProperties };
@@ -11,8 +11,8 @@ import { SelectedConfigurableProperty } from "../properties.js";
11
11
  * @returns A Record of layer names to their properties, or null if no properties are found
12
12
  */
13
13
  declare function getConfigVariantProperties(variant?: VariantConfig): {
14
- [x: string]: Readonly<Record<string, SelectedConfigurableProperty<"textTransform" | "fontSize" | "fontWeight" | "lineHeight" | "fontFamily" | "letterSpacing" | "backgroundColor" | "borderWidth" | "strokeWidth" | "borderRadius" | "borderRadiusVar" | "borderColor" | "stroke" | "buttonSize" | "buttonVariant" | "fontVariationSettings" | "gap" | "color" | "opacity" | "fillOpacity" | "iconSize" | "spacing" | "iconVariant" | "spacingHorizontal" | "spacingVertical" | "textVariant" | "textDecorationLine" | "shadow" | "shadowVar" | "insetShadow" | "height" | "width" | "scaleEffect" | "backdropBlur" | "blurBackgroundColor" | "blurBackgroundColorFallback", string, readonly ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases" | "elevationAliases")[] | readonly ("elevationAliases" | "borderWidths" | "spacingAliases")[] | readonly "borderRadii"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "elevationAliases" | "linePaletteColors")[] | readonly "buttonSizes"[] | readonly "buttonVariantsFlat"[] | readonly "textVariants"[] | readonly "spacingAliases"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "foregroundPaletteColors")[] | readonly "opacitySteps"[] | readonly "iconSizes"[] | readonly "iconVariants"[] | readonly "textDecorationLines"[] | readonly ("elevationAliases" | "shadowVariants" | "shadowVariantConfig")[] | readonly ("shadowVariantConfig" | "shadowVariantsWithInvert")[] | readonly "scaleEffects"[] | readonly "positiveIntegers"[], readonly (readonly unknown[])[]>>>;
15
- root: Readonly<Record<string, SelectedConfigurableProperty<"textTransform" | "fontSize" | "fontWeight" | "lineHeight" | "fontFamily" | "letterSpacing" | "backgroundColor" | "borderWidth" | "strokeWidth" | "borderRadius" | "borderRadiusVar" | "borderColor" | "stroke" | "buttonSize" | "buttonVariant" | "fontVariationSettings" | "gap" | "color" | "opacity" | "fillOpacity" | "iconSize" | "spacing" | "iconVariant" | "spacingHorizontal" | "spacingVertical" | "textVariant" | "textDecorationLine" | "shadow" | "shadowVar" | "insetShadow" | "height" | "width" | "scaleEffect" | "backdropBlur" | "blurBackgroundColor" | "blurBackgroundColorFallback", string, readonly ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases" | "elevationAliases")[] | readonly ("elevationAliases" | "borderWidths" | "spacingAliases")[] | readonly "borderRadii"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "elevationAliases" | "linePaletteColors")[] | readonly "buttonSizes"[] | readonly "buttonVariantsFlat"[] | readonly "textVariants"[] | readonly "spacingAliases"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "foregroundPaletteColors")[] | readonly "opacitySteps"[] | readonly "iconSizes"[] | readonly "iconVariants"[] | readonly "textDecorationLines"[] | readonly ("elevationAliases" | "shadowVariants" | "shadowVariantConfig")[] | readonly ("shadowVariantConfig" | "shadowVariantsWithInvert")[] | readonly "scaleEffects"[] | readonly "positiveIntegers"[], readonly (readonly unknown[])[]>>>;
14
+ [x: string]: Readonly<Record<string, SelectedConfigurableProperty<"backgroundColor" | "borderWidth" | "strokeWidth" | "borderRadius" | "borderRadiusVar" | "borderColor" | "stroke" | "buttonSize" | "buttonVariant" | "fontFamily" | "fontSize" | "fontVariationSettings" | "lineHeight" | "textTransform" | "letterSpacing" | "gap" | "color" | "opacity" | "fillOpacity" | "fontWeight" | "iconSize" | "spacing" | "iconVariant" | "spacingHorizontal" | "spacingVertical" | "textVariant" | "textDecorationLine" | "shadow" | "shadowVar" | "insetShadow" | "height" | "width" | "scaleEffect" | "backdropBlur" | "blurBackgroundColor" | "blurBackgroundColorFallback", string, readonly ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases" | "elevationAliases")[] | readonly ("elevationAliases" | "borderWidths" | "spacingAliases")[] | readonly "borderRadii"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "elevationAliases" | "linePaletteColors")[] | readonly "buttonSizes"[] | readonly "buttonVariantsFlat"[] | readonly "textVariants"[] | readonly "spacingAliases"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "foregroundPaletteColors")[] | readonly "opacitySteps"[] | readonly "iconSizes"[] | readonly "iconVariants"[] | readonly "textDecorationLines"[] | readonly ("elevationAliases" | "shadowVariants" | "shadowVariantConfig")[] | readonly ("shadowVariantConfig" | "shadowVariantsWithInvert")[] | readonly "scaleEffects"[] | readonly "positiveIntegers"[], readonly (readonly unknown[])[]>>>;
15
+ root: Readonly<Record<string, SelectedConfigurableProperty<"backgroundColor" | "borderWidth" | "strokeWidth" | "borderRadius" | "borderRadiusVar" | "borderColor" | "stroke" | "buttonSize" | "buttonVariant" | "fontFamily" | "fontSize" | "fontVariationSettings" | "lineHeight" | "textTransform" | "letterSpacing" | "gap" | "color" | "opacity" | "fillOpacity" | "fontWeight" | "iconSize" | "spacing" | "iconVariant" | "spacingHorizontal" | "spacingVertical" | "textVariant" | "textDecorationLine" | "shadow" | "shadowVar" | "insetShadow" | "height" | "width" | "scaleEffect" | "backdropBlur" | "blurBackgroundColor" | "blurBackgroundColorFallback", string, readonly ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases" | "elevationAliases")[] | readonly ("elevationAliases" | "borderWidths" | "spacingAliases")[] | readonly "borderRadii"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "elevationAliases" | "linePaletteColors")[] | readonly "buttonSizes"[] | readonly "buttonVariantsFlat"[] | readonly "textVariants"[] | readonly "spacingAliases"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "foregroundPaletteColors")[] | readonly "opacitySteps"[] | readonly "iconSizes"[] | readonly "iconVariants"[] | readonly "textDecorationLines"[] | readonly ("elevationAliases" | "shadowVariants" | "shadowVariantConfig")[] | readonly ("shadowVariantConfig" | "shadowVariantsWithInvert")[] | readonly "scaleEffects"[] | readonly "positiveIntegers"[], readonly (readonly unknown[])[]>>>;
16
16
  } | null; //#endregion
17
17
  //#endregion
18
18
  export { getConfigVariantProperties };
@@ -57,7 +57,7 @@ const syncCommand = {
57
57
  if (!config) throw new Error("Config JSON could not be parsed.");
58
58
  const sortedConfig = require_cli_commands_utils_sortKeys.sortKeys(config);
59
59
  const importsTS = [`import type { UniversalTokensConfig } from '@yahoo/uds';`];
60
- const exportsTS = [`export const config: UniversalTokensConfig = ${JSON.stringify(sortedConfig, null, 2)};`];
60
+ const exportsTS = [`export const config: UniversalTokensConfig = ${JSON.stringify(sortedConfig, null, 2)} as UniversalTokensConfig;`];
61
61
  const exportsJS = [`export const config = ${JSON.stringify(sortedConfig, null, 2)};`];
62
62
  const runtimeConfigs = {
63
63
  breakpoints: [require_runtime_breakpointsConfig.configToBreakpointsConfigContext(sortedConfig), "UDSBreakpointsConfigContextType"],
@@ -54,7 +54,7 @@ const syncCommand = {
54
54
  if (!config) throw new Error("Config JSON could not be parsed.");
55
55
  const sortedConfig = sortKeys(config);
56
56
  const importsTS = [`import type { UniversalTokensConfig } from '@yahoo/uds';`];
57
- const exportsTS = [`export const config: UniversalTokensConfig = ${JSON.stringify(sortedConfig, null, 2)};`];
57
+ const exportsTS = [`export const config: UniversalTokensConfig = ${JSON.stringify(sortedConfig, null, 2)} as UniversalTokensConfig;`];
58
58
  const exportsJS = [`export const config = ${JSON.stringify(sortedConfig, null, 2)};`];
59
59
  const runtimeConfigs = {
60
60
  breakpoints: [configToBreakpointsConfigContext(sortedConfig), "UDSBreakpointsConfigContextType"],
@@ -88,6 +88,6 @@ interface MenuItemCheckboxProps extends Omit<PressableProps, 'asChild'>, HtmlBut
88
88
  *
89
89
  * @related [Menu](https://uds.build/docs/components/menu), [Menu.Item](https://uds.build/docs/components/menu-item)
90
90
  **/
91
- declare const MenuItemCheckbox: react.ForwardRefExoticComponent<Omit<MenuItemCheckboxProps, "rootProps" | "hideEndIcon" | "active"> & react.RefAttributes<HTMLDivElement>>;
91
+ declare const MenuItemCheckbox: react.ForwardRefExoticComponent<Omit<MenuItemCheckboxProps, "active" | "hideEndIcon" | "rootProps"> & react.RefAttributes<HTMLDivElement>>;
92
92
  //#endregion
93
93
  export { MenuItemCheckbox, type MenuItemCheckboxProps };
@@ -88,6 +88,6 @@ interface MenuItemCheckboxProps extends Omit<PressableProps, 'asChild'>, HtmlBut
88
88
  *
89
89
  * @related [Menu](https://uds.build/docs/components/menu), [Menu.Item](https://uds.build/docs/components/menu-item)
90
90
  **/
91
- declare const MenuItemCheckbox: react.ForwardRefExoticComponent<Omit<MenuItemCheckboxProps, "rootProps" | "hideEndIcon" | "active"> & react.RefAttributes<HTMLDivElement>>;
91
+ declare const MenuItemCheckbox: react.ForwardRefExoticComponent<Omit<MenuItemCheckboxProps, "active" | "hideEndIcon" | "rootProps"> & react.RefAttributes<HTMLDivElement>>;
92
92
  //#endregion
93
93
  export { MenuItemCheckbox, type MenuItemCheckboxProps };
@@ -3,6 +3,7 @@
3
3
  Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
4
4
  const require_runtime = require('../../../_virtual/_rolldown/runtime.cjs');
5
5
  const require_styles_styler = require('../../../styles/styler.cjs');
6
+ const require_components_HStack = require('../../HStack.cjs');
6
7
  const require_components_Text = require('../../Text.cjs');
7
8
  const require_components_VStack = require('../../VStack.cjs');
8
9
  const require_components_Icon = require('../../Icon.cjs');
@@ -13,11 +14,12 @@ let _yahoo_uds_icons = require("@yahoo/uds-icons");
13
14
  let motion_react = require("motion/react");
14
15
 
15
16
  //#region src/components/experimental/client/Accordion.tsx
16
- function Accordion({ label, children, onClick, open, spacingHorizontal = "4", spacingVertical = "4", _content, className, textProps, ...props }) {
17
+ function Accordion({ label, children, onClick, open, spacingHorizontal = "4", spacingVertical = "4", _content, className, textProps, endAction = null, ...props }) {
17
18
  return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_components_client_SpringMotionConfig.SpringMotionConfig, {
18
19
  layoutVariant: "smooth",
19
20
  layoutSpeed: "3",
20
- children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_components_client_Pressable.Pressable, {
21
+ children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_client_Pressable.Pressable, {
22
+ asChild: true,
21
23
  display: "flex",
22
24
  flexDirection: "row",
23
25
  alignItems: "center",
@@ -28,30 +30,39 @@ function Accordion({ label, children, onClick, open, spacingHorizontal = "4", sp
28
30
  onClick,
29
31
  className: require_styles_styler.cx("hover:bg-secondary/80", "w-full", className),
30
32
  ...props,
31
- children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_Text.Text, {
33
+ children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_Text.Text, {
32
34
  variant: "title4",
33
35
  color: "primary",
34
36
  ...textProps || {},
35
37
  children: label
36
- }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(motion_react.AnimatePresence, {
37
- initial: false,
38
- children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(motion_react.m.div, {
39
- initial: "collapsed",
40
- animate: open ? "open" : "collapsed",
41
- exit: "collapsed",
42
- variants: {
43
- open: { rotate: 90 },
44
- collapsed: { rotate: 0 }
45
- },
46
- "data-testid": "chevron-motion",
47
- children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_Icon.Icon, {
48
- name: _yahoo_uds_icons.ChevronRight,
49
- variant: "fill",
50
- size: "sm",
51
- color: "primary"
52
- })
38
+ }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_HStack.HStack, {
39
+ display: "flex",
40
+ alignItems: "center",
41
+ justifyContent: "space-between",
42
+ columnGap: "2.5",
43
+ children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(motion_react.AnimatePresence, {
44
+ initial: false,
45
+ children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(motion_react.m.div, {
46
+ initial: "collapsed",
47
+ animate: open ? "open" : "collapsed",
48
+ exit: "collapsed",
49
+ variants: {
50
+ open: { rotate: 90 },
51
+ collapsed: { rotate: 0 }
52
+ },
53
+ "data-testid": "chevron-motion",
54
+ children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_Icon.Icon, {
55
+ name: _yahoo_uds_icons.ChevronRight,
56
+ variant: "fill",
57
+ size: "sm",
58
+ color: "primary"
59
+ })
60
+ }, "chevron"), endAction && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(motion_react.m.div, {
61
+ onClick: (e) => e.stopPropagation(),
62
+ children: endAction
63
+ })]
53
64
  })
54
- })]
65
+ })] })
55
66
  }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(motion_react.AnimatePresence, {
56
67
  initial: false,
57
68
  children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(motion_react.m.div, {
@@ -12,6 +12,7 @@ interface AccordionProps extends PressableProps {
12
12
  onClick?: () => void;
13
13
  _content?: VStackProps;
14
14
  textProps?: TextProps;
15
+ endAction?: React.ReactNode;
15
16
  }
16
17
  declare function Accordion({
17
18
  label,
@@ -23,6 +24,7 @@ declare function Accordion({
23
24
  _content,
24
25
  className,
25
26
  textProps,
27
+ endAction,
26
28
  ...props
27
29
  }: AccordionProps): react_jsx_runtime0.JSX.Element;
28
30
  declare namespace Accordion {
@@ -12,6 +12,7 @@ interface AccordionProps extends PressableProps {
12
12
  onClick?: () => void;
13
13
  _content?: VStackProps;
14
14
  textProps?: TextProps;
15
+ endAction?: React.ReactNode;
15
16
  }
16
17
  declare function Accordion({
17
18
  label,
@@ -23,6 +24,7 @@ declare function Accordion({
23
24
  _content,
24
25
  className,
25
26
  textProps,
27
+ endAction,
26
28
  ...props
27
29
  }: AccordionProps): react_jsx_runtime0.JSX.Element;
28
30
  declare namespace Accordion {
@@ -1,6 +1,7 @@
1
1
  "use client";
2
2
  /*! © 2026 Yahoo, Inc. UDS v0.0.0-development */
3
3
  import { cx } from "../../../styles/styler.js";
4
+ import { HStack } from "../../HStack.js";
4
5
  import { Text } from "../../Text.js";
5
6
  import { VStack } from "../../VStack.js";
6
7
  import { Icon } from "../../Icon.js";
@@ -11,11 +12,12 @@ import { ChevronRight } from "@yahoo/uds-icons";
11
12
  import { AnimatePresence, m } from "motion/react";
12
13
 
13
14
  //#region src/components/experimental/client/Accordion.tsx
14
- function Accordion({ label, children, onClick, open, spacingHorizontal = "4", spacingVertical = "4", _content, className, textProps, ...props }) {
15
+ function Accordion({ label, children, onClick, open, spacingHorizontal = "4", spacingVertical = "4", _content, className, textProps, endAction = null, ...props }) {
15
16
  return /* @__PURE__ */ jsxs(SpringMotionConfig, {
16
17
  layoutVariant: "smooth",
17
18
  layoutSpeed: "3",
18
- children: [/* @__PURE__ */ jsxs(Pressable, {
19
+ children: [/* @__PURE__ */ jsx(Pressable, {
20
+ asChild: true,
19
21
  display: "flex",
20
22
  flexDirection: "row",
21
23
  alignItems: "center",
@@ -26,30 +28,39 @@ function Accordion({ label, children, onClick, open, spacingHorizontal = "4", sp
26
28
  onClick,
27
29
  className: cx("hover:bg-secondary/80", "w-full", className),
28
30
  ...props,
29
- children: [/* @__PURE__ */ jsx(Text, {
31
+ children: /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx(Text, {
30
32
  variant: "title4",
31
33
  color: "primary",
32
34
  ...textProps || {},
33
35
  children: label
34
- }), /* @__PURE__ */ jsx(AnimatePresence, {
35
- initial: false,
36
- children: /* @__PURE__ */ jsx(m.div, {
37
- initial: "collapsed",
38
- animate: open ? "open" : "collapsed",
39
- exit: "collapsed",
40
- variants: {
41
- open: { rotate: 90 },
42
- collapsed: { rotate: 0 }
43
- },
44
- "data-testid": "chevron-motion",
45
- children: /* @__PURE__ */ jsx(Icon, {
46
- name: ChevronRight,
47
- variant: "fill",
48
- size: "sm",
49
- color: "primary"
50
- })
36
+ }), /* @__PURE__ */ jsx(HStack, {
37
+ display: "flex",
38
+ alignItems: "center",
39
+ justifyContent: "space-between",
40
+ columnGap: "2.5",
41
+ children: /* @__PURE__ */ jsxs(AnimatePresence, {
42
+ initial: false,
43
+ children: [/* @__PURE__ */ jsx(m.div, {
44
+ initial: "collapsed",
45
+ animate: open ? "open" : "collapsed",
46
+ exit: "collapsed",
47
+ variants: {
48
+ open: { rotate: 90 },
49
+ collapsed: { rotate: 0 }
50
+ },
51
+ "data-testid": "chevron-motion",
52
+ children: /* @__PURE__ */ jsx(Icon, {
53
+ name: ChevronRight,
54
+ variant: "fill",
55
+ size: "sm",
56
+ color: "primary"
57
+ })
58
+ }, "chevron"), endAction && /* @__PURE__ */ jsx(m.div, {
59
+ onClick: (e) => e.stopPropagation(),
60
+ children: endAction
61
+ })]
51
62
  })
52
- })]
63
+ })] })
53
64
  }), /* @__PURE__ */ jsx(AnimatePresence, {
54
65
  initial: false,
55
66
  children: /* @__PURE__ */ jsx(m.div, {