@proyecto-viviana/ui 0.6.3 → 0.8.0-rc.0

package/dist/_chunk/ActionButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"ActionButton.js","names":["JSX","ProgressBar","StaticColor","ActionButtonSize","s2ProgressCircleIndeterminateAnimation","s2PendingProgressCircle","s2PendingProgressCircleFill","s2PendingProgressCircleHcmStroke","s2PendingProgressCircleTrack","S2PendingProgressCircleProps","size","staticColor","S2PendingProgressCircle","props","Element","isStaticColor","_$createComponent","isIndeterminate","aria-label","class","children","percentage","_el$","_$getNextElement","_tmpl$","_el$2","firstChild","_el$3","nextSibling","_el$4","_$setStyleProperty","undefined","_$effect","_p$","_v$","_v$2","_v$3","_v$4","String","e","_$setAttribute","t","a","o"],"sources":["../../src/button/pending-state.ts","../../src/progress/progress-circle-animation.ts","../../src/button/s2-progress-circle-styles.ts","../../src/button/S2PendingProgressCircle.tsx","../../src/button/ActionButton.tsx"],"sourcesContent":["import { createEffect, createSignal, onCleanup, type Accessor } from \"solid-js\";\n\nexport function createPendingState(isPending: Accessor<boolean | undefined>) {\n  const [isProgressVisible, setIsProgressVisible] = createSignal(false);\n\n  createEffect(() => {\n    let timeout: ReturnType<typeof setTimeout> | undefined;\n\n    if (isPending()) {\n      timeout = setTimeout(() => {\n        setIsProgressVisible(true);\n      }, 1000);\n    } else {\n      setIsProgressVisible(false);\n    }\n\n    onCleanup(() => {\n      if (timeout) {\n        clearTimeout(timeout);\n      }\n    });\n  });\n\n  return { isProgressVisible };\n}\n","import { keyframes } from \"../style/style-macro\" with { type: \"macro\" };\n\nconst progressCircleRotationAnimation = keyframes(`\n  0% {\n    transform: rotate(0deg);\n  }\n\n  100% {\n    transform: rotate(360deg);\n  }\n`);\n\nconst progressCircleDashoffsetAnimation = keyframes(`\n  0%, 100% {\n    stroke-dashoffset: 75;\n  }\n\n  30% {\n    stroke-dashoffset: 20;\n  }\n`);\n\nexport const s2ProgressCircleIndeterminateAnimation = `${progressCircleRotationAnimation} 1s cubic-bezier(.6, .1, .3, .9) infinite, ${progressCircleDashoffsetAnimation} 1s cubic-bezier(.25, .1, .25, 1.3) infinite`;\n","// @ts-nocheck\n/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport { style } from \"../style\" with { type: \"macro\" };\nimport { staticColor } from \"../s2-internal/style-utils\" with { type: \"macro\" };\nimport type { StaticColor } from \"./types\";\nimport type { ActionButtonSize } from \"./group-context\";\n\nexport interface S2PendingProgressCircleStyleProps {\n  size: ActionButtonSize;\n  staticColor?: StaticColor;\n}\n\nexport const s2PendingProgressCircle = style<S2PendingProgressCircleStyleProps>({\n  ...staticColor(),\n  size: {\n    size: {\n      XS: 12,\n      S: 14,\n      M: 18,\n      L: 20,\n      XL: 24,\n    },\n  },\n  aspectRatio: \"square\",\n});\n\nexport const s2PendingProgressCircleTrack = style<{\n  isStaticColor?: boolean;\n  size?: \"S\" | \"M\" | \"L\";\n}>({\n  stroke: {\n    default: \"gray-300\",\n    isStaticColor: \"transparent-overlay-300\",\n    forcedColors: \"Background\",\n  },\n  strokeWidth: {\n    default: \"[0.1875rem]\",\n    size: {\n      S: \"[0.125rem]\",\n      L: \"[0.25rem]\",\n    },\n    forcedColors: {\n      default: \"[0.125rem]\",\n      size: {\n        S: \"[0.0625rem]\",\n        L: \"[0.1875rem]\",\n      },\n    },\n  },\n});\n\nexport const s2PendingProgressCircleFill = style<{\n  isStaticColor?: boolean;\n  size?: \"S\" | \"M\" | \"L\";\n}>({\n  stroke: {\n    default: \"blue-900\",\n    isStaticColor: \"transparent-overlay-900\",\n    forcedColors: \"ButtonText\",\n  },\n  rotate: -90,\n  transformOrigin: \"center\",\n  strokeWidth: {\n    default: \"[0.1875rem]\",\n    size: {\n      S: \"[0.125rem]\",\n      L: \"[0.25rem]\",\n    },\n  },\n});\n\nexport const s2PendingProgressCircleHcmStroke = style<{\n  size?: \"S\" | \"M\" | \"L\";\n}>({\n  stroke: {\n    default: \"transparent\",\n    forcedColors: \"ButtonText\",\n  },\n  strokeWidth: {\n    default: \"[0.1875rem]\",\n    size: {\n      S: \"[0.125rem]\",\n      L: \"[0.25rem]\",\n    },\n  },\n});\n","import { type JSX } from \"solid-js\";\nimport { ProgressBar } from \"@proyecto-viviana/solidaria-components\";\nimport type { StaticColor } from \"./types\";\nimport type { ActionButtonSize } from \"./group-context\";\nimport { s2ProgressCircleIndeterminateAnimation } from \"../progress/progress-circle-animation\";\nimport {\n  s2PendingProgressCircle,\n  s2PendingProgressCircleFill,\n  s2PendingProgressCircleHcmStroke,\n  s2PendingProgressCircleTrack,\n} from \"./s2-progress-circle-styles\";\n\nexport interface S2PendingProgressCircleProps {\n  size: ActionButtonSize;\n  staticColor?: StaticColor;\n  \"aria-label\": string;\n}\n\n/**\n * Button pending indicators are upstream S2 ProgressCircles with size=\"S\" stroke\n * metrics and button-size-specific wrapper dimensions.\n */\nexport function S2PendingProgressCircle(props: S2PendingProgressCircleProps): JSX.Element {\n  const isStaticColor = () => !!props.staticColor;\n\n  return (\n    <ProgressBar\n      isIndeterminate\n      aria-label={props[\"aria-label\"]}\n      data-rac=\"\"\n      class={s2PendingProgressCircle({\n        size: props.size,\n        staticColor: props.staticColor,\n      })}\n    >\n      {({ percentage, isIndeterminate }) => (\n        <svg fill=\"none\" width=\"100%\" height=\"100%\">\n          <circle\n            cx=\"50%\"\n            cy=\"50%\"\n            r=\"calc(50% - 0.0625rem)\"\n            class={s2PendingProgressCircleHcmStroke({ size: \"S\" })}\n          />\n          <circle\n            cx=\"50%\"\n            cy=\"50%\"\n            r=\"calc(50% - 0.0625rem)\"\n            class={s2PendingProgressCircleTrack({ isStaticColor: isStaticColor(), size: \"S\" })}\n          />\n          <circle\n            cx=\"50%\"\n            cy=\"50%\"\n            r=\"calc(50% - 0.0625rem)\"\n            class={s2PendingProgressCircleFill({ isStaticColor: isStaticColor(), size: \"S\" })}\n            style={{\n              animation: isIndeterminate ? s2ProgressCircleIndeterminateAnimation : undefined,\n            }}\n            pathLength=\"100\"\n            stroke-dasharray=\"100 200\"\n            stroke-dashoffset={\n              isIndeterminate || percentage == null ? undefined : String(100 - percentage)\n            }\n            stroke-linecap=\"round\"\n          />\n        </svg>\n      )}\n    </ProgressBar>\n  );\n}\n","import {\n  children as resolveChildren,\n  createEffect,\n  createSignal,\n  type JSX,\n  mergeProps,\n  onCleanup,\n  splitProps,\n  useContext,\n} from \"solid-js\";\nimport {\n  Button as HeadlessButton,\n  type ButtonProps as HeadlessButtonProps,\n  type ButtonRenderProps,\n  DialogTriggerContext,\n  MenuTriggerContext,\n  PopoverTriggerContext,\n} from \"@proyecto-viviana/solidaria-components\";\nimport { createStringFormatter } from \"@proyecto-viviana/solidaria\";\nimport { fontRelative, style } from \"../style\" with { type: \"macro\" };\nimport { useProviderProps } from \"../provider\";\nimport { centerBaseline } from \"../icon/center-baseline\";\nimport type { StaticColor } from \"./types\";\nimport type { StyleString } from \"../style\";\nimport { mergeStyles } from \"../style/runtime\";\nimport {\n  s2ActionButton,\n  s2ActionButtonPendingIndicator,\n  s2ActionButtonStaticColor,\n  s2ActionButtonText,\n  type S2ActionButtonRenderState,\n} from \"./s2-action-button-styles\";\nimport { createPendingState } from \"./pending-state\";\nimport { S2PendingProgressCircle } from \"./S2PendingProgressCircle\";\nimport { pressScale } from \"../pressScale\";\nimport {\n  type ActionButtonDensity,\n  type ActionButtonOrientation,\n  type ActionButtonSize,\n  useActionButtonGroupContext,\n} from \"./group-context\";\nimport { IconContext } from \"../icon/spectrum-icon\";\nimport { AvatarContext } from \"../avatar\";\nimport { ImageContext } from \"../image\";\nimport { NotificationBadgeContext } from \"../notificationbadge\";\nimport { SkeletonContext } from \"../skeleton\";\nimport { TextContext } from \"../text\";\nimport { s2IntlStrings } from \"../intl\";\nimport { useActionButtonContext } from \"./context\";\nimport {\n  getSlottedContextProps,\n  mergeContextRefs,\n  mergeContextStyles,\n  mergeContextUnsafeStyle,\n  type RefLike,\n} from \"./spectrum-context\";\nimport { getSingleTextChild } from \"./text-child\";\n\nexport type { ActionButtonSize } from \"./group-context\";\n\ntype StyledActionButtonBaseProps = Omit<\n  HeadlessButtonProps,\n  | \"class\"\n  | \"style\"\n  | \"children\"\n  | \"render\"\n  | \"isPendingFocusable\"\n  | \"onClick\"\n  | \"onHoverStart\"\n  | \"onHoverEnd\"\n  | \"onHoverChange\"\n  | \"elementType\"\n  | \"href\"\n  | \"target\"\n  | \"rel\"\n  | \"allowFocusWhenDisabled\"\n>;\n\ntype RuntimeActionButtonProps = ActionButtonProps & {\n  onHoverChange?: (isHovered: boolean) => void;\n};\n\nconst avatarSize: Record<ActionButtonSize, number> = {\n  XS: 14,\n  S: 16,\n  M: 20,\n  L: 22,\n  XL: 26,\n};\n\nexport interface ActionButtonProps extends StyledActionButtonBaseProps {\n  /** The content to display in the ActionButton. */\n  children?: JSX.Element;\n  /** The size of the button. @default 'M' */\n  size?: ActionButtonSize;\n  /** The static color style to apply. Useful when the ActionButton appears over a color background. */\n  staticColor?: StaticColor;\n  /** Whether the button should be displayed with a quiet style. */\n  isQuiet?: boolean;\n  /** Whether the ActionButton is pending. Pending buttons suppress press handlers and show progress. */\n  isPending?: boolean;\n  /** Spectrum-defined generated classes. */\n  styles?: StyleString;\n  /** Additional CSS class name. Use only as a last resort. */\n  UNSAFE_className?: string;\n  /** Additional inline styles. Use only as a last resort. */\n  UNSAFE_style?: JSX.CSSProperties;\n}\n\n/**\n * ActionButtons allow users to perform an action.\n */\nexport function ActionButton(props: ActionButtonProps): JSX.Element {\n  const runtimeProps = props as RuntimeActionButtonProps;\n  const providerProps = useProviderProps(runtimeProps);\n  const contextProps = getSlottedContextProps(useActionButtonContext(), runtimeProps.slot);\n  const groupContext = getSlottedContextProps(useActionButtonGroupContext(), undefined);\n  const defaultProps: Partial<ActionButtonProps> = {\n    size: \"M\",\n  };\n  const groupProps: Partial<ActionButtonProps> & {\n    density?: ActionButtonDensity;\n    orientation?: ActionButtonOrientation;\n    isJustified?: boolean;\n  } = {\n    get size() {\n      return groupContext?.size;\n    },\n    get staticColor() {\n      return groupContext?.staticColor;\n    },\n    get isQuiet() {\n      return groupContext?.isQuiet;\n    },\n    get isDisabled() {\n      return groupContext?.isDisabled;\n    },\n    get density() {\n      return groupContext?.density;\n    },\n    get orientation() {\n      return groupContext?.orientation;\n    },\n    get isJustified() {\n      return groupContext?.isJustified;\n    },\n  };\n\n  const merged = mergeProps(\n    defaultProps,\n    providerProps,\n    contextProps ?? {},\n    runtimeProps,\n    groupProps,\n  );\n  const [local, headlessProps] = splitProps(merged, [\n    \"size\",\n    \"staticColor\",\n    \"isQuiet\",\n    \"isPending\",\n    \"styles\",\n    \"UNSAFE_className\",\n    \"UNSAFE_style\",\n    \"children\",\n    \"ref\",\n    \"onPress\",\n    \"onPressChange\",\n    \"onHoverChange\",\n    \"density\",\n    \"orientation\",\n    \"isJustified\",\n  ] as const);\n\n  const { isProgressVisible } = createPendingState(() => local.isPending);\n  const dialogTriggerContext = useContext(DialogTriggerContext);\n  const menuTriggerContext = useContext(MenuTriggerContext);\n  const popoverTriggerContext = useContext(PopoverTriggerContext);\n  const stringFormatter = createStringFormatter(s2IntlStrings, \"@react-spectrum/s2\");\n  let buttonElement: HTMLButtonElement | undefined;\n  const [resolvedButtonElement, setResolvedButtonElement] = createSignal<HTMLButtonElement | null>(\n    null,\n  );\n  const assignButtonRefs = mergeContextRefs(\n    (contextProps as { ref?: RefLike<HTMLButtonElement> } | null)?.ref,\n    runtimeProps.ref,\n  );\n\n  const size = (): ActionButtonSize => local.size ?? \"M\";\n  const density = (): ActionButtonDensity => local.density ?? \"regular\";\n  const orientation = (): ActionButtonOrientation => local.orientation ?? \"horizontal\";\n  const isOverlayTriggerOpen = () =>\n    !!buttonElement &&\n    ((dialogTriggerContext?.triggerRef() === buttonElement &&\n      dialogTriggerContext.state.isOpen()) ||\n      (popoverTriggerContext?.triggerRef() === buttonElement &&\n        popoverTriggerContext.state.isOpen()));\n  const pendingLabel = () => stringFormatter().format(\"button.pending\");\n  const mergedStyles = () => mergeContextStyles(contextProps?.styles, runtimeProps.styles);\n  const mergedUnsafeStyle = () =>\n    mergeContextUnsafeStyle(contextProps?.UNSAFE_style, runtimeProps.UNSAFE_style);\n  const getS2State = (renderProps: ButtonRenderProps): S2ActionButtonRenderState => ({\n    isHovered: renderProps.isHovered || isOverlayTriggerOpen(),\n    isPressed: renderProps.isPressed,\n    isFocused: renderProps.isFocused,\n    isFocusVisible: renderProps.isFocusVisible,\n    isDisabled: renderProps.isDisabled || isProgressVisible(),\n    isPending: local.isPending,\n  });\n\n  const getClassName = (renderProps: ButtonRenderProps): string =>\n    [\n      local.UNSAFE_className,\n      mergeStyles(\n        s2ActionButton({\n          ...getS2State(renderProps),\n          size: size(),\n          staticColor: local.staticColor,\n          isStaticColor: !!local.staticColor,\n          isQuiet: local.isQuiet,\n          density: density(),\n          orientation: orientation(),\n          isJustified: local.isJustified,\n          isInGroup: !!groupContext,\n        }),\n        local.staticColor\n          ? s2ActionButtonStaticColor({\n              ...getS2State(renderProps),\n              size: size(),\n              staticColor: local.staticColor,\n              isStaticColor: true,\n              isQuiet: local.isQuiet,\n              density: density(),\n              orientation: orientation(),\n              isJustified: local.isJustified,\n              isInGroup: !!groupContext,\n            })\n          : undefined,\n        mergedStyles(),\n      ),\n    ]\n      .filter(Boolean)\n      .join(\" \");\n\n  const getPressScaleStyle = (renderProps: ButtonRenderProps): JSX.CSSProperties =>\n    pressScale(() => buttonElement, mergedUnsafeStyle())(renderProps);\n  const menuTriggerButtonProps = (): Partial<HeadlessButtonProps> => {\n    if (!menuTriggerContext) {\n      return {};\n    }\n\n    return {\n      get \"aria-haspopup\"() {\n        return (menuTriggerContext.triggerProps as Record<string, unknown>)[\"aria-haspopup\"] as\n          | \"menu\"\n          | true\n          | undefined;\n      },\n      get \"aria-expanded\"() {\n        return (menuTriggerContext.triggerProps as Record<string, unknown>)[\"aria-expanded\"] as\n          | boolean\n          | undefined;\n      },\n      get \"aria-controls\"() {\n        return (menuTriggerContext.triggerProps as Record<string, unknown>)[\"aria-controls\"] as\n          | string\n          | undefined;\n      },\n      get \"aria-disabled\"() {\n        return (menuTriggerContext.triggerProps as Record<string, unknown>)[\"aria-disabled\"] as\n          | boolean\n          | undefined;\n      },\n    };\n  };\n  const syncMenuTriggerAttribute = (element: HTMLButtonElement, name: string, value: unknown) => {\n    if (value == null) {\n      element.removeAttribute(name);\n      return;\n    }\n\n    element.setAttribute(name, String(value));\n  };\n\n  createEffect(() => {\n    const element = resolvedButtonElement();\n    if (!element || !menuTriggerContext) {\n      return;\n    }\n\n    const triggerProps = menuTriggerContext.triggerProps as Record<string, unknown>;\n    syncMenuTriggerAttribute(element, \"aria-haspopup\", triggerProps[\"aria-haspopup\"]);\n    syncMenuTriggerAttribute(element, \"aria-expanded\", triggerProps[\"aria-expanded\"]);\n    syncMenuTriggerAttribute(element, \"aria-controls\", triggerProps[\"aria-controls\"]);\n    syncMenuTriggerAttribute(element, \"aria-disabled\", triggerProps[\"aria-disabled\"]);\n  });\n  createEffect(() => {\n    const element = resolvedButtonElement();\n    if (!element || !menuTriggerContext) {\n      return;\n    }\n\n    const onKeyDown = (event: KeyboardEvent) => {\n      if (event.key !== \"ArrowDown\" && event.key !== \"ArrowUp\") {\n        return;\n      }\n\n      (menuTriggerContext.triggerProps as { onKeyDown?: (e: KeyboardEvent) => void }).onKeyDown?.(\n        event,\n      );\n    };\n\n    element.addEventListener(\"keydown\", onKeyDown);\n    onCleanup(() => element.removeEventListener(\"keydown\", onKeyDown));\n  });\n\n  const pendingAccessibleLabel = () => {\n    const existingLabel = (headlessProps as Record<string, unknown>)[\"aria-label\"];\n    if (existingLabel != null) {\n      return existingLabel as string;\n    }\n\n    const resolvedChildren = resolveChildren(() => local.children);\n    const content = resolvedChildren();\n    return local.isPending && typeof content === \"string\" ? content : undefined;\n  };\n\n  function ActionButtonContent() {\n    const iconContextValue = {\n      slot: \"icon\",\n      render: centerBaseline({\n        slot: \"icon\",\n        styles: () =>\n          style({\n            gridArea: \"icon\",\n            visibility: {\n              isProgressVisible: \"hidden\",\n            },\n          })({ isProgressVisible: isProgressVisible() }),\n      }),\n      styles: style({\n        /* fontRelative(16) — matches Button. S2's fontRelative(20) sizes to its 20px\n         * workflow-icon grid; on this register's 15px control font that renders ~21px,\n         * bigger than the register's 17px PixelIcon default (primitives.tsx:55).\n         * fontRelative(16) lands ~17px at the control font. */\n        size: fontRelative(16),\n        marginStart: \"--iconMargin\",\n        flexShrink: 0,\n      }),\n    };\n    const textContextValue = {\n      styles: () => s2ActionButtonText({ isProgressVisible: isProgressVisible() }),\n    };\n    const avatarContextValue = {\n      get size() {\n        return avatarSize[size()];\n      },\n      get styles() {\n        return style({\n          marginStart: \"--iconMargin\",\n          gridArea: \"icon\",\n        });\n      },\n    };\n    const imageContextValue = {\n      styles: () =>\n        style({\n          visibility: {\n            isProgressVisible: \"hidden\",\n          },\n        })({ isProgressVisible: isProgressVisible() }),\n    };\n    const notificationBadgeContextValue = {\n      get staticColor() {\n        return local.staticColor;\n      },\n      get size() {\n        const currentSize = size();\n        return currentSize === \"XS\" ? undefined : currentSize;\n      },\n      get isDisabled() {\n        return !!headlessProps.isDisabled;\n      },\n      styles: () =>\n        style({\n          position: \"absolute\",\n          top: \"--badgeTop\",\n          marginTop: \"calc((self(height) * -1)/2)\",\n          marginStart: \"calc(var(--iconMargin) * 2 + (self(height) * -1)/4)\",\n          gridColumnStart: 1,\n          insetStart: \"--badgePosition\",\n          visibility: {\n            isProgressVisible: \"hidden\",\n          },\n        })({ isProgressVisible: isProgressVisible() }),\n    };\n\n    function ResolvedContent() {\n      const resolvedChildren = resolveChildren(() => local.children);\n      const content = () => resolvedChildren();\n      const textChild = () => getSingleTextChild(content());\n\n      return textChild() !== undefined ? (\n        <span\n          class={s2ActionButtonText({ isProgressVisible: isProgressVisible() })}\n          data-rsp-slot=\"text\"\n        >\n          {textChild()}\n        </span>\n      ) : (\n        content()\n      );\n    }\n\n    return (\n      <SkeletonContext.Provider value={null}>\n        <TextContext.Provider value={textContextValue}>\n          <IconContext.Provider value={iconContextValue}>\n            <AvatarContext.Provider value={avatarContextValue}>\n              <ImageContext.Provider value={imageContextValue}>\n                <NotificationBadgeContext.Provider value={notificationBadgeContextValue}>\n                  <ResolvedContent />\n                  {local.isPending ? (\n                    <div\n                      class={s2ActionButtonPendingIndicator({\n                        isProgressVisible: isProgressVisible(),\n                      })}\n                    >\n                      <S2PendingProgressCircle\n                        aria-label={pendingLabel()}\n                        size={size()}\n                        staticColor={local.staticColor}\n                      />\n                    </div>\n                  ) : null}\n                </NotificationBadgeContext.Provider>\n              </ImageContext.Provider>\n            </AvatarContext.Provider>\n          </IconContext.Provider>\n        </TextContext.Provider>\n      </SkeletonContext.Provider>\n    );\n  }\n\n  return (\n    <HeadlessButton\n      {...headlessProps}\n      {...menuTriggerButtonProps()}\n      aria-label={pendingAccessibleLabel()}\n      isPending={local.isPending}\n      isPendingFocusable\n      ref={(element: HTMLButtonElement) => {\n        buttonElement = element;\n        setResolvedButtonElement(element);\n        assignButtonRefs(element);\n      }}\n      onHoverChange={(hovered) => {\n        local.onHoverChange?.(hovered);\n      }}\n      onPressChange={(pressed) => {\n        local.onPressChange?.(pressed);\n      }}\n      onPress={(event) => {\n        if (!local.isPending) {\n          local.onPress?.(event);\n        }\n      }}\n      class={getClassName}\n      style={getPressScaleStyle}\n    >\n      <ActionButtonContent />\n    </HeadlessButton>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"ActionButton.js","names":["<ProgressBar\n      isIndeterminate\n      aria-label={props[\"aria-label\"]}\n      data-rac=\"\"\n      class={s2PendingProgressCircle({\n        size: props.size,\n        staticColor: props.staticColor,\n      })}\n    >\n      {({ percentage, isIndeterminate }) => (\n        <svg fill=\"none\" width=\"100%\" height=\"100%\">\n          <circle\n            cx=\"50%\"\n            cy=\"50%\"\n            r=\"calc(50% - 0.0625rem)\"\n            class={s2PendingProgressCircleHcmStroke({ size: \"S\" })}\n          />\n          <circle\n            cx=\"50%\"\n            cy=\"50%\"\n            r=\"calc(50% - 0.0625rem)\"\n            class={s2PendingProgressCircleTrack({ isStaticColor: isStaticColor(), size: \"S\" })}\n          />\n          <circle\n            cx=\"50%\"\n            cy=\"50%\"\n            r=\"calc(50% - 0.0625rem)\"\n            class={s2PendingProgressCircleFill({ isStaticColor: isStaticColor(), size: \"S\" })}\n            style={{\n              animation: isIndeterminate ? s2ProgressCircleIndeterminateAnimation : undefined,\n            }}\n            pathLength=\"100\"\n            stroke-dasharray=\"100 200\"\n            stroke-dashoffset={\n              isIndeterminate || percentage == null ? undefined : String(100 - percentage)\n            }\n            stroke-linecap=\"round\"\n          />\n        </svg>\n      )}\n    </ProgressBar>","class={s2PendingProgressCircleTrack({ isStaticColor: isStaticColor(), size: \"S\" })}","class={s2PendingProgressCircleFill({ isStaticColor: isStaticColor(), size: \"S\" })}","stroke-dashoffset={\n              isIndeterminate || percentage == null ? undefined : String(100 - percentage)\n            }"],"sources":["../../src/button/pending-state.ts","../../src/progress/progress-circle-animation.ts","../../src/button/s2-progress-circle-styles.ts","../../src/button/S2PendingProgressCircle.tsx","../../src/button/ActionButton.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n// Ported to SolidJS for Proyecto Viviana; based on packages/@react-spectrum/s2/src/Button.tsx\n\n// Port of packages/@react-spectrum/s2/src/Button.tsx.\nimport { createEffect, createSignal } from \"solid-js\";\nimport type { Accessor } from \"solid-js\";\n\nexport function createPendingState(isPending: Accessor<boolean | undefined>) {\n  const [isProgressVisible, setIsProgressVisible] = createSignal(false, { ownedWrite: true });\n\n  createEffect(\n    () => isPending() ?? false,\n    (pending) => {\n      if (pending) {\n        const timeout = setTimeout(() => {\n          setIsProgressVisible(true);\n        }, 1000);\n        return () => clearTimeout(timeout);\n      }\n      setIsProgressVisible(false);\n    },\n  );\n\n  return { isProgressVisible };\n}\n","/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n// Ported to SolidJS for Proyecto Viviana; based on packages/@react-spectrum/s2/src/ProgressCircle.tsx\n\n// Port of packages/@react-spectrum/s2/src/ProgressCircle.tsx.\nimport { keyframes } from \"../style/style-macro\" with { type: \"macro\" };\n\nconst progressCircleRotationAnimation = keyframes(`\n  0% {\n    transform: rotate(0deg);\n  }\n\n  100% {\n    transform: rotate(360deg);\n  }\n`);\n\nconst progressCircleDashoffsetAnimation = keyframes(`\n  0%, 100% {\n    stroke-dashoffset: 75;\n  }\n\n  30% {\n    stroke-dashoffset: 20;\n  }\n`);\n\nexport const s2ProgressCircleIndeterminateAnimation = `${progressCircleRotationAnimation} 1s cubic-bezier(.6, .1, .3, .9) infinite, ${progressCircleDashoffsetAnimation} 1s cubic-bezier(.25, .1, .25, 1.3) infinite`;\n","// @ts-nocheck\n\n/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n// Ported to SolidJS for Proyecto Viviana; based on packages/@react-spectrum/s2/src/ProgressCircle.tsx\n\nimport { style } from \"../style\" with { type: \"macro\" };\n\nimport { staticColor } from \"../s2-internal/style-utils\" with { type: \"macro\" };\nimport type { StaticColor } from \"./types\";\nimport type { ActionButtonSize } from \"./group-context\";\n\nexport interface S2PendingProgressCircleStyleProps {\n  size: ActionButtonSize;\n  staticColor?: StaticColor;\n}\n\nexport const s2PendingProgressCircle = style<S2PendingProgressCircleStyleProps>({\n  ...staticColor(),\n  size: \"1lh\",\n  aspectRatio: \"square\",\n});\n\nexport const s2PendingProgressCircleTrack = style<{\n  isStaticColor?: boolean;\n  size?: \"S\" | \"M\" | \"L\";\n}>({\n  stroke: {\n    default: \"gray-300\",\n    isStaticColor: \"transparent-overlay-300\",\n    forcedColors: \"Background\",\n  },\n  strokeWidth: {\n    default: \"[0.1875rem]\",\n    size: {\n      S: \"[0.125rem]\",\n      L: \"[0.25rem]\",\n    },\n    forcedColors: {\n      default: \"[0.125rem]\",\n      size: {\n        S: \"[0.0625rem]\",\n        L: \"[0.1875rem]\",\n      },\n    },\n  },\n});\n\nexport const s2PendingProgressCircleFill = style<{\n  isStaticColor?: boolean;\n  size?: \"S\" | \"M\" | \"L\";\n}>({\n  stroke: {\n    default: \"blue-900\",\n    isStaticColor: \"transparent-overlay-900\",\n    forcedColors: \"ButtonText\",\n  },\n  rotate: -90,\n  transformOrigin: \"center\",\n  strokeWidth: {\n    default: \"[0.1875rem]\",\n    size: {\n      S: \"[0.125rem]\",\n      L: \"[0.25rem]\",\n    },\n  },\n});\n\nexport const s2PendingProgressCircleHcmStroke = style<{\n  size?: \"S\" | \"M\" | \"L\";\n}>({\n  stroke: {\n    default: \"transparent\",\n    forcedColors: \"ButtonText\",\n  },\n  strokeWidth: {\n    default: \"[0.1875rem]\",\n    size: {\n      S: \"[0.125rem]\",\n      L: \"[0.25rem]\",\n    },\n  },\n});\n","/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n// Ported to SolidJS for Proyecto Viviana; based on packages/@react-spectrum/s2/src/ProgressCircle.tsx\n\n// Port of packages/@react-spectrum/s2/src/ProgressCircle.tsx.\nimport type { JSX } from \"@solidjs/web\";\nimport { ProgressBar } from \"@proyecto-viviana/solidaria-components\";\nimport type { StaticColor } from \"./types\";\nimport type { ActionButtonSize } from \"./group-context\";\nimport { s2ProgressCircleIndeterminateAnimation } from \"../progress/progress-circle-animation\";\nimport {\n  s2PendingProgressCircle,\n  s2PendingProgressCircleFill,\n  s2PendingProgressCircleHcmStroke,\n  s2PendingProgressCircleTrack,\n} from \"./s2-progress-circle-styles\";\n\nexport interface S2PendingProgressCircleProps {\n  size: ActionButtonSize;\n  staticColor?: StaticColor;\n  \"aria-label\": string;\n}\n\n/**\n * Button pending indicators are upstream S2 ProgressCircles with size=\"S\" stroke\n * metrics and button-size-specific wrapper dimensions.\n */\nexport function S2PendingProgressCircle(props: S2PendingProgressCircleProps): JSX.Element {\n  const isStaticColor = () => !!props.staticColor;\n\n  return (\n    <ProgressBar\n      isIndeterminate\n      aria-label={props[\"aria-label\"]}\n      data-rac=\"\"\n      class={s2PendingProgressCircle({\n        size: props.size,\n        staticColor: props.staticColor,\n      })}\n    >\n      {({ percentage, isIndeterminate }) => (\n        <svg fill=\"none\" width=\"100%\" height=\"100%\">\n          <circle\n            cx=\"50%\"\n            cy=\"50%\"\n            r=\"calc(50% - 0.0625rem)\"\n            class={s2PendingProgressCircleHcmStroke({ size: \"S\" })}\n          />\n          <circle\n            cx=\"50%\"\n            cy=\"50%\"\n            r=\"calc(50% - 0.0625rem)\"\n            class={s2PendingProgressCircleTrack({ isStaticColor: isStaticColor(), size: \"S\" })}\n          />\n          <circle\n            cx=\"50%\"\n            cy=\"50%\"\n            r=\"calc(50% - 0.0625rem)\"\n            class={s2PendingProgressCircleFill({ isStaticColor: isStaticColor(), size: \"S\" })}\n            style={{\n              animation: isIndeterminate ? s2ProgressCircleIndeterminateAnimation : undefined,\n            }}\n            pathLength=\"100\"\n            stroke-dasharray=\"100 200\"\n            stroke-dashoffset={\n              isIndeterminate || percentage == null ? undefined : String(100 - percentage)\n            }\n            stroke-linecap=\"round\"\n          />\n        </svg>\n      )}\n    </ProgressBar>\n  );\n}\n","/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n// Ported to SolidJS for Proyecto Viviana; based on packages/@react-spectrum/s2/src/ActionButton.tsx\n\n// Port of packages/@react-spectrum/s2/src/ActionButton.tsx.\n\nimport { children as resolveChildren, createEffect, createSignal, useContext } from \"solid-js\";\nimport type { JSX } from \"@solidjs/web\";\nimport {\n  Button as HeadlessButton,\n  type ButtonProps as HeadlessButtonProps,\n  type ButtonRenderProps,\n  DialogTriggerContext,\n  MenuTriggerContext,\n  PopoverTriggerContext,\n} from \"@proyecto-viviana/solidaria-components\";\nimport { createStringFormatter, mergeProps, useLocale } from \"@proyecto-viviana/solidaria\";\nimport { fontRelative, space, style } from \"../style\" with { type: \"macro\" };\nimport { useProviderProps, type ProviderInheritedProps } from \"../provider\";\nimport { useFormProps } from \"../form\";\nimport { centerBaseline } from \"../icon/center-baseline\";\nimport type { StaticColor } from \"./types\";\nimport type { StyleString } from \"../style\";\nimport { mergeStyles } from \"../style/runtime\";\nimport {\n  s2ActionButton,\n  s2ActionButtonPendingIndicator,\n  s2ActionButtonStaticColor,\n  s2ActionButtonText,\n  type S2ActionButtonRenderState,\n} from \"./s2-action-button-styles\";\nimport { createPendingState } from \"./pending-state\";\nimport { S2PendingProgressCircle } from \"./S2PendingProgressCircle\";\nimport { pressScale } from \"../pressScale\";\nimport {\n  type ActionButtonDensity,\n  type ActionButtonOrientation,\n  type ActionButtonSize,\n  useActionButtonGroupContext,\n} from \"./group-context\";\nimport { IconContext } from \"../icon/spectrum-icon\";\nimport { AvatarContext } from \"../avatar\";\nimport { ImageContext } from \"../image\";\nimport { NotificationBadgeContext } from \"../notificationbadge\";\nimport { SkeletonContext } from \"../skeleton\";\nimport { TextContext } from \"../text\";\nimport { s2IntlStrings } from \"../intl\";\nimport { useActionButtonContext } from \"./context\";\nimport {\n  getSlottedContextProps,\n  mergeContextRefs,\n  mergeContextStyles,\n  mergeContextUnsafeStyle,\n  type RefLike,\n} from \"./spectrum-context\";\nimport { getSingleTextChild } from \"./text-child\";\nimport CornerTriangle from \"../icon/ui-icons/CornerTriangle\";\nimport { splitProps } from \"@proyecto-viviana/solidaria/utils\";\n\nexport type { ActionButtonSize } from \"./group-context\";\n\ntype StyledActionButtonBaseProps = Omit<\n  HeadlessButtonProps,\n  | \"class\"\n  | \"style\"\n  | \"children\"\n  | \"render\"\n  | \"isPendingFocusable\"\n  | \"onClick\"\n  | \"onHoverStart\"\n  | \"onHoverEnd\"\n  | \"onHoverChange\"\n  | \"elementType\"\n  | \"href\"\n  | \"target\"\n  | \"rel\"\n  | \"allowFocusWhenDisabled\"\n>;\n\ntype RuntimeActionButtonProps = ActionButtonProps & {\n  onHoverChange?: (isHovered: boolean) => void;\n  holdAffordance?: boolean;\n};\n\ntype ActionButtonLayeredProps = RuntimeActionButtonProps & {\n  density?: ActionButtonDensity;\n  orientation?: ActionButtonOrientation;\n  isJustified?: boolean;\n};\n\nexport interface ActionButtonProps extends StyledActionButtonBaseProps {\n  /** The content to display in the ActionButton. */\n  children?: JSX.Element;\n  /** The size of the button. @default 'M' */\n  size?: ActionButtonSize;\n  /** The static color style to apply. Useful when the ActionButton appears over a color background. */\n  staticColor?: StaticColor;\n  /** Whether the button should be displayed with a quiet style. */\n  isQuiet?: boolean;\n  /** Whether the ActionButton is pending. Pending buttons suppress press handlers and show progress. */\n  isPending?: boolean;\n  /** Spectrum-defined generated classes. */\n  styles?: StyleString;\n  /** Additional CSS class name. Use only as a last resort. */\n  UNSAFE_className?: string;\n  /** Additional inline styles. Use only as a last resort. */\n  UNSAFE_style?: JSX.CSSProperties;\n}\n\n/**\n * ActionButtons allow users to perform an action.\n */\nexport function ActionButton(props: ActionButtonProps): JSX.Element {\n  const runtimeProps = props as RuntimeActionButtonProps;\n  const providerProps = useProviderProps(runtimeProps) as RuntimeActionButtonProps &\n    ProviderInheritedProps;\n  const [flags] = splitProps(providerProps, [\n    \"isQuiet\",\n    \"isEmphasized\",\n    \"isDisabled\",\n    \"isRequired\",\n    \"isReadOnly\",\n    \"validationState\",\n  ]);\n  const contextProps = getSlottedContextProps(useActionButtonContext(), runtimeProps.slot);\n  const groupContext = getSlottedContextProps(useActionButtonGroupContext(), undefined);\n  const groupProps: Partial<ActionButtonProps> & {\n    density?: ActionButtonDensity;\n    orientation?: ActionButtonOrientation;\n    isJustified?: boolean;\n  } = {\n    get size() {\n      return groupContext?.size;\n    },\n    get staticColor() {\n      return groupContext?.staticColor;\n    },\n    get isQuiet() {\n      return groupContext?.isQuiet;\n    },\n    get density() {\n      return groupContext?.density;\n    },\n    get orientation() {\n      return groupContext?.orientation;\n    },\n    get isJustified() {\n      return groupContext?.isJustified;\n    },\n  };\n\n  // As Button: the Form fills what the layers leave unset; defaults are read-time.\n  const merged = useFormProps(\n    mergeProps<ActionButtonLayeredProps>(flags, contextProps ?? {}, runtimeProps, groupProps),\n  );\n  const [local, headlessProps] = splitProps(merged, [\n    \"size\",\n    \"staticColor\",\n    \"isQuiet\",\n    \"isPending\",\n    \"styles\",\n    \"UNSAFE_className\",\n    \"UNSAFE_style\",\n    \"children\",\n    \"holdAffordance\",\n    \"ref\",\n    \"onPress\",\n    \"onPressChange\",\n    \"onHoverChange\",\n    \"density\",\n    \"orientation\",\n    \"isJustified\",\n  ] as const);\n\n  // Upstream ends the chain on the Form proxy and keeps the group last:\n  // `isDisabled={props.isDisabled ?? isDisabled}` after `useFormProps`\n  // (`@react-spectrum/s2@1.7.0/src/ActionButton.tsx:334,358`). `headlessProps`\n  // is that proxy — own prop, context, provider, then the Form, with a Skeleton\n  // over all of them — so the group stays out of the merge for this one key,\n  // unlike size/staticColor/isQuiet, which upstream lets the group win.\n  const isDisabled = () => headlessProps.isDisabled ?? groupContext?.isDisabled;\n  const { isProgressVisible } = createPendingState(() => local.isPending);\n  const dialogTriggerContext = useContext(DialogTriggerContext);\n  const menuTriggerContext = useContext(MenuTriggerContext);\n  const popoverTriggerContext = useContext(PopoverTriggerContext);\n  const stringFormatter = createStringFormatter(s2IntlStrings, \"@react-spectrum/s2\");\n  const locale = useLocale();\n  let buttonElement: HTMLButtonElement | undefined;\n  const [resolvedButtonElement, setResolvedButtonElement] = createSignal<HTMLButtonElement | null>(\n    null,\n  );\n  const assignButtonRefs = mergeContextRefs(\n    (contextProps as { ref?: RefLike<HTMLButtonElement> } | null)?.ref,\n    runtimeProps.ref,\n  );\n\n  const size = (): ActionButtonSize => local.size ?? \"M\";\n  const cornerTriangleSize = (): \"S\" | \"M\" | \"L\" | \"XL\" => {\n    const currentSize = size();\n    return currentSize === \"XS\" ? \"S\" : currentSize;\n  };\n  const density = (): ActionButtonDensity => local.density ?? \"regular\";\n  const orientation = (): ActionButtonOrientation => local.orientation ?? \"horizontal\";\n  const isOverlayTriggerOpen = () =>\n    !!buttonElement &&\n    ((dialogTriggerContext?.triggerRef() === buttonElement &&\n      dialogTriggerContext.state.isOpen()) ||\n      (popoverTriggerContext?.triggerRef() === buttonElement &&\n        popoverTriggerContext.state.isOpen()));\n  const pendingLabel = () => stringFormatter().format(\"button.pending\");\n  const mergedStyles = () => mergeContextStyles(contextProps?.styles, runtimeProps.styles);\n  const mergedUnsafeStyle = () =>\n    mergeContextUnsafeStyle(contextProps?.UNSAFE_style, runtimeProps.UNSAFE_style);\n  const getS2State = (renderProps: ButtonRenderProps): S2ActionButtonRenderState => ({\n    isHovered: renderProps.isHovered || isOverlayTriggerOpen(),\n    isPressed: renderProps.isPressed,\n    isFocused: renderProps.isFocused,\n    isFocusVisible: renderProps.isFocusVisible,\n    isDisabled: renderProps.isDisabled || isProgressVisible(),\n    isPending: local.isPending,\n  });\n\n  const getClassName = (renderProps: ButtonRenderProps): string =>\n    [\n      local.UNSAFE_className,\n      mergeStyles(\n        s2ActionButton({\n          ...getS2State(renderProps),\n          size: size(),\n          staticColor: local.staticColor,\n          isStaticColor: !!local.staticColor,\n          isQuiet: local.isQuiet,\n          density: density(),\n          orientation: orientation(),\n          isJustified: local.isJustified,\n          isInGroup: !!groupContext,\n        }),\n        local.staticColor\n          ? s2ActionButtonStaticColor({\n              ...getS2State(renderProps),\n              size: size(),\n              staticColor: local.staticColor,\n              isStaticColor: true,\n              isQuiet: local.isQuiet,\n              density: density(),\n              orientation: orientation(),\n              isJustified: local.isJustified,\n              isInGroup: !!groupContext,\n            })\n          : undefined,\n        mergedStyles(),\n      ),\n    ]\n      .filter(Boolean)\n      .join(\" \");\n\n  const getPressScaleStyle = (renderProps: ButtonRenderProps): JSX.CSSProperties =>\n    pressScale(() => buttonElement, mergedUnsafeStyle())(renderProps);\n  const menuTriggerButtonProps: Partial<HeadlessButtonProps> = !menuTriggerContext\n    ? {}\n    : mergeProps<Partial<HeadlessButtonProps>>(\n        splitProps(menuTriggerContext.triggerProps as Record<string, unknown>, [\n          \"onKeyDown\",\n        ])[1] as Partial<HeadlessButtonProps>,\n        {\n          onPressStart: menuTriggerContext.onPressStart,\n        } as Partial<HeadlessButtonProps>,\n      );\n  const syncMenuTriggerAttribute = (element: HTMLButtonElement, name: string, value: unknown) => {\n    if (value == null) {\n      element.removeAttribute(name);\n      return;\n    }\n\n    element.setAttribute(name, String(value));\n  };\n\n  createEffect(\n    () => {\n      const element = resolvedButtonElement();\n      if (!element || !menuTriggerContext || menuTriggerContext.triggerRef?.() !== element) {\n        return null;\n      }\n      const triggerProps = menuTriggerContext.triggerProps as Record<string, unknown>;\n      return {\n        element,\n        haspopup: triggerProps[\"aria-haspopup\"],\n        expanded: triggerProps[\"aria-expanded\"],\n        controls: triggerProps[\"aria-controls\"],\n        disabled: triggerProps[\"aria-disabled\"],\n      };\n    },\n    (snapshot) => {\n      if (!snapshot) return;\n      syncMenuTriggerAttribute(snapshot.element, \"aria-haspopup\", snapshot.haspopup);\n      syncMenuTriggerAttribute(snapshot.element, \"aria-expanded\", snapshot.expanded);\n      syncMenuTriggerAttribute(snapshot.element, \"aria-controls\", snapshot.controls);\n      syncMenuTriggerAttribute(snapshot.element, \"aria-disabled\", snapshot.disabled);\n    },\n  );\n  createEffect(\n    () => {\n      const element = resolvedButtonElement();\n      if (!element || !menuTriggerContext || menuTriggerContext.triggerRef?.() !== element) {\n        return null;\n      }\n      return element;\n    },\n    (element) => {\n      if (!element) return;\n      const onKeyDown = (event: KeyboardEvent) => {\n        (\n          menuTriggerContext?.triggerProps as { onKeyDown?: (e: KeyboardEvent) => void } | undefined\n        )?.onKeyDown?.(event);\n      };\n      element.addEventListener(\"keydown\", onKeyDown);\n      return () => element.removeEventListener(\"keydown\", onKeyDown);\n    },\n  );\n  function ActionButtonContent() {\n    const iconContextValue = {\n      slot: \"icon\",\n      render: centerBaseline({\n        slot: \"icon\",\n        styles: () =>\n          style({\n            gridArea: \"icon\",\n            visibility: {\n              isProgressVisible: \"hidden\",\n            },\n          })({ isProgressVisible: isProgressVisible() }),\n      }),\n      styles: style({\n        /* fontRelative(16) — matches Button. S2's fontRelative(20) sizes to its 20px\n         * workflow-icon grid; on this register's 15px control font that renders ~21px,\n         * bigger than the register's 17px PixelIcon default (primitives.tsx:55).\n         * fontRelative(16) lands ~17px at the control font. */\n        size: fontRelative(16),\n        marginStart: \"--iconMargin\",\n        flexShrink: 0,\n      }),\n    };\n    const textContextValue = {\n      styles: () => s2ActionButtonText({ isProgressVisible: isProgressVisible() }),\n    };\n    const avatarContextValue = {\n      size: \"1lh\" as const,\n      get styles() {\n        return style({\n          marginStart: \"--iconMargin\",\n          gridArea: \"icon\",\n        });\n      },\n    };\n    const imageContextValue = {\n      styles: () =>\n        style({\n          visibility: {\n            isProgressVisible: \"hidden\",\n          },\n        })({ isProgressVisible: isProgressVisible() }),\n    };\n    const notificationBadgeContextValue = {\n      get staticColor() {\n        return local.staticColor;\n      },\n      get size() {\n        const currentSize = size();\n        return currentSize === \"XS\" ? undefined : currentSize;\n      },\n      get isDisabled() {\n        // Upstream hands the badge RACButton's children render prop, not the\n        // group value: `:381` is `{({isDisabled}) =>`, which shadows the `ctx`\n        // destructuring at `:348`, so the `isDisabled` passed at `:436` is the\n        // resolved `props.isDisabled ?? ctx.isDisabled`\n        // (`@react-spectrum/s2@1.7.0/src/ActionButton.tsx:348,358,381,436`;\n        // `react-aria-components@1.21.0/dist/private/Button.mjs:51` coerces it).\n        // So the Form greys the badge too. The proxy alone misses the group.\n        return !!isDisabled();\n      },\n      styles: () =>\n        style({\n          position: \"absolute\",\n          top: \"--badgeTop\",\n          marginTop: \"calc((self(height) * -1)/2)\",\n          marginStart: \"calc(var(--iconMargin) * 2 + (self(height) * -1)/4)\",\n          gridColumnStart: 1,\n          insetStart: \"--badgePosition\",\n          visibility: {\n            isProgressVisible: \"hidden\",\n          },\n        })({ isProgressVisible: isProgressVisible() }),\n    };\n\n    function ResolvedContent() {\n      const resolvedChildren = resolveChildren(() => local.children);\n      const content = () => resolvedChildren();\n      const textChild = () => getSingleTextChild(content());\n\n      return (\n        <>\n          {textChild() !== undefined ? (\n            <span\n              class={s2ActionButtonText({ isProgressVisible: isProgressVisible() })}\n              data-rsp-slot=\"text\"\n            >\n              {textChild()}\n            </span>\n          ) : (\n            content()\n          )}\n        </>\n      );\n    }\n\n    return (\n      <SkeletonContext value={null}>\n        <TextContext value={textContextValue}>\n          <IconContext value={iconContextValue}>\n            <AvatarContext value={avatarContextValue}>\n              <ImageContext value={imageContextValue}>\n                <NotificationBadgeContext value={notificationBadgeContextValue}>\n                  <ResolvedContent />\n                  {local.isPending ? (\n                    <div\n                      class={s2ActionButtonPendingIndicator({\n                        isProgressVisible: isProgressVisible(),\n                      })}\n                    >\n                      <S2PendingProgressCircle\n                        aria-label={pendingLabel()}\n                        size={size()}\n                        staticColor={local.staticColor}\n                      />\n                    </div>\n                  ) : null}\n                  {local.holdAffordance ? (\n                    <CornerTriangle\n                      size={cornerTriangleSize()}\n                      class={style({\n                        position: \"absolute\",\n                        insetEnd: {\n                          size: {\n                            XS: space(3),\n                            S: space(3),\n                            M: 4,\n                            L: space(5),\n                            XL: space(6),\n                          },\n                        },\n                        bottom: {\n                          size: {\n                            XS: space(3),\n                            S: space(3),\n                            M: 4,\n                            L: space(5),\n                            XL: space(6),\n                          },\n                        },\n                        scaleX: {\n                          direction: {\n                            rtl: -1,\n                          },\n                        },\n                      })({ direction: locale().direction, size: size() })}\n                    />\n                  ) : null}\n                </NotificationBadgeContext>\n              </ImageContext>\n            </AvatarContext>\n          </IconContext>\n        </TextContext>\n      </SkeletonContext>\n    );\n  }\n\n  return (\n    <HeadlessButton\n      {...headlessProps}\n      {...menuTriggerButtonProps}\n      isDisabled={isDisabled()}\n      isPending={local.isPending}\n      isPendingFocusable\n      ref={(element: HTMLButtonElement) => {\n        buttonElement = element;\n        setResolvedButtonElement(element);\n        assignButtonRefs(element);\n      }}\n      onHoverChange={(hovered) => {\n        local.onHoverChange?.(hovered);\n      }}\n      onPressChange={(pressed) => {\n        local.onPressChange?.(pressed);\n      }}\n      onPress={(event) => {\n        if (menuTriggerContext?.triggerRef?.() === buttonElement) {\n          const menuOnPress = (menuTriggerContext!.triggerProps as Partial<HeadlessButtonProps>)\n            .onPress;\n          menuOnPress?.(event);\n        }\n        local.onPress?.(event);\n      }}\n      class={getClassName}\n      style={getPressScaleStyle}\n    >\n      <ActionButtonContent />\n    </HeadlessButton>\n  );\n}\n"],"mappings":"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"}

package/dist/_chunk/ActionButton.jsx

@@ -1,33 +1,71 @@
+/*
+* Copyright 2024 Adobe. All rights reserved.
+* This file is licensed to you under the Apache License, Version 2.0 (the "License");
+* you may not use this file except in compliance with the License. You may obtain a copy
+* of the License at http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing, software distributed under
+* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+* OF ANY KIND, either express or implied. See the License for the specific language
+* governing permissions and limitations under the License.
+*/
+// Ported to SolidJS for Proyecto Viviana; based on packages/@react-spectrum/s2/src/ActionButton.tsx
+/*
+* Copyright 2024 Adobe. All rights reserved.
+* This file is licensed to you under the Apache License, Version 2.0 (the "License");
+* you may not use this file except in compliance with the License. You may obtain a copy
+* of the License at http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing, software distributed under
+* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+* OF ANY KIND, either express or implied. See the License for the specific language
+* governing permissions and limitations under the License.
+*/
+// Ported to SolidJS for Proyecto Viviana; based on packages/@react-spectrum/s2/src/ProgressCircle.tsx
+/*
+* Copyright 2024 Adobe. All rights reserved.
+* This file is licensed to you under the Apache License, Version 2.0 (the "License");
+* you may not use this file except in compliance with the License. You may obtain a copy
+* of the License at http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing, software distributed under
+* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+* OF ANY KIND, either express or implied. See the License for the specific language
+* governing permissions and limitations under the License.
+*/
+// Ported to SolidJS for Proyecto Viviana; based on packages/@react-spectrum/s2/src/Button.tsx
 import { t as mergeStyles } from "./runtime.jsx";
-import { useProviderProps } from "../provider/index.jsx";
+import { a as useProviderProps } from "./provider.jsx";
 import { a as useActionButtonContext } from "./context.jsx";
 import { a as mergeContextUnsafeStyle, i as mergeContextStyles, n as getSlottedContextProps, r as mergeContextRefs } from "./spectrum-context.jsx";
 import { a as s2ActionButtonText, d as useActionButtonGroupContext, i as s2ActionButtonStaticColor, r as s2ActionButtonPendingIndicator, t as s2ActionButton } from "./s2-action-button-styles.jsx";
 import { t as s2IntlStrings } from "./intl.jsx";
+import { SkeletonContext } from "../skeleton/index.jsx";
+import { i as useFormProps } from "./form.jsx";
 import { centerBaseline } from "../icon/center-baseline.jsx";
 import { pressScale } from "../pressScale.jsx";
-import { SkeletonContext } from "../skeleton/index.jsx";
 import { t as IconContext } from "./spectrum-icon.jsx";
 import { ImageContext } from "../image/index.jsx";
 import { AvatarContext } from "../avatar/index.jsx";
 import { NotificationBadgeContext } from "../notificationbadge/index.jsx";
-import { c as TextContext } from "./text.jsx";
+import { c as TextContext$1 } from "./text.jsx";
 import { t as getSingleTextChild } from "./text-child.jsx";
-import { children, createEffect, createSignal, mergeProps, onCleanup, splitProps, useContext } from "solid-js";
-import { createStringFormatter } from "@proyecto-viviana/solidaria";
+import { t as CornerTriangle } from "./CornerTriangle.jsx";
+import { children, createEffect, createSignal, useContext } from "solid-js";
+import { splitProps } from "@proyecto-viviana/solidaria/utils";
 import { Button, DialogTriggerContext, MenuTriggerContext, PopoverTriggerContext, ProgressBar } from "@proyecto-viviana/solidaria-components";
+import { createStringFormatter, mergeProps as mergeProps$1, useLocale } from "@proyecto-viviana/solidaria";
 //#region src/button/pending-state.ts
 function createPendingState(isPending) {
-	const [isProgressVisible, setIsProgressVisible] = createSignal(false);
-	createEffect(() => {
-		let timeout;
-		if (isPending()) timeout = setTimeout(() => {
-			setIsProgressVisible(true);
-		}, 1e3);
-		else setIsProgressVisible(false);
-		onCleanup(() => {
-			if (timeout) clearTimeout(timeout);
-		});
+	const [isProgressVisible, setIsProgressVisible] = createSignal(false, { ownedWrite: true });
+	createEffect(() => isPending() ?? false, (pending) => {
+		if (pending) {
+			const timeout = setTimeout(() => {
+				setIsProgressVisible(true);
+			}, 1e3);
+			return () => clearTimeout(timeout);
+		}
+		setIsProgressVisible(false);
 	});
 	return { isProgressVisible };
 }
@@ -36,53 +74,45 @@ const s2ProgressCircleIndeterminateAnimation = `Z8Un9b 1s cubic-bezier(.6, .1, .
 //#region src/button/s2-progress-circle-styles.ts
 const s2PendingProgressCircle = function anonymous(props) {
 	let rules = " ";
-	if (props.staticColor === "white") rules += " -Ovbhqd-gcwrnr151";
-	else if (props.staticColor === "black") rules += " -Ovbhqd-g4hn3s151";
-	if (props.size === "XL") rules += " Zo151";
-	else if (props.size === "L") rules += " Zm151";
-	else if (props.size === "M") rules += " Zl151";
-	else if (props.size === "S") rules += " Zk151";
-	else if (props.size === "XS") rules += " Zj151";
-	if (props.size === "XL") rules += " Fp151";
-	else if (props.size === "L") rules += " Fn151";
-	else if (props.size === "M") rules += " Fm151";
-	else if (props.size === "S") rules += " Fl151";
-	else if (props.size === "XS") rules += " Fk151";
-	rules += " fa151";
+	if (props.staticColor === "white") rules += " -Ovbhqd-gcwrnr17";
+	else if (props.staticColor === "black") rules += " -Ovbhqd-g4hn3s17";
+	rules += " ZObNfn17";
+	rules += " FObNfn17";
+	rules += " fa17";
 	return rules;
 };
 const s2PendingProgressCircleTrack = function anonymous(props) {
 	let rules = " ";
-	if (props.isStaticColor) rules += " Vd151";
-	else rules += " VfbAdGe151";
-	rules += " Vla151";
-	if (props.size === "L") rules += " _VuNalie151";
-	else if (props.size === "S") rules += " _V7m7Gv151";
-	else rules += " _Vwtfhvc151";
-	if (props.size === "L") rules += " _Vlwtfhvc151";
-	else if (props.size === "S") rules += " _Vlai5a0151";
-	else rules += " _Vl7m7Gv151";
+	if (props.isStaticColor) rules += " Vd17";
+	else rules += " VSNu3ze17";
+	rules += " Vla17";
+	if (props.size === "L") rules += " _VuNalie17";
+	else if (props.size === "S") rules += " _V7m7Gv17";
+	else rules += " _Vwtfhvc17";
+	if (props.size === "L") rules += " _Vlwtfhvc17";
+	else if (props.size === "S") rules += " _Vlai5a017";
+	else rules += " _Vl7m7Gv17";
 	return rules;
 };
 const s2PendingProgressCircleFill = function anonymous(props) {
 	let rules = " ";
-	if (props.isStaticColor) rules += " Ve151";
-	else rules += " V5dxOg151";
-	rules += " VlUG8Hlc151";
-	rules += " _Sa151";
-	rules += " _0d151";
-	if (props.size === "L") rules += " _VuNalie151";
-	else if (props.size === "S") rules += " _V7m7Gv151";
-	else rules += " _Vwtfhvc151";
+	if (props.isStaticColor) rules += " Ve17";
+	else rules += " VwOLUue17";
+	rules += " VlUG8Hlc17";
+	rules += " _Sa17";
+	rules += " _0d17";
+	if (props.size === "L") rules += " _VuNalie17";
+	else if (props.size === "S") rules += " _V7m7Gv17";
+	else rules += " _Vwtfhvc17";
 	return rules;
 };
 const s2PendingProgressCircleHcmStroke = function anonymous(props) {
 	let rules = " ";
-	rules += " VRWHrbc151";
-	rules += " VlUG8Hlc151";
-	if (props.size === "L") rules += " _VuNalie151";
-	else if (props.size === "S") rules += " _V7m7Gv151";
-	else rules += " _Vwtfhvc151";
+	rules += " VRWHrbc17";
+	rules += " VlUG8Hlc17";
+	if (props.size === "L") rules += " _VuNalie17";
+	else if (props.size === "S") rules += " _V7m7Gv17";
+	else rules += " _Vwtfhvc17";
 	return rules;
 };
 //#endregion
@@ -112,21 +142,22 @@ function S2PendingProgressCircle(props) {
 }
 //#endregion
 //#region src/button/ActionButton.tsx
-const avatarSize = {
-	XS: 14,
-	S: 16,
-	M: 20,
-	L: 22,
-	XL: 26
-};
 /**
 * ActionButtons allow users to perform an action.
 */ function ActionButton(props) {
 	const runtimeProps = props;
 	const providerProps = useProviderProps(runtimeProps);
+	const [flags] = splitProps(providerProps, [
+		"isQuiet",
+		"isEmphasized",
+		"isDisabled",
+		"isRequired",
+		"isReadOnly",
+		"validationState"
+	]);
 	const contextProps = getSlottedContextProps(useActionButtonContext(), runtimeProps.slot);
 	const groupContext = getSlottedContextProps(useActionButtonGroupContext(), void 0);
-	const [local, headlessProps] = splitProps(mergeProps({ size: "M" }, providerProps, contextProps ?? {}, runtimeProps, {
+	const merged = useFormProps(mergeProps$1(flags, contextProps ?? {}, runtimeProps, {
 		get size() {
 			return groupContext?.size;
 		},
@@ -136,9 +167,6 @@ const avatarSize = {
 		get isQuiet() {
 			return groupContext?.isQuiet;
 		},
-		get isDisabled() {
-			return groupContext?.isDisabled;
-		},
 		get density() {
 			return groupContext?.density;
 		},
@@ -148,7 +176,8 @@ const avatarSize = {
 		get isJustified() {
 			return groupContext?.isJustified;
 		}
-	}), [
+	}));
+	const [local, headlessProps] = splitProps(merged, [
 		"size",
 		"staticColor",
 		"isQuiet",
@@ -157,6 +186,7 @@ const avatarSize = {
 		"UNSAFE_className",
 		"UNSAFE_style",
 		"children",
+		"holdAffordance",
 		"ref",
 		"onPress",
 		"onPressChange",
@@ -165,15 +195,21 @@ const avatarSize = {
 		"orientation",
 		"isJustified"
 	]);
+	const isDisabled = () => headlessProps.isDisabled ?? groupContext?.isDisabled;
 	const { isProgressVisible } = createPendingState(() => local.isPending);
 	const dialogTriggerContext = useContext(DialogTriggerContext);
 	const menuTriggerContext = useContext(MenuTriggerContext);
 	const popoverTriggerContext = useContext(PopoverTriggerContext);
 	const stringFormatter = createStringFormatter(s2IntlStrings, "@react-spectrum/s2");
+	const locale = useLocale();
 	let buttonElement;
 	const [resolvedButtonElement, setResolvedButtonElement] = createSignal(null);
 	const assignButtonRefs = mergeContextRefs(contextProps?.ref, runtimeProps.ref);
 	const size = () => local.size ?? "M";
+	const cornerTriangleSize = () => {
+		const currentSize = size();
+		return currentSize === "XS" ? "S" : currentSize;
+	};
 	const density = () => local.density ?? "regular";
 	const orientation = () => local.orientation ?? "horizontal";
 	const isOverlayTriggerOpen = () => !!buttonElement && (dialogTriggerContext?.triggerRef() === buttonElement && dialogTriggerContext.state.isOpen() || popoverTriggerContext?.triggerRef() === buttonElement && popoverTriggerContext.state.isOpen());
@@ -210,23 +246,7 @@ const avatarSize = {
 		isInGroup: !!groupContext
 	}) : void 0, mergedStyles())].filter(Boolean).join(" ");
 	const getPressScaleStyle = (renderProps) => pressScale(() => buttonElement, mergedUnsafeStyle())(renderProps);
-	const menuTriggerButtonProps = () => {
-		if (!menuTriggerContext) return {};
-		return {
-			get "aria-haspopup"() {
-				return menuTriggerContext.triggerProps["aria-haspopup"];
-			},
-			get "aria-expanded"() {
-				return menuTriggerContext.triggerProps["aria-expanded"];
-			},
-			get "aria-controls"() {
-				return menuTriggerContext.triggerProps["aria-controls"];
-			},
-			get "aria-disabled"() {
-				return menuTriggerContext.triggerProps["aria-disabled"];
-			}
-		};
-	};
+	const menuTriggerButtonProps = !menuTriggerContext ? {} : mergeProps$1(splitProps(menuTriggerContext.triggerProps, ["onKeyDown"])[1], { onPressStart: menuTriggerContext.onPressStart });
 	const syncMenuTriggerAttribute = (element, name, value) => {
 		if (value == null) {
 			element.removeAttribute(name);
@@ -236,29 +256,34 @@ const avatarSize = {
 	};
 	createEffect(() => {
 		const element = resolvedButtonElement();
-		if (!element || !menuTriggerContext) return;
+		if (!element || !menuTriggerContext || menuTriggerContext.triggerRef?.() !== element) return null;
 		const triggerProps = menuTriggerContext.triggerProps;
-		syncMenuTriggerAttribute(element, "aria-haspopup", triggerProps["aria-haspopup"]);
-		syncMenuTriggerAttribute(element, "aria-expanded", triggerProps["aria-expanded"]);
-		syncMenuTriggerAttribute(element, "aria-controls", triggerProps["aria-controls"]);
-		syncMenuTriggerAttribute(element, "aria-disabled", triggerProps["aria-disabled"]);
+		return {
+			element,
+			haspopup: triggerProps["aria-haspopup"],
+			expanded: triggerProps["aria-expanded"],
+			controls: triggerProps["aria-controls"],
+			disabled: triggerProps["aria-disabled"]
+		};
+	}, (snapshot) => {
+		if (!snapshot) return;
+		syncMenuTriggerAttribute(snapshot.element, "aria-haspopup", snapshot.haspopup);
+		syncMenuTriggerAttribute(snapshot.element, "aria-expanded", snapshot.expanded);
+		syncMenuTriggerAttribute(snapshot.element, "aria-controls", snapshot.controls);
+		syncMenuTriggerAttribute(snapshot.element, "aria-disabled", snapshot.disabled);
 	});
 	createEffect(() => {
 		const element = resolvedButtonElement();
-		if (!element || !menuTriggerContext) return;
+		if (!element || !menuTriggerContext || menuTriggerContext.triggerRef?.() !== element) return null;
+		return element;
+	}, (element) => {
+		if (!element) return;
 		const onKeyDown = (event) => {
-			if (event.key !== "ArrowDown" && event.key !== "ArrowUp") return;
-			menuTriggerContext.triggerProps.onKeyDown?.(event);
+			(menuTriggerContext?.triggerProps)?.onKeyDown?.(event);
 		};
 		element.addEventListener("keydown", onKeyDown);
-		onCleanup(() => element.removeEventListener("keydown", onKeyDown));
+		return () => element.removeEventListener("keydown", onKeyDown);
 	});
-	const pendingAccessibleLabel = () => {
-		const existingLabel = headlessProps["aria-label"];
-		if (existingLabel != null) return existingLabel;
-		const content = children(() => local.children)();
-		return local.isPending && typeof content === "string" ? content : void 0;
-	};
 	function ActionButtonContent() {
 		const iconContextValue = {
 			slot: "icon",
@@ -266,28 +291,26 @@ const avatarSize = {
 				slot: "icon",
 				styles: () => function anonymous(props) {
 					let rules = " ";
-					rules += " z2U5Crc151";
-					rules += " y2U5Crc151";
-					rules += " B2U5Crc151";
-					rules += " A2U5Crc151";
-					if (props.isProgressVisible) rules += " _6b151";
+					rules += " z2U5Crc17";
+					rules += " y2U5Crc17";
+					rules += " B2U5Crc17";
+					rules += " A2U5Crc17";
+					if (props.isProgressVisible) rules += " _6b17";
 					return rules;
 				}({ isProgressVisible: isProgressVisible() })
 			}),
-			styles: " ZXJkxGe151 FXJkxGe151 I67logd151 _va151"
+			styles: " ZXJkxGe17 FXJkxGe17 I67logd17 _va17"
 		};
 		const textContextValue = { styles: () => s2ActionButtonText({ isProgressVisible: isProgressVisible() }) };
 		const avatarContextValue = {
-			get size() {
-				return avatarSize[size()];
-			},
+			size: "1lh",
 			get styles() {
-				return " I67logd151 z2U5Crc151 y2U5Crc151 B2U5Crc151 A2U5Crc151";
+				return " I67logd17 z2U5Crc17 y2U5Crc17 B2U5Crc17 A2U5Crc17";
 			}
 		};
 		const imageContextValue = { styles: () => function anonymous(props) {
 			let rules = " ";
-			if (props.isProgressVisible) rules += " _6b151";
+			if (props.isProgressVisible) rules += " _6b17";
 			return rules;
 		}({ isProgressVisible: isProgressVisible() }) };
 		const notificationBadgeContextValue = {
@@ -299,17 +322,17 @@ const avatarSize = {
 				return currentSize === "XS" ? void 0 : currentSize;
 			},
 			get isDisabled() {
-				return !!headlessProps.isDisabled;
+				return !!isDisabled();
 			},
 			styles: () => function anonymous(props) {
 				let rules = " ";
-				rules += " _Pa151";
-				rules += " WtedXZc151";
-				rules += " JlZStSb151";
-				rules += " Ijgro3c151";
-				rules += " z2mU151";
-				rules += " _A1IiWH151";
-				if (props.isProgressVisible) rules += " _6b151";
+				rules += " _Pa17";
+				rules += " WtedXZc17";
+				rules += " JlZStSb17";
+				rules += " Ijgro3c17";
+				rules += " z2mU17";
+				rules += " _A1IiWH17";
+				if (props.isProgressVisible) rules += " _6b17";
 				return rules;
 			}({ isProgressVisible: isProgressVisible() })
 		};
@@ -317,28 +340,52 @@ const avatarSize = {
 			const resolvedChildren = children(() => local.children);
 			const content = () => resolvedChildren();
 			const textChild = () => getSingleTextChild(content());
-			return textChild() !== void 0 ? <span class={s2ActionButtonText({ isProgressVisible: isProgressVisible() })} data-rsp-slot="text">
-          {textChild()}
-        </span> : content();
+			return <>
+          {textChild() !== void 0 ? <span class={s2ActionButtonText({ isProgressVisible: isProgressVisible() })} data-rsp-slot="text">
+              {textChild()}
+            </span> : content()}
+        </>;
 		}
-		return <SkeletonContext.Provider value={null}>
-        <TextContext.Provider value={textContextValue}>
-          <IconContext.Provider value={iconContextValue}>
-            <AvatarContext.Provider value={avatarContextValue}>
-              <ImageContext.Provider value={imageContextValue}>
-                <NotificationBadgeContext.Provider value={notificationBadgeContextValue}>
+		return <SkeletonContext value={null}>
+        <TextContext$1 value={textContextValue}>
+          <IconContext value={iconContextValue}>
+            <AvatarContext value={avatarContextValue}>
+              <ImageContext value={imageContextValue}>
+                <NotificationBadgeContext value={notificationBadgeContextValue}>
                   <ResolvedContent />
                   {local.isPending ? <div class={s2ActionButtonPendingIndicator({ isProgressVisible: isProgressVisible() })}>
                       <S2PendingProgressCircle aria-label={pendingLabel()} size={size()} staticColor={local.staticColor} />
                     </div> : null}
-                </NotificationBadgeContext.Provider>
-              </ImageContext.Provider>
-            </AvatarContext.Provider>
-          </IconContext.Provider>
-        </TextContext.Provider>
-      </SkeletonContext.Provider>;
+                  {local.holdAffordance ? <CornerTriangle size={cornerTriangleSize()} class={function anonymous(props) {
+			let rules = " ";
+			rules += " _Pa17";
+			if (props.size === "XL") rules += " _zWJpoB17";
+			else if (props.size === "L") rules += " _zC1otk17";
+			else if (props.size === "M") rules += " _zE17";
+			else if (props.size === "S") rules += " _zwtfhvc17";
+			else if (props.size === "XS") rules += " _zwtfhvc17";
+			if (props.size === "XL") rules += " _lWJpoB17";
+			else if (props.size === "L") rules += " _lC1otk17";
+			else if (props.size === "M") rules += " _lE17";
+			else if (props.size === "S") rules += " _lwtfhvc17";
+			else if (props.size === "XS") rules += " _lwtfhvc17";
+			if (props.direction === "rtl") {
+				rules += " -Z4Pn4c-a17";
+				rules += " __Ha17";
+			}
+			return rules;
+		}({
+			direction: locale().direction,
+			size: size()
+		})} /> : null}
+                </NotificationBadgeContext>
+              </ImageContext>
+            </AvatarContext>
+          </IconContext>
+        </TextContext$1>
+      </SkeletonContext>;
 	}
-	return <Button {...headlessProps} {...menuTriggerButtonProps()} aria-label={pendingAccessibleLabel()} isPending={local.isPending} isPendingFocusable ref={(element) => {
+	return <Button {...headlessProps} {...menuTriggerButtonProps} isDisabled={isDisabled()} isPending={local.isPending} isPendingFocusable ref={(element) => {
 		buttonElement = element;
 		setResolvedButtonElement(element);
 		assignButtonRefs(element);
@@ -347,7 +394,11 @@ const avatarSize = {
 	}} onPressChange={(pressed) => {
 		local.onPressChange?.(pressed);
 	}} onPress={(event) => {
-		if (!local.isPending) local.onPress?.(event);
+		if (menuTriggerContext?.triggerRef?.() === buttonElement) {
+			const menuOnPress = menuTriggerContext.triggerProps.onPress;
+			menuOnPress?.(event);
+		}
+		local.onPress?.(event);
 	}} class={getClassName} style={getPressScaleStyle}>
       <ActionButtonContent />
     </Button>;