@pushwoosh/dumb-components 2.9.3 → 2.9.5

package/Badge/types.d.ts

@@ -1,4 +1,4 @@
-import type { Ref, ReactNode } from 'react';
+import type { JSX, Ref, ReactNode } from 'react';
 /** Color of a {@link Badge}. */
 export type BadgeColor = 'gray' | 'green' | 'orange' | 'red' | 'purple' | 'sky' | 'locked' | 'black';
 /** Props of {@link Badge} — all `<div>` attributes plus the badge-specific ones. */

package/Link/Link.d.ts

@@ -1,4 +1,4 @@
-import { type ReactElement } from 'react';
+import { type JSX, type ReactElement } from 'react';
 import type { LinkPropsWithoutAs, LinkPropsWithAsTag, LinkPropsWithAsComponent } from './types';
 /**
  * Styled hyperlink. Renders a native `<a>` by default.

package/Link/types.d.ts

@@ -1,4 +1,4 @@
-import type { Ref, ReactNode, ComponentType } from 'react';
+import type { JSX, Ref, ReactNode, ComponentType } from 'react';
 /** Default {@link Link} props — renders a styled `<a>` (requires `title` and `href`). */
 export type LinkPropsWithoutAs = Omit<JSX.IntrinsicElements['a'], 'ref'> & {
     /** Ref to the `<a>` element. */

package/Pagination/types.d.ts

@@ -1,4 +1,4 @@
-import type { Ref } from 'react';
+import type { JSX, Ref } from 'react';
 /** Props of {@link Pagination} — all `<div>` attributes plus the pagination-specific ones. */
 export type PaginationProps = Omit<JSX.IntrinsicElements['div'], 'ref'> & {
     /** Ref to the container `<div>`. */

package/Popover/types.d.ts

@@ -1,11 +1,11 @@
-import type { RefObject, ReactNode } from 'react';
+import type { Ref, RefObject, ReactNode } from 'react';
 import type { Placement } from 'tippy.js';
 /** Props of {@link Popover}. */
 export interface PopoverProps {
     /** Ref to the element the popover anchors to. */
-    readonly anchorEl: RefObject<HTMLElement>;
+    readonly anchorEl: RefObject<HTMLElement | null>;
     /** Ref to the popover window, e.g. for click-outside detection. */
-    readonly internalWindowRef?: RefObject<HTMLDivElement> | null;
+    readonly internalWindowRef?: Ref<HTMLDivElement>;
     /** Placement relative to the anchor (default `right-start`). */
     readonly position?: Placement;
     /** Whether the popover is open. */

package/SortButton/types.d.ts

@@ -1,4 +1,4 @@
-import type { Ref } from 'react';
+import type { JSX, Ref } from 'react';
 /** Current sort order of a column: ascending, descending, or unsorted (`null`). */
 export type SortButtonOrder = 'asc' | 'desc' | null;
 /** Arrow icon state shown by a {@link SortButton}. */

package/Tabs/components/Tab/types.d.ts

@@ -1,4 +1,4 @@
-import type { ReactNode } from 'react';
+import type { JSX, ReactNode } from 'react';
 import type { TabCode } from '../../types';
 /** Props of {@link Tab} — all `<div>` attributes plus the tab-specific ones. */
 export type TabProps = Omit<JSX.IntrinsicElements['div'], 'ref' | 'onClick'> & Readonly<{

package/Tabs/components/TabBar/types.d.ts

@@ -1,4 +1,4 @@
-import type { ReactNode } from 'react';
+import type { JSX, ReactNode } from 'react';
 /** How a {@link TabBar} lays out its tabs. */
 export type TabBarLayout = 
 /** Tabs take their content width; overflowing tabs scroll behind arrows. */

package/Tabs/components/TabBarScrollableFrame/types.d.ts

@@ -1 +1,2 @@
+import type { JSX } from 'react';
 export type TabsListSlideFrameProps = Omit<JSX.IntrinsicElements['div'], 'ref'>;

package/Tabs/components/TabBase/types.d.ts

@@ -1,4 +1,4 @@
-import type { ReactNode } from 'react';
+import type { JSX, ReactNode } from 'react';
 export type TabBaseProps = Omit<JSX.IntrinsicElements['div'], 'ref'> & Readonly<{
     isActive?: boolean;
     isDisabled?: boolean;

package/Tooltip/types.d.ts

@@ -24,7 +24,7 @@ export type TooltipProps = {
     /** Controlled visibility; omit for hover/focus behavior. */
     readonly isVisible?: boolean;
     /** External anchor ref to attach to instead of wrapping `children`. */
-    readonly reference?: RefObject<Element>;
+    readonly reference?: RefObject<Element | null>;
     /** The anchor element the tooltip wraps. */
     readonly children?: ReactElement<unknown>;
 };

package/hooks/useElementWidth.d.ts

@@ -8,5 +8,5 @@ type ElementWidth = number | null;
  * @returns a tuple of the current width (`null` before first measure) and a
  *   `forceUpdate` callback to re-measure on demand
  */
-export declare function useElementWidth(ref: RefObject<HTMLElement>): [ElementWidth, ForceUpdate];
+export declare function useElementWidth(ref: RefObject<HTMLElement | null>): [ElementWidth, ForceUpdate];
 export {};

package/hooks/useThemeName.d.ts

@@ -3,4 +3,4 @@ import { type ThemeName } from '@pushwoosh/kit-constants';
 /** Current theme as a value, for widgets that cannot read `var(--pw-color-*)` — canvas, shadow DOM.
  * @param ref - element inside the theme scope, so a light island wins over the document theme
  * @param isEnabled - pass `false` when the caller already knows the theme and needs no observer */
-export declare function useThemeName(ref?: RefObject<Element>, isEnabled?: boolean): ThemeName;
+export declare function useThemeName(ref?: RefObject<Element | null>, isEnabled?: boolean): ThemeName;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pushwoosh/dumb-components",
-  "version": "2.9.3",
+  "version": "2.9.5",
   "description": "React components to build Pushwoosh products",
   "main": "index.js",
   "module": "index.js",
@@ -43,7 +43,7 @@
     "@pushwoosh/kit-constants": "^2.1.0",
     "@pushwoosh/kit-helpers": "^4.12.7",
     "@pushwoosh/kit-icons": "^2.3.3",
-    "@pushwoosh/kit-typography": "^1.8.6",
+    "@pushwoosh/kit-typography": "^1.8.7",
     "@tippyjs/react": "^4.2.6",
     "@uiw/codemirror-themes": "^4.23.8",
     "@uiw/react-codemirror": "^4.23.8",

package/shared/dropdownField/shared.d.ts

@@ -10,5 +10,5 @@ export declare function defaultLabelFilter<T>(item: T, query: string, getLabel:
  * Mousedown handler for the field shell: refocuses the input and opens the dropdown,
  * while letting clicks on the input itself or on inner buttons through.
  */
-export declare function useShellMouseDown(inputRef: RefObject<HTMLInputElement>, isOpen: boolean, open: () => void): (event: MouseEvent<HTMLDivElement>) => void;
-export declare function useToggleOpen(inputRef: RefObject<HTMLInputElement>, isOpen: boolean, open: () => void, close: () => void): () => void;
+export declare function useShellMouseDown(inputRef: RefObject<HTMLInputElement | null>, isOpen: boolean, open: () => void): (event: MouseEvent<HTMLDivElement>) => void;
+export declare function useToggleOpen(inputRef: RefObject<HTMLInputElement | null>, isOpen: boolean, open: () => void, close: () => void): () => void;

package/shared/dropdownField/useFieldOpenEffects.d.ts

@@ -5,7 +5,7 @@ type Args = {
     onClose?: () => void;
     autoFocus?: boolean;
     disabled?: boolean;
-    inputRef: RefObject<HTMLInputElement>;
+    inputRef: RefObject<HTMLInputElement | null>;
 };
 /**
  * Side effects tied to a Combobox field's open state: optional autofocus on mount