@koobiq/react-primitives 0.20.0 → 0.21.0

package/dist/components/Button/Button.d.ts

@@ -1,4 +1,4 @@
 import type { ComponentPropsWithRef, ElementType } from 'react';
-import type { ButtonBaseProps } from './types.js';
+import type { ButtonBaseProps } from './types';
 export declare const Button: import("@koobiq/react-core").PolyForwardComponent<"button", ButtonBaseProps, ElementType>;
 export type ButtonProps<As extends ElementType = 'button'> = ComponentPropsWithRef<typeof Button<As>>;

package/dist/components/Button/Button.js

@@ -1,13 +1,12 @@
 "use client";
 import { jsx } from "react/jsx-runtime";
 import { polymorphicForwardRef, useDOMRef, filterDOMProps, mergeProps } from "@koobiq/react-core";
-import { useRenderProps } from "../../utils/index.js";
-import { useSlottedContext } from "../../utils/useSlottedContext.js";
+import { useContextProps, useRenderProps } from "../../utils/index.js";
 import { ButtonContext } from "./ButtonContext.js";
 import { useButton } from "../../behaviors/useButton.js";
 const Button = polymorphicForwardRef(
   (props, ref) => {
-    const commonProps = useSlottedContext(props, ButtonContext, props.slot);
+    const [ctxProps, ctxRef] = useContextProps(props, ref, ButtonContext);
     const {
       as,
       tabIndex,
@@ -21,12 +20,12 @@ const Button = polymorphicForwardRef(
       formMethod,
       formNoValidate,
       formTarget
-    } = commonProps;
+    } = ctxProps;
     const Tag = as || "button";
-    const domRef = useDOMRef(ref);
+    const domRef = useDOMRef(ctxRef);
     const { isHovered, isPressed, isFocused, isFocusVisible, buttonProps } = useButton(
       {
-        ...commonProps,
+        ...ctxProps,
         ...(isLoading || isDisabled) && {
           onPress: void 0,
           onPressStart: void 0,
@@ -74,11 +73,11 @@ const Button = polymorphicForwardRef(
         "data-hovered": isHovered || void 0,
         "data-pressed": isPressed || void 0,
         "data-focused": isFocused || void 0,
+        "data-loading": isLoading || void 0,
         "data-disabled": isDisabled || void 0,
         "data-focus-visible": isFocusVisible || void 0,
-        tabIndex: buttonProps.tabIndex,
-        ..."tabIndex" in commonProps && { tabIndex },
-        "aria-hidden": commonProps["aria-hidden"],
+        ..."tabIndex" in ctxProps && { tabIndex },
+        "aria-hidden": ctxProps["aria-hidden"],
         "aria-disabled": isLoading ? "true" : buttonProps["aria-disabled"],
         "aria-busy": isLoading,
         ref: domRef,

package/dist/components/Button/ButtonContext.d.ts

@@ -1,5 +1,3 @@
+import type { ContextValue } from '../../utils';
 import type { ButtonProps } from './index';
-export type ButtonContextProps = {
-    slots?: Record<string, ButtonProps>;
-};
-export declare const ButtonContext: import("react").Context<ButtonContextProps>;
+export declare const ButtonContext: import("react").Context<ContextValue<ButtonProps, HTMLElement>>;

package/dist/components/Label/Label.js

@@ -1,14 +1,13 @@
 "use client";
 import { jsx } from "react/jsx-runtime";
-import { useContext } from "react";
-import { polymorphicForwardRef, mergeProps } from "@koobiq/react-core";
+import { polymorphicForwardRef } from "@koobiq/react-core";
+import { useContextProps } from "../../utils/index.js";
 import { LabelContext } from "./LabelContext.js";
 const Label = polymorphicForwardRef(
   (props, ref) => {
-    const { as: Tag = "label", children, ...other } = props;
-    const defaultProps = useContext(LabelContext);
-    const commonProps = mergeProps(defaultProps, other);
-    return /* @__PURE__ */ jsx(Tag, { ...commonProps, ref, children });
+    const [ctxProps, ctxRef] = useContextProps(props, ref, LabelContext);
+    const { as: Tag = "label", children, ...other } = ctxProps;
+    return /* @__PURE__ */ jsx(Tag, { ...other, ref: ctxRef, children });
   }
 );
 Label.displayName = "Label";

package/dist/components/Label/LabelContext.d.ts

@@ -1,2 +1,3 @@
+import type { ContextValue } from '../../utils';
 import type { LabelProps } from './index';
-export declare const LabelContext: import("react").Context<LabelProps>;
+export declare const LabelContext: import("react").Context<ContextValue<LabelProps, HTMLElement>>;

package/dist/components/Label/LabelContext.js

@@ -1,6 +1,6 @@
 "use client";
 import { createContext } from "react";
-const LabelContext = createContext({});
+const LabelContext = createContext(null);
 export {
   LabelContext
 };

package/dist/components/Link/Link.d.ts

@@ -1,2 +1,4 @@
+import type { ComponentPropsWithRef, ElementType } from 'react';
 import type { LinkBaseProps } from './types.js';
-export declare const Link: import("@koobiq/react-core").PolyForwardComponent<"a", LinkBaseProps, import("react").ElementType>;
+export declare const Link: import("@koobiq/react-core").PolyForwardComponent<"a", LinkBaseProps, ElementType>;
+export type LinkProps<As extends ElementType = 'a'> = ComponentPropsWithRef<typeof Link<As>>;

package/dist/components/Link/Link.js

@@ -37,8 +37,13 @@ const Link = polymorphicForwardRef((props, ref) => {
   return /* @__PURE__ */ jsx(
     Tag,
     {
+      "data-hovered": isHovered || void 0,
+      "data-pressed": isPressed || void 0,
+      "data-focused": isFocused || void 0,
+      "data-disabled": props.isDisabled || void 0,
+      "data-focus-visible": isFocusVisible || void 0,
       ...mergeProps(linkProps, renderProps),
-      tabIndex: props.tabIndex || linkProps.tabIndex,
+      ..."tabIndex" in props && { tabIndex: props.tabIndex },
       ref: domRef,
       children: renderProps.children
     }

package/dist/components/Text/Text.js

@@ -1,12 +1,12 @@
 "use client";
 import { jsx } from "react/jsx-runtime";
 import { polymorphicForwardRef } from "@koobiq/react-core";
-import { useSlottedContext } from "../../utils/useSlottedContext.js";
+import { useContextProps } from "../../utils/index.js";
 import { TextContext } from "./TextContext.js";
 const Text = polymorphicForwardRef((props, ref) => {
-  const { as: Tag = "p", children, slot, ...other } = props;
-  const commonProps = useSlottedContext(other, TextContext, slot);
-  return /* @__PURE__ */ jsx(Tag, { ...commonProps, ref, children });
+  const [ctxProps, ctxRef] = useContextProps(props, ref, TextContext);
+  const { as: Tag = "p", children, ...other } = ctxProps;
+  return /* @__PURE__ */ jsx(Tag, { ...other, ref: ctxRef, children });
 });
 Text.displayName = "Text";
 export {

package/dist/components/Text/TextContext.d.ts

@@ -1,5 +1,3 @@
+import type { ContextValue } from '../../utils';
 import type { TextProps } from './Text';
-export type TextContextProps = {
-    slots?: Record<string, TextProps>;
-};
-export declare const TextContext: import("react").Context<TextContextProps>;
+export declare const TextContext: import("react").Context<ContextValue<TextProps, HTMLElement>>;

package/dist/components/Text/TextContext.js

@@ -1,6 +1,8 @@
 "use client";
 import { createContext } from "react";
-const TextContext = createContext({});
+const TextContext = createContext(
+  {}
+);
 export {
   TextContext
 };

package/dist/utils/index.js

@@ -1,6 +1,6 @@
 import { jsx } from "react/jsx-runtime";
 import { useMemo, useContext } from "react";
-import { useObjectRef, mergeRefs, mergeProps } from "@koobiq/react-core";
+import { isNotNil, useObjectRef, mergeRefs, mergeProps } from "@koobiq/react-core";
 const DEFAULT_SLOT = Symbol("default");
 function useRenderProps(props) {
   const {
@@ -69,7 +69,7 @@ function removeDataAttributes(props) {
 }
 function useSlottedContext(context, slot) {
   const ctx = useContext(context);
-  if (slot === null) {
+  if (!isNotNil(slot)) {
     return null;
   }
   if (ctx && typeof ctx === "object" && "slots" in ctx && ctx.slots) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@koobiq/react-primitives",
-  "version": "0.20.0",
+  "version": "0.21.0",
   "license": "MIT",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
@@ -71,8 +71,8 @@
     "@react-stately/toggle": "^3.9.2",
     "@react-stately/tooltip": "^3.5.5",
     "@react-stately/tree": "^3.8.9",
-    "@koobiq/logger": "0.20.0",
-    "@koobiq/react-core": "0.20.0"
+    "@koobiq/react-core": "0.21.0",
+    "@koobiq/logger": "0.21.0"
   },
   "peerDependencies": {
     "react": "18.x || 19.x",

package/dist/utils/useSlottedContext.d.ts

@@ -1,4 +0,0 @@
-import type { Context } from 'react';
-export declare function useSlottedContext<PROPS extends object, CONTEXT extends Context<{
-    slots?: Record<string, any>;
-}>>(props: PROPS, context: CONTEXT, slot: string | undefined): PROPS;

package/dist/utils/useSlottedContext.js

@@ -1,11 +0,0 @@
-import { useContext } from "react";
-import { mergeProps } from "@koobiq/react-core";
-function useSlottedContext(props, context, slot) {
-  const slotContext = useContext(context);
-  if (!slot) return props;
-  const propsContext = slotContext.slots?.[slot];
-  return mergeProps(propsContext, props);
-}
-export {
-  useSlottedContext
-};