@chassis-ui/react 0.2.0 → 0.3.0

package/src/hooks/useControllableState.ts

@@ -1,24 +0,0 @@
-import { useState } from 'react'
-
-/**
- * Shared controlled/uncontrolled state pattern: `value` present means controlled (the returned
- * state always mirrors it), otherwise state is tracked internally starting from `defaultValue`.
- * The returned setter updates internal state (when uncontrolled) and always calls `onChange`,
- * leaving the caller free to layer additional logic (e.g. an `onComplete` callback) around it.
- */
-export function useControllableState<T>(
-  value: T | undefined,
-  defaultValue: T,
-  onChange?: (value: T) => void
-): [T, (next: T) => void] {
-  const isControlled = value !== undefined
-  const [uncontrolledValue, setUncontrolledValue] = useState<T>(defaultValue)
-  const state = isControlled ? (value as T) : uncontrolledValue
-
-  const setState = (next: T) => {
-    if (!isControlled) setUncontrolledValue(next)
-    onChange?.(next)
-  }
-
-  return [state, setState]
-}

package/src/hooks/useDialogElement.ts

@@ -1,226 +0,0 @@
-import {
-  ForwardedRef,
-  MouseEvent as ReactMouseEvent,
-  MouseEventHandler,
-  SyntheticEvent,
-  useEffect,
-  useRef,
-  useState
-} from 'react'
-import { usePreventScroll } from 'react-aria'
-
-import { useForkedRef } from './useForkedRef'
-import { useIsomorphicLayoutEffect } from './useIsomorphicLayoutEffect'
-import { executeAfterTransition } from '../utils/dialogTransition'
-
-export interface UseDialogElementOptions {
-  /**
-   * Same-named prop from the caller (`Modal`/`Drawer`) — only ever consulted here to
-   * distinguish `'static'` from everything else for the backdrop-click/Escape bounce.
-   */
-  backdrop?: boolean | 'static'
-  /**
-   * Disables the open/close transition entirely.
-   */
-  instant?: boolean
-  /**
-   * Whether this open should use `showModal()` (top-layer, native backdrop, scroll-locked) or
-   * `show()` — `Modal` passes its own `modal` prop straight through; `Drawer` derives it from
-   * `backdrop`/`scroll` instead, since its vanilla chassis-css counterpart does the same.
-   */
-  isModal: boolean
-  /**
-   * Closes on the escape key / native `cancel` event.
-   */
-  keyboard?: boolean
-  /**
-   * Fires synchronously right before a closed dialog actually opens (after the "already open"
-   * bail-out, before capturing the pre-open trigger element) — `Drawer`'s only hook into the
-   * show effect, used to auto-close every other open drawer first.
-   */
-  onBeforeShow?: (dialog: HTMLDialogElement) => void
-  /**
-   * The caller's own `onClick`, chained ahead of the backdrop-click handling below rather than
-   * left in the props spread — a `<dialog>` needs `onClick` for its own backdrop detection, so
-   * spreading the caller's alongside it silently dropped one of the two. Fires for every click
-   * on the dialog, not just backdrop ones.
-   */
-  onClick?: MouseEventHandler<HTMLDialogElement>
-  onClose?: () => void
-  onClosePrevented?: () => void
-  onHidden?: () => void
-  onShow?: () => void
-  onShown?: () => void
-  ref: ForwardedRef<HTMLDialogElement>
-  visible?: boolean
-}
-
-// Shared open/close machinery for a native `<dialog>`-based component — `Modal` and `Drawer`
-// otherwise duplicated this near-verbatim: forked ref, the show/begin-hide effect (showModal()
-// vs. show(), initial focus, scroll lock), the finish-hide effect (waits out the exit
-// transition), the non-modal Escape-key listener (the native `cancel` event only fires for
-// dialogs opened with `showModal()`), and the static-backdrop "bounce" used by both the
-// backdrop-click handler and the Escape/`cancel` handler. What's left in each caller is only
-// what's genuinely component-specific: `Modal`/`Drawer`'s own `_className` building, and
-// `Drawer`'s cross-instance "auto-close every other open drawer" registry (wired in via
-// `onBeforeShow`, since it needs to run at one precise point inside the show effect).
-export const useDialogElement = ({
-  backdrop,
-  instant,
-  isModal,
-  keyboard = true,
-  onBeforeShow,
-  onClick,
-  onClose,
-  onClosePrevented,
-  onHidden,
-  onShow,
-  onShown,
-  ref,
-  visible
-}: UseDialogElementOptions) => {
-  const dialogRef = useRef<HTMLDialogElement>(null)
-  const forkedRef = useForkedRef(ref, dialogRef)
-
-  const [_visible, setVisible] = useState(visible)
-  const [hiding, setHiding] = useState(false)
-  const [staticBounce, setStaticBounce] = useState(false)
-  const [scrollLocked, setScrollLocked] = useState(false)
-  const openedAsModalRef = useRef(false)
-  const triggerRef = useRef<HTMLElement | null>(null)
-
-  // Locked from showModal() until the exit transition finishes (see the show/hide effect
-  // below) — usePreventScroll releases it automatically on unmount too, even mid-transition.
-  usePreventScroll({ isDisabled: !scrollLocked })
-
-  useEffect(() => {
-    setVisible(visible)
-  }, [visible])
-
-  const close = () => {
-    onClose?.()
-  }
-
-  const triggerStaticBounce = () => {
-    onClosePrevented?.()
-    const dialog = dialogRef.current
-    if (!dialog) return
-    setStaticBounce(true)
-    executeAfterTransition(dialog, () => setStaticBounce(false), !instant)
-  }
-
-  // Read through refs, kept current every render, so the keydown listener below — which only
-  // resubscribes when `keyboard` changes — never invokes a stale `close`/`triggerStaticBounce`
-  // closure if `onClose`/`onClosePrevented`/`instant` change identity without `keyboard` also
-  // changing. Same pattern as `Drawer`'s own `closeRef` and `useFloatingOverlay`'s `closeRef`.
-  const closeRef = useRef(close)
-  closeRef.current = close
-  const triggerStaticBounceRef = useRef(triggerStaticBounce)
-  triggerStaticBounceRef.current = triggerStaticBounce
-
-  // Show / begin-hide
-  useIsomorphicLayoutEffect(() => {
-    const dialog = dialogRef.current
-    if (!dialog) return undefined
-
-    if (_visible) {
-      if (dialog.open) return undefined
-
-      onBeforeShow?.(dialog)
-
-      triggerRef.current =
-        document.activeElement instanceof HTMLElement ? document.activeElement : null
-
-      openedAsModalRef.current = isModal
-      if (isModal) {
-        dialog.showModal()
-        setScrollLocked(true)
-      } else {
-        dialog.show()
-      }
-
-      const autofocusEl = dialog.querySelector<HTMLElement>('[autofocus]')
-      if (autofocusEl) {
-        autofocusEl.focus()
-      } else {
-        dialog.setAttribute('tabindex', '-1')
-        dialog.focus()
-      }
-
-      onShow?.()
-      setHiding(false)
-
-      return executeAfterTransition(dialog, () => onShown?.(), !instant)
-    }
-
-    if (!dialog.open) return undefined
-    setHiding(true)
-    return undefined
-  }, [_visible])
-
-  // Finish hide once the exit transition (or lack thereof) completes
-  useEffect(() => {
-    const dialog = dialogRef.current
-    if (!hiding || !dialog) return undefined
-
-    return executeAfterTransition(
-      dialog,
-      () => {
-        if (dialog.open) {
-          dialog.close()
-        }
-        if (openedAsModalRef.current) {
-          setScrollLocked(false)
-        }
-        setHiding(false)
-        onHidden?.()
-        const trigger = triggerRef.current
-        if (trigger && document.contains(trigger)) {
-          trigger.focus()
-        }
-      },
-      !instant
-    )
-  }, [hiding])
-
-  // Escape key for non-modal (show()) dialogs — the native `cancel` event below only
-  // fires for dialogs opened with showModal().
-  useEffect(() => {
-    const dialog = dialogRef.current
-    if (!dialog) return undefined
-
-    const handleKeyDown = (event: KeyboardEvent) => {
-      if (event.key !== 'Escape' || openedAsModalRef.current) return
-      event.preventDefault()
-      if (!keyboard) {
-        triggerStaticBounceRef.current()
-        return
-      }
-      closeRef.current()
-    }
-
-    dialog.addEventListener('keydown', handleKeyDown)
-    return () => dialog.removeEventListener('keydown', handleKeyDown)
-  }, [keyboard])
-
-  const handleCancel = (event: SyntheticEvent<HTMLDialogElement>) => {
-    event.preventDefault()
-    if (!keyboard) {
-      triggerStaticBounce()
-      return
-    }
-    close()
-  }
-
-  const handleBackdropClick = (event: ReactMouseEvent<HTMLDialogElement>) => {
-    onClick?.(event)
-    if (event.target !== dialogRef.current || !openedAsModalRef.current) return
-    if (backdrop === 'static') {
-      triggerStaticBounce()
-      return
-    }
-    close()
-  }
-
-  return { close, dialogRef, forkedRef, handleBackdropClick, handleCancel, hiding, staticBounce }
-}

