@availity/mui-transitions 0.1.1 → 0.2.0

package/CHANGELOG.md

@@ -2,6 +2,18 @@
 
 This file was generated using [@jscutlery/semver](https://github.com/jscutlery/semver).
 
+## [0.2.0](https://github.com/Availity/element/compare/@availity/mui-transitions@0.1.2...@availity/mui-transitions@0.2.0) (2024-06-21)
+
+### Dependency Updates
+
+* `mui-typography` updated to version `0.1.2`
+
+### Features
+
+* **mui-transitions:** add Fade component ([0a6e4b9](https://github.com/Availity/element/commit/0a6e4b9b31da786f26f64a66ceef789a57d302fe))
+
+## [0.1.2](https://github.com/Availity/element/compare/@availity/mui-transitions@0.1.1...@availity/mui-transitions@0.1.2) (2024-04-19)
+
 ## [0.1.1](https://github.com/Availity/element/compare/@availity/mui-transitions@0.1.0...@availity/mui-transitions@0.1.1) (2024-04-04)
 
 

package/dist/index.d.mts

@@ -0,0 +1,10 @@
+import { CollapseProps as CollapseProps$1 } from '@mui/material/Collapse';
+import { FadeProps as FadeProps$1 } from '@mui/material/Fade';
+
+type CollapseProps = CollapseProps$1;
+declare const Collapse: (props: CollapseProps) => JSX.Element;
+
+type FadeProps = FadeProps$1;
+declare const Fade: (props: FadeProps) => JSX.Element;
+
+export { Collapse, type CollapseProps, Fade, type FadeProps };

package/dist/index.d.ts

@@ -1,6 +1,10 @@
 import { CollapseProps as CollapseProps$1 } from '@mui/material/Collapse';
+import { FadeProps as FadeProps$1 } from '@mui/material/Fade';
 
 type CollapseProps = CollapseProps$1;
 declare const Collapse: (props: CollapseProps) => JSX.Element;
 
-export { Collapse, CollapseProps };
+type FadeProps = FadeProps$1;
+declare const Fade: (props: FadeProps) => JSX.Element;
+
+export { Collapse, type CollapseProps, Fade, type FadeProps };

package/dist/index.js

@@ -3,8 +3,22 @@ var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
 var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
 var __export = (target, all) => {
   for (var name in all)
     __defProp(target, name, { get: all[name], enumerable: true });
@@ -18,6 +32,10 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
   isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
   mod
 ));
@@ -26,7 +44,8 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/index.ts
 var src_exports = {};
 __export(src_exports, {
-  Collapse: () => Collapse
+  Collapse: () => Collapse,
+  Fade: () => Fade
 });
 module.exports = __toCommonJS(src_exports);
 
@@ -34,11 +53,17 @@ module.exports = __toCommonJS(src_exports);
 var import_Collapse = __toESM(require("@mui/material/Collapse"));
 var import_jsx_runtime = require("react/jsx-runtime");
 var Collapse = (props) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Collapse.default, {
-    ...props
-  });
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Collapse.default, __spreadValues({}, props));
+};
+
+// src/lib/Fade.tsx
+var import_Fade = __toESM(require("@mui/material/Fade"));
+var import_jsx_runtime2 = require("react/jsx-runtime");
+var Fade = (props) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_Fade.default, __spreadValues({}, props));
 };
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  Collapse
+  Collapse,
+  Fade
 });

package/dist/index.mjs

@@ -1,11 +1,34 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+
 // src/lib/Collapse.tsx
 import MuiCollapse from "@mui/material/Collapse";
 import { jsx } from "react/jsx-runtime";
 var Collapse = (props) => {
-  return /* @__PURE__ */ jsx(MuiCollapse, {
-    ...props
-  });
+  return /* @__PURE__ */ jsx(MuiCollapse, __spreadValues({}, props));
+};
+
+// src/lib/Fade.tsx
+import MuiFade from "@mui/material/Fade";
+import { jsx as jsx2 } from "react/jsx-runtime";
+var Fade = (props) => {
+  return /* @__PURE__ */ jsx2(MuiFade, __spreadValues({}, props));
 };
 export {
-  Collapse
+  Collapse,
+  Fade
 };

package/jest.config.js

@@ -4,4 +4,14 @@ module.exports = {
   ...global,
   displayName: 'transitions',
   coverageDirectory: '../../coverage/transitions',
+  /* TODO: Update to latest Jest snapshotFormat
+   * By default Nx has kept the older style of Jest Snapshot formats
+   * to prevent breaking of any existing tests with snapshots.
+   * It's recommend you update to the latest format.
+   * You can do this by removing snapshotFormat property
+   * and running tests with --update-snapshot flag.
+   * Example: From within the project directory, run "nx test --update-snapshot"
+   * More info: https://jestjs.io/docs/upgrading-to-jest29#snapshot-format
+   */
+  snapshotFormat: { escapeString: true, printBasicPrototype: true },
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@availity/mui-transitions",
-  "version": "0.1.1",
+  "version": "0.2.0",
   "description": "Availity MUI Transitions Component - part of the @availity/element design system",
   "keywords": [
     "react",
@@ -32,11 +32,13 @@
     "publish:canary": "yarn npm publish --access public --tag canary"
   },
   "devDependencies": {
-    "@mui/material": "^5.11.9",
+    "@availity/mui-alert": "^0.5.13",
+    "@availity/mui-typography": "^0.2.0",
+    "@mui/material": "^5.15.15",
     "react": "18.2.0",
     "react-dom": "18.2.0",
-    "tsup": "^5.12.7",
-    "typescript": "^4.6.4"
+    "tsup": "^8.0.2",
+    "typescript": "^5.4.5"
   },
   "peerDependencies": {
     "@mui/material": "^5.11.9",

package/project.json

@@ -6,10 +6,9 @@
   "tags": [],
   "targets": {
     "lint": {
-      "executor": "@nrwl/linter:eslint",
+      "executor": "@nx/eslint:lint",
       "options": {
         "eslintConfig": ".eslintrc.json",
-        "lintFilePatterns": ["packages/transitions/**/*.{js,ts}"],
         "silent": false,
         "fix": false,
         "cache": true,
@@ -22,20 +21,20 @@
       }
     },
     "test": {
-      "executor": "@nrwl/jest:jest",
-      "outputs": ["coverage/transitions"],
+      "executor": "@nx/jest:jest",
+      "outputs": ["{workspaceRoot}/coverage/transitions"],
       "options": {
-        "jestConfig": "packages/transitions/jest.config.js",
-        "passWithNoTests": true
+        "jestConfig": "packages/transitions/jest.config.js"
       }
     },
     "version": {
       "executor": "@jscutlery/semver:version",
       "options": {
         "preset": "conventional",
-        "commitMessageFormat": "chore(${projectName}): release version ${version} [skip ci]",
-        "tagPrefix": "@availity/${projectName}@",
-        "trackDeps": true
+        "commitMessageFormat": "chore({projectName}): release version ${version} [skip ci]",
+        "tagPrefix": "@availity/{projectName}@",
+        "trackDeps": true,
+        "skipCommitTypes": ["docs"]
       }
     }
   }

package/src/index.ts

@@ -1 +1,2 @@
 export * from './lib/Collapse';
+export * from './lib/Fade';

package/src/lib/Collapse.stories.tsx

@@ -13,7 +13,7 @@ import TableHead from '@mui/material/TableHead';
 import TableRow from '@mui/material/TableRow';
 import TableCell from '@mui/material/TableCell';
 import TableBody from '@mui/material/TableBody';
-import Alert from '@mui/material/Alert';
+import { Alert } from '@availity/mui-alert';
 
 /** Expand from the start edge of the child element. */
 const meta: Meta<typeof Collapse> = {

package/src/lib/Fade.stories.tsx

@@ -0,0 +1,34 @@
+// Each exported component in the package should have its own stories file
+
+import { useState } from 'react';
+import type { Meta, StoryObj } from '@storybook/react';
+import { Alert } from '@availity/mui-alert';
+import { Fade, FadeProps } from './Fade';
+
+/** Expand from the start edge of the child element. */
+const meta: Meta<typeof Fade> = {
+  title: 'Components/Transitions/Fade',
+  component: Fade,
+  tags: ['autodocs'],
+};
+
+export default meta;
+
+export const _Fade: StoryObj<typeof Fade> = {
+  render: (args: FadeProps) => {
+    const [visible, setVisible] = useState(true);
+
+    const onClose = () => {
+      setVisible(false);
+      setTimeout(() => setVisible(true), 1000);
+    };
+
+    return (
+      <Fade in={visible} {...args}>
+        <div>
+          <Alert onClose={onClose}>Dismissable Alert</Alert>
+        </div>
+      </Fade>
+    );
+  },
+};

package/src/lib/Fade.test.tsx

@@ -0,0 +1,14 @@
+import { render } from '@testing-library/react';
+import { Typography } from '@availity/mui-typography';
+import { Fade } from './Fade';
+
+describe('Fade', () => {
+  test('should render successfully', () => {
+    const { getByText } = render(
+      <Fade>
+        <Typography>Test</Typography>
+      </Fade>
+    );
+    expect(getByText('Test')).toBeTruthy();
+  });
+});

package/src/lib/Fade.tsx

@@ -0,0 +1,7 @@
+import MuiFade, { FadeProps as MuiFadeProps } from '@mui/material/Fade';
+
+export type FadeProps = MuiFadeProps;
+
+export const Fade = (props: FadeProps): JSX.Element => {
+  return <MuiFade {...props} />;
+};