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

package/dist/_chunk/LinkButton.jsx.map

@@ -1 +1 @@
-{"version":3,"file":"LinkButton.jsx","names":[],"sources":["../../src/button/s2-button-styles.ts","../../src/button/LinkButton.tsx"],"sourcesContent":["// @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 { baseColor, focusRing, lightDark, style } from \"../style\" with { type: \"macro\" };\nimport {\n  control,\n  getAllowedOverrides,\n  staticColor,\n} from \"../s2-internal/style-utils\" with { type: \"macro\" };\nimport type { ButtonFillStyle, ButtonSize, ButtonVariant, StaticColor } from \"./types\";\n\nexport interface S2ButtonRenderState {\n  isHovered?: boolean;\n  isPressed?: boolean;\n  isFocused?: boolean;\n  isFocusVisible?: boolean;\n  isDisabled?: boolean;\n  isPending?: boolean;\n}\n\nexport interface S2ButtonStyleProps extends S2ButtonRenderState {\n  variant: ButtonVariant;\n  fillStyle: ButtonFillStyle;\n  size: ButtonSize;\n  staticColor?: StaticColor;\n  isStaticColor: boolean;\n}\n\nexport const s2Button = style<S2ButtonStyleProps>(\n  {\n    ...focusRing(),\n    ...staticColor(),\n    ...control({ shape: \"default\", wrap: true, icon: true }),\n    position: \"relative\",\n    justifyContent: \"center\",\n    textAlign: \"start\",\n    /* The Glasselated register — 5px corner, `--edge-glass` rim, mono 400 — now\n     * arrives with `control()` above, which reads it off the handoff's own button\n     * (TerminalGlassLab.tsx:230 `btnBase` over design-handoff-v2.css:283\n     * `--type-button`). It used to be spelled out here, which is exactly why Button\n     * was the only control that converted. Size and padding still come from\n     * `control()`'s S/M/L/XL ramp rather than the mock's single fixed 7px/14px.\n     *\n     * No blur: the handoff's buttons are opaque. Glass is a surface treatment. */\n    userSelect: \"none\",\n    width: \"fit\",\n    textDecoration: \"none\",\n    transition: \"default\",\n    borderStyle: \"solid\",\n    borderWidth: {\n      fillStyle: {\n        /* Filled buttons carry the edge too. Every button the handoff draws has one,\n         * with no exception: accent `1px solid var(--interactive-fill)` over the same\n         * fill (TerminalGlassLab.tsx:303-304), secondary `1px solid var(--border-subtle)`\n         * (:315), create (:326), ghost over a transparent fill (:352), the well-filled\n         * RUN (:365). `btnBase` (:230-235) declares only radius/padding/cursor/shadow,\n         * so each variant spells its own edge — and every one of them does.\n         *\n         * This was 0, which is why `variant.create: 1` below was the only edge in the\n         * component that ever drew. `control()` sets `boxSizing: \"border-box\"`, so the\n         * S/M/L/XL height ramp is unchanged; only the content box narrows by 2px. */\n        fill: 1,\n        /* 1px, not Spectrum's 2px: the handoff's secondary and ghost buttons are\n         * hairline-edged like everything else it draws (TerminalGlassLab.tsx:231),\n         * and a 2px edge beside a 1px field reads as a different weight class. */\n        outline: 1,\n      },\n      variant: {\n        /* The handoff draws create with an explicit 1px rim in its own border token,\n         * not the fill colour — the pale wash needs the edge to hold its shape against\n         * a light surface. `variant` is applied after `fillStyle`, so this is 1px in\n         * both fill and outline, which is what the handoff shows. */\n        create: 1,\n      },\n    },\n    borderColor: {\n      variant: {\n        /* `primary` deliberately stays on the neutral ramp. The handoff's filled CTA\n         * draws its border in its own FILL colour — `1px solid var(--interactive-fill)`\n         * over `background-color: var(--interactive-fill)` (TerminalGlassLab.tsx:303-304)\n         * — so gray-800 tracking the `baseColor(\"neutral\")` fill below is already the\n         * right idiom. A hairline here would break that fill/edge pairing. */\n        primary: baseColor(\"gray-800\"),\n        /* `var(--border-subtle)` — the handoff's secondary (TerminalGlassLab.tsx:315)\n         * and ghost (:352) buttons are both hairlines in it. gray-300 is a solid mid-gray\n         * (#c5d0de light, #67717d dark), a full rule weight rather than an edge.\n         *\n         * Plain string, not `baseColor()`: --border-subtle has no ramp to step along, so\n         * this intentionally drops the hover/press border steps `baseColor()` was emitting\n         * — the handoff declares no hover border change on any button. The sibling\n         * `isStaticColor` branch below stays on `baseColor(\"transparent-overlay-300\")`\n         * on purpose; that is the over-imagery case and keeps its overlay ramp. */\n        secondary: \"border-subtle\",\n        create: \"create-border\",\n      },\n      /* Every FILLED variant needs its border colour spelled out HERE, under\n       * `fillStyle.fill.variant`. The earlier note claimed variants with no entry\n       * \"fall through to `variant` above\" the way `borderWidth` does — that is\n       * WRONG for a colour value, and it shipped Today (secondary-fill) and Create\n       * (create-fill) with a black rim. The reason `borderWidth` falls through is\n       * that BOTH its keys (`fillStyle.fill` and `variant.create`) name a width, so\n       * a fill button always has one to land on. `borderColor` does not: once the\n       * higher-priority `fillStyle` key matches (fillStyle === \"fill\"), it OWNS the\n       * result, and a fill variant with no leaf in this sub-map resolves to nothing\n       * from the winning branch — it does NOT consult the sibling `variant` map\n       * below. The only value left is the `forcedColors` fallback, `ButtonBorder`,\n       * which paints black in a normal viewport. So each fill variant is listed\n       * explicitly, mirroring the proven accent path stop for stop.\n       *\n       * The `variant` map below is kept for the OUTLINE variants (Ghost), which do\n       * not match `fillStyle.fill` and so still read secondary/create from it.\n       *\n       * accent/negative border the button in the same token as their fill\n       * (handoff :303-304), so they mirror the `backgroundColor` map stop for stop,\n       * hover included. secondary and create carry no hover-border step (the\n       * handoff declares none), so each is a flat token: `border-subtle` for the\n       * secondary hairline, `create-border` for the create rim (the pale wash needs\n       * the edge to hold its shape). primary tracks its neutral fill in gray-800,\n       * matching the `variant.primary` idiom. Placed before\n       * `isDisabled`/`isStaticColor`/`forcedColors` so those still win. */\n      fillStyle: {\n        fill: {\n          variant: {\n            primary: baseColor(\"gray-800\"),\n            secondary: \"border-subtle\",\n            create: \"create-border\",\n            accent: {\n              default: lightDark(\"accent-900\", \"accent-700\"),\n              isHovered: lightDark(\"accent-1000\", \"accent-800\"),\n              isPressed: lightDark(\"accent-1000\", \"accent-800\"),\n              isFocusVisible: lightDark(\"accent-1000\", \"accent-800\"),\n            },\n            negative: {\n              default: lightDark(\"negative-900\", \"negative-700\"),\n              isHovered: lightDark(\"negative-1000\", \"negative-600\"),\n              isPressed: lightDark(\"negative-1000\", \"negative-600\"),\n              isFocusVisible: lightDark(\"negative-1000\", \"negative-600\"),\n            },\n            /* warning/success are negative's status counterparts: the same saturated-fill\n             * idiom on the warm (notice -> amber) and success (positive -> green) channels.\n             * Border mirrors the fill stop for stop, exactly as accent/negative do. */\n            warning: {\n              default: lightDark(\"notice-900\", \"notice-700\"),\n              isHovered: lightDark(\"notice-1000\", \"notice-600\"),\n              isPressed: lightDark(\"notice-1000\", \"notice-600\"),\n              isFocusVisible: lightDark(\"notice-1000\", \"notice-600\"),\n            },\n            success: {\n              default: lightDark(\"positive-900\", \"positive-700\"),\n              isHovered: lightDark(\"positive-1000\", \"positive-600\"),\n              isPressed: lightDark(\"positive-1000\", \"positive-600\"),\n              isFocusVisible: lightDark(\"positive-1000\", \"positive-600\"),\n            },\n          },\n        },\n      },\n      isDisabled: \"disabled\",\n      isStaticColor: {\n        variant: {\n          primary: baseColor(\"transparent-overlay-800\"),\n          secondary: baseColor(\"transparent-overlay-300\"),\n        },\n        isDisabled: \"transparent-overlay-300\",\n      },\n      forcedColors: {\n        default: \"ButtonBorder\",\n        isHovered: \"Highlight\",\n        isDisabled: \"GrayText\",\n      },\n    },\n    backgroundColor: {\n      fillStyle: {\n        fill: {\n          variant: {\n            primary: baseColor(\"neutral\"),\n            secondary: {\n              /* `var(--btn-secondary-bg)` (TerminalGlassLab.tsx:314) — #e9eff6 in light,\n               * `var(--surface-raised)` = rgb(51,58,68) in dark (design-handoff-v2.css:73,\n               * :196, :179). No pre-existing token covered both schemes: `raised` is\n               * #ffffff in light and `well` is #0a0f14 in dark, so each matches only one.\n               * The backgroundColor map therefore gained a `btn-secondary` entry pointing\n               * at the variable the island already ships. gray-100 (#e5eaf1 / #43474d) was\n               * a step off in both schemes and lost the slate cast in dark.\n               *\n               * The hover/press/focus stops stay on gray-200 (#dbe3ed / #555c64). Against\n               * the new resting fill that darkens in light and lightens in dark, which is\n               * the correct direction in each scheme — hover moves toward contrast with\n               * the page, so it necessarily reverses between schemes. --surface-hover is\n               * NOT usable here: it is an alpha wash (rgba(255,255,255,.75) light,\n               * rgba(58,62,70,.48) dark) meant to composite over a surface, and the macro\n               * bakes fills with no knowledge of the backdrop — see the gray-100/200 note\n               * in style/glasselated-ramps.ts. As a replacement fill it would turn an\n               * opaque button translucent on hover and, composited over the panel, invert\n               * the step in both schemes. */\n              default: \"btn-secondary\",\n              isHovered: \"gray-200\",\n              isPressed: \"gray-200\",\n              isFocusVisible: \"gray-200\",\n            },\n            accent: {\n              default: lightDark(\"accent-900\", \"accent-700\"),\n              isHovered: lightDark(\"accent-1000\", \"accent-800\"),\n              isPressed: lightDark(\"accent-1000\", \"accent-800\"),\n              isFocusVisible: lightDark(\"accent-1000\", \"accent-800\"),\n            },\n            negative: {\n              default: lightDark(\"negative-900\", \"negative-700\"),\n              isHovered: lightDark(\"negative-1000\", \"negative-600\"),\n              isPressed: lightDark(\"negative-1000\", \"negative-600\"),\n              isFocusVisible: lightDark(\"negative-1000\", \"negative-600\"),\n            },\n            /* warning/success fills mirror negative on the warm (notice -> amber) and success\n             * (positive -> green) channels. The green ramp is L-solved to carry the same\n             * white-ink contrast as amber, so all three status fills clear AA identically\n             * (see style/glasselated-ramps.ts). */\n            warning: {\n              default: lightDark(\"notice-900\", \"notice-700\"),\n              isHovered: lightDark(\"notice-1000\", \"notice-600\"),\n              isPressed: lightDark(\"notice-1000\", \"notice-600\"),\n              isFocusVisible: lightDark(\"notice-1000\", \"notice-600\"),\n            },\n            success: {\n              default: lightDark(\"positive-900\", \"positive-700\"),\n              isHovered: lightDark(\"positive-1000\", \"positive-600\"),\n              isPressed: lightDark(\"positive-1000\", \"positive-600\"),\n              isFocusVisible: lightDark(\"positive-1000\", \"positive-600\"),\n            },\n            /* The create CTA does not follow the semantic-fill pattern above. Those step\n             * along a ramp for hover; create-bg has no ramp, so the deeper wash is a named\n             * token. Both schemes are declared in the token itself, hence no lightDark(). */\n            create: {\n              default: \"create-bg\",\n              isHovered: \"create-bg-deep\",\n              isPressed: \"create-bg-deep\",\n              isFocusVisible: \"create-bg-deep\",\n            },\n          },\n          isDisabled: \"disabled\",\n        },\n        outline: {\n          default: \"transparent\",\n          isHovered: \"gray-100\",\n          isPressed: \"gray-100\",\n          isFocusVisible: \"gray-100\",\n          isDisabled: \"transparent\",\n        },\n      },\n      isStaticColor: {\n        fillStyle: {\n          fill: {\n            variant: {\n              primary: baseColor(\"transparent-overlay-800\"),\n              secondary: baseColor(\"transparent-overlay-100\"),\n            },\n            isDisabled: \"transparent-overlay-100\",\n          },\n          outline: {\n            default: \"transparent\",\n            isHovered: \"transparent-overlay-100\",\n            isPressed: \"transparent-overlay-100\",\n            isFocusVisible: \"transparent-overlay-100\",\n            isDisabled: \"transparent\",\n          },\n        },\n      },\n      forcedColors: {\n        fillStyle: {\n          fill: {\n            default: \"ButtonText\",\n            isHovered: \"Highlight\",\n            isDisabled: \"GrayText\",\n          },\n          outline: \"ButtonFace\",\n        },\n      },\n    },\n    color: {\n      fillStyle: {\n        fill: {\n          variant: {\n            primary: \"gray-25\",\n            secondary: baseColor(\"neutral\"),\n            accent: \"white\",\n            negative: \"white\",\n            /* warning/success carry white ink on their saturated fills, like accent/negative.\n             * The fill stops (notice/positive -900/-700) are pinned >= 4.5:1 on white. */\n            warning: \"white\",\n            success: \"white\",\n            /* Dark ink on a pale fill — the inverse of every Spectrum variant. #7a5600 on\n             * #ffedb0 is 6.4:1, so this clears AA comfortably in both schemes. */\n            create: \"create-ink\",\n          },\n          isDisabled: \"disabled\",\n        },\n        outline: {\n          default: baseColor(\"neutral\"),\n          variant: {\n            /* Ghost is the register's outlined SECONDARY, and the handoff inks it in the\n             * MUTED slate, not the strong neutral its filled twin (Today) wears: the\n             * `Ghost` button is drawn `color: var(--text-secondary)` on a transparent fill\n             * inside `--border-subtle` (TerminalGlassLab.tsx:273-277), whereas the filled\n             * secondary is `--text-primary`. `--text-secondary` is pinned to `gray-500` in\n             * both schemes (glasselated-ramps.ts:114,855 — #64748b light / #9aa0a8 dark),\n             * so a secondary+outline button de-emphasises its label exactly the way the\n             * register draws it. Every other outline variant keeps `outline.default`'s\n             * neutral ink; only secondary steps down. */\n            secondary: baseColor(\"gray-500\"),\n            /* create-ink is near-black in the dark scheme — legible ON the pale fill, not\n             * against a dark page. Outline drops the fill, so the dark scheme takes the\n             * fill colour as its ink instead. */\n            create: lightDark(\"create-ink\", \"create-bg\"),\n          },\n          isDisabled: \"disabled\",\n        },\n      },\n      isStaticColor: {\n        fillStyle: {\n          fill: {\n            variant: {\n              primary: \"auto\",\n              secondary: {\n                default: \"transparent-overlay-1000\",\n                isHovered: \"transparent-overlay-1000\",\n                isFocusVisible: \"transparent-overlay-1000\",\n                isPressed: \"transparent-overlay-1000\",\n              },\n            },\n          },\n          outline: {\n            default: {\n              default: \"transparent-overlay-1000\",\n              isHovered: \"transparent-overlay-1000\",\n              isFocusVisible: \"transparent-overlay-1000\",\n              isPressed: \"transparent-overlay-1000\",\n            },\n          },\n        },\n        isDisabled: \"transparent-overlay-400\",\n      },\n      forcedColors: {\n        fillStyle: {\n          fill: {\n            default: \"ButtonFace\",\n            isDisabled: \"HighlightText\",\n          },\n          outline: {\n            default: \"ButtonText\",\n            isDisabled: \"GrayText\",\n          },\n        },\n      },\n    },\n    \"--iconPrimary\": {\n      type: \"fill\",\n      value: \"currentColor\",\n    },\n    outlineColor: {\n      default: \"focus-ring\",\n      isStaticColor: \"transparent-overlay-1000\",\n      forcedColors: \"Highlight\",\n    },\n    forcedColorAdjust: \"none\",\n    disableTapHighlight: true,\n  },\n  getAllowedOverrides(),\n);\n\nexport const s2ButtonText = style<{ isProgressVisible?: boolean }>({\n  paddingY: \"--labelPadding\",\n  order: 1,\n  visibility: {\n    isProgressVisible: \"hidden\",\n  },\n});\n\nexport const s2ButtonPendingIndicator = style<{\n  isPending?: boolean;\n  isProgressVisible?: boolean;\n}>({\n  position: \"absolute\",\n  top: \"50%\",\n  left: \"50%\",\n  transform: \"translate(-50%, -50%)\",\n  visibility: {\n    default: \"hidden\",\n    isProgressVisible: \"visible\",\n  },\n});\n","import {\n  children as resolveChildren,\n  mergeProps,\n  splitProps,\n  useContext,\n  type JSX,\n} from \"solid-js\";\nimport {\n  DialogTriggerContext,\n  Link as HeadlessLink,\n  PopoverTriggerContext,\n  type LinkProps as HeadlessLinkProps,\n  type LinkRenderProps,\n} from \"@proyecto-viviana/solidaria-components\";\nimport type { StyleString } from \"../style\";\nimport { fontRelative, style } from \"../style\" with { type: \"macro\" };\nimport { IconContext } from \"../icon/spectrum-icon\";\nimport { centerBaseline } from \"../icon/center-baseline\";\nimport { SkeletonContext } from \"../skeleton\";\nimport { TextContext } from \"../text\";\nimport { useProviderProps } from \"../provider\";\nimport { pressScale } from \"../pressScale\";\nimport { useLinkButtonContext } from \"./context\";\nimport { s2Button, s2ButtonText } from \"./s2-button-styles\";\nimport {\n  getSlottedContextProps,\n  mergeContextRefs,\n  mergeContextStyles,\n  mergeContextUnsafeStyle,\n  type RefLike,\n} from \"./spectrum-context\";\nimport type { ButtonFillStyle, ButtonSize, ButtonVariant, StaticColor } from \"./types\";\nimport { getSingleTextChild } from \"./text-child\";\n\ntype StyledLinkButtonBaseProps = Omit<\n  HeadlessLinkProps,\n  \"class\" | \"style\" | \"children\" | \"onClick\"\n>;\n\nexport interface LinkButtonProps extends StyledLinkButtonBaseProps {\n  /** The content to display in the LinkButton. */\n  children?: JSX.Element;\n  /** The visual style of the LinkButton. */\n  variant?: ButtonVariant;\n  /** The background style of the LinkButton. */\n  fillStyle?: ButtonFillStyle;\n  /** The size of the LinkButton. */\n  size?: ButtonSize;\n  /** The static color style to apply. Useful when the LinkButton appears over a color background. */\n  staticColor?: StaticColor;\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 * A LinkButton navigates like a link while using the S2 Button visual treatment.\n */\nexport function LinkButton(props: LinkButtonProps): JSX.Element {\n  const providerProps = useProviderProps(props);\n  const contextProps = getSlottedContextProps(useLinkButtonContext(), props.slot);\n  const defaultProps: Partial<LinkButtonProps> = {\n    variant: \"primary\",\n    size: \"M\",\n    fillStyle: \"fill\",\n  };\n  const merged = mergeProps(defaultProps, providerProps, contextProps ?? {}, props);\n  const [local, headlessProps] = splitProps(merged, [\n    \"variant\",\n    \"fillStyle\",\n    \"size\",\n    \"staticColor\",\n    \"styles\",\n    \"UNSAFE_className\",\n    \"UNSAFE_style\",\n    \"children\",\n    \"ref\",\n  ]);\n\n  const variant = (): ButtonVariant => local.variant ?? \"primary\";\n  const fillStyle = (): ButtonFillStyle => local.fillStyle ?? \"fill\";\n  const size = (): ButtonSize => local.size ?? \"M\";\n  const mergedStyles = () => mergeContextStyles(contextProps?.styles, props.styles);\n  const mergedUnsafeStyle = () =>\n    mergeContextUnsafeStyle(contextProps?.UNSAFE_style, props.UNSAFE_style);\n  const dialogTriggerContext = useContext(DialogTriggerContext);\n  const popoverTriggerContext = useContext(PopoverTriggerContext);\n  let linkElement: HTMLAnchorElement | undefined;\n  const assignLinkRefs = mergeContextRefs(\n    (contextProps as { ref?: RefLike<HTMLElement> } | null)?.ref,\n    props.ref,\n  );\n  const isOverlayTriggerOpen = () =>\n    !!linkElement &&\n    ((dialogTriggerContext?.triggerRef() === linkElement && dialogTriggerContext.state.isOpen()) ||\n      (popoverTriggerContext?.triggerRef() === linkElement &&\n        popoverTriggerContext.state.isOpen()));\n\n  const getClassName = (renderProps: LinkRenderProps): string =>\n    [\n      local.UNSAFE_className,\n      s2Button(\n        {\n          isHovered: renderProps.isHovered || isOverlayTriggerOpen(),\n          isPressed: renderProps.isPressed,\n          isFocused: renderProps.isFocused,\n          isFocusVisible: renderProps.isFocusVisible,\n          isDisabled: renderProps.isDisabled,\n          isPending: false,\n          variant: variant(),\n          fillStyle: fillStyle(),\n          size: size(),\n          staticColor: local.staticColor,\n          isStaticColor: !!local.staticColor,\n        },\n        mergedStyles(),\n      ),\n    ]\n      .filter(Boolean)\n      .join(\" \");\n\n  const getStyle = (renderProps: LinkRenderProps): JSX.CSSProperties =>\n    pressScale(() => linkElement, mergedUnsafeStyle())(renderProps);\n\n  function LinkButtonContent() {\n    const iconContextValue = {\n      slot: \"icon\",\n      render: centerBaseline({ slot: \"icon\", styles: style({ order: 0 }) }),\n      styles: style({\n        size: fontRelative(20),\n        marginStart: \"--iconMargin\",\n        flexShrink: 0,\n      }),\n    };\n    const textContextValue = {\n      styles: () => s2ButtonText({ isProgressVisible: false }),\n      \"data-rsp-slot\": \"text\",\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 class={s2ButtonText({ isProgressVisible: false })} data-rsp-slot=\"text\">\n          {textChild()}\n        </span>\n      ) : (\n        content()\n      );\n    }\n\n    return (\n      <>\n        <SkeletonContext.Provider value={null}>\n          <TextContext.Provider value={textContextValue}>\n            <IconContext.Provider value={iconContextValue}>\n              <ResolvedContent />\n            </IconContext.Provider>\n          </TextContext.Provider>\n        </SkeletonContext.Provider>\n      </>\n    );\n  }\n\n  return (\n    <HeadlessLink\n      {...headlessProps}\n      class={getClassName}\n      style={getStyle}\n      ref={(element: HTMLElement) => {\n        linkElement = element as HTMLAnchorElement;\n        assignLinkRefs(element);\n      }}\n    >\n      <LinkButtonContent />\n    </HeadlessLink>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"LinkButton.jsx","names":[],"sources":["../../src/button/s2-button-styles.ts","../../src/button/LinkButton.tsx"],"sourcesContent":["// @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/Button.tsx\n\nimport { baseColor, focusRing, lightDark, style } from \"../style\" with { type: \"macro\" };\n\nimport {\n  control,\n  getAllowedOverrides,\n  staticColor,\n} from \"../s2-internal/style-utils\" with { type: \"macro\" };\nimport type { ButtonFillStyle, ButtonSize, ButtonVariant, StaticColor } from \"./types\";\n\nexport interface S2ButtonRenderState {\n  isHovered?: boolean;\n  isPressed?: boolean;\n  isFocused?: boolean;\n  isFocusVisible?: boolean;\n  isDisabled?: boolean;\n  isPending?: boolean;\n}\n\nexport interface S2ButtonStyleProps extends S2ButtonRenderState {\n  variant: ButtonVariant;\n  fillStyle: ButtonFillStyle;\n  size: ButtonSize;\n  staticColor?: StaticColor;\n  isStaticColor: boolean;\n}\n\nexport const s2Button = style<S2ButtonStyleProps>(\n  {\n    ...focusRing(),\n    ...staticColor(),\n    ...control({ shape: \"default\", wrap: true, icon: true }),\n    position: \"relative\",\n    justifyContent: \"center\",\n    textAlign: \"start\",\n    /* The Glasselated register — 5px corner, `--edge-glass` rim, mono 400 — now\n     * arrives with `control()` above, which reads it off the handoff's own button\n     * (TerminalGlassLab.tsx:230 `btnBase` over design-handoff-v2.css:283\n     * `--type-button`). It used to be spelled out here, which is exactly why Button\n     * was the only control that converted.\n     *\n     * No blur: the handoff's buttons are opaque. Glass is a surface treatment. */\n    userSelect: \"none\",\n    /* ...and the SIZE of that face, which `control()` cannot own. `controlFont()`\n     * is the whole library's S/M/L/XL band and resolves M to the `ui` rung (14px);\n     * the register's button is `--type-button`, mono 400 **13px** (viviana-tokens.css\n     * :456, re-valued from the handoff's own `--type-button`). Only the M rung is\n     * re-valued, because M is the only rung the handoff draws — the other three keep\n     * the shared ui ramp rather than acquiring three invented px values. Set as\n     * `fontSize` so it overrides only the size the `font:` shorthand established. */\n    fontSize: {\n      default: \"[13px]\",\n      size: {\n        XS: \"ui-xs\",\n        S: \"ui-sm\",\n        L: \"ui-lg\",\n        XL: \"ui-xl\",\n      },\n    },\n    /* Same argument for the horizontal padding. `control()` derives it from the height\n     * (`edge-to-text` = height * 3/8, so 12px at M), and the handoff draws its button\n     * at a flat `7px 14px` (TerminalGlassLab.tsx:231 `btnBase`). The M rung takes the\n     * drawn 14px; the rest stay on the derived ramp.\n     *\n     * The vertical half of that pair is NOT restated: `control({wrap: true})` centers\n     * the label in the 32px M control box, which puts ~6.5px above and below a 13px\n     * line — the drawn 7px, arrived at from the height ramp instead of pinned against\n     * it. Pinning paddingY here would fight `minHeight` and change nothing visible.\n     *\n     * The icon-only branch has to be restated because this key REPLACES `control()`'s\n     * whole `paddingX` map, and an icon-only button collapses its padding to 0. The\n     * selector is spelled out for the same reason s2-action-button-styles.ts:57 spells\n     * out its own copy: `iconOnly` is private to style-utils. */\n    paddingX: {\n      default: {\n        default: \"[14px]\",\n        size: {\n          XS: \"edge-to-text\",\n          S: \"edge-to-text\",\n          L: \"edge-to-text\",\n          XL: \"edge-to-text\",\n        },\n      },\n      \":has([slot=icon], [data-slot=icon]):not(:has([data-rsp-slot=text]))\": 0,\n    },\n    /* The RUN button is the one the register tracks out — `letter-spacing: .06em` on\n     * the terminal-well button (TerminalGlassLab.tsx:365). Every other variant sits at\n     * the mono default. */\n    letterSpacing: {\n      variant: {\n        terminal: \"[0.06em]\",\n      },\n    },\n    width: \"fit\",\n    textDecoration: \"none\",\n    transition: {\n      default: \"default\",\n      \"@media (prefers-reduced-motion: reduce)\": \"none\",\n    },\n    borderStyle: \"solid\",\n    borderWidth: {\n      fillStyle: {\n        /* Filled buttons carry the edge too. Every button the handoff draws has one,\n         * with no exception: accent `1px solid var(--interactive-fill)` over the same\n         * fill (TerminalGlassLab.tsx:303-304), secondary `1px solid var(--border-subtle)`\n         * (:315), create (:326), ghost over a transparent fill (:352), the well-filled\n         * RUN (:365). `btnBase` (:230-235) declares only radius/padding/cursor/shadow,\n         * so each variant spells its own edge — and every one of them does.\n         *\n         * This was 0, which is why `variant.create: 1` below was the only edge in the\n         * component that ever drew. `control()` sets `boxSizing: \"border-box\"`, so the\n         * S/M/L/XL height ramp is unchanged; only the content box narrows by 2px. */\n        fill: 1,\n        /* 1px, not Spectrum's 2px: the handoff's secondary and ghost buttons are\n         * hairline-edged like everything else it draws (TerminalGlassLab.tsx:231),\n         * and a 2px edge beside a 1px field reads as a different weight class. */\n        outline: 1,\n      },\n      variant: {\n        /* The handoff draws create with an explicit 1px rim in its own border token,\n         * not the fill colour — the pale wash needs the edge to hold its shape against\n         * a light surface. `variant` is applied after `fillStyle`, so this is 1px in\n         * both fill and outline, which is what the handoff shows. */\n        create: 1,\n        /* Same argument for the terminal well: the handoff draws RUN as\n         * `1px solid var(--well-border)` over the well fill\n         * (TerminalGlassLab.tsx:365), an edge the fill alone cannot hold. */\n        terminal: 1,\n      },\n    },\n    borderColor: {\n      variant: {\n        /* `primary` deliberately stays on the neutral ramp. The handoff's filled CTA\n         * draws its border in its own FILL colour — `1px solid var(--interactive-fill)`\n         * over `background-color: var(--interactive-fill)` (TerminalGlassLab.tsx:303-304)\n         * — so gray-800 tracking the `baseColor(\"neutral\")` fill below is already the\n         * right idiom. A hairline here would break that fill/edge pairing. */\n        primary: baseColor(\"gray-800\"),\n        /* `var(--border-subtle)` — the handoff's secondary (TerminalGlassLab.tsx:315)\n         * and ghost (:352) buttons are both hairlines in it. gray-300 is a solid mid-gray\n         * (#c5d0de light, #67717d dark), a full rule weight rather than an edge.\n         *\n         * Plain string, not `baseColor()`: --border-subtle has no ramp to step along, so\n         * this intentionally drops the hover/press border steps `baseColor()` was emitting\n         * — the handoff declares no hover border change on any button. The sibling\n         * `isStaticColor` branch below stays on `baseColor(\"transparent-overlay-300\")`\n         * on purpose; that is the over-imagery case and keeps its overlay ramp. */\n        secondary: \"border-subtle\",\n        create: \"create-border\",\n        terminal: \"well-border\",\n      },\n      /* Every FILLED variant needs its border colour spelled out HERE, under\n       * `fillStyle.fill.variant`. The earlier note claimed variants with no entry\n       * \"fall through to `variant` above\" the way `borderWidth` does — that is\n       * WRONG for a colour value, and it shipped Today (secondary-fill) and Create\n       * (create-fill) with a black rim. The reason `borderWidth` falls through is\n       * that BOTH its keys (`fillStyle.fill` and `variant.create`) name a width, so\n       * a fill button always has one to land on. `borderColor` does not: once the\n       * higher-priority `fillStyle` key matches (fillStyle === \"fill\"), it OWNS the\n       * result, and a fill variant with no leaf in this sub-map resolves to nothing\n       * from the winning branch — it does NOT consult the sibling `variant` map\n       * below. The only value left is the `forcedColors` fallback, `ButtonBorder`,\n       * which paints black in a normal viewport. So each fill variant is listed\n       * explicitly, mirroring the proven accent path stop for stop.\n       *\n       * The `variant` map below is kept for the OUTLINE variants (Ghost), which do\n       * not match `fillStyle.fill` and so still read secondary/create from it.\n       *\n       * accent/negative border the button in the same token as their fill\n       * (handoff :303-304), so they mirror the `backgroundColor` map stop for stop,\n       * hover included. secondary and create carry no hover-border step (the\n       * handoff declares none), so each is a flat token: `border-subtle` for the\n       * secondary hairline, `create-border` for the create rim (the pale wash needs\n       * the edge to hold its shape). primary tracks its neutral fill in gray-800,\n       * matching the `variant.primary` idiom. Placed before\n       * `isDisabled`/`isStaticColor`/`forcedColors` so those still win. */\n      fillStyle: {\n        fill: {\n          variant: {\n            primary: baseColor(\"gray-800\"),\n            secondary: \"border-subtle\",\n            create: \"create-border\",\n            /* RUN's edge is the well's own rim, and it is the ONE border in this\n             * component with a hover step: the handoff lifts the terminal button's\n             * edge toward the prompt blue on hover while the matte fill stays put\n             * (TerminalGlassLab.tsx:365-368). Stepping the border rather than the\n             * fill is what keeps a console button from looking like a CTA. */\n            terminal: {\n              default: \"well-border\",\n              isHovered: \"blue-1100\",\n              isPressed: \"blue-1100\",\n              isFocusVisible: \"blue-1100\",\n            },\n            accent: {\n              default: \"interactive-fill\",\n              isHovered: lightDark(\"accent-1000\", \"accent-600\"),\n              isPressed: lightDark(\"accent-1000\", \"accent-600\"),\n              isFocusVisible: lightDark(\"accent-1000\", \"accent-600\"),\n            },\n            negative: {\n              default: lightDark(\"negative-900\", \"negative-700\"),\n              isHovered: lightDark(\"negative-1000\", \"negative-600\"),\n              isPressed: lightDark(\"negative-1000\", \"negative-600\"),\n              isFocusVisible: lightDark(\"negative-1000\", \"negative-600\"),\n            },\n            /* warning/success are negative's status counterparts: the same saturated-fill\n             * idiom on the signal (notice -> yellow) and success (positive -> green) channels.\n             * Border mirrors the fill stop for stop, exactly as accent/negative do. */\n            warning: {\n              default: lightDark(\"notice-900\", \"notice-700\"),\n              isHovered: lightDark(\"notice-1000\", \"notice-600\"),\n              isPressed: lightDark(\"notice-1000\", \"notice-600\"),\n              isFocusVisible: lightDark(\"notice-1000\", \"notice-600\"),\n            },\n            success: {\n              default: lightDark(\"positive-900\", \"positive-700\"),\n              isHovered: lightDark(\"positive-1000\", \"positive-600\"),\n              isPressed: lightDark(\"positive-1000\", \"positive-600\"),\n              isFocusVisible: lightDark(\"positive-1000\", \"positive-600\"),\n            },\n          },\n        },\n      },\n      isDisabled: \"disabled\",\n      isStaticColor: {\n        variant: {\n          primary: baseColor(\"transparent-overlay-800\"),\n          secondary: baseColor(\"transparent-overlay-300\"),\n        },\n        isDisabled: \"transparent-overlay-300\",\n      },\n      forcedColors: {\n        default: \"ButtonBorder\",\n        isHovered: \"Highlight\",\n        isDisabled: \"GrayText\",\n      },\n    },\n    backgroundColor: {\n      fillStyle: {\n        fill: {\n          variant: {\n            primary: baseColor(\"neutral\"),\n            secondary: {\n              /* `var(--btn-secondary-bg)` (TerminalGlassLab.tsx:314) — #e9eff6 in light,\n               * `var(--surface-raised)` = rgb(51,58,68) in dark (design-handoff-v2.css:73,\n               * :196, :179). No pre-existing token covered both schemes: `raised` is\n               * #ffffff in light and `well` is #0a0f14 in dark, so each matches only one.\n               * The backgroundColor map therefore gained a `btn-secondary` entry pointing\n               * at the variable the island already ships. gray-100 (#e5eaf1 / #43474d) was\n               * a step off in both schemes and lost the slate cast in dark.\n               *\n               * The hover/press/focus stops stay on gray-200 (#dbe3ed / #555c64). Against\n               * the new resting fill that darkens in light and lightens in dark, which is\n               * the correct direction in each scheme — hover moves toward contrast with\n               * the page, so it necessarily reverses between schemes. --surface-hover is\n               * NOT usable here: it is an alpha wash (rgba(255,255,255,.75) light,\n               * rgba(58,62,70,.48) dark) meant to composite over a surface, and the macro\n               * bakes fills with no knowledge of the backdrop — see the gray-100/200 note\n               * in style/glasselated-ramps.ts. As a replacement fill it would turn an\n               * opaque button translucent on hover and, composited over the panel, invert\n               * the step in both schemes. */\n              default: \"btn-secondary\",\n              isHovered: \"gray-200\",\n              isPressed: \"gray-200\",\n              isFocusVisible: \"gray-200\",\n            },\n            accent: {\n              default: \"interactive-fill\",\n              isHovered: lightDark(\"accent-1000\", \"accent-600\"),\n              isPressed: lightDark(\"accent-1000\", \"accent-600\"),\n              isFocusVisible: lightDark(\"accent-1000\", \"accent-600\"),\n            },\n            negative: {\n              default: lightDark(\"negative-900\", \"negative-700\"),\n              isHovered: lightDark(\"negative-1000\", \"negative-600\"),\n              isPressed: lightDark(\"negative-1000\", \"negative-600\"),\n              isFocusVisible: lightDark(\"negative-1000\", \"negative-600\"),\n            },\n            /* warning/success fills mirror negative on the signal (notice -> yellow) and\n             * success (positive -> green) channels. The green ramp is L-solved to carry the\n             * same white-ink contrast as red, so both dark fills clear AA identically\n             * (see style/glasselated-ramps.ts). */\n            warning: {\n              default: lightDark(\"notice-900\", \"notice-700\"),\n              isHovered: lightDark(\"notice-1000\", \"notice-600\"),\n              isPressed: lightDark(\"notice-1000\", \"notice-600\"),\n              isFocusVisible: lightDark(\"notice-1000\", \"notice-600\"),\n            },\n            success: {\n              default: lightDark(\"positive-900\", \"positive-700\"),\n              isHovered: lightDark(\"positive-1000\", \"positive-600\"),\n              isPressed: lightDark(\"positive-1000\", \"positive-600\"),\n              isFocusVisible: lightDark(\"positive-1000\", \"positive-600\"),\n            },\n            /* The create CTA does not follow the semantic-fill pattern above. Those step\n             * along a ramp for hover; create-bg has no ramp, so the deeper wash is a named\n             * token. Both schemes are declared in the token itself, hence no lightDark(). */\n            create: {\n              default: \"create-bg\",\n              isHovered: \"create-bg-deep\",\n              isPressed: \"create-bg-deep\",\n              isFocusVisible: \"create-bg-deep\",\n            },\n            /* The terminal button is a piece of the well it sits in, not a fill on top\n             * of it: `background: var(--surface-well)` (TerminalGlassLab.tsx:365). Flat\n             * across every state — the hover signal lives on the border above, so a RUN\n             * button never brightens the way an accent or create button does. */\n            terminal: \"well\",\n          },\n          isDisabled: \"disabled\",\n        },\n        outline: {\n          default: \"transparent\",\n          isHovered: \"gray-100\",\n          isPressed: \"gray-100\",\n          isFocusVisible: \"gray-100\",\n          isDisabled: \"transparent\",\n        },\n      },\n      isStaticColor: {\n        fillStyle: {\n          fill: {\n            variant: {\n              primary: baseColor(\"transparent-overlay-800\"),\n              secondary: baseColor(\"transparent-overlay-100\"),\n            },\n            isDisabled: \"transparent-overlay-100\",\n          },\n          outline: {\n            default: \"transparent\",\n            isHovered: \"transparent-overlay-100\",\n            isPressed: \"transparent-overlay-100\",\n            isFocusVisible: \"transparent-overlay-100\",\n            isDisabled: \"transparent\",\n          },\n        },\n      },\n      forcedColors: {\n        fillStyle: {\n          fill: {\n            default: \"ButtonText\",\n            isHovered: \"Highlight\",\n            isDisabled: \"GrayText\",\n          },\n          outline: \"ButtonFace\",\n        },\n      },\n    },\n    color: {\n      fillStyle: {\n        fill: {\n          variant: {\n            primary: \"gray-25\",\n            secondary: baseColor(\"neutral\"),\n            accent: \"white\",\n            negative: \"white\",\n            /* Success carries white ink on its saturated fill, like accent/negative: the\n             * positive fill stops (-900/-700) are pinned >= 4.5:1 on white. Warning cannot —\n             * the notice ramp is the register's yellow, bright in BOTH columns, so white on\n             * it is 2.3-2.5:1 and black is 7.7:1. Same ink Badge and InlineAlert spend on\n             * this channel. */\n            warning: \"black\",\n            success: \"white\",\n            /* Create is the CTA fuchsia, and its ink flips with the ground rather than\n             * staying white: near-black #1a0512 on the night fill is 6.66:1, white on the\n             * daylight fill 4.74:1, so both schemes clear AA. */\n            create: \"create-ink\",\n            /* Blue ink on the matte well — the register's console voice. The handoff inks\n             * it in `--terminal-prompt` (= `--blue-400`), which is only ~2.4:1 on the LIGHT\n             * well (#3d9be8 on #e9eff6) and fails AA outright. blue-1100 is the same ramp's\n             * end stop and is IDENTICAL to `--terminal-prompt` in the dark scheme (#99d8ff),\n             * so the night rendering is the handoff's exactly and only the daylight column\n             * darkens to #094aa2 (~9:1) to become readable. */\n            terminal: \"blue-1100\",\n          },\n          isDisabled: \"disabled\",\n        },\n        outline: {\n          default: baseColor(\"neutral\"),\n          variant: {\n            /* Ghost is the register's outlined SECONDARY, and the handoff inks it in the\n             * MUTED slate, not the strong neutral its filled twin (Today) wears: the\n             * `Ghost` button is drawn `color: var(--text-secondary)` on a transparent fill\n             * inside `--border-subtle` (TerminalGlassLab.tsx:273-277), whereas the filled\n             * secondary is `--text-primary`. `--text-secondary` is pinned to `gray-500` in\n             * both schemes (glasselated-ramps.ts:114,855 — #64748b light / #9aa0a8 dark),\n             * so a secondary+outline button de-emphasises its label exactly the way the\n             * register draws it. Every other outline variant keeps `outline.default`'s\n             * neutral ink; only secondary steps down. */\n            secondary: baseColor(\"gray-500\"),\n            /* create-ink is near-black in the dark scheme — legible ON the pale fill, not\n             * against a dark page. Outline drops the fill, so the dark scheme takes the\n             * fill colour as its ink instead. */\n            create: lightDark(\"create-ink\", \"create-bg\"),\n            /* Outline drops the well fill but keeps the console voice. */\n            terminal: \"blue-1100\",\n          },\n          isDisabled: \"disabled\",\n        },\n      },\n      isStaticColor: {\n        fillStyle: {\n          fill: {\n            variant: {\n              primary: \"auto\",\n              secondary: {\n                default: \"transparent-overlay-1000\",\n                isHovered: \"transparent-overlay-1000\",\n                isFocusVisible: \"transparent-overlay-1000\",\n                isPressed: \"transparent-overlay-1000\",\n              },\n            },\n          },\n          outline: {\n            default: {\n              default: \"transparent-overlay-1000\",\n              isHovered: \"transparent-overlay-1000\",\n              isFocusVisible: \"transparent-overlay-1000\",\n              isPressed: \"transparent-overlay-1000\",\n            },\n          },\n        },\n        isDisabled: \"transparent-overlay-400\",\n      },\n      forcedColors: {\n        fillStyle: {\n          fill: {\n            default: \"ButtonFace\",\n            isDisabled: \"HighlightText\",\n          },\n          outline: {\n            default: \"ButtonText\",\n            isDisabled: \"GrayText\",\n          },\n        },\n      },\n    },\n    \"--iconPrimary\": {\n      type: \"fill\",\n      value: \"currentColor\",\n    },\n    outlineColor: {\n      default: \"focus-ring\",\n      isStaticColor: \"transparent-overlay-1000\",\n      forcedColors: \"Highlight\",\n    },\n    forcedColorAdjust: \"none\",\n    disableTapHighlight: true,\n  },\n  getAllowedOverrides(),\n);\n\nexport const s2ButtonText = style<{ isProgressVisible?: boolean }>({\n  paddingY: \"--labelPadding\",\n  order: 1,\n  visibility: {\n    isProgressVisible: \"hidden\",\n  },\n});\n\nexport const s2ButtonPendingIndicator = style<{\n  isPending?: boolean;\n  isProgressVisible?: boolean;\n}>({\n  position: \"absolute\",\n  top: \"50%\",\n  left: \"50%\",\n  transform: \"translate(-50%, -50%)\",\n  visibility: {\n    default: \"hidden\",\n    isProgressVisible: \"visible\",\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/Button.tsx\n\n// Port of packages/@react-spectrum/s2/src/Button.tsx.\n\nimport { children as resolveChildren, useContext } from \"solid-js\";\nimport type { JSX } from \"@solidjs/web\";\nimport { mergeProps } from \"@proyecto-viviana/solidaria/utils\";\nimport {\n  DialogTriggerContext,\n  Link as HeadlessLink,\n  PopoverTriggerContext,\n  type LinkProps as HeadlessLinkProps,\n  type LinkRenderProps,\n} from \"@proyecto-viviana/solidaria-components\";\nimport type { StyleString } from \"../style\";\nimport { style } from \"../style\" with { type: \"macro\" };\nimport { IconContext } from \"../icon/spectrum-icon\";\nimport { centerBaseline } from \"../icon/center-baseline\";\nimport { SkeletonContext } from \"../skeleton\";\nimport { TextContext } from \"../text\";\nimport { useProviderProps, type ProviderInheritedProps } from \"../provider\";\nimport { useFormProps } from \"../form\";\nimport { pressScale } from \"../pressScale\";\nimport { useLinkButtonContext } from \"./context\";\nimport { s2Button, s2ButtonText } from \"./s2-button-styles\";\nimport {\n  getSlottedContextProps,\n  mergeContextRefs,\n  mergeContextStyles,\n  mergeContextUnsafeStyle,\n  type RefLike,\n} from \"./spectrum-context\";\nimport type { ButtonFillStyle, ButtonSize, ButtonVariant, StaticColor } from \"./types\";\nimport { getSingleTextChild } from \"./text-child\";\nimport { splitProps } from \"@proyecto-viviana/solidaria/utils\";\n\ntype StyledLinkButtonBaseProps = Omit<\n  HeadlessLinkProps,\n  \"class\" | \"style\" | \"children\" | \"onClick\"\n>;\n\nexport interface LinkButtonProps extends StyledLinkButtonBaseProps {\n  /** The content to display in the LinkButton. */\n  children?: JSX.Element;\n  /** The visual style of the LinkButton. */\n  variant?: ButtonVariant;\n  /** The background style of the LinkButton. */\n  fillStyle?: ButtonFillStyle;\n  /** The size of the LinkButton. */\n  size?: ButtonSize;\n  /** The static color style to apply. Useful when the LinkButton appears over a color background. */\n  staticColor?: StaticColor;\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 * A LinkButton navigates like a link while using the S2 Button visual treatment.\n */\nexport function LinkButton(props: LinkButtonProps): JSX.Element {\n  const providerProps = useProviderProps(props) as LinkButtonProps & ProviderInheritedProps;\n  const [flags] = splitProps(providerProps, [\n    \"isQuiet\",\n    \"isEmphasized\",\n    \"isDisabled\",\n    \"isRequired\",\n    \"isReadOnly\",\n    \"validationState\",\n  ]);\n  const contextProps = getSlottedContextProps(useLinkButtonContext(), props.slot);\n  // As Button: the Form fills what context and props leave unset; defaults are read-time.\n  const merged = useFormProps(mergeProps<LinkButtonProps>(flags, contextProps ?? {}, props));\n  const [local, headlessProps] = splitProps(merged, [\n    \"variant\",\n    \"fillStyle\",\n    \"size\",\n    \"staticColor\",\n    \"styles\",\n    \"UNSAFE_className\",\n    \"UNSAFE_style\",\n    \"children\",\n    \"ref\",\n  ]);\n\n  const variant = (): ButtonVariant => local.variant ?? \"primary\";\n  const fillStyle = (): ButtonFillStyle => local.fillStyle ?? \"fill\";\n  const size = (): ButtonSize => local.size ?? \"M\";\n  const mergedStyles = () => mergeContextStyles(contextProps?.styles, props.styles);\n  const mergedUnsafeStyle = () =>\n    mergeContextUnsafeStyle(contextProps?.UNSAFE_style, props.UNSAFE_style);\n  const dialogTriggerContext = useContext(DialogTriggerContext);\n  const popoverTriggerContext = useContext(PopoverTriggerContext);\n  let linkElement: HTMLAnchorElement | undefined;\n  const assignLinkRefs = mergeContextRefs(\n    (contextProps as { ref?: RefLike<HTMLElement> } | null)?.ref,\n    props.ref,\n  );\n  const isOverlayTriggerOpen = () =>\n    !!linkElement &&\n    ((dialogTriggerContext?.triggerRef() === linkElement && dialogTriggerContext.state.isOpen()) ||\n      (popoverTriggerContext?.triggerRef() === linkElement &&\n        popoverTriggerContext.state.isOpen()));\n\n  const getClassName = (renderProps: LinkRenderProps): string =>\n    [\n      local.UNSAFE_className,\n      s2Button(\n        {\n          isHovered: renderProps.isHovered || isOverlayTriggerOpen(),\n          isPressed: renderProps.isPressed,\n          isFocused: renderProps.isFocused,\n          isFocusVisible: renderProps.isFocusVisible,\n          isDisabled: renderProps.isDisabled,\n          isPending: false,\n          variant: variant(),\n          fillStyle: fillStyle(),\n          size: size(),\n          staticColor: local.staticColor,\n          isStaticColor: !!local.staticColor,\n        },\n        mergedStyles(),\n      ),\n    ]\n      .filter(Boolean)\n      .join(\" \");\n\n  const getStyle = (renderProps: LinkRenderProps): JSX.CSSProperties =>\n    pressScale(() => linkElement, mergedUnsafeStyle())(renderProps);\n\n  function LinkButtonContent() {\n    const iconContextValue = {\n      slot: \"icon\",\n      render: centerBaseline({ slot: \"icon\", styles: style({ order: 0 }) }),\n      styles: style({\n        size: \"1lh\",\n        marginStart: \"--iconMargin\",\n        flexShrink: 0,\n      }),\n    };\n    const textContextValue = {\n      styles: () => s2ButtonText({ isProgressVisible: false }),\n      \"data-rsp-slot\": \"text\",\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 class={s2ButtonText({ isProgressVisible: false })} data-rsp-slot=\"text\">\n              {textChild()}\n            </span>\n          ) : (\n            content()\n          )}\n        </>\n      );\n    }\n\n    return (\n      <>\n        <SkeletonContext value={null}>\n          <TextContext value={textContextValue}>\n            <IconContext value={iconContextValue}>\n              <ResolvedContent />\n            </IconContext>\n          </TextContext>\n        </SkeletonContext>\n      </>\n    );\n  }\n\n  return (\n    <HeadlessLink\n      {...headlessProps}\n      class={getClassName}\n      style={getStyle}\n      ref={(element: HTMLElement) => {\n        linkElement = element as HTMLAnchorElement;\n        assignLinkRefs(element);\n      }}\n    >\n      <LinkButtonContent />\n    </HeadlessLink>\n  );\n}\n"],"mappings":"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"}