@availity/change-password 3.0.7 → 4.0.0

package/index.js

@@ -1,2 +1,2 @@
-export { default, useChangePasswordContext, ChangePasswordContext } from './src/ChangePassword';
-export { default as ChangePasswordForm } from './src/ChangePasswordForm';
+export { default, useChangePasswordContext, ChangePasswordContext } from './src/ChangePassword.jsx';
+export { default as ChangePasswordForm } from './src/ChangePasswordForm.jsx';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@availity/change-password",
-  "version": "3.0.7",
+  "version": "4.0.0",
   "description": "Easy to use change-password components",
   "keywords": [
     "react",
@@ -17,37 +17,50 @@
     "directory": "packages/change-password"
   },
   "license": "MIT",
+  "type": "module",
   "author": "Tyson Warner <tyson.warner@availity.com>",
-  "main": "index.js",
-  "types": "index.d.ts",
   "scripts": {
+    "build": "tsup --clean",
+    "dev": "tsup --watch",
+    "clean": "rm -rf dist",
     "publish": "yarn npm publish --tolerate-republish --access public",
     "publish:canary": "yarn npm publish --access public --tag canary"
   },
   "dependencies": {
-    "@availity/block-ui": "^1.1.7",
-    "@availity/form": "1.10.7",
-    "@availity/icon": "0.11.11",
-    "@tanstack/react-query": "^4.36.1",
+    "@availity/block-ui": "^2.0.0",
+    "@availity/form": "2.0.0",
+    "@availity/icon": "1.0.0",
     "classnames": "^2.5.1",
     "dayjs": "^1.11.13",
-    "lodash": "^4.17.21",
+    "lodash": "^4.18.1",
     "prop-types": "^15.8.1"
   },
   "devDependencies": {
-    "@availity/api-axios": "^12.1.0",
-    "axios": "^1.13.2",
+    "@availity/api-axios": "^13.0.2",
+    "@tanstack/react-query": "^5.75.5",
+    "axios": "^1.17.0",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
-    "reactstrap": "^8.10.1"
+    "reactstrap": "^8.10.1",
+    "tsup": "^8.5.1"
   },
   "peerDependencies": {
-    "@availity/api-axios": "^12.0.0",
+    "@availity/api-axios": "^12.0.0 || ^13.0.0",
+    "@tanstack/react-query": "^5.75.5",
     "axios": "^1.13.2",
     "react": "^18.0.0",
     "reactstrap": "^8.10.1"
   },
   "publishConfig": {
     "access": "public"
+  },
+  "exports": {
+    ".": {
+      "source": "./index.js",
+      "import": {
+        "types": "./index.d.ts",
+        "default": "./dist/index.js"
+      }
+    }
   }
 }

package/project.json

@@ -4,10 +4,15 @@
   "projectType": "library",
   "targets": {
     "test": {
-      "executor": "@nx/jest:jest",
-      "outputs": ["{workspaceRoot}/coverage/change-password"],
+      "executor": "nx:run-commands",
       "options": {
-        "jestConfig": "packages/change-password/jest.config.js"
+        "command": "vitest run --project=change-password",
+        "cwd": "."
+      },
+      "configurations": {
+        "ci": {
+          "command": "vitest run --project=change-password --coverage"
+        }
       }
     },
     "version": {
@@ -34,6 +39,12 @@
         "hasTypeAwareRules": true,
         "cacheStrategy": "metadata"
       }
+    },
+    "build": {
+      "command": "tsup",
+      "options": {
+        "cwd": "packages/change-password"
+      }
     }
   }
 }

package/src/{ChangePasswordFeedback.js → ChangePasswordFeedback.jsx}

@@ -1,7 +1,7 @@
 import React from 'react';
 import Icon from '@availity/icon';
 import { useFormikContext } from 'formik';