package/src/hooks/useDisabledAnchorGuard.ts

@@ -1,22 +0,0 @@
-import { MouseEvent, MouseEventHandler } from 'react'
-
-// A native `<button>`/`<input>` stops firing `click` on its own once `disabled` is set — an
-// `<a>` (or any other non-native-button element standing in for one) has no real `disabled`
-// attribute, so it still fires click (and an anchor still navigates) unless blocked by hand.
-// `guard` is the caller's own "is this rendering as a non-native-button element" check (e.g.
-// `Component === 'a'` for `Button`/`CloseButton`, `!isButton` for `Chip`) — kept as an explicit
-// parameter rather than inferred here, since each caller's own set of native, guard-free elements
-// differs slightly.
-export const useDisabledAnchorGuard = <T extends HTMLElement>(
-  guard: boolean,
-  disabled: boolean | undefined,
-  onClick: MouseEventHandler<T> | undefined
-): MouseEventHandler<T> => {
-  return (event: MouseEvent<T>) => {
-    if (guard && disabled) {
-      event.preventDefault()
-      return
-    }
-    onClick?.(event)
-  }
-}

package/src/hooks/useDismissibleTransition.ts

@@ -1,126 +0,0 @@
-import { ForwardedRef, RefObject, useCallback, useEffect, useId, useRef, useState } from 'react'
-
-import { useForkedRef } from './useForkedRef'
-
-export interface UseDismissibleTransitionOptions {
-  /**
-   * Callback fired once the exit transition completes and the component is fully hidden.
-   */
-  onClose?: () => void
-  /**
-   * Callback fired when the component starts to show.
-   */
-  onShow?: () => void
-  ref: ForwardedRef<HTMLDivElement>
-  /**
-   * Toggle the visibility of the component.
-   */
-  visible?: boolean
-}
-
-export interface UseDismissibleTransitionTransitionProps {
-  appear: true
-  in: boolean
-  nodeRef: RefObject<HTMLDivElement | null>
-  onEnter: () => void
-  onEntered: () => void
-  onExit: () => void
-  onExited: () => void
-  unmountOnExit: true
-}
-
-export interface UseDismissibleTransitionResult {
-  /**
-   * Requests the component be closed — sets the internal visible state to `false`, which kicks
-   * off the exit transition; `onClose` fires once it finishes. Stable across re-renders (see the
-   * hook's own doc comment for why that matters).
-   */
-  close: () => void
-  /**
-   * Whether the entrance transition has actually finished — `false` while still fading/sliding
-   * in, even though `visible` is already `true`. Gate anything that should only start once the
-   * component is fully, visibly present (e.g. an autohide timer) on this rather than `visible`
-   * alone.
-   */
-  entered: boolean
-  forkedRef: ReturnType<typeof useForkedRef<HTMLDivElement>>
-  getTransitionClass: (state: string) => string | undefined
-  textId: string
-  titleId: string
-  /**
-   * Spread directly onto `<Transition>`. Each caller still supplies its own `timeout` (and any
-   * extra props, e.g. `mountOnEnter`) on top of this.
-   */
-  transitionProps: UseDismissibleTransitionTransitionProps
-  /**
-   * The internal, transition-driving visible state — distinct from the `visible` prop, since a
-   * `close()` call (or the exit transition itself) needs to flip this independently of whatever
-   * the caller is currently passing in.
-   */
-  visible: boolean
-}
-
-// Shared dismiss/transition machinery for `Toast` and `Notification` — both otherwise duplicated
-// this near-verbatim: visible-state + prop-sync effect, a forked ref, `getTransitionClass`,
-// `titleId`/`textId` via `useId()`, and the `Transition` entry/exit callback wiring.
-//
-// `close` is memoized once here with `useCallback` (empty deps — it only ever calls
-// `setVisible(false)`, whose setter identity is itself stable) specifically so it has a stable
-// identity across re-renders. Previously each component built its own unmemoized
-// `() => setVisible(false)` inline and passed it straight into `useAutoDismiss`, whose scheduling
-// effect depends on that closure's identity — since `Toaster`/`NotificationStack` re-render every
-// mounted item whenever the shared queue changes (`ToastQueue.add()`/`.close()` notify all
-// subscribers synchronously), that meant adding or dismissing any one toast/notification silently
-// restarted every other visible one's autohide countdown, with no code change needed to trigger
-// it beyond normal multi-item usage.
-//
-// `entered` similarly gates "has the entrance transition actually finished" uniformly for both —
-// `Toast` already had this (gating on `visible` alone would start the autohide timer the instant
-// `visible` flips true, while still fading/sliding in); `Notification` didn't, so this extraction
-// gives it the same fix for free.
-export function useDismissibleTransition({
-  onClose,
-  onShow,
-  ref,
-  visible = false
-}: UseDismissibleTransitionOptions): UseDismissibleTransitionResult {
-  const [_visible, setVisible] = useState(visible)
-  const [entered, setEntered] = useState(false)
-  const nodeRef = useRef<HTMLDivElement>(null)
-  const forkedRef = useForkedRef(ref, nodeRef)
-  const titleId = useId()
-  const textId = useId()
-
-  useEffect(() => {
-    setVisible(visible)
-  }, [visible])
-
-  const close = useCallback(() => setVisible(false), [])
-
-  const getTransitionClass = (state: string) =>
-    state === 'entering' || state === 'exiting'
-      ? 'show showing'
-      : state === 'entered'
-        ? 'show'
-        : undefined
-
-  return {
-    close,
-    entered,
-    forkedRef,
-    getTransitionClass,
-    textId,
-    titleId,
-    transitionProps: {
-      appear: true,
-      in: _visible,
-      nodeRef,
-      onEnter: () => onShow?.(),
-      onEntered: () => setEntered(true),
-      onExit: () => setEntered(false),
-      onExited: () => onClose?.(),
-      unmountOnExit: true
-    },
-    visible: _visible
-  }
-}

package/src/hooks/useDrawer.ts

@@ -1,9 +0,0 @@
-import { useContext } from 'react'
-import { DrawerContext, DrawerContextProps } from '../components/drawer/Drawer'
-
-export type UseDrawerResult = DrawerContextProps
-
-// Reach the enclosing `Drawer`'s close handler from anywhere in its composed markup — e.g. to
-// close it from a plain `Button` placed in a `DrawerFooter`. Only meaningful inside a `Drawer`;
-// outside one it returns a no-op `close`.
-export const useDrawer = (): UseDrawerResult => useContext(DrawerContext)

package/src/hooks/useFloatingOverlay.ts

@@ -1,125 +0,0 @@
-import { CSSProperties, HTMLAttributes, RefObject, useEffect, useRef, useState } from 'react'
-
-export interface UseFloatingOverlayOptions {
-  /**
-   * Imperatively closes the overlay — called when `visible` syncs to `false` and when the
-   * containing `<dialog>` fires its native `close` event. Pass a stable callback (e.g. the
-   * trigger state's own `close`) where possible; an inline arrow is fine too, since only its
-   * latest value is ever invoked.
-   */
-  close: () => void
-  /**
-   * Whether the overlay is currently open — drives `onShow`/`onHide` and portal-container
-   * resolution.
-   */
-  isOpen: boolean
-  /**
-   * Imperatively opens the overlay — called when `visible` syncs to `true`.
-   */
-  open: () => void
-  onHide?: () => void
-  onShow?: () => void
-  /**
-   * Ref to the element that triggers the overlay, used to resolve which `<dialog>` (if any) it
-   * lives inside.
-   */
-  triggerRef: RefObject<HTMLElement | null>
-  /**
-   * Controlled visibility prop from the consuming component; `undefined` means uncontrolled.
-   */
-  visible?: boolean
-}
-
-/**
- * Shared portal-container/visibility wiring for `Popover` and `Tooltip`: resolves the `<dialog>`
- * a trigger lives inside (if any), syncs an uncontrolled-by-default `visible` prop to the
- * trigger state, fires `onShow`/`onHide`, and resets on the containing dialog's native `close`
- * event. Positioning-specific concerns (placement, arrow, escape/outside-click dismissal) stay
- * in each component — only this ~80% overlap is shared.
- */
-export function useFloatingOverlay({
-  close,
-  isOpen,
-  open,
-  onHide,
-  onShow,
-  triggerRef,
-  visible
-}: UseFloatingOverlayOptions) {
-  const [portalContainer, setPortalContainer] = useState<Element | null>(null)
-
-  // Overlays inside an open `<dialog>` are appended to that dialog instead of `document.body`,
-  // so they render in its top layer and close with it automatically.
-  const resolvePortalContainer = () => triggerRef.current?.closest('dialog[open]') ?? document.body
-
-  // Sync-on-change, not strictly controlled — matches `Menu`'s `visible` semantics.
-  useEffect(() => {
-    if (visible === undefined) return
-    setPortalContainer(resolvePortalContainer())
-    if (visible) open()
-    else close()
-  }, [visible])
-
-  // `onShow`/`onHide` report *transitions*, so neither fires for the initial commit — mounting
-  // closed is not a hide. Without this guard the `else` branch ran on mount and every
-  // `<Popover onHide>`/`<Tooltip onHide>` on the page reported a close that never happened,
-  // before `onShow` had ever fired once. The portal container still resolves on mount, since
-  // an overlay mounted already-open needs one immediately.
-  const mountedRef = useRef(false)
-
-  useEffect(() => {
-    const isInitialCommit = !mountedRef.current
-    mountedRef.current = true
-
-    if (isOpen) {
-      setPortalContainer(resolvePortalContainer())
-      if (!isInitialCommit) onShow?.()
-    } else if (!isInitialCommit) {
-      onHide?.()
-    }
-  }, [isOpen])
-
-  // `close` is read through a ref so this effect only re-subscribes when `isOpen`/
-  // `portalContainer` actually change, regardless of whether the caller passes a stable
-  // callback or a fresh inline arrow each render.
-  const closeRef = useRef(close)
-  closeRef.current = close
-
-  // A dialog fires a native `close` event on ESC, backdrop click, or `.close()`, so resetting
-  // on it keeps a reopened dialog from showing a stale, already-open overlay.
-  useEffect(() => {
-    const dialog = portalContainer?.closest('dialog')
-    if (!isOpen || !dialog) return
-
-    const handleClose = () => closeRef.current()
-    dialog.addEventListener('close', handleClose)
-    return () => dialog.removeEventListener('close', handleClose)
-  }, [isOpen, portalContainer])
-
-  return portalContainer
-}
-
-// `useOverlayPosition`'s `arrowProps.style` sets a single cross-axis offset (`top` for a
-// left/right overlay, `left` for a top/bottom one) to the trigger's center point, not the arrow
-// element's top-left corner — so it must be recentered by half the arrow's own size on that
-// axis. Chassis-css's JS plugin never has this problem since Floating UI's `arrow` middleware
-// returns a top-left-corner coordinate directly; react-aria's is center-based. Unlike the
-// chassis-css JS plugin, react-aria also never sets `position: absolute` on the arrow element
-// itself, so without it the offset has no effect and the arrow renders in normal document flow.
-export function getOverlayArrowStyle(arrowProps: HTMLAttributes<HTMLDivElement>): CSSProperties {
-  return {
-    position: 'absolute',
-    ...arrowProps.style,
-    transform: arrowProps.style?.top !== undefined ? 'translateY(-50%)' : 'translateX(-50%)'
-  }
-}
-
-export function getOverlayTransitionClass(transitionState: string): string {
-  return transitionState === 'entering'
-    ? 'fade'
-    : transitionState === 'entered'
-      ? 'fade show'
-      : transitionState === 'exiting'
-        ? 'fade'
-        : 'fade'
-}

package/src/hooks/useForkedRef.ts

@@ -1,50 +0,0 @@
-// code borrowed from https://github.com/reach/reach-ui
-// problem described https://github.com/facebook/react/issues/13029
-
-import { useMemo } from 'react'
-
-export type AssignableRef<ValueType> =
-  | {
-      bivarianceHack(instance: ValueType | null): void
-    }['bivarianceHack']
-  | React.MutableRefObject<ValueType | null>
-
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-export function useForkedRef<RefValueType = any>(
-  ...refs: (AssignableRef<RefValueType> | null | undefined)[]
-) {
-  return useMemo(() => {
-    if (refs.every((ref) => ref == null)) {
-      return null
-    }
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    return (node: any) => {
-      refs.forEach((ref) => {
-        assignRef(ref, node)
-      })
-    }
-  }, refs)
-}
-
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-export function assignRef<RefValueType = any>(
-  ref: AssignableRef<RefValueType> | null | undefined,
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  value: any
-) {
-  if (ref == null) return
-  if (isFunction(ref)) {
-    ref(value)
-  } else {
-    try {
-      ref.current = value
-    } catch (error) {
-      throw new Error(`Cannot assign value "${value}" to ref "${ref}"`, { cause: error })
-    }
-  }
-}
-
-// eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/no-unsafe-function-type
-export function isFunction(value: any): value is Function {
-  return !!(value && {}.toString.call(value) == '[object Function]')
-}

package/src/hooks/useFormField.ts

@@ -1,89 +0,0 @@
-import { ReactNode, useId } from 'react'
-
-export interface UseFormFieldOptions {
-  /**
-   * A caller-supplied `aria-describedby` to merge in alongside the generated help/feedback ids
-   * (e.g. `rest['aria-describedby']`).
-   */
-  ariaDescribedBy?: string
-  /**
-   * A caller-supplied `aria-labelledby` to merge in alongside `labelId` (e.g.
-   * `rest['aria-labelledby']`). Relevant for the `role="group"` shape and for any single-input
-   * component backed by a react-aria hook — see `labelledBy`.
-   */
-  ariaLabelledBy?: string
-  help?: ReactNode
-  id?: string
-  invalid?: boolean
-  invalidFeedback?: ReactNode
-  label?: ReactNode
-  valid?: boolean
-  validFeedback?: ReactNode
-}
-
-export interface UseFormFieldResult {
-  /**
-   * Merged `aria-describedby` value (help id + feedback id, if shown + `ariaDescribedBy`), or
-   * `undefined` when none apply. Safe to spread straight onto the real control:
-   * `aria-describedby={describedBy}`.
-   */
-  describedBy?: string
-  feedbackId: string
-  helpId: string
-  /**
-   * Id for the one real focusable control — pair with `<FormLabel htmlFor={inputId}>` (via
-   * `ids.input`). Ignore this and use `labelId`/`labelledBy` instead for a `role="group"` wrapper
-   * with no single input to target — see FORMS.md's "`htmlFor` vs `aria-labelledby`" section.
-   */
-  inputId: string
-  /**
-   * This field's own label id, for a control to reference via its own `aria-labelledby` (via
-   * `ids.label`) instead of `htmlFor`.
-   */
-  labelId: string
-  /**
-   * Merged `aria-labelledby` value (`labelId`, only when `label` is set + `ariaLabelledBy`), or
-   * `undefined` when neither applies. Feed this into the underlying react-aria hook's own
-   * `aria-labelledby` (in addition to any `htmlFor`-based association) so its own dev-mode
-   * "no accessible label" warning knows about a visible `label` it can't otherwise see.
-   */
-  labelledBy?: string
-}
-
-// Shared id-generation and aria-describedby/aria-labelledby merge logic behind every
-// renderFormField-based component (see FORMS.md's "The two engines" section). Every id is
-// generated with React's own useId(), not react-aria's — see FORMS.md for why that's deliberate.
-//
-// If you spread the result of a react-aria hook via mergeProps(hookProps, rest) instead of
-// directly onto the control, re-apply `describedBy`/`labelledBy` as explicit props *after* that
-// spread — mergeProps lets the later argument win, so rest's raw (un-merged) aria-describedby/
-// aria-labelledby can silently overwrite these otherwise. See FORMS.md gotcha #4.
-export const useFormField = ({
-  ariaDescribedBy,
-  ariaLabelledBy,
-  help,
-  id,
-  invalid,
-  invalidFeedback,
-  label,
-  valid,
-  validFeedback
-}: UseFormFieldOptions): UseFormFieldResult => {
-  const generatedId = useId()
-  const inputId = id ?? generatedId
-  const labelId = `${generatedId}-label`
-  const helpId = `${generatedId}-help`
-  const feedbackId = `${generatedId}-feedback`
-
-  const showInvalidFeedback = invalid && invalidFeedback
-  const showValidFeedback = valid && validFeedback
-
-  const describedBy =
-    [help && helpId, (showInvalidFeedback || showValidFeedback) && feedbackId, ariaDescribedBy]
-      .filter(Boolean)
-      .join(' ') || undefined
-
-  const labelledBy = [label && labelId, ariaLabelledBy].filter(Boolean).join(' ') || undefined
-
-  return { describedBy, feedbackId, helpId, inputId, labelId, labelledBy }
-}

package/src/hooks/useIconConfig.ts

@@ -1,6 +0,0 @@
-import { useContext } from 'react'
-
-import { IconConfig, IconContext } from '../utils/iconConfig'
-
-// The nearest `IconProvider`'s settings, merged with every provider above it; empty outside one.
-export const useIconConfig = (): IconConfig => useContext(IconContext)