chore(root): left/Right labels changed to start/end, tests fixed

packages/components/accordion/CHANGELOG.md

@@ -1,5 +1,20 @@
 # @nextui-org/accordion
 
+## 0.0.0-dev-v2-20230409142211
+
+### Patch Changes
+
+- Left/Right labels changed to Start/End, tests fixed
+- Updated dependencies
+  - @nextui-org/use-aria-accordion-item@0.0.0-dev-v2-20230409142211
+  - @nextui-org/framer-transitions@0.0.0-dev-v2-20230409142211
+  - @nextui-org/shared-icons@0.0.0-dev-v2-20230409142211
+  - @nextui-org/shared-utils@0.0.0-dev-v2-20230409142211
+  - @nextui-org/aria-utils@0.0.0-dev-v2-20230409142211
+  - @nextui-org/dom-utils@0.0.0-dev-v2-20230409142211
+  - @nextui-org/system@0.0.0-dev-v2-20230409142211
+  - @nextui-org/theme@0.0.0-dev-v2-20230409142211
+
 ## 0.0.0-dev-v2-20230409022144
 
 ### Patch Changes

packages/components/accordion/__tests__/accordion.test.tsx

@@ -92,13 +92,13 @@ describe("Accordion", () => {
     expect(button).toHaveAttribute("aria-expanded", "true");
   });
 
