@sendgrid/ui-components - npm Package Compare versions

Comparing version 1.43.5 to 1.44.0

actions.d.ts

@@ -8,4 +8,4 @@ import React from 'react';
 }
-export declare const Actions: React.SFC<ActionsProps>;
-export declare const ActionsCell: React.SFC<ActionsProps>;
+export declare const Actions: React.FC<ActionsProps>;
+export declare const ActionsCell: React.FC<ActionsProps>;
 export interface ActionProps {
@@ -15,5 +15,7 @@ title: string;
     noKeyboardNavigation?: boolean;
-    onClick: (event: any) => void;
+    onClick?: (event: any) => void;
+    disabled?: boolean;
+    className?: string;
 }
-export declare const Action: React.SFC<ActionProps>;
+export declare const Action: React.FC<ActionProps>;
 export default Actions;

actions.js

@@ -16,3 +16,3 @@ var __rest = (this && this.__rest) || function (s, e) {
 import EmailCardStyles from './styles/email-card.module.scss';
-import { keyboardNavigationProps } from './utilities/keyboard-navigation';
+import { disabledKeyboardNavigationProps, keyboardNavigationProps, } from './utilities/keyboard-navigation';
 // using Children.map to attach this prop is problematic because we
@@ -42,3 +42,3 @@ // may wish to render <Link> elements as opposed to <Action> elements
 export const Action = (_a) => {
-    var { title, icon, onClick: handleClick, noKeyboardNavigation } = _a, attributes = __rest(_a, ["title", "icon", "onClick", "noKeyboardNavigation"]);
+    var { title, icon, onClick: handleClick, noKeyboardNavigation, disabled = false, className = '' } = _a, attributes = __rest(_a, ["title", "icon", "onClick", "noKeyboardNavigation", "disabled", "className"]);
     const hiddenTitleTooltipAttributes = {
@@ -48,6 +48,8 @@ 'data-tooltip': title,
     };
-    return (React.createElement(Consumer, null, ({ showTitle }) => (React.createElement("span", Object.assign({}, (showTitle ? {} : hiddenTitleTooltipAttributes), (noKeyboardNavigation ? {} : keyboardNavigationProps), { onClick: handleClick }, attributes),
+    return (React.createElement(Consumer, null, ({ showTitle }) => (React.createElement(React.Fragment, null, disabled ? (React.createElement("span", Object.assign({ className: cn(Styles['action--disabled'], className) }, (showTitle ? {} : hiddenTitleTooltipAttributes), (noKeyboardNavigation ? {} : disabledKeyboardNavigationProps), attributes),
+        React.createElement(Icon, { type: icon, className: Styles['action-icon--disabled'] }),
+        showTitle && title)) : (React.createElement("span", Object.assign({}, (showTitle ? {} : hiddenTitleTooltipAttributes), (noKeyboardNavigation ? {} : keyboardNavigationProps), { onClick: handleClick, className: className }, attributes),
         React.createElement(Icon, { type: icon }),
-        showTitle && title))));
+        showTitle && title))))));
 };
 export default Actions;

package.json

 {
   "name": "@sendgrid/ui-components",
-  "version": "1.43.5",
+  "version": "1.44.0",
   "description": "Reusable UI components for Sendgrid's applications.",
@@ -5,0 +5,0 @@ "main": "index.js",

utilities/keyboard-navigation.d.ts

@@ -14,2 +14,7 @@ /// <reference types="react" />
 };
+export declare const disabledKeyboardNavigationProps: {
+    ariaDisabled: boolean;
+    role: string;
+    tabIndex: number;
+};
 export declare const getModalKeyboardProps: (context: any, escapeAction: (...args: any) => void, modalSelector: string) => {
@@ -16,0 +21,0 @@ onKeyDown: any;

utilities/keyboard-navigation.js

@@ -66,2 +66,7 @@ export const FOCUSABLE_ELEMENT_SELECTORS = 'a[href], area[href], input:not([disabled]), select:not([disabled]), textarea:not([disabled]), button:not([disabled]), iframe, object, [tabindex="0"], [contenteditable]';
 };
+export const disabledKeyboardNavigationProps = {
+    ariaDisabled: true,
+    role: 'button',
+    tabIndex: 0,
+};
 export const getModalKeyboardProps = (context, escapeAction, modalSelector) => {
@@ -68,0 +73,0 @@ const focusable = getFocusableElementsWithin(modalSelector);

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

978960

increased by0.09%

Lines of code

9358

increased by0.16%

No dependency changes