ag-common 0.0.293 → 0.0.296

package/dist/ui/components/UserImage/index.d.ts

@@ -1,9 +1,10 @@
 /// <reference types="react" />
 import { User } from '../../helpers/jwt';
 export declare const UserImageIcon: JSX.Element;
-export declare const UserImage: ({ image, className, }: {
+export declare const UserImage: ({ image, className, title, }: {
     image?: string | undefined;
     className?: string | undefined;
+    title?: string | undefined;
 }) => JSX.Element;
 export declare const UserProfileImage: ({ className, user, }: {
     className?: string | undefined;

package/dist/ui/components/UserImage/index.js

@@ -48,12 +48,11 @@ const Img = styled_components_1.default.img `
 const images = {
     domains: ['platform-lookaside.fbsbx.com', 'lh3.googleusercontent.com'],
 };
-const UserImage = ({ image, className, }) => {
+const UserImage = ({ image, className, title = 'user image', }) => {
     const [fallback, setFallback] = (0, react_1.useState)(false);
-    const showImage = image && !fallback;
-    return (react_1.default.createElement(Base, { className: className, title: 'user image' },
-        showImage && (react_1.default.createElement(Img, { alt: "user", src: image, onError: () => setFallback(true) })),
-        !showImage && exports.UserImageIcon));
+    return (react_1.default.createElement(Base, { className: className, title: title },
+        image && !fallback && (react_1.default.createElement(Img, { alt: "user", src: image, onError: () => setFallback(true) })),
+        (!image || fallback) && exports.UserImageIcon));
 };
 exports.UserImage = UserImage;
 const UserProfileImage = ({ className, user, }) => {
@@ -65,8 +64,6 @@ const UserProfileImage = ({ className, user, }) => {
     }
     const titleA = [user === null || user === void 0 ? void 0 : user.fullname, user === null || user === void 0 ? void 0 : user.userId].filter(array_1.notEmpty);
     const title = titleA.length === 0 ? '' : titleA.join(' - ');
-    return (react_1.default.createElement(Base, { className: className, title: title },
-        image && react_1.default.createElement(Img, { alt: "user", src: image }),
-        !image && exports.UserImageIcon));
+    return react_1.default.createElement(exports.UserImage, { image: image, title: title, className: className });
 };
 exports.UserProfileImage = UserProfileImage;

package/dist/ui/helpers/dom.d.ts

@@ -6,3 +6,4 @@ export declare const convertRemToPixels: (rem: number) => number;
  * @returns
  */
 export declare const filterDataProps: (p: any) => Record<string, string>;
+export declare const isRightClick: (event: MouseEvent | TouchEvent) => boolean;

package/dist/ui/helpers/dom.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.filterDataProps = exports.convertRemToPixels = exports.domContains = void 0;
+exports.isRightClick = exports.filterDataProps = exports.convertRemToPixels = exports.domContains = void 0;
 const array_1 = require("../../common/helpers/array");
 const domContains = (e, x, y) => {
     if (!e) {
@@ -30,3 +30,16 @@ const filterDataProps = (p) => {
     return (0, array_1.arrayToObject)(x, (s) => s[0], (s) => s[1]);
 };
 exports.filterDataProps = filterDataProps;
+const isRightClick = (event) => {
+    //
+    let isRightMB = false;
+    if ('which' in event)
+        // Gecko (Firefox), WebKit (Safari/Chrome) & Opera
+        isRightMB = event.which == 3;
+    else if ('button' in event)
+        // IE, Opera
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        isRightMB = event.button == 2;
+    return isRightMB;
+};
+exports.isRightClick = isRightClick;

package/dist/ui/helpers/useOnClickOutside.js

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useOnClickOutside = void 0;
+const dom_1 = require("./dom");
 const react_1 = require("react");
 function useOnClickOutside(p, handler) {
     (0, react_1.useEffect)(() => {
@@ -9,6 +10,11 @@ function useOnClickOutside(p, handler) {
         }
         const listener = (event) => {
             var _a;
+            //
+            const isRightMB = (0, dom_1.isRightClick)(event);
+            if (isRightMB) {
+                return;
+            }
             const el = (_a = p.ref) === null || _a === void 0 ? void 0 : _a.current;
             // Do nothing if clicking ref's element or descendent elements
             if (!el || el.contains((event === null || event === void 0 ? void 0 : event.target) || null)) {

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "ag-common",
-  "version": "0.0.293",
+  "version": "0.0.296",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
   "author": "Andrei Gec <@andreigec> (https://gec.dev/)",
   "repository": "github:andreigec/ag-common",
   "license": "ISC",
-  "packageManager": "yarn@3.2.1",
+  "packageManager": "yarn@3.2.2",
   "scripts": {
     "format": "npx eslint --ext .ts,.tsx ./src --fix",
     "build": "rimraf dist && yarn lint && tsc",
@@ -42,18 +42,18 @@
     "@storybook/react": "6.5.9",
     "@storybook/theming": "6.5.9",
     "@types/jsonwebtoken": "8.5.8",
-    "@types/node": "18.0.6",
+    "@types/node": "18.6.1",
     "@types/react": "18.0.15",
     "@types/react-dom": "18.0.6",
     "@types/styled-components": "5.1.25",
-    "@typescript-eslint/eslint-plugin": "5.30.7",
-    "@typescript-eslint/parser": "5.30.7",
+    "@typescript-eslint/eslint-plugin": "5.31.0",
+    "@typescript-eslint/parser": "5.31.0",
     "cross-env": "7.0.3",
     "eslint": "8.20.0",
     "eslint-config-airbnb-typescript": "17.0.0",
     "eslint-config-prettier": "8.5.0",
     "eslint-plugin-import": "2.26.0",
-    "eslint-plugin-jsx-a11y": "6.6.0",
+    "eslint-plugin-jsx-a11y": "6.6.1",
     "eslint-plugin-prettier": "4.2.1",
     "eslint-plugin-react": "7.30.1",
     "eslint-plugin-react-hooks": "4.6.0",