-  it("should support leftIndicator", () => {
+  it("should support startIndicator", () => {
     const wrapper = render(
       <Accordion>
         <AccordionItem
           key="1"
           data-testid="item-1"
-          leftIndicator={<div data-testid="left-content" />}
+          startContent={<div data-testid="start-content" />}
           title="Accordion Item 1"
         >
           Accordion Item 1 description
@@ -106,7 +106,7 @@ describe("Accordion", () => {
       </Accordion>,
     );
 
-    expect(wrapper.getByTestId("left-content")).toBeInTheDocument();
+    expect(wrapper.getByTestId("start-content")).toBeInTheDocument();
   });
 
   it("arrow up & down moves focus to next/previous accordion item", async () => {

packages/components/accordion/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/accordion",
-  "version": "0.0.0-dev-v2-20230409022144",
+  "version": "0.0.0-dev-v2-20230409142211",
   "description": "Collapse display a list of high-level options that can expand/collapse to reveal more information.",
   "keywords": [
     "react",

packages/components/accordion/src/accordion-item.tsx

@@ -16,7 +16,7 @@ const AccordionItem = forwardRef<AccordionItemProps, "div">((props, ref) => {
     children,
     title,
     subtitle,
-    leftIndicator,
+    startContent,
     isOpen,
     isDisabled,
     disableAnimation,
@@ -56,10 +56,8 @@ const AccordionItem = forwardRef<AccordionItemProps, "div">((props, ref) => {
     <Component {...getBaseProps()}>
       <h2 {...getHeadingProps()}>
         <button {...getButtonProps()}>
-          {leftIndicator && (
-            <div className={slots.leftIndicator({class: styles?.leftIndicator})}>
-              {leftIndicator}
-            </div>
+          {startContent && (
+            <div className={slots.startContent({class: styles?.startContent})}>{startContent}</div>
           )}
           <div className={slots.titleWrapper({class: styles?.titleWrapper})}>
             {title && <span {...getTitleProps()}>{title}</span>}

packages/components/accordion/src/base/accordion-item-base.tsx

@@ -47,9 +47,9 @@ export interface Props<T extends object = {}>
    */
   indicator?: ReactNode | ((props: AccordionItemIndicatorProps) => ReactNode) | null;
   /**
-   * The accordion item left indicator, it's usually an icon or avatar.
+   * The accordion item start content, it's usually an icon or avatar.
    */
-  leftIndicator?: ReactNode;
+  startContent?: ReactNode;
   /**
    * The properties passed to the underlying `Collapse` component.
    */
@@ -64,7 +64,7 @@ export interface Props<T extends object = {}>
    *    base:"base-classes",
    *    heading: "heading-classes",
    *    trigger: "trigger-classes",
-   *    leftIndicator: "left-indicator-classes",
+   *    startContent: "start-indicator-classes",
    *    indicator: "indicator-classes",
    *    titleWrapper: "title-wrapper-classes", // this wraps the title and subtitle
    *    title: "title-classes",

packages/components/accordion/src/use-accordion-item.ts

@@ -36,7 +36,7 @@ export function useAccordionItem<T extends object = {}>(props: UseAccordionItemP
     children,
     title,
     subtitle,
-    leftIndicator,
+    startContent,
     motionProps = groupContext?.motionProps,
     isCompact = groupContext?.isCompact ?? false,
     isDisabled: isDisabledProp = groupContext?.isDisabled ?? false,
@@ -211,7 +211,7 @@ export function useAccordionItem<T extends object = {}>(props: UseAccordionItemP
     children,
     title,
     subtitle,
-    leftIndicator,
+    startContent,
     isOpen,
     isDisabled,
     disableAnimation,

packages/components/accordion/stories/accordion.stories.tsx

@@ -89,12 +89,12 @@ const TemplateWithSubtitle: ComponentStory<typeof Accordion> = (args: AccordionP
   </Accordion>
 );
 
-const TemplateWithLeftIndicator: ComponentStory<typeof Accordion> = (args: AccordionProps) => (
+const TemplateWithStartContent: ComponentStory<typeof Accordion> = (args: AccordionProps) => (
   <Accordion {...args} variant="shadow">
     <AccordionItem
       key="1"
       aria-label="Chung Miller"
-      leftIndicator={
+      startContent={
         <Avatar
           isBordered
           color="primary"
@@ -110,7 +110,7 @@ const TemplateWithLeftIndicator: ComponentStory<typeof Accordion> = (args: Accor
     <AccordionItem
       key="2"
       aria-label="Janelle Lenard"
-      leftIndicator={
+      startContent={
         <Avatar
           isBordered
           color="success"
@@ -126,7 +126,7 @@ const TemplateWithLeftIndicator: ComponentStory<typeof Accordion> = (args: Accor
     <AccordionItem
       key="3"
       aria-label="Zoey Lang"
-      leftIndicator={
+      startContent={
         <Avatar
           isBordered
           color="warning"
@@ -261,7 +261,7 @@ const CustomWithStylesTemplate: ComponentStory<typeof Accordion> = (args: Accord
       <AccordionItem
         key="1"
         aria-label="Connected devices"
-        leftIndicator={<MonitorMobileIcon className="text-primary" />}
+        startContent={<MonitorMobileIcon className="text-primary" />}
         styles={itemStyles}
         subtitle={
           <p className="flex">
@@ -275,7 +275,7 @@ const CustomWithStylesTemplate: ComponentStory<typeof Accordion> = (args: Accord
       <AccordionItem
         key="2"
         aria-label="Apps Permissions"
-        leftIndicator={<ShieldSecurityIcon />}
+        startContent={<ShieldSecurityIcon />}
         styles={itemStyles}
         subtitle="3 apps have read permissions"
         title="Apps Permissions"
@@ -285,7 +285,7 @@ const CustomWithStylesTemplate: ComponentStory<typeof Accordion> = (args: Accord
       <AccordionItem
         key="3"
         aria-label="Pending tasks"
-        leftIndicator={<InfoIcon className="text-warning" />}
+        startContent={<InfoIcon className="text-warning" />}
         styles={{...itemStyles, subtitle: "text-warning"}}
         subtitle="Complete your profile"
         title="Pending tasks"
@@ -295,7 +295,7 @@ const CustomWithStylesTemplate: ComponentStory<typeof Accordion> = (args: Accord
       <AccordionItem
         key="4"
         aria-label="Card expired"
-        leftIndicator={<InvalidCardIcon className="text-danger" />}
+        startContent={<InvalidCardIcon className="text-danger" />}
         styles={{...itemStyles, subtitle: "text-danger"}}
         subtitle="Please, update now"
         title={
@@ -345,8 +345,8 @@ WithSubtitle.args = {
   ...defaultProps,
 };
 
-export const WithLeftIndicator = TemplateWithLeftIndicator.bind({});
-WithLeftIndicator.args = {
+export const WithStartContent = TemplateWithStartContent.bind({});
+WithStartContent.args = {
   ...defaultProps,
 };
 

packages/components/avatar/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @nextui-org/avatar
 
+## 0.0.0-dev-v2-20230409142211
+
+### Patch Changes
+
+- Left/Right labels changed to Start/End, tests fixed
+- Updated dependencies
+  - @nextui-org/shared-utils@0.0.0-dev-v2-20230409142211
+  - @nextui-org/dom-utils@0.0.0-dev-v2-20230409142211
+  - @nextui-org/use-image@0.0.0-dev-v2-20230409142211
+  - @nextui-org/system@0.0.0-dev-v2-20230409142211
+  - @nextui-org/theme@0.0.0-dev-v2-20230409142211
+
 ## 0.0.0-dev-v2-20230409022144
 
 ### Patch Changes

packages/components/avatar/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/avatar",
-  "version": "0.0.0-dev-v2-20230409022144",
+  "version": "0.0.0-dev-v2-20230409142211",
   "description": "The Avatar component is used to represent a user, and displays the profile picture, initials or fallback icon.",
   "keywords": [
     "avatar"

packages/components/badge/CHANGELOG.md

@@ -1,5 +1,16 @@
 # @nextui-org/badge
 
+## 0.0.0-dev-v2-20230409142211
+
+### Patch Changes
+
+- Left/Right labels changed to Start/End, tests fixed
+- Updated dependencies
+  - @nextui-org/shared-utils@0.0.0-dev-v2-20230409142211
+  - @nextui-org/dom-utils@0.0.0-dev-v2-20230409142211
+  - @nextui-org/system@0.0.0-dev-v2-20230409142211
+  - @nextui-org/theme@0.0.0-dev-v2-20230409142211
+
 ## 0.0.0-dev-v2-20230409022144
 
 ### Patch Changes

packages/components/badge/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/badge",
-  "version": "0.0.0-dev-v2-20230409022144",
+  "version": "0.0.0-dev-v2-20230409142211",
   "description": "Badges are used as a small numerical value or status descriptor for UI elements.",
   "keywords": [
     "badge"

packages/components/button/CHANGELOG.md

@@ -1,5 +1,18 @@
 # @nextui-org/button
 
+## 0.0.0-dev-v2-20230409142211
+
+### Patch Changes
+
+- Left/Right labels changed to Start/End, tests fixed
+- Updated dependencies
+  - @nextui-org/shared-utils@0.0.0-dev-v2-20230409142211
+  - @nextui-org/dom-utils@0.0.0-dev-v2-20230409142211
+  - @nextui-org/spinner@0.0.0-dev-v2-20230409142211
+  - @nextui-org/drip@0.0.0-dev-v2-20230409142211
+  - @nextui-org/system@0.0.0-dev-v2-20230409142211
+  - @nextui-org/theme@0.0.0-dev-v2-20230409142211
+
 ## 0.0.0-dev-v2-20230409022144
 
 ### Patch Changes

packages/components/button/__tests__/button.test.tsx

@@ -28,20 +28,6 @@ describe("Button", () => {
     expect(onPress).toHaveBeenCalled();
   });
 
-  it("should show warning message when onClick is being used", () => {
-    const onClick = jest.fn();
-    const spy = jest.spyOn(console, "warn").mockImplementation(() => {});
-
-    const wrapper = render(<Button onClick={onClick} />);
-
-    act(() => {
-      wrapper.getByRole("button").click();
-    });
-
-    expect(spy).toHaveBeenCalled();
-    spy.mockRestore();
-  });
-
   it("should ignore events when disabled", () => {
     const onPress = jest.fn();
     const {getByRole} = render(<Button disabled onPress={onPress} />);
@@ -53,20 +39,20 @@ describe("Button", () => {
     expect(onPress).not.toHaveBeenCalled();
   });
 
-  it("should renders with left icon", () => {
+  it("should renders with start icon", () => {
     const wrapper = render(
-      <Button leftIcon={<span data-testid="left-icon">Icon</span>}>Button</Button>,
+      <Button startIcon={<span data-testid="start-icon">Icon</span>}>Button</Button>,
     );
 
-    expect(wrapper.getByTestId("left-icon")).toBeInTheDocument();
+    expect(wrapper.getByTestId("start-icon")).toBeInTheDocument();
   });
 
-  it("should renders with right icon", () => {
+  it("should renders with end icon", () => {
     const wrapper = render(
-      <Button rightIcon={<span data-testid="right-icon">Icon</span>}>Button</Button>,
+      <Button endIcon={<span data-testid="end-icon">Icon</span>}>Button</Button>,
     );
 
-    expect(wrapper.getByTestId("right-icon")).toBeInTheDocument();
+    expect(wrapper.getByTestId("end-icon")).toBeInTheDocument();
   });
 
   it("should have the proper type attribute", () => {

packages/components/button/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/button",
-  "version": "0.0.0-dev-v2-20230409022144",
+  "version": "0.0.0-dev-v2-20230409142211",
   "description": "Buttons allow users to perform actions and choose with a single tap.",
   "keywords": [
     "button"
@@ -39,6 +39,7 @@
   "dependencies": {
     "@nextui-org/system": "workspace:*",
     "@nextui-org/shared-utils": "workspace:*",
+    "@nextui-org/use-aria-button": "workspace:*",
     "@nextui-org/dom-utils": "workspace:*",
     "@nextui-org/theme": "workspace:*",
     "@nextui-org/drip": "workspace:*",

packages/components/button/src/button.tsx

@@ -12,8 +12,8 @@ const Button = forwardRef<ButtonProps, "button">((props, ref) => {
     children,
     styles,
     drips,
-    leftIcon,
-    rightIcon,
+    startIcon,
+    endIcon,
     disableRipple,
     getButtonProps,
   } = useButton({
@@ -23,9 +23,9 @@ const Button = forwardRef<ButtonProps, "button">((props, ref) => {
 
   return (
     <Component ref={domRef} className={styles} {...getButtonProps()}>
-      {leftIcon}
+      {startIcon}
       {children}
-      {rightIcon}
+      {endIcon}
       {!disableRipple && <Drip drips={drips} />}
     </Component>
   );

packages/components/button/src/use-button.ts

@@ -11,8 +11,8 @@ import {useDrip} from "@nextui-org/drip";
 import {useDOMRef} from "@nextui-org/dom-utils";
 import {button} from "@nextui-org/theme";
 import {isValidElement, cloneElement, useMemo} from "react";
+import {useAriaButton} from "@nextui-org/use-aria-button";
 
-import {useButton as useAriaButton} from "./use-aria-button";
 import {useButtonGroupContext} from "./button-group-context";
 
 export interface UseButtonProps
@@ -29,13 +29,13 @@ export interface UseButtonProps
   disableRipple?: boolean;
 
   /**
-   * The button left content.
+   * The button start content.
    */
-  leftIcon?: ReactNode;
+  startIcon?: ReactNode;
   /**
-   * The button right content.
+   * The button end content.
    */
-  rightIcon?: ReactNode;
+  endIcon?: ReactNode;
   /**
    * The native button click event handler.
    * @deprecated - use `onPress` instead.
@@ -51,8 +51,8 @@ export function useButton(props: UseButtonProps) {
     ref,
     as,
     children,
-    leftIcon: leftIconProp,
-    rightIcon: rightIconProp,
+    startIcon: startIconProp,
+    endIcon: endIconProp,
     autoFocus,
     className,
     fullWidth = groupContext?.fullWidth ?? false,
@@ -145,8 +145,8 @@ export function useButton(props: UseButtonProps) {
         })
       : null;
 
-  const leftIcon = getIconClone(leftIconProp);
-  const rightIcon = getIconClone(rightIconProp);
+  const startIcon = getIconClone(startIconProp);
+  const endIcon = getIconClone(endIconProp);
 
   return {
     Component,
@@ -154,8 +154,8 @@ export function useButton(props: UseButtonProps) {
     domRef,
     drips,
     styles,
-    leftIcon,
-    rightIcon,
+    startIcon,
+    endIcon,
     disableRipple,
     getButtonProps,
   };

packages/components/button/stories/button.stories.tsx

@@ -98,8 +98,8 @@ DisableRipple.args = {
 export const WithIcons = Template.bind({});
 WithIcons.args = {
   ...defaultProps,
-  leftIcon: <Notification />,
-  rightIcon: <Camera />,
+  startIcon: <Notification />,
+  endIcon: <Camera />,
 };
 
 export const IconButton = Template.bind({});

packages/components/card/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @nextui-org/card
 
+## 0.0.0-dev-v2-20230409142211
+
+### Patch Changes
+
+- Left/Right labels changed to Start/End, tests fixed
+- Updated dependencies
+  - @nextui-org/shared-utils@0.0.0-dev-v2-20230409142211
+  - @nextui-org/dom-utils@0.0.0-dev-v2-20230409142211
+  - @nextui-org/drip@0.0.0-dev-v2-20230409142211
+  - @nextui-org/system@0.0.0-dev-v2-20230409142211
+  - @nextui-org/theme@0.0.0-dev-v2-20230409142211
+
 ## 0.0.0-dev-v2-20230409022144
 
 ### Patch Changes

packages/components/card/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/card",
-  "version": "0.0.0-dev-v2-20230409022144",
+  "version": "0.0.0-dev-v2-20230409142211",
   "description": "Card is a container for text, photos, and actions in the context of a single subject.",
   "keywords": [
     "card"
@@ -40,6 +40,7 @@
     "@nextui-org/theme": "workspace:*",
     "@nextui-org/system": "workspace:*",
     "@nextui-org/shared-utils": "workspace:*",
+    "@nextui-org/use-aria-button": "workspace:*",
     "@nextui-org/dom-utils": "workspace:*",
     "@nextui-org/drip": "workspace:*",
     "@react-aria/focus": "^3.12.0",

packages/components/card/src/use-card.ts

@@ -6,7 +6,7 @@ import {MouseEvent, useCallback, useMemo} from "react";
 import {mergeProps} from "@react-aria/utils";
 import {useFocusRing} from "@react-aria/focus";
 import {useHover} from "@react-aria/interactions";
-import {useButton as useAriaButton} from "@react-aria/button";
+import {useAriaButton} from "@nextui-org/use-aria-button";
 import {HTMLNextUIProps, mapPropsVariants, PropGetter} from "@nextui-org/system";
 import {callAllHandlers, clsx, dataAttr, ReactRef} from "@nextui-org/shared-utils";
 import {useDOMRef} from "@nextui-org/dom-utils";

packages/components/checkbox/CHANGELOG.md

@@ -1,5 +1,16 @@
 # @nextui-org/checkbox
 
+## 0.0.0-dev-v2-20230409142211
+
+### Patch Changes
+
+- Left/Right labels changed to Start/End, tests fixed
+- Updated dependencies
+  - @nextui-org/shared-utils@0.0.0-dev-v2-20230409142211
+  - @nextui-org/dom-utils@0.0.0-dev-v2-20230409142211
+  - @nextui-org/system@0.0.0-dev-v2-20230409142211
+  - @nextui-org/theme@0.0.0-dev-v2-20230409142211
+
 ## 0.0.0-dev-v2-20230409022144
 
 ### Patch Changes

packages/components/checkbox/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/checkbox",
-  "version": "0.0.0-dev-v2-20230409022144",
+  "version": "0.0.0-dev-v2-20230409142211",
   "description": "Checkboxes allow users to select multiple items from a list of individual items, or to mark one individual item as selected.",
   "keywords": [
     "checkbox"

packages/components/chip/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @nextui-org/chip
 
+## 0.0.0-dev-v2-20230409142211
+
+### Patch Changes
+
+- Left/Right labels changed to Start/End, tests fixed
+- Updated dependencies
+  - @nextui-org/shared-icons@0.0.0-dev-v2-20230409142211
+  - @nextui-org/shared-utils@0.0.0-dev-v2-20230409142211
+  - @nextui-org/dom-utils@0.0.0-dev-v2-20230409142211
+  - @nextui-org/system@0.0.0-dev-v2-20230409142211
+  - @nextui-org/theme@0.0.0-dev-v2-20230409142211
+
 ## 0.0.0-dev-v2-20230409022144
 
 ### Patch Changes

packages/components/chip/__tests__/chip.test.tsx

@@ -32,9 +32,9 @@ describe("Chip", () => {
   });
 
   it("should support startContent", () => {
-    const wrapper = render(<Chip startContent={<span data-testid="left-icon" />} />);
+    const wrapper = render(<Chip startContent={<span data-testid="start-icon" />} />);
 
-    expect(wrapper.getByTestId("left-icon")).not.toBeNull();
+    expect(wrapper.getByTestId("start-icon")).not.toBeNull();
   });
 
   it("should support endContent", () => {

packages/components/chip/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/chip",
-  "version": "0.0.0-dev-v2-20230409022144",
+  "version": "0.0.0-dev-v2-20230409142211",
   "description": "Chips help people enter information, make selections, filter content, or trigger actions.",
   "keywords": [
     "chip"

packages/components/code/CHANGELOG.md

@@ -1,5 +1,16 @@
 # @nextui-org/code
 
+## 0.0.0-dev-v2-20230409142211
+
+### Patch Changes
+
+- Left/Right labels changed to Start/End, tests fixed
+- Updated dependencies
+  - @nextui-org/shared-utils@0.0.0-dev-v2-20230409142211
+  - @nextui-org/dom-utils@0.0.0-dev-v2-20230409142211
+  - @nextui-org/system@0.0.0-dev-v2-20230409142211
+  - @nextui-org/theme@0.0.0-dev-v2-20230409142211
+
 ## 0.0.0-dev-v2-20230409022144
 
 ### Patch Changes

packages/components/code/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/code",
-  "version": "0.0.0-dev-v2-20230409022144",
+  "version": "0.0.0-dev-v2-20230409142211",
   "description": "Code is a component used to display inline code.",
   "keywords": [
     "code"

packages/components/drip/CHANGELOG.md

@@ -1,5 +1,16 @@
 # @nextui-org/drip
 
+## 0.0.0-dev-v2-20230409142211
+
+### Patch Changes
+
+- Left/Right labels changed to Start/End, tests fixed
+- Updated dependencies
+  - @nextui-org/shared-utils@0.0.0-dev-v2-20230409142211
+  - @nextui-org/dom-utils@0.0.0-dev-v2-20230409142211
+  - @nextui-org/system@0.0.0-dev-v2-20230409142211
+  - @nextui-org/theme@0.0.0-dev-v2-20230409142211
+
 ## 0.0.0-dev-v2-20230409022144
 
 ### Patch Changes

packages/components/drip/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/drip",
-  "version": "0.0.0-dev-v2-20230409022144",
+  "version": "0.0.0-dev-v2-20230409142211",
   "description": "A ripple effect for ensuring that the user fells the system is reacting instantaneously",
   "keywords": [
     "drip"

packages/components/dropdown/CHANGELOG.md

@@ -1,5 +1,18 @@
 # @nextui-org/dropdown
 
+## 0.0.0-dev-v2-20230409142211
+
+### Patch Changes
+
+- Left/Right labels changed to Start/End, tests fixed
+- Updated dependencies
+  - @nextui-org/shared-utils@0.0.0-dev-v2-20230409142211
+  - @nextui-org/aria-utils@0.0.0-dev-v2-20230409142211
+  - @nextui-org/dom-utils@0.0.0-dev-v2-20230409142211
+  - @nextui-org/popover@0.0.0-dev-v2-20230409142211
+  - @nextui-org/system@0.0.0-dev-v2-20230409142211
+  - @nextui-org/theme@0.0.0-dev-v2-20230409142211
+
 ## 0.0.0-dev-v2-20230409022144
 
 ### Patch Changes

packages/components/dropdown/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/dropdown",
-  "version": "0.0.0-dev-v2-20230409022144",
+  "version": "0.0.0-dev-v2-20230409142211",
   "description": "A dropdown displays a list of actions or options that a user can choose.",
   "keywords": [
     "dropdown"

packages/components/dropdown/stories/dropdown.stories.tsx

@@ -332,6 +332,45 @@ const WithStartContentTemplate: ComponentStory<any> = ({
   );
 };
 
+const WithEndContentTemplate: ComponentStory<any> = ({
+  color,
+  variant,
+  disableAnimation,
+  ...args
+}) => {
+  const iconClasses = "text-2xl text-neutral-500 pointer-events-none flex-shrink-0";
+
+  return (
+    <Dropdown {...args} disableAnimation={disableAnimation}>
+      <DropdownTrigger>
+        <Button color="success" disableAnimation={disableAnimation} variant="faded">
+          Trigger
+        </Button>
+      </DropdownTrigger>
+      <DropdownMenu aria-label="Actions" color={color} variant={variant} onAction={alert}>
+        <DropdownItem key="new" endContent={<AddNoteBulkIcon className={iconClasses} />}>
+          New file
+        </DropdownItem>
+        <DropdownItem key="copy" endContent={<CopyDocumentBulkIcon className={iconClasses} />}>
+          Copy link
+        </DropdownItem>
+        <DropdownItem key="edit" endContent={<EditDocumentBulkIcon className={iconClasses} />}>
+          Edit file
+        </DropdownItem>
+        <DropdownItem
+          key="delete"
+          showDivider
+          className="text-danger"
+          color="danger"
+          endContent={<DeleteDocumentBulkIcon className={clsx(iconClasses, "!text-danger")} />}
+        >
+          Delete file
+        </DropdownItem>
+      </DropdownMenu>
+    </Dropdown>
+  );
+};
+
 const WithDescriptionTemplate: ComponentStory<any> = ({
   color,
   variant,
@@ -568,6 +607,13 @@ WithStartContent.args = {
   color: "secondary",
 };
 
+export const WithEndContent = WithEndContentTemplate.bind({});
+WithEndContent.args = {
+  ...defaultProps,
+  variant: "faded",
+  color: "success",
+};
+
 export const WithDescription = WithDescriptionTemplate.bind({});
 WithDescription.args = {
   ...defaultProps,

packages/components/input/CHANGELOG.md

@@ -1,5 +1,18 @@
 # @nextui-org/input
 
+## 0.0.0-dev-v2-20230409142211
+
+### Patch Changes
+
+- Left/Right labels changed to Start/End, tests fixed
+- Updated dependencies
+  - @nextui-org/shared-icons@0.0.0-dev-v2-20230409142211
+  - @nextui-org/shared-utils@0.0.0-dev-v2-20230409142211
+  - @nextui-org/use-aria-field@0.0.0-dev-v2-20230409142211
+  - @nextui-org/dom-utils@0.0.0-dev-v2-20230409142211
+  - @nextui-org/system@0.0.0-dev-v2-20230409142211
+  - @nextui-org/theme@0.0.0-dev-v2-20230409142211
+
 ## 0.0.0-dev-v2-20230409022144
 
 ### Patch Changes

packages/components/input/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/input",
-  "version": "0.0.0-dev-v2-20230409022144",
+  "version": "0.0.0-dev-v2-20230409142211",
   "description": "The input component is designed for capturing user input within a text field.",
   "keywords": [
     "input"

packages/components/link/CHANGELOG.md

@@ -1,5 +1,16 @@
 # @nextui-org/link
 
+## 0.0.0-dev-v2-20230409142211
+
+### Patch Changes
+
+- Left/Right labels changed to Start/End, tests fixed
+- Updated dependencies
+  - @nextui-org/shared-utils@0.0.0-dev-v2-20230409142211
+  - @nextui-org/dom-utils@0.0.0-dev-v2-20230409142211
+  - @nextui-org/system@0.0.0-dev-v2-20230409142211
+  - @nextui-org/theme@0.0.0-dev-v2-20230409142211
+
 ## 0.0.0-dev-v2-20230409022144
 
 ### Patch Changes

packages/components/link/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/link",
-  "version": "0.0.0-dev-v2-20230409022144",
+  "version": "0.0.0-dev-v2-20230409142211",
   "description": "Links allow users to click their way from page to page. This component is styled to resemble a hyperlink and semantically renders an <a>",
   "keywords": [
     "link"

packages/components/pagination/CHANGELOG.md

@@ -1,5 +1,18 @@
 # @nextui-org/pagination
 
+## 0.0.0-dev-v2-20230409142211
+
+### Patch Changes
+
+- Left/Right labels changed to Start/End, tests fixed
+- Updated dependencies
+  - @nextui-org/shared-icons@0.0.0-dev-v2-20230409142211
+  - @nextui-org/shared-utils@0.0.0-dev-v2-20230409142211
+  - @nextui-org/use-pagination@0.0.0-dev-v2-20230409142211
+  - @nextui-org/dom-utils@0.0.0-dev-v2-20230409142211
+  - @nextui-org/system@0.0.0-dev-v2-20230409142211
+  - @nextui-org/theme@0.0.0-dev-v2-20230409142211
+
 ## 0.0.0-dev-v2-20230409022144
 
 ### Patch Changes

packages/components/pagination/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/pagination",
-  "version": "0.0.0-dev-v2-20230409022144",
+  "version": "0.0.0-dev-v2-20230409142211",
   "description": "The Pagination component allows you to display active page and navigate between multiple pages.",
   "keywords": [
     "pagination"

packages/components/popover/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @nextui-org/popover
 
+## 0.0.0-dev-v2-20230409142211
+
+### Patch Changes
+
+- Left/Right labels changed to Start/End, tests fixed
+- Updated dependencies
+  - @nextui-org/framer-transitions@0.0.0-dev-v2-20230409142211
+  - @nextui-org/shared-utils@0.0.0-dev-v2-20230409142211
+  - @nextui-org/aria-utils@0.0.0-dev-v2-20230409142211
+  - @nextui-org/dom-utils@0.0.0-dev-v2-20230409142211
+  - @nextui-org/button@0.0.0-dev-v2-20230409142211
+  - @nextui-org/system@0.0.0-dev-v2-20230409142211
+  - @nextui-org/theme@0.0.0-dev-v2-20230409142211
+
 ## 0.0.0-dev-v2-20230409022144
 
 ### Patch Changes

packages/components/popover/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/popover",
-  "version": "0.0.0-dev-v2-20230409022144",
+  "version": "0.0.0-dev-v2-20230409142211",
   "description": "A popover is an overlay element positioned relative to a trigger.",
   "keywords": [
     "popover"
@@ -40,6 +40,7 @@
     "@nextui-org/aria-utils": "workspace:*",
     "@nextui-org/dom-utils": "workspace:*",
     "@nextui-org/framer-transitions": "workspace:*",
+    "@nextui-org/use-aria-button": "workspace:*",
     "@nextui-org/button": "workspace:*",
     "@nextui-org/shared-utils": "workspace:*",
     "@nextui-org/system": "workspace:*",

packages/components/popover/src/popover-trigger.tsx

@@ -1,7 +1,7 @@
 import {forwardRef} from "@nextui-org/system";
 import React, {Children, cloneElement, useMemo} from "react";
 import {pickChildren} from "@nextui-org/shared-utils";
-import {useButton} from "@react-aria/button";
+import {useAriaButton} from "@nextui-org/use-aria-button";
 import {Button} from "@nextui-org/button";
 import {mergeProps} from "@react-aria/utils";
 
@@ -36,7 +36,7 @@ const PopoverTrigger = forwardRef<PopoverTriggerProps, "button">((props, _) => {
   // validates if contains a NextUI Button as a child
   const [, triggerChildren] = pickChildren(children, Button);
 
-  const {buttonProps} = useButton({onPress}, triggerRef);
+  const {buttonProps} = useAriaButton({onPress}, triggerRef);
 
   const hasNextUIButton = useMemo<boolean>(() => {
     return triggerChildren?.[0] !== undefined;

packages/components/progress/CHANGELOG.md

@@ -1,5 +1,18 @@
 # @nextui-org/progress
 
+## 0.0.0-dev-v2-20230409142211
+
+### Patch Changes
+
+- Left/Right labels changed to Start/End, tests fixed
+- Updated dependencies
+  - @nextui-org/shared-utils@0.0.0-dev-v2-20230409142211
+  - @nextui-org/use-aria-label@0.0.0-dev-v2-20230409142211
+  - @nextui-org/use-is-mounted@0.0.0-dev-v2-20230409142211
+  - @nextui-org/dom-utils@0.0.0-dev-v2-20230409142211
+  - @nextui-org/system@0.0.0-dev-v2-20230409142211
+  - @nextui-org/theme@0.0.0-dev-v2-20230409142211
+
 ## 0.0.0-dev-v2-20230409022144
 
 ### Patch Changes

packages/components/progress/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/progress",
-  "version": "0.0.0-dev-v2-20230409022144",
+  "version": "0.0.0-dev-v2-20230409142211",
   "description": "Progress bars show either determinate or indeterminate progress of an operation over time.",
   "keywords": [
     "progress"

packages/components/radio/CHANGELOG.md

@@ -1,5 +1,16 @@
 # @nextui-org/radio
 
+## 0.0.0-dev-v2-20230409142211
+
+### Patch Changes
+
+- Left/Right labels changed to Start/End, tests fixed
+- Updated dependencies
+  - @nextui-org/shared-utils@0.0.0-dev-v2-20230409142211
+  - @nextui-org/dom-utils@0.0.0-dev-v2-20230409142211
+  - @nextui-org/system@0.0.0-dev-v2-20230409142211
+  - @nextui-org/theme@0.0.0-dev-v2-20230409142211
+
 ## 0.0.0-dev-v2-20230409022144
 
 ### Patch Changes

packages/components/radio/__tests__/radio.test.tsx

@@ -1,7 +1,7 @@
 import * as React from "react";
 import {act, render} from "@testing-library/react";
 
-import {RadioGroup, Radio, RadioProps} from "../src";
+import {RadioGroup, Radio, RadioGroupProps} from "../src";
 
 describe("Radio", () => {
   it("should render correctly", () => {
@@ -99,11 +99,11 @@ describe("Radio", () => {
     expect(radio1).not.toBeChecked();
   });
 
-  it('should work correctly with "onChange" prop', () => {
-    const onChange = jest.fn();
+  it('should work correctly with "onValueChange" prop', () => {
+    const onValueChange = jest.fn();
 
     const {container} = render(
-      <RadioGroup defaultValue="1" label="Options" onChange={onChange}>
+      <RadioGroup defaultValue="1" label="Options" onValueChange={onValueChange}>
         <Radio value="1">Option 1</Radio>
         <Radio className="radio-test-2" value="2">
           Option 2
@@ -117,7 +117,7 @@ describe("Radio", () => {
       radio2.click();
     });
 
-    expect(onChange).toBeCalledWith("2");
+    expect(onValueChange).toBeCalledWith("2");
 
     expect(radio2).toBeChecked();
   });
@@ -161,18 +161,18 @@ describe("Radio", () => {
   });
 
   it("should work correctly with controlled value", () => {
-    const onChange = jest.fn();
+    const onValueChange = jest.fn();
 
-    const Component = ({onChange}: Omit<RadioProps, "value">) => {
+    const Component = ({onValueChange}: Omit<RadioGroupProps, "value">) => {
       const [value, setValue] = React.useState("1");
 
       return (
         <RadioGroup
           label="Options"
           value={value}
-          onChange={(next) => {
+          onValueChange={(next) => {
             setValue(next);
-            onChange?.(next as any);
+            onValueChange?.(next as any);
           }}
         >
           <Radio value="1">Option 1</Radio>
@@ -183,7 +183,7 @@ describe("Radio", () => {
       );
     };
 
-    const {container} = render(<Component onChange={onChange} />);
+    const {container} = render(<Component onValueChange={onValueChange} />);
 
     let radio2 = container.querySelector(".radio-test-2 input") as HTMLInputElement;
 
@@ -191,7 +191,7 @@ describe("Radio", () => {
       radio2.click();
     });
 
-    expect(onChange).toBeCalled();
+    expect(onValueChange).toBeCalled();
 
     expect(radio2).toBeChecked();
   });

packages/components/radio/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/radio",
-  "version": "0.0.0-dev-v2-20230409022144",
+  "version": "0.0.0-dev-v2-20230409142211",
   "description": "Radios allow users to select a single option from a list of mutually exclusive options.",
   "keywords": [
     "radio"

packages/components/snippet/CHANGELOG.md

@@ -1,5 +1,18 @@
 # @nextui-org/snippet
 
+## 0.0.0-dev-v2-20230409142211
+
+### Patch Changes
+
+- Left/Right labels changed to Start/End, tests fixed
+- Updated dependencies
+  - @nextui-org/shared-utils@0.0.0-dev-v2-20230409142211
+  - @nextui-org/use-clipboard@0.0.0-dev-v2-20230409142211
+  - @nextui-org/dom-utils@0.0.0-dev-v2-20230409142211
+  - @nextui-org/tooltip@0.0.0-dev-v2-20230409142211
+  - @nextui-org/system@0.0.0-dev-v2-20230409142211
+  - @nextui-org/theme@0.0.0-dev-v2-20230409142211
+
 ## 0.0.0-dev-v2-20230409022144
 
 ### Patch Changes

packages/components/snippet/__tests__/snippet.test.tsx

@@ -64,17 +64,16 @@ describe("Snippet - Clipboard", () => {
     jest.useRealTimers();
   });
 
-  it('should copy text to clipboard when "copy" button is clicked', () => {
+  it('should copy text to clipboard when "copy" button is clicked', async () => {
     jest.spyOn(navigator.clipboard, "writeText");
 
     let code = "npm install @nextui-org/react";
 
     const wrapper = render(<Snippet data-testid="code-test">{code}</Snippet>);
 
-    act(() => {
-      wrapper.getByRole("button").click();
+    await act(async () => {
+      await wrapper.getByRole("button").click();
+      expect(navigator.clipboard.writeText).toHaveBeenCalledWith(code);
     });
-
-    expect(navigator.clipboard.writeText).toHaveBeenCalledWith(code);
   });
 });

packages/components/snippet/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/snippet",
-  "version": "0.0.0-dev-v2-20230409022144",
+  "version": "0.0.0-dev-v2-20230409142211",
   "description": "Display a snippet of copyable code for the command line.",
   "keywords": [
     "snippet"

packages/components/spinner/CHANGELOG.md

@@ -1,5 +1,16 @@
 # @nextui-org/spinner
 
+## 0.0.0-dev-v2-20230409142211
+
+### Patch Changes
+
+- Left/Right labels changed to Start/End, tests fixed
+- Updated dependencies
+  - @nextui-org/shared-utils@0.0.0-dev-v2-20230409142211
+  - @nextui-org/dom-utils@0.0.0-dev-v2-20230409142211
+  - @nextui-org/system@0.0.0-dev-v2-20230409142211
+  - @nextui-org/theme@0.0.0-dev-v2-20230409142211
+
 ## 0.0.0-dev-v2-20230409022144
 
 ### Patch Changes

packages/components/spinner/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/spinner",
-  "version": "0.0.0-dev-v2-20230409022144",
+  "version": "0.0.0-dev-v2-20230409142211",
   "description": "Loaders express an unspecified wait time or display the length of a process.",
   "keywords": [
     "loading",

packages/components/switch/CHANGELOG.md

@@ -1,5 +1,16 @@
 # @nextui-org/switch
 
+## 0.0.0-dev-v2-20230409142211
+
+### Patch Changes
+
+- Left/Right labels changed to Start/End, tests fixed
+- Updated dependencies
+  - @nextui-org/shared-utils@0.0.0-dev-v2-20230409142211
+  - @nextui-org/dom-utils@0.0.0-dev-v2-20230409142211
+  - @nextui-org/system@0.0.0-dev-v2-20230409142211
+  - @nextui-org/theme@0.0.0-dev-v2-20230409142211
+
 ## 0.0.0-dev-v2-20230409022144
 
 ### Patch Changes

packages/components/switch/__tests__/switch.test.tsx

@@ -77,7 +77,7 @@ describe("Switch", () => {
         <Switch
           aria-label="switch"
           isSelected={isSelected}
-          onChange={(selected) => {
+          onValueChange={(selected) => {
             onChange?.(selected);
             setIsSelected(selected);
           }}
@@ -169,32 +169,30 @@ describe("Switch", () => {
     expect(uncheckedThumbIcon).toBeInTheDocument();
   });
 
-  it('should work with "leftIcon"', () => {
+  it('should work with "startIcon"', () => {
     const wrapper = render(
-      <Switch aria-label="switch" leftIcon={<svg data-testid="left-icon" />} />,
+      <Switch aria-label="switch" startIcon={<svg data-testid="start-icon" />} />,
     );
 
-    expect(wrapper.getByTestId("left-icon")).toBeInTheDocument();
+    expect(wrapper.getByTestId("start-icon")).toBeInTheDocument();
   });
 
-  it('should work with "rightIcon"', () => {
-    const wrapper = render(
-      <Switch aria-label="switch" rightIcon={<svg data-testid="right-icon" />} />,
-    );
+  it('should work with "endIcon"', () => {
+    const wrapper = render(<Switch aria-label="switch" endIcon={<svg data-testid="end-icon" />} />);
 
-    expect(wrapper.getByTestId("right-icon")).toBeInTheDocument();
+    expect(wrapper.getByTestId("end-icon")).toBeInTheDocument();
   });
 
-  it('should work with "leftIcon" and "rightIcon"', () => {
+  it('should work with "startIcon" and "endIcon"', () => {
     const wrapper = render(
       <Switch
         aria-label="switch"
-        leftIcon={<svg data-testid="left-icon" />}
-        rightIcon={<svg data-testid="right-icon" />}
+        endIcon={<svg data-testid="end-icon" />}
+        startIcon={<svg data-testid="start-icon" />}
       />,
     );
 
-    expect(wrapper.getByTestId("left-icon")).toBeInTheDocument();
-    expect(wrapper.getByTestId("right-icon")).toBeInTheDocument();
+    expect(wrapper.getByTestId("start-icon")).toBeInTheDocument();
+    expect(wrapper.getByTestId("end-icon")).toBeInTheDocument();
   });
 });

packages/components/switch/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/switch",
-  "version": "0.0.0-dev-v2-20230409022144",
+  "version": "0.0.0-dev-v2-20230409142211",
   "description": "A switch is similar to a checkbox, but represents on/off values as opposed to selection.",
   "keywords": [
     "switch"

packages/components/switch/src/switch.tsx

@@ -10,8 +10,8 @@ const Switch = forwardRef<SwitchProps, "div">((props, ref) => {
   const {
     Component,
     children,
-    leftIcon,
-    rightIcon,
+    startIcon,
+    endIcon,
     thumbIcon,
     getBaseProps,
     getInputProps,
@@ -19,8 +19,8 @@ const Switch = forwardRef<SwitchProps, "div">((props, ref) => {
     getThumbProps,
     getThumbIconProps,
     getLabelProps,
-    getLeftIconProps,
-    getRightIconProps,
+    getStartIconProps,
+    getEndIconProps,
   } = useSwitch({ref, ...props});
 
   const clonedThumbIcon =
@@ -28,8 +28,8 @@ const Switch = forwardRef<SwitchProps, "div">((props, ref) => {
       ? thumbIcon(getThumbIconProps({includeStateProps: true}))
       : thumbIcon && cloneElement(thumbIcon as ReactElement, getThumbIconProps());
 
-  const clonedLeftIcon = leftIcon && cloneElement(leftIcon as ReactElement, getLeftIconProps());
-  const clonedRightIcon = rightIcon && cloneElement(rightIcon as ReactElement, getRightIconProps());
+  const clonedStartIcon = startIcon && cloneElement(startIcon as ReactElement, getStartIconProps());
+  const clonedEndIcon = endIcon && cloneElement(endIcon as ReactElement, getEndIconProps());
 
   return (
     <Component {...getBaseProps()}>
@@ -37,9 +37,9 @@ const Switch = forwardRef<SwitchProps, "div">((props, ref) => {
         <input {...getInputProps()} />
       </VisuallyHidden>
       <span {...getWrapperProps()}>
-        {leftIcon && clonedLeftIcon}
+        {startIcon && clonedStartIcon}
         <span {...getThumbProps()}>{thumbIcon && clonedThumbIcon}</span>
-        {rightIcon && clonedRightIcon}
+        {endIcon && clonedEndIcon}
       </span>
       {children && <span {...getLabelProps()}>{children}</span>}
     </Component>

packages/components/switch/src/use-switch.ts

@@ -41,13 +41,13 @@ interface Props extends HTMLNextUIProps<"label"> {
    */
   thumbIcon?: ReactNode | ((props: SwitchThumbIconProps) => ReactNode);
   /**
-   * Left icon to be displayed inside the switch.
+   * Start icon to be displayed inside the switch.
    */
-  leftIcon?: ReactNode;
+  startIcon?: ReactNode;
   /**
-   * Right icon to be displayed inside the switch.
+   * End icon to be displayed inside the switch.
    */
-  rightIcon?: ReactNode;
+  endIcon?: ReactNode;
   /**
    * Classname or List of classes to change the styles of the element.
    * if `className` is passed, it will be added to the base slot.
@@ -84,8 +84,8 @@ export function useSwitch(originalProps: UseSwitchProps) {
     value = "",
     isReadOnly = false,
     autoFocus = false,
-    leftIcon,
-    rightIcon,
+    startIcon,
+    endIcon,
     defaultSelected,
     isSelected: isSelectedProp,
     children,
@@ -241,24 +241,24 @@ export function useSwitch(originalProps: UseSwitchProps) {
     [slots, styles?.thumbIcon, isSelected, originalProps.disableAnimation],
   );
 
-  const getLeftIconProps = useCallback(
+  const getStartIconProps = useCallback(
     () => ({
       width: "1em",
       height: "1em",
       "data-checked": dataAttr(isSelected),
-      className: slots.leftIcon({class: styles?.leftIcon}),
+      className: slots.startIcon({class: styles?.startIcon}),
     }),
-    [slots, styles?.leftIcon, isSelected],
+    [slots, styles?.startIcon, isSelected],
   );
 
-  const getRightIconProps = useCallback(
+  const getEndIconProps = useCallback(
     () => ({
       width: "1em",
       height: "1em",
       "data-checked": dataAttr(isSelected),
-      className: slots.rightIcon({class: styles?.rightIcon}),
+      className: slots.endIcon({class: styles?.endIcon}),
     }),
-    [slots, styles?.rightIcon, isSelected],
+    [slots, styles?.endIcon, isSelected],
   );
 
   return {
@@ -268,8 +268,8 @@ export function useSwitch(originalProps: UseSwitchProps) {
     domRef,
     children,
     thumbIcon,
-    leftIcon,
-    rightIcon,
+    startIcon,
+    endIcon,
     isHovered,
     isSelected,
     isFocused,
@@ -281,8 +281,8 @@ export function useSwitch(originalProps: UseSwitchProps) {
     getLabelProps,
     getThumbProps,
     getThumbIconProps,
-    getLeftIconProps,
-    getRightIconProps,
+    getStartIconProps,
+    getEndIconProps,
   };
 }
 

packages/components/switch/stories/switch.stories.tsx

@@ -50,11 +50,11 @@ const WithIconsTemplate: ComponentStory<typeof Switch> = (args: SwitchProps) =>
     <div className="flex flex-col gap-2">
       <Switch
         {...args}
+        endIcon={<MoonFilledIcon />}
         isSelected={isSelected}
-        leftIcon={<SunFilledIcon />}
-        rightIcon={<MoonFilledIcon />}
+        startIcon={<SunFilledIcon />}
         styles={{
-          leftIcon: "text-white",
+          startIcon: "text-white",
         }}
         onValueChange={setIsSelected}
       />

packages/components/tooltip/CHANGELOG.md

@@ -1,5 +1,18 @@
 # @nextui-org/tooltip
 
+## 0.0.0-dev-v2-20230409142211
+
+### Patch Changes
+
+- Left/Right labels changed to Start/End, tests fixed
+- Updated dependencies
+  - @nextui-org/framer-transitions@0.0.0-dev-v2-20230409142211
+  - @nextui-org/shared-utils@0.0.0-dev-v2-20230409142211
+  - @nextui-org/aria-utils@0.0.0-dev-v2-20230409142211
+  - @nextui-org/dom-utils@0.0.0-dev-v2-20230409142211
+  - @nextui-org/system@0.0.0-dev-v2-20230409142211
+  - @nextui-org/theme@0.0.0-dev-v2-20230409142211
+
 ## 0.0.0-dev-v2-20230409022144
 
 ### Patch Changes

packages/components/tooltip/__tests__/tooltip.test.tsx

@@ -1,5 +1,5 @@
 import * as React from "react";
-import {render, fireEvent} from "@testing-library/react";
+import {render, fireEvent, act} from "@testing-library/react";
 import {Button} from "@nextui-org/button";
 
 import {Tooltip} from "../src";
@@ -35,7 +35,7 @@ describe("Tooltip", () => {
     expect(ref.current).not.toBeNull();
   });
 
-  it("should hide the tooltip when pressing the escape key", () => {
+  it("should hide the tooltip when pressing the escape key", async () => {
     const onClose = jest.fn();
 
     const wrapper = render(
@@ -46,8 +46,10 @@ describe("Tooltip", () => {
 
     const content = wrapper.getByTestId("content-test");
 
-    fireEvent.keyDown(content, {key: "Escape"});
-    expect(onClose).toHaveBeenCalledTimes(1);
+    await act(async () => {
+      await fireEvent.keyDown(content, {key: "Escape"});
+      expect(onClose).toHaveBeenCalledTimes(1);
+    });
   });
 
   it("should still hide the tooltip when pressing the escape key if isDismissable is false", () => {

packages/components/tooltip/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/tooltip",
-  "version": "0.0.0-dev-v2-20230409022144",
+  "version": "0.0.0-dev-v2-20230409142211",
   "description": "A React Component for rendering dynamically positioned Tooltips",
   "keywords": [
     "tooltip"

packages/components/tooltip/src/use-tooltip.ts

@@ -34,13 +34,13 @@ interface Props extends HTMLNextUIProps<"div"> {
    */
   isDisabled?: boolean;
   /**
-   * The delay time for the tooltip to show up.
+   * The delay time in ms for the tooltip to show up.
    * @default 0
    */
   delay?: number;
   /**
-   * The delay time for the tooltip to hide.
-   * @default 0
+   * The delay time in ms for the tooltip to hide.
+   * @default 500
    */
   closeDelay?: number;
   /**
@@ -90,12 +90,12 @@ export function useTooltip(originalProps: UseTooltipProps) {
     containerPadding = 12,
     placement: placementProp = "top",
     delay = 0,
-    closeDelay = 0,
+    closeDelay = 500,
     showArrow = false,
     offset = 7,
     crossOffset = 0,
-    isDismissable = true,
-    shouldCloseOnBlur = false,
+    isDismissable,
+    shouldCloseOnBlur = true,
     isKeyboardDismissDisabled = false,
     shouldCloseOnInteractOutside,
     className,
@@ -112,7 +112,12 @@ export function useTooltip(originalProps: UseTooltipProps) {
     closeDelay,
     isDisabled,
     defaultOpen,
-    onOpenChange,
+    onOpenChange: (isOpen) => {
+      onOpenChange?.(isOpen);
+      if (!isOpen) {
+        onClose?.();
+      }
+    },
   });
 
   const triggerRef = useRef<HTMLElement>(null);
@@ -120,7 +125,6 @@ export function useTooltip(originalProps: UseTooltipProps) {
 
   const tooltipId = useId();
 
-  const immediate = closeDelay === 0;
   const isOpen = state.isOpen && !isDisabled;
 
   // Sync ref with overlayRef from passed ref.
@@ -129,19 +133,14 @@ export function useTooltip(originalProps: UseTooltipProps) {
     createDOMRef(overlayRef),
   );
 
-  const handleClose = useCallback(() => {
-    onClose?.();
-    state.close(immediate);
-  }, [state, immediate, onClose]);
-
   // control open state from outside
   useEffect(() => {
     if (isOpenProp === undefined) return;
 
     if (isOpenProp !== state.isOpen) {
-      isOpenProp ? state.open() : handleClose();
+      isOpenProp ? state.open() : state.close();
     }
-  }, [isOpenProp, handleClose]);
+  }, [isOpenProp]);
 
   const {triggerProps, tooltipProps: triggerTooltipProps} = useTooltipTrigger(
     {
@@ -174,8 +173,8 @@ export function useTooltip(originalProps: UseTooltipProps) {
   const {overlayProps} = useOverlay(
     {
       isOpen: isOpen,
+      onClose: state.close,
       isDismissable,
-      onClose: handleClose,
       shouldCloseOnBlur,
       isKeyboardDismissDisabled,
       shouldCloseOnInteractOutside,
@@ -199,9 +198,9 @@ export function useTooltip(originalProps: UseTooltipProps) {
       ref: mergeRefs(_ref, triggerRef),
       "aria-describedby": isOpen ? tooltipId : undefined,
       onPointerEnter: () => state.open(),
-      onPointerLeave: () => isDismissable && state.close(),
+      onPointerLeave: () => state.isOpen && state.close(),
     }),
-    [triggerProps, isOpen, tooltipId, isDismissable, state],
+    [triggerProps, isOpen, tooltipId, state],
   );
 
   const getTooltipProps = useCallback<PropGetter>(

packages/components/user/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @nextui-org/user
 
+## 0.0.0-dev-v2-20230409142211
+
+### Patch Changes
+
+- Left/Right labels changed to Start/End, tests fixed
+- Updated dependencies
+  - @nextui-org/shared-utils@0.0.0-dev-v2-20230409142211
+  - @nextui-org/dom-utils@0.0.0-dev-v2-20230409142211
+  - @nextui-org/avatar@0.0.0-dev-v2-20230409142211
+  - @nextui-org/system@0.0.0-dev-v2-20230409142211
+  - @nextui-org/theme@0.0.0-dev-v2-20230409142211
+
 ## 0.0.0-dev-v2-20230409022144
 
 ### Patch Changes

packages/components/user/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/user",
-  "version": "0.0.0-dev-v2-20230409022144",
+  "version": "0.0.0-dev-v2-20230409142211",
   "description": "Flexible User Profile Component.",
   "keywords": [
     "user"

packages/core/react/CHANGELOG.md

@@ -1,5 +1,35 @@
 # @nextui-org/react
 
+## 0.0.0-dev-v2-20230409142211
+
+### Patch Changes
+
+- Left/Right labels changed to Start/End, tests fixed
+- Updated dependencies
+  - @nextui-org/pagination@0.0.0-dev-v2-20230409142211
+  - @nextui-org/accordion@0.0.0-dev-v2-20230409142211
+  - @nextui-org/checkbox@0.0.0-dev-v2-20230409142211
+  - @nextui-org/dropdown@0.0.0-dev-v2-20230409142211
+  - @nextui-org/progress@0.0.0-dev-v2-20230409142211
+  - @nextui-org/popover@0.0.0-dev-v2-20230409142211
+  - @nextui-org/snippet@0.0.0-dev-v2-20230409142211
+  - @nextui-org/spinner@0.0.0-dev-v2-20230409142211
+  - @nextui-org/tooltip@0.0.0-dev-v2-20230409142211
+  - @nextui-org/avatar@0.0.0-dev-v2-20230409142211
+  - @nextui-org/button@0.0.0-dev-v2-20230409142211
+  - @nextui-org/switch@0.0.0-dev-v2-20230409142211
+  - @nextui-org/badge@0.0.0-dev-v2-20230409142211
+  - @nextui-org/input@0.0.0-dev-v2-20230409142211
+  - @nextui-org/radio@0.0.0-dev-v2-20230409142211
+  - @nextui-org/card@0.0.0-dev-v2-20230409142211
+  - @nextui-org/chip@0.0.0-dev-v2-20230409142211
+  - @nextui-org/code@0.0.0-dev-v2-20230409142211
+  - @nextui-org/drip@0.0.0-dev-v2-20230409142211
+  - @nextui-org/link@0.0.0-dev-v2-20230409142211
+  - @nextui-org/user@0.0.0-dev-v2-20230409142211
+  - @nextui-org/system@0.0.0-dev-v2-20230409142211
+  - @nextui-org/theme@0.0.0-dev-v2-20230409142211
+
 ## 0.0.0-dev-v2-20230409022144
 
 ### Patch Changes

packages/core/react/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/react",
-  "version": "0.0.0-dev-v2-20230409022144",
+  "version": "0.0.0-dev-v2-20230409142211",
   "description": "🚀 Beautiful and modern React UI library.",
   "author": "Junior Garcia <jrgarciadev@gmail.com>",
   "homepage": "https://nextui.org",

packages/core/system/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @nextui-org/system
 
+## 0.0.0-dev-v2-20230409142211
+
+### Patch Changes
+
+- Left/Right labels changed to Start/End, tests fixed
+
 ## 0.0.0-dev-v2-20230409022144
 
 ### Patch Changes

packages/core/system/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/system",
-  "version": "0.0.0-dev-v2-20230409022144",
+  "version": "0.0.0-dev-v2-20230409142211",
   "description": "NextUI system primitives",
   "keywords": [
     "system"

packages/core/theme/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @nextui-org/theme
 
+## 0.0.0-dev-v2-20230409142211
+
+### Patch Changes
+
+- Left/Right labels changed to Start/End, tests fixed
+
 ## 0.0.0-dev-v2-20230409022144
 
 ### Patch Changes

packages/core/theme/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/theme",
-  "version": "0.0.0-dev-v2-20230409022144",
+  "version": "0.0.0-dev-v2-20230409142211",
   "description": "The default theme for NextUI components",
   "keywords": [
     "theme",

packages/core/theme/src/components/accordion-item.ts

@@ -6,13 +6,13 @@ import {ringClasses} from "../utils";
 /**
  * AccordionItem wrapper **Tailwind Variants** component
  *
- * const {base, heading, indicator, trigger, leftIndicator, title, subtitle, content } = accordionItem({...})
+ * const {base, heading, indicator, trigger, startContent, title, subtitle, content } = accordionItem({...})
  *
  * @example
  * <div className={base())}>
  *   <div className={heading())}>
  *    <button className={trigger())}>
- *      <div className={leftIndicator()}>
+ *      <div className={startContent()}>
  *         // content
  *      </div>
  *      <div className={titleWrapper()}>
@@ -40,7 +40,7 @@ const accordionItem = tv({
     ],
     heading: "",
     trigger: "py-2 flex w-full gap-3 outline-none items-center",
-    leftIndicator: "flex-shrink-0",
+    startContent: "flex-shrink-0",
     indicator: "text-neutral-400",
     titleWrapper: "flex-1 flex flex-col text-left",
     title: "text-foreground text-lg",

packages/core/theme/src/components/toggle.ts

@@ -7,17 +7,17 @@ import {ringClasses} from "../utils";
 /**
  * Toggle (Switch) wrapper **Tailwind Variants** component
  *
- * const {base, wrapper, thumb, thumbIcon, label} = toggle({...})
+ * const {base, wrapper, thumb, thumbIcon, label, startIcon, endIcon} = toggle({...})
  *
  * @example
  * <label className={base())}>
  *  // hidden input
  *  <span className={wrapper()} aria-hidden="true" data-checked={checked}>
- *    <svg className={leftIcon()}>...</svg>
+ *    <svg className={startIcon()}>...</svg>
  *    <span className={thumb()}>
  *      <svg className={thumbIcon()}>...</svg>
  *    </span>
- *    <svg className={rightIcon()}>...</svg>
+ *    <svg className={endIcon()}>...</svg>
  *  </span>
  *  <span className={label()}>Label</span>
  * </label>
@@ -47,8 +47,8 @@ const toggle = tv({
       "rounded-full",
       "data-[checked=true]:translate-x-full",
     ],
-    leftIcon: "z-0 absolute left-1.5 text-current",
-    rightIcon: "z-0 absolute right-1.5 text-neutral-600",
+    startIcon: "z-0 absolute left-1.5 text-current",
+    endIcon: "z-0 absolute right-1.5 text-neutral-600",
     thumbIcon: "text-black",
     label: "relative text-foreground select-none",
   },
@@ -92,37 +92,37 @@ const toggle = tv({
       xs: {
         wrapper: "px-0.5 w-7 h-4 mr-1",
         thumb: "w-3 h-3 text-[0.5rem]",
-        leftIcon: "text-[0.5rem] left-1",
-        rightIcon: "text-[0.5rem] right-1",
+        startIcon: "text-[0.5rem] left-1",
+        endIcon: "text-[0.5rem] right-1",
         right: "text-[0.5rem]",
         label: "text-xs",
       },
       sm: {
         wrapper: "w-8 h-5 mr-1",
         thumb: "w-3 h-3 text-[0.6rem]",
-        leftIcon: "text-[0.6rem] left-1",
-        rightIcon: "text-[0.6rem] right-1",
+        startIcon: "text-[0.6rem] left-1",
+        endIcon: "text-[0.6rem] right-1",
         label: "text-sm",
       },
       md: {
         wrapper: "w-10 h-6 mr-2",
         thumb: "w-4 h-4 text-xs",
-        rightIcon: "text-xs",
-        leftIcon: "text-xs",
+        endIcon: "text-xs",
+        startIcon: "text-xs",
         label: "text-base",
       },
       lg: {
         wrapper: "w-12 h-7 mr-2",
         thumb: "w-5 h-5 text-sm",
-        rightIcon: "text-sm",
-        leftIcon: "text-sm",
+        endIcon: "text-sm",
+        startIcon: "text-sm",
         label: "text-lg",
       },
       xl: {
         wrapper: "w-14 h-8 mr-2",
         thumb: "w-6 h-6 text-base",
-        rightIcon: "text-base",
-        leftIcon: "text-base",
+        endIcon: "text-base",
+        startIcon: "text-base",
         label: "text-xl",
       },
     },
@@ -142,16 +142,16 @@ const toggle = tv({
         thumb: "transition-none",
       },
       false: {
-        wrapper: "transition-background !duration-500",
+        wrapper: "transition-background",
         thumb: "transition-transform !ease-soft-spring !duration-500",
-        leftIcon: [
+        startIcon: [
           "opacity-0",
           "scale-50",
           "transition-transform-opacity",
           "data-[checked=true]:scale-100",
           "data-[checked=true]:opacity-100",
         ],
-        rightIcon: [
+        endIcon: [
           "opacity-100",
           "transition-transform-opacity",
           "data-[checked=true]:translate-x-3",

packages/hooks/use-aria-accordion-item/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @nextui-org/use-aria-accordion-item
 
+## 0.0.0-dev-v2-20230409142211
+
+### Patch Changes
+
+- Left/Right labels changed to Start/End, tests fixed
+
 ## 0.0.0-dev-v2-20230409022144
 
 ### Patch Changes

packages/hooks/use-aria-accordion-item/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/use-aria-accordion-item",
-  "version": "0.0.0-dev-v2-20230409022144",
+  "version": "0.0.0-dev-v2-20230409142211",
   "description": "Internal impl for react aria accordion item",
   "keywords": [
     "use-aria-accordion-item"

packages/hooks/use-aria-button/README.md

@@ -0,0 +1,24 @@
+# @nextui-org/use-aria-button
+
+A Quick description of the component
+
+> This is an internal utility, not intended for public usage.
+
+## Installation
+
+```sh
+yarn add @nextui-org/use-aria-button
+# or
+npm i @nextui-org/use-aria-button
+```
+
+## Contribution
+
+Yes please! See the
+[contributing guidelines](https://github.com/nextui-org/nextui/blob/master/CONTRIBUTING.md)
+for details.
+
+## Licence
+
+This project is licensed under the terms of the
+[MIT license](https://github.com/nextui-org/nextui/blob/master/LICENSE).

packages/hooks/use-aria-button/package.json

@@ -0,0 +1,59 @@
+{
+  "name": "@nextui-org/use-aria-button",
+  "version": "2.0.0-beta.1",
+  "description": "Internal hook to handle button a11y and events, this is based on react-aria button hook but without the onClick warning",
+  "keywords": [
+    "use-aria-button"
+  ],
+  "author": "Junior Garcia <jrgarciadev@gmail.com>",
+  "homepage": "https://nextui.org",
+  "license": "MIT",
+  "main": "src/index.ts",
+  "sideEffects": false,
+  "files": [
+    "dist"
+  ],
+  "publishConfig": {
+    "access": "public"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/nextui-org/nextui.git",
+    "directory": "packages/hooks/use-aria-button"
+  },
+  "bugs": {
+    "url": "https://github.com/nextui-org/nextui/issues"
+  },
+  "scripts": {
+    "build": "tsup src --dts",
+    "build:fast": "tsup src",
+    "dev": "yarn build:fast -- --watch",
+    "clean": "rimraf dist .turbo",
+    "typecheck": "tsc --noEmit",
+    "prepack": "clean-package",
+    "postpack": "clean-package restore"
+  },
+  "peerDependencies": {
+    "react": ">=18"
+  },
+  "dependencies": {
+    "@react-aria/utils": "^3.16.0",
+    "@react-aria/focus": "^3.12.0",
+    "@react-aria/interactions": "^3.15.0"
+  },
+  "devDependencies": {
+    "@react-types/button": "^3.7.2",
+    "@react-types/shared": "^3.18.0",
+    "clean-package": "2.2.0",
+    "react": "^18.0.0"
+  },
+  "clean-package": "../../../clean-package.config.json",
+  "tsup": {
+    "clean": true,
+    "target": "es2019",
+    "format": [
+      "cjs",
+      "esm"
+    ]
+  }
+}

packages/hooks/use-aria-button/src/index.ts

@@ -11,8 +11,7 @@ import {
 } from "react";
 import {AriaButtonProps} from "@react-types/button";
 import {DOMAttributes} from "@react-types/shared";
-import {filterDOMProps} from "@react-aria/utils";
-import {mergeProps} from "@react-aria/utils";
+import {filterDOMProps, mergeProps} from "@react-aria/utils";
 import {useFocusable} from "@react-aria/focus";
 import {usePress} from "@react-aria/interactions";
 
@@ -24,27 +23,27 @@ export interface ButtonAria<T> {
 }
 
 // Order with overrides is important: 'button' should be default
-export function useButton(
+export function useAriaButton(
   props: AriaButtonProps<"button">,
   ref: RefObject<HTMLButtonElement>,
 ): ButtonAria<ButtonHTMLAttributes<HTMLButtonElement>>;
-export function useButton(
+export function useAriaButton(
   props: AriaButtonProps<"a">,
   ref: RefObject<HTMLAnchorElement>,
 ): ButtonAria<AnchorHTMLAttributes<HTMLAnchorElement>>;
-export function useButton(
+export function useAriaButton(
   props: AriaButtonProps<"div">,
   ref: RefObject<HTMLDivElement>,
 ): ButtonAria<HTMLAttributes<HTMLDivElement>>;
-export function useButton(
+export function useAriaButton(
   props: AriaButtonProps<"input">,
   ref: RefObject<HTMLInputElement>,
 ): ButtonAria<InputHTMLAttributes<HTMLInputElement>>;
-export function useButton(
+export function useAriaButton(
   props: AriaButtonProps<"span">,
   ref: RefObject<HTMLSpanElement>,
 ): ButtonAria<HTMLAttributes<HTMLSpanElement>>;
-export function useButton(
+export function useAriaButton(
   props: AriaButtonProps<ElementType>,
   ref: RefObject<Element>,
 ): ButtonAria<DOMAttributes>;
@@ -54,7 +53,7 @@ export function useButton(
  * @param props - Props to be applied to the button.
  * @param ref - A ref to a DOM element for the button.
  */
-export function useButton(
+export function useAriaButton(
   props: AriaButtonProps<ElementType>,
   ref: RefObject<any>,
 ): ButtonAria<HTMLAttributes<any>> {

packages/hooks/use-aria-button/tsconfig.json

@@ -0,0 +1,4 @@
+{
+  "extends": "../../../tsconfig.json",
+  "include": ["src", "index.ts"]
+}

packages/hooks/use-aria-field/CHANGELOG.md

@@ -1,5 +1,14 @@
 # @nextui-org/use-aria-field
 
+## 0.0.0-dev-v2-20230409142211
+
+### Patch Changes
+
+- Left/Right labels changed to Start/End, tests fixed
+- Updated dependencies
+  - @nextui-org/use-aria-slot-id@0.0.0-dev-v2-20230409142211
+  - @nextui-org/use-aria-label@0.0.0-dev-v2-20230409142211
+
 ## 0.0.0-dev-v2-20230409022144
 
 ### Patch Changes

packages/hooks/use-aria-field/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/use-aria-field",
-  "version": "0.0.0-dev-v2-20230409022144",
+  "version": "0.0.0-dev-v2-20230409142211",
   "description": "Based on react-aria useField hook, provides the accessibility implementation for input fields",
   "keywords": [
     "use-aria-field"

packages/hooks/use-aria-label/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @nextui-org/use-aria-label
 
+## 0.0.0-dev-v2-20230409142211
+
+### Patch Changes
+
+- Left/Right labels changed to Start/End, tests fixed
+
 ## 0.0.0-dev-v2-20230409022144
 
 ### Patch Changes

packages/hooks/use-aria-label/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/use-aria-label",
-  "version": "0.0.0-dev-v2-20230409022144",
+  "version": "0.0.0-dev-v2-20230409142211",
   "description": "Based on react-aria label hook, it provides the accessibility implementation for labels and their associated elements. Labels provide context for user inputs.",
   "keywords": [
     "use-aria-label"

packages/hooks/use-aria-slot-id/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @nextui-org/use-aria-slot-id
 
+## 0.0.0-dev-v2-20230409142211
+
+### Patch Changes
+
+- Left/Right labels changed to Start/End, tests fixed
+
 ## 0.0.0-dev-v2-20230409022144
 
 ### Patch Changes

packages/hooks/use-aria-slot-id/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/use-aria-slot-id",
-  "version": "0.0.0-dev-v2-20230409022144",
+  "version": "0.0.0-dev-v2-20230409142211",
   "description": "Based on react-aria useSlotId, used to generate an id, and after render check if that id is rendered",
   "keywords": [
     "use-aria-slot-id"

packages/hooks/use-clipboard/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @nextui-org/use-clipboard
 
+## 0.0.0-dev-v2-20230409142211
+
+### Patch Changes
+
+- Left/Right labels changed to Start/End, tests fixed
+
 ## 0.0.0-dev-v2-20230409022144
 
 ### Patch Changes

packages/hooks/use-clipboard/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/use-clipboard",
-  "version": "0.0.0-dev-v2-20230409022144",
+  "version": "0.0.0-dev-v2-20230409142211",
   "description": "Wrapper around navigator.clipboard with feedback timeout",
   "keywords": [
     "use-clipboard"

packages/hooks/use-image/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @nextui-org/use-image
 
+## 0.0.0-dev-v2-20230409142211
+
+### Patch Changes
+
+- Left/Right labels changed to Start/End, tests fixed
+- Updated dependencies
+  - @nextui-org/use-safe-layout-effect@0.0.0-dev-v2-20230409142211
+
 ## 0.0.0-dev-v2-20230409022144
 
 ### Patch Changes

packages/hooks/use-image/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/use-image",
-  "version": "0.0.0-dev-v2-20230409022144",
+  "version": "0.0.0-dev-v2-20230409142211",
   "description": "React hook for progressing image loading",
   "keywords": [
     "use-image"

packages/hooks/use-is-mounted/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @nextui-org/use-is-mounted
 
+## 0.0.0-dev-v2-20230409142211
+
+### Patch Changes
+
+- Left/Right labels changed to Start/End, tests fixed
+
 ## 0.0.0-dev-v2-20230409022144
 
 ### Patch Changes

packages/hooks/use-is-mounted/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/use-is-mounted",
-  "version": "0.0.0-dev-v2-20230409022144",
+  "version": "0.0.0-dev-v2-20230409142211",
   "description": "This hook can be used to render client-based components or run client logic",
   "keywords": [
     "use-is-mounted"

packages/hooks/use-pagination/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @nextui-org/use-pagination
 
+## 0.0.0-dev-v2-20230409142211
+
+### Patch Changes
+
+- Left/Right labels changed to Start/End, tests fixed
+- Updated dependencies
+  - @nextui-org/shared-utils@0.0.0-dev-v2-20230409142211
+
 ## 0.0.0-dev-v2-20230409022144
 
 ### Patch Changes

packages/hooks/use-pagination/__tests__/use-pagination.test.tsx

@@ -7,14 +7,14 @@ describe("usePagination", () => {
     const {result} = renderHook(() => usePagination({total: 10}));
 
     act(() => result.current.setPage(5));
-    expect(result.current.active).toBe(5);
+    expect(result.current.activePage).toBe(5);
   });
 
   it("should return correct initial state", () => {
     const {result} = renderHook(() => usePagination({total: 10}));
 
     expect(result.current.range).toStrictEqual([1, 2, 3, 4, 5, "dots", 10]);
-    expect(result.current.active).toBe(1);
+    expect(result.current.activePage).toBe(1);
   });
 
   it("should not change range length between page changes", () => {
@@ -37,7 +37,7 @@ describe("usePagination", () => {
     );
 
     expect(result.current.range).toStrictEqual([1, 2, "dots", 5, 6, 7, 8, 9, "dots", 19, 20]);
-    expect(result.current.active).toBe(7);
+    expect(result.current.activePage).toBe(7);
   });
 
   it("should work correctly with custom siblings", () => {
@@ -50,7 +50,7 @@ describe("usePagination", () => {
     );
 
     expect(result.current.range).toStrictEqual([1, "dots", 5, 6, 7, 8, 9, "dots", 20]);
-    expect(result.current.active).toBe(7);
+    expect(result.current.activePage).toBe(7);
   });
 
   it("should work correctly without siblings", () => {
@@ -63,7 +63,7 @@ describe("usePagination", () => {
     );
 
     expect(result.current.range).toStrictEqual([1, "dots", 7, "dots", 20]);
-    expect(result.current.active).toBe(7);
+    expect(result.current.activePage).toBe(7);
   });
 
   it("should work correctly with custom boundaries", () => {
@@ -76,7 +76,7 @@ describe("usePagination", () => {
     );
 
     expect(result.current.range).toStrictEqual([1, 2, "dots", 6, 7, 8, "dots", 19, 20]);
-    expect(result.current.active).toBe(7);
+    expect(result.current.activePage).toBe(7);
   });
 
   it("should work correctly without boundaries", () => {
@@ -89,7 +89,7 @@ describe("usePagination", () => {
     );
 
     expect(result.current.range).toStrictEqual(["dots", 6, 7, 8, "dots"]);
-    expect(result.current.active).toBe(7);
+    expect(result.current.activePage).toBe(7);
   });
 
   it("should call onChange function correctly", () => {

packages/hooks/use-pagination/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/use-pagination",
-  "version": "0.0.0-dev-v2-20230409022144",
+  "version": "0.0.0-dev-v2-20230409142211",
   "description": "State management hook for Pagination component, it lets you manage pagination with controlled and uncontrolled state",
   "keywords": [
     "use-pagination"

packages/hooks/use-real-shape/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @nextui-org/use-real-shape
 
+## 0.0.0-dev-v2-20230409142211
+
+### Patch Changes
+
+- Left/Right labels changed to Start/End, tests fixed
+- Updated dependencies
+  - @nextui-org/dom-utils@0.0.0-dev-v2-20230409142211
+
 ## 0.0.0-dev-v2-20230409022144
 
 ### Patch Changes

packages/hooks/use-real-shape/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/use-real-shape",
-  "version": "0.0.0-dev-v2-20230409022144",
+  "version": "0.0.0-dev-v2-20230409142211",
   "description": "Hook that returns the real dimensions of an element",
   "keywords": [
     "use-real-shape"

packages/hooks/use-ref-state/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @nextui-org/use-ref-state
 
+## 0.0.0-dev-v2-20230409142211
+
+### Patch Changes
+
+- Left/Right labels changed to Start/End, tests fixed
+
 ## 0.0.0-dev-v2-20230409022144
 
 ### Patch Changes

packages/hooks/use-ref-state/__tests__/use-ref-state.test.tsx

@@ -5,12 +5,12 @@ import {render} from "@testing-library/react";
 import {useRefState} from "../src";
 
 describe("useRefState", () => {
-  it("should work correctly", () => {
+  it("should work correctly", async () => {
     const {result} = renderHook(() => useRefState(""));
 
     expect(result.current[0]).toEqual("");
 
-    act(() => result.current[1]("test"));
+    await act(async () => await result.current[1]("test"));
 
     expect(result.current[0]).toEqual("test");
     expect(result.current[2].current).toEqual("test");
@@ -23,12 +23,12 @@ describe("useRefState", () => {
     expect(result.current[2].current).toEqual("test");
   });
 
-  it("functional update mode should be supported", () => {
+  it("functional update mode should be supported", async () => {
     const {result} = renderHook(() => useRefState(""));
 
     expect(result.current[0]).toEqual("");
 
-    act(() => result.current[1]((value) => value + "test"));
+    await act(async () => await result.current[1]((value) => value + "test"));
 
     expect(result.current[0]).toEqual("test");
     expect(result.current[2].current).toEqual("test");

packages/hooks/use-ref-state/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/use-ref-state",
-  "version": "0.0.0-dev-v2-20230409022144",
+  "version": "0.0.0-dev-v2-20230409142211",
   "description": "Hook for saving the state in a ref value",
   "keywords": [
     "use-ref-state"

packages/hooks/use-resize/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @nextui-org/use-resize
 
+## 0.0.0-dev-v2-20230409142211
+
+### Patch Changes
+
+- Left/Right labels changed to Start/End, tests fixed
+
 ## 0.0.0-dev-v2-20230409022144
 
 ### Patch Changes

packages/hooks/use-resize/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/use-resize",
-  "version": "0.0.0-dev-v2-20230409022144",
+  "version": "0.0.0-dev-v2-20230409142211",
   "description": "Hook that adds an event listener to the resize window event",
   "keywords": [
     "use-resize"

packages/hooks/use-safe-layout-effect/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @nextui-org/use-safe-layout-effect
 
+## 0.0.0-dev-v2-20230409142211
+
+### Patch Changes
+
+- Left/Right labels changed to Start/End, tests fixed
+
 ## 0.0.0-dev-v2-20230409022144
 
 ### Patch Changes