-import { useChangePasswordContext } from './ChangePassword';
+import { useChangePasswordContext } from './ChangePassword.jsx';
 import './ChangePasswordFeedback.scss';
 
 const ChangePasswordFeedback = () => {

package/src/{ChangePasswordForm.js → ChangePasswordForm.jsx}

@@ -4,8 +4,8 @@ import BlockUI from '@availity/block-ui';
 import Icon from '@availity/icon';
 import { Alert, Button, CardBody, CardFooter, Col, Row } from 'reactstrap';
 import { Form, Field } from '@availity/form';
-import { useChangePasswordContext } from './ChangePassword';
-import ChangePasswordFeedback from './ChangePasswordFeedback';
+import { useChangePasswordContext } from './ChangePassword.jsx';
+import ChangePasswordFeedback from './ChangePasswordFeedback.jsx';
 import './ChangePasswordForm.scss';
 
 const ChangePasswordForm = ({

package/stories/change-password.stories.tsx

@@ -1,11 +1,11 @@
 import React from 'react';
-import { StoryObj } from '@storybook/react';
+import { StoryObj } from '@storybook/react-vite';
 import * as yup from 'yup';
 import AvApi from '@availity/api-axios';
 import ChangePassword, { ChangePasswordForm } from '..';
 
 export default {
-  title: 'Bootstrap Components/Change Password',
+  title: 'Deprecated/Change Password',
   parameters: {
     docs: {
       description: {

package/tests/{ChangePasswordFeedback.test.js → ChangePasswordFeedback.test.jsx}

@@ -1,11 +1,11 @@
 import React from 'react';
 import { render, fireEvent, cleanup } from '@testing-library/react';
-import ChangePassword, { ChangePasswordForm } from '..';
+import ChangePassword, { ChangePasswordForm } from '../index.js';
 
-jest.mock('@availity/api-axios');
+vi.mock('@availity/api-axios');
 
 afterEach(() => {
-  jest.clearAllMocks();
+  vi.clearAllMocks();
   cleanup();
 });
 
@@ -47,7 +47,7 @@ describe('ChangePasswordFeedback', () => {
       },
     ];
 
-    const resource = { changePassword: jest.fn() };
+    const resource = { changePassword: vi.fn() };
     const { getByTestId } = render(
       <ChangePassword resource={resource} conditions={conditions}>
         <ChangePasswordForm />

package/tests/{ChangePasswordForm.test.js → ChangePasswordForm.test.jsx}

@@ -1,11 +1,11 @@
 import React from 'react';
 import { render, waitFor, fireEvent, cleanup } from '@testing-library/react';
-import ChangePassword, { ChangePasswordForm, useChangePasswordContext } from '..';
+import ChangePassword, { ChangePasswordForm, useChangePasswordContext } from '../index.js';
 
-jest.mock('@availity/api-axios');
+vi.mock('@availity/api-axios');
 
 afterEach(() => {
-  jest.clearAllMocks();
+  vi.clearAllMocks();
   cleanup();
 });
 
@@ -23,10 +23,10 @@ describe('ChangePasswordForm', () => {
 
   it('submits api request with new password', async () => {
     const resource = {
-      changePassword: jest.fn().mockResolvedValue('Your password was successfully updated'),
+      changePassword: vi.fn().mockResolvedValue('Your password was successfully updated'),
     };
 
-    const onHandleSubmit = jest.fn();
+    const onHandleSubmit = vi.fn();
 
     const { getByTestId, getByText } = render(
       <ChangePassword resource={resource}>
@@ -77,7 +77,7 @@ describe('ChangePasswordForm', () => {
 
   it('renders custom on success message', async () => {
     const resource = {
-      changePassword: jest.fn().mockResolvedValue('Your password was successfully updated'),
+      changePassword: vi.fn().mockResolvedValue('Your password was successfully updated'),
     };
 
     const CustomPasswordComponent = () => {
@@ -135,7 +135,7 @@ describe('ChangePasswordForm', () => {
 
   it('renders error message', async () => {
     const resource = {
-      changePassword: jest.fn().mockRejectedValue('Failed to change password'),
+      changePassword: vi.fn().mockRejectedValue('Failed to change password'),
     };
 
     const { getByTestId, getByText } = render(
@@ -183,7 +183,7 @@ describe('ChangePasswordForm', () => {
 
   it('renders custom error message', async () => {
     const resource = {
-      changePassword: jest.fn().mockRejectedValue('Failed to change password'),
+      changePassword: vi.fn().mockRejectedValue('Failed to change password'),
     };
 
     const CustomPasswordComponent = () => {
@@ -241,7 +241,7 @@ describe('ChangePasswordForm', () => {
 
   it('toggles whether passwords are visible', async () => {
     const resource = {
-      changePassword: jest.fn(),
+      changePassword: vi.fn(),
     };
 
     const { getByTestId } = render(

package/tsup.config.js

@@ -0,0 +1,8 @@
+import { defineConfig } from 'tsup';
+
+export default defineConfig({
+  entry: ['index.js'],
+  format: ['esm'],
+  dts: true,
+  loader: { '.scss': 'empty' },
+});

package/types/ChangePassword.d.ts

@@ -38,7 +38,7 @@ export interface ChangePasswordContext {
   setConfirmNewPasswordVisible: () => boolean;
 }
 
-declare function useChangePasswordContext(): ChangePasswordContext;
+export function useChangePasswordContext(): ChangePasswordContext;
 
 declare const ChangePassword: React.FC<ChangePasswordProps>;
 

package/vitest.config.ts

@@ -0,0 +1,17 @@
+import { defineProject } from 'vitest/config';
+
+export default defineProject({
+  test: {
+    name: 'change-password',
+    globals: true,
+    environment: 'jsdom',
+    setupFiles: ['../../vitest.setup.ts'],
+    include: ['src/**/*.test.{ts,tsx,js,jsx}', 'tests/**/*.test.{ts,tsx,js,jsx}'],
+    env: { TZ: 'UTC' },
+    server: {
+      deps: {
+        inline: [/lodash/, /@availity\/yup/],
+      },
+    },
+  },
+});

package/jest.config.js

@@ -1,8 +0,0 @@
-const global = require('../../jest/global-config');
-
-module.exports = {
-  ...global,
-  displayName: 'change-password',
-  coverageDirectory: '../../coverage/change-password',
-};
-

package/tsconfig.spec.json

@@ -1,10 +0,0 @@
-{
-  "extends": "./tsconfig.json",
-  "compilerOptions": {
-    "outDir": "../../dist/out-tsc",
-    "module": "commonjs",
-    "types": ["jest", "node", "@testing-library/jest-dom"],
-    "allowJs": true
-  },
-  "include": ["**/*.test.js", "**/*.test.ts", "**/*.d.ts"]
-}