@koobiq/react-primitives 0.0.1-beta.20 → 0.0.1-beta.22

package/dist/behaviors/useButton.d.ts

@@ -2,11 +2,11 @@ import type { RefObject } from 'react';
 import type { ButtonOptions } from '../types';
 export type UseButtonProps = ButtonOptions;
 export declare function useButton(props: UseButtonProps, ref: RefObject<Element | null>): {
-    pressed: boolean;
-    hovered: boolean;
-    focused: boolean;
-    disabled: boolean | undefined;
+    isPressed: boolean;
+    isHovered: boolean;
+    isFocused: boolean;
+    isDisabled: boolean | undefined;
     buttonProps: import("@react-types/shared").DOMAttributes<import("@react-types/shared").FocusableElement>;
-    focusVisible: boolean;
+    isFocusVisible: boolean;
 };
 export type UseButtonReturn = ReturnType<typeof useButton>;

package/dist/behaviors/useButton.js

@@ -2,33 +2,23 @@
 import { useFocusRing, useHover, mergeProps } from "@koobiq/react-core";
 import { useButton as useButton$1 } from "@react-aria/button";
 function useButton(props, ref) {
-  const { disabled, ...otherProps } = props;
-  const {
-    focusProps,
-    isFocused: focused,
-    isFocusVisible: focusVisible
-  } = useFocusRing({
+  const { isDisabled } = props;
+  const { focusProps, isFocused, isFocusVisible } = useFocusRing({
     within: true
   });
-  const { hoverProps, isHovered: hovered } = useHover({
-    ...props,
-    isDisabled: disabled
-  });
-  const { buttonProps: commonButtonProps, isPressed: pressed } = useButton$1(
-    {
-      ...otherProps,
-      isDisabled: disabled
-    },
+  const { hoverProps, isHovered } = useHover(props);
+  const { buttonProps: commonButtonProps, isPressed } = useButton$1(
+    props,
     ref
   );
   const buttonProps = mergeProps(commonButtonProps, focusProps, hoverProps);
   return {
-    pressed,
-    hovered,
-    focused,
-    disabled,
+    isPressed,
+    isHovered,
+    isFocused,
+    isDisabled,
     buttonProps,
-    focusVisible
+    isFocusVisible
   };
 }
 export {

package/dist/behaviors/useLink.d.ts

@@ -1,14 +1,11 @@
 import type { RefObject } from 'react';
-import type { ExtendableProps } from '@koobiq/react-core';
 import type { AriaLinkOptions } from '@react-aria/link';
-export type UseLinkProps = ExtendableProps<{
-    disabled?: boolean;
-}, Omit<AriaLinkOptions, 'isDisabled'>>;
+export type UseLinkProps = AriaLinkOptions;
 export declare function useLink(props: UseLinkProps, ref: RefObject<HTMLElement | null>): {
     linkProps: import("@react-types/shared").DOMAttributes<import("@react-types/shared").FocusableElement>;
-    pressed: boolean;
-    hovered: boolean;
-    focused: boolean;
-    focusVisible: boolean;
+    isPressed: boolean;
+    isHovered: boolean;
+    isFocused: boolean;
+    isFocusVisible: boolean;
 };
 export type UseLinkReturn = ReturnType<typeof useLink>;

package/dist/behaviors/useLink.js

@@ -2,31 +2,23 @@
 import { useHover, useFocusRing, mergeProps } from "@koobiq/react-core";
 import { useLink as useLink$1 } from "@react-aria/link";
 function useLink(props, ref) {
-  const { disabled, ...otherProps } = props;
-  const { hoverProps, isHovered } = useHover({
-    ...otherProps,
-    isDisabled: disabled
-  });
+  const { hoverProps, isHovered } = useHover(props);
   const { focusProps, isFocused, isFocusVisible } = useFocusRing();
   const { linkProps: commonLinkProps, isPressed } = useLink$1(
-    {
-      ...otherProps,
-      isDisabled: disabled
-    },
+    props,
     ref
   );
   const linkProps = mergeProps(
-    { disabled },
+    commonLinkProps,
     focusProps,
-    hoverProps,
-    commonLinkProps
+    hoverProps
   );
   return {
     linkProps,
-    pressed: isPressed,
-    hovered: isHovered,
-    focused: isFocused,
-    focusVisible: isFocusVisible
+    isPressed,
+    isHovered,
+    isFocused,
+    isFocusVisible
   };
 }
 export {

package/dist/components/Button/Button.js

@@ -11,8 +11,8 @@ const Button = polymorphicForwardRef(
     const Tag = as || "button";
     const commonProps = useSlottedContext(props, ButtonContext, slot);
     const {
-      loading,
-      disabled,
+      isLoading,
+      isDisabled,
       value,
       name,
       form,
@@ -23,10 +23,10 @@ const Button = polymorphicForwardRef(
       formTarget
     } = commonProps;
     const domRef = useDOMRef(ref);
-    const { hovered, pressed, focused, focusVisible, buttonProps } = useButton(
+    const { isHovered, isPressed, isFocused, isFocusVisible, buttonProps } = useButton(
       {
         ...commonProps,
-        ...(loading || disabled) && {
+        ...(isLoading || isDisabled) && {
           onPress: void 0,
           onPressStart: void 0,
           onPressEnd: void 0,
@@ -37,18 +37,17 @@ const Button = polymorphicForwardRef(
           onClick: void 0,
           href: void 0
         },
-        disabled,
         elementType: as
       },
       domRef
     );
     const renderValues = {
-      hovered,
-      pressed,
-      focused,
-      focusVisible,
-      loading: loading || false,
-      disabled: disabled || false
+      isHovered,
+      isPressed,
+      isFocused,
+      isFocusVisible,
+      isLoading: isLoading || false,
+      isDisabled: isDisabled || false
     };
     const renderProps = useRenderProps({
       ...props,
@@ -69,14 +68,14 @@ const Button = polymorphicForwardRef(
         },
         ...buttonProps,
         ...renderProps,
-        "data-hovered": hovered,
-        "data-pressed": pressed,
-        "data-focused": focused,
-        "data-disabled": disabled,
-        "data-focus-visible": focusVisible,
+        "data-hovered": isHovered,
+        "data-pressed": isPressed,
+        "data-focused": isFocused,
+        "data-disabled": isDisabled,
+        "data-focus-visible": isFocusVisible,
         tabIndex: tabIndex || buttonProps.tabIndex,
-        "aria-disabled": loading ? "true" : buttonProps["aria-disabled"],
-        "aria-busy": loading,
+        "aria-disabled": isLoading ? "true" : buttonProps["aria-disabled"],
+        "aria-busy": isLoading,
         ref: domRef,
         children: renderProps.children
       }

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

@@ -3,12 +3,12 @@ import type { HoverEvent } from '@react-types/shared';
 import type { ButtonOptions } from '../../types';
 import type { RenderProps } from '../../utils';
 export type ButtonRenderProps = {
-    hovered: boolean;
-    focused: boolean;
-    pressed: boolean;
-    loading: boolean;
-    disabled: boolean;
-    focusVisible: boolean;
+    isHovered: boolean;
+    isFocused: boolean;
+    isPressed: boolean;
+    isLoading: boolean;
+    isDisabled: boolean;
+    isFocusVisible: boolean;
 };
 export type ButtonBaseProps = ExtendableProps<RenderProps<ButtonRenderProps>, ButtonOptions & {
     /** Handler that is called when a hover interaction starts. */
@@ -39,5 +39,5 @@ export type ButtonBaseProps = ExtendableProps<RenderProps<ButtonRenderProps>, Bu
     formTarget?: string;
     tabIndex?: number;
     slot?: string;
-    loading?: boolean;
+    isLoading?: boolean;
 }>;

package/dist/components/Link/Link.js

@@ -4,13 +4,12 @@ import { polymorphicForwardRef, useDOMRef, mergeProps } from "@koobiq/react-core
 import { useRenderProps } from "../../utils/index.js";
 import { useLink } from "../../behaviors/useLink.js";
 const Link = polymorphicForwardRef((props, ref) => {
-  const { as: Tag = "a", ...commonProps } = props;
-  const { disabled } = commonProps;
+  const { as: Tag = "a", ...other } = props;
   const domRef = useDOMRef(ref);
-  const { hovered, pressed, focused, focusVisible, linkProps } = useLink(
+  const { isHovered, isPressed, isFocusVisible, isFocused, linkProps } = useLink(
     {
-      ...commonProps,
-      ...disabled && {
+      ...other,
+      ...other.isDisabled && {
         onPress: void 0,
         onPressStart: void 0,
         onPressEnd: void 0,
@@ -20,17 +19,16 @@ const Link = polymorphicForwardRef((props, ref) => {
         onKeyUp: void 0,
         onClick: void 0,
         href: void 0
-      },
-      disabled
+      }
     },
     domRef
   );
   const renderValues = {
-    hovered,
-    pressed,
-    focused,
-    focusVisible,
-    disabled: props.disabled || false
+    isHovered,
+    isPressed,
+    isFocused,
+    isFocusVisible,
+    isDisabled: props.isDisabled || false
   };
   const renderProps = useRenderProps({
     ...props,

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

@@ -2,11 +2,11 @@ import type { ExtendableProps } from '@koobiq/react-core';
 import type { UseLinkProps } from '../../behaviors';
 import type { RenderProps } from '../../utils';
 export type LinkRenderProps = {
-    hovered: boolean;
-    focused: boolean;
-    pressed: boolean;
-    disabled: boolean;
-    focusVisible: boolean;
+    isHovered: boolean;
+    isFocused: boolean;
+    isPressed: boolean;
+    isDisabled: boolean;
+    isFocusVisible: boolean;
 };
 export type LinkBaseProps = ExtendableProps<RenderProps<LinkRenderProps> & {
     tabIndex?: number;

package/dist/index.d.ts

@@ -6,8 +6,10 @@ import { useMenu, useMenuItem, useMenuSection, useMenuTrigger, type AriaMenuOpti
 import { Overlay, usePopover, useModalOverlay, useOverlayTrigger, useOverlayPosition, type AriaModalOverlayProps } from '@react-aria/overlays';
 import { useSelect, HiddenSelect } from '@react-aria/select';
 import { useSeparator } from '@react-aria/separator';
+import { useTag, useTagGroup, type AriaTagGroupProps, type AriaTagProps } from '@react-aria/tag';
 import { useTooltip, useTooltipTrigger } from '@react-aria/tooltip';
 import { Item, Section } from '@react-stately/collections';
+import { useListData } from '@react-stately/data';
 import { useListState, type ListState } from '@react-stately/list';
 import { useMenuTriggerState } from '@react-stately/menu';
 import { useOverlayTriggerState, type OverlayTriggerState } from '@react-stately/overlays';
@@ -19,6 +21,6 @@ import { useTreeState, type TreeState } from '@react-stately/tree';
 import type { Node, PressEvent, HoverEvent, ItemProps, SectionProps, LinkDOMProps, FocusableElement } from '@react-types/shared';
 export * from './behaviors/index.js';
 export * from './components/index.js';
-export { Item, Overlay, Section, useMenu, useLocale, useDialog, useOption, useSelect, usePopover, useListBox, useTooltip, useListState, HiddenSelect, I18nProvider, useMenuItem, useTreeState, useSeparator, useMenuSection, useMenuTrigger, useSelectState, useModalOverlay, useOverlayTrigger, useTooltipTrigger, useListBoxSection, useOverlayPosition, useMenuTriggerState, useToggleGroupState, useToggleButtonGroup, useOverlayTriggerState, useTooltipTriggerState, useToggleButtonGroupItem, useLocalizedStringFormatter, type Node, type TreeState, type ItemProps, type ListState, type PressEvent, type HoverEvent, type LinkDOMProps, type FocusableElement, type SectionProps, type ToggleGroupState, type AriaMenuProps, type AriaDialogProps, type AriaMenuOptions, type AriaListBoxProps, type I18nProviderProps, type TooltipTriggerProps, type OverlayTriggerState, type AriaModalOverlayProps, type AriaToggleButtonGroupProps, type AriaToggleButtonGroupItemProps, };
+export { Item, Overlay, Section, useMenu, useLocale, useDialog, useOption, useSelect, usePopover, useListBox, useTooltip, useTag, useTagGroup, useListState, HiddenSelect, I18nProvider, useMenuItem, useListData, useTreeState, useSeparator, useMenuSection, useMenuTrigger, useSelectState, useModalOverlay, useOverlayTrigger, useTooltipTrigger, useListBoxSection, useOverlayPosition, useMenuTriggerState, useToggleGroupState, useToggleButtonGroup, useOverlayTriggerState, useTooltipTriggerState, useToggleButtonGroupItem, useLocalizedStringFormatter, type Node, type TreeState, type ItemProps, type AriaTagGroupProps, type AriaTagProps, type ListState, type PressEvent, type HoverEvent, type LinkDOMProps, type FocusableElement, type SectionProps, type ToggleGroupState, type AriaMenuProps, type AriaDialogProps, type AriaMenuOptions, type AriaListBoxProps, type I18nProviderProps, type TooltipTriggerProps, type OverlayTriggerState, type AriaModalOverlayProps, type AriaToggleButtonGroupProps, type AriaToggleButtonGroupItemProps, };
 export * from './types';
 export * from './utils';

package/dist/index.js

@@ -6,8 +6,10 @@ import { useMenu, useMenuItem, useMenuSection, useMenuTrigger } from "@react-ari
 import { Overlay, useModalOverlay, useOverlayPosition, useOverlayTrigger, usePopover } from "@react-aria/overlays";
 import { HiddenSelect, useSelect } from "@react-aria/select";
 import { useSeparator } from "@react-aria/separator";
+import { useTag, useTagGroup } from "@react-aria/tag";
 import { useTooltip, useTooltipTrigger } from "@react-aria/tooltip";
 import { Item, Section } from "@react-stately/collections";
+import { useListData } from "@react-stately/data";
 import { useListState } from "@react-stately/list";
 import { useMenuTriggerState } from "@react-stately/menu";
 import { useOverlayTriggerState } from "@react-stately/overlays";
@@ -85,6 +87,7 @@ export {
   useLink,
   useListBox,
   useListBoxSection,
+  useListData,
   useListState,
   useLocale,
   useLocalizedStringFormatter,
@@ -109,6 +112,8 @@ export {
   useSelect,
   useSelectState,
   useSeparator,
+  useTag,
+  useTagGroup,
   useTextField,
   useTextareaContext,
   useToggle,

package/dist/types.d.ts

@@ -1,11 +1,5 @@
 import type { ElementType } from 'react';
 import type { AriaButtonOptions } from '@react-aria/button';
 import type { AriaLinkOptions } from '@react-aria/link';
-export type ButtonOptions = Omit<AriaButtonOptions<ElementType>, 'isDisabled'> & {
-    /** Whether the button is disabled. */
-    disabled?: boolean;
-};
-export type LinkOptions = Omit<AriaLinkOptions, 'isDisabled'> & {
-    /** Whether the button is disabled. */
-    disabled?: boolean;
-};
+export type ButtonOptions = AriaButtonOptions<ElementType>;
+export type LinkOptions = AriaLinkOptions;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@koobiq/react-primitives",
-  "version": "0.0.1-beta.20",
+  "version": "0.0.1-beta.22",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
   "exports": {
@@ -36,11 +36,13 @@
     "@react-aria/radio": "^3.10.9",
     "@react-aria/select": "^3.15.3",
     "@react-aria/separator": "^3.4.8",
+    "@react-aria/tag": "^3.6.0",
     "@react-aria/textfield": "^3.14.0",
     "@react-aria/toggle": "^3.10.10",
     "@react-aria/tooltip": "^3.7.9",
     "@react-aria/visually-hidden": "^3.8.0",
     "@react-stately/collections": "^3.12.2",
+    "@react-stately/data": "^3.13.0",
     "@react-stately/list": "^3.12.0",
     "@react-stately/menu": "^3.9.3",
     "@react-stately/numberfield": "^3.9.7",
@@ -50,8 +52,8 @@
     "@react-stately/toggle": "^3.7.0",
     "@react-stately/tooltip": "^3.4.13",
     "@react-stately/tree": "^3.8.9",
-    "@koobiq/logger": "0.0.1-beta.20",
-    "@koobiq/react-core": "0.0.1-beta.20"
+    "@koobiq/logger": "0.0.1-beta.22",
+    "@koobiq/react-core": "0.0.1-beta.22"
   },
   "peerDependencies": {
     "react": "18.x || 19.x",