@astryxdesign/core 0.1.3-canary.73bcac9 → 0.1.3-canary.a18ca6b

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1 +1 @@
1
- {"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../src/Button/Button.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../src/Button/Button.tsx"],"names":[],"mappings":"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"}
@@ -19,15 +19,15 @@
19
19
  */
20
20
  import { useRef, useTransition } from 'react';
21
21
  import * as stylex from '@stylexjs/stylex';
22
+ import { useTooltip } from "../Tooltip/useTooltip.js";
22
23
  import "../theme/tokens.stylex.js";
23
24
  import { colorVars, sizeVars, spacingVars, radiusVars, borderVars, durationVars, easeVars, fontWeightVars, typeScaleVars } from "../theme/tokens.stylex.js";
24
- import { Tooltip } from "../Tooltip/Tooltip.js";
25
25
  import { Spinner } from "../Spinner/index.js";
26
26
  import { VisuallyHidden } from "../VisuallyHidden/index.js";
27
27
  import { EDGE_COMP_ATTR } from "../Layout/edgeCompensation.stylex.js";
28
28
  import { useSize } from "../SizeContext/SizeContext.js";
29
29
  import { useButtonGroup } from "../ButtonGroup/ButtonGroupContext.js";
30
- import { mergeProps } from "../utils/index.js";
30
+ import { mergeProps, mergeRefs } from "../utils/index.js";
31
31
  import { useLinkComponent } from "../Link/useLinkComponent.js";
32
32
  import { themeProps } from "../utils/themeProps.js";
33
33
 
@@ -339,6 +339,16 @@ export function Button({
339
339
  // Use aria-disabled when tooltip is present so the button remains focusable
340
340
  // for keyboard users to reach the tooltip. Otherwise use native disabled.
341
341
  const useAriaDisabled = tooltip != null && buttonDisabled;
342
+
343
+ // Attach tooltip behavior via the hook rather than wrapping the button in a
344
+ // <Tooltip> element. The hook adds hover/focus triggers to the button itself,
345
+ // so no extra DOM node is inserted — the button stays a direct child of its
346
+ // container (no layout shift, and edge-compensation markers remain
347
+ // discoverable through the container's direct-child `:has()` selector).
348
+ const tooltipHook = useTooltip({
349
+ placement: 'above',
350
+ isEnabled: tooltip != null
351
+ });
342
352
  const handleClick = e => {
343
353
  // The ref guard dedupes fire-once actions. Interruptible callers skip it so
344
354
  // a re-click while pending starts a fresh action that interrupts the prior.
@@ -429,28 +439,41 @@ export function Button({
429
439
  const ariaLabelProp = needsAriaLabel ? {
430
440
  'aria-label': label
431
441
  } : null;
442
+
443
+ // When a tooltip is attached via the hook, point aria-describedby at the
444
+ // tooltip content (composing with any consumer-provided value).
445
+ const describedByProp = tooltip != null ? {
446
+ 'aria-describedby': [props['aria-describedby'], tooltipHook.describedBy].filter(Boolean).join(' ') || undefined
447
+ } : null;
448
+
449
+ // Merge the consumer ref with the tooltip hook's trigger ref so both point at
450
+ // the same element. mergeRefs tolerates undefined, so this is a no-op for the
451
+ // tooltip side when no tooltip is set.
452
+ const mergedButtonRef = mergeRefs(ref, tooltip != null ? tooltipHook.ref : undefined);
432
453
  let element;
433
454
  if (renderAsLink) {
434
455
  element = /*#__PURE__*/_jsx(LinkComponent, {
435
- ref: ref,
456
+ ref: mergedButtonRef,
436
457
  href: href,
437
458
  target: target,
438
459
  rel: rel,
439
460
  ...sharedMergedProps,
440
461
  ...props,
441
462
  ...ariaLabelProp,
463
+ ...describedByProp,
442
464
  ...edgeCompAttr,
443
465
  onClick: handleClick,
444
466
  children: buttonContent
445
467
  });
446
468
  } else {
447
469
  element = /*#__PURE__*/_jsx("button", {
448
- ref: ref,
470
+ ref: mergedButtonRef,
449
471
  type: type,
450
472
  disabled: useAriaDisabled ? undefined : buttonDisabled,
451
473
  ...sharedMergedProps,
452
474
  ...props,
453
475
  ...ariaLabelProp,
476
+ ...describedByProp,
454
477
  ...edgeCompAttr,
455
478
  "aria-busy": isLoadingState || undefined,
456
479
  "aria-disabled": useAriaDisabled || undefined,
@@ -462,10 +485,8 @@ export function Button({
462
485
  });
463
486
  }
464
487
  if (tooltip) {
465
- return /*#__PURE__*/_jsx(Tooltip, {
466
- content: tooltip,
467
- placement: "above",
468
- children: element
488
+ return /*#__PURE__*/_jsxs(_Fragment, {
489
+ children: [element, tooltipHook.renderTooltip(tooltip)]
469
490
  });
470
491
  }
471
492
  return element;