@pushwoosh/dumb-components 2.9.5 → 2.9.7

package/Button/__tests__/Button.test.d.ts

@@ -0,0 +1 @@
+export {};

package/Button/__tests__/Button.test.js

@@ -0,0 +1,27 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { render, screen } from '@testing-library/react';
+import { Button } from '../Button';
+describe('Button disabled colors', () => {
+  it('keeps white text on the red background for a disabled danger button', () => {
+    render(_jsx(Button, {
+      color: "danger",
+      isDisabled: true,
+      children: "Delete"
+    }));
+    const style = getComputedStyle(screen.getByRole('button'));
+    expect(style.color).toContain('--danger-shape-base-color');
+    expect(style.backgroundColor).toContain('--danger-shape-base-bg-color');
+  });
+  it('paints background, not text color, behind a disabled link-button', () => {
+    render(_jsx(Button, {
+      as: "a",
+      color: "primary",
+      isDisabled: true,
+      children: "Open"
+    }));
+    const style = getComputedStyle(screen.getByText('Open').closest('a'));
+    expect(style.color).toContain('--primary-shape-base-color');
+    expect(style.backgroundColor).toContain('--primary-shape-disabled-bg-color');
+    expect(style.borderColor).toBe('transparent');
+  });
+});

package/Button/colors.js

@@ -64,9 +64,7 @@ export const colors = {
         color: `var(--danger-shape-base-color, ${Color.CLEAR})`,
         bgColor: `var(--danger-shape-base-bg-color, ${Color.DANGER})`
       },
-      disabled: {
-        color: `var(--danger-shape-disabled-color, ${Color.LOCKED})`
-      },
+      disabled: {},
       hover: {
         bgColor: `var(--danger-shape-hover-bg-color, ${Color.DANGER_HOVER})`
       }
@@ -115,7 +113,7 @@ export function createColors(buttonColors) {
     if ($isOpen) {
       return Color.MAIN;
     }
-    return $isDisabled ? disabled.color : base.bgColor;
+    return $isDisabled ? disabled.bgColor : base.bgColor;
   }, ({
     $isOpen,
     $isDisabled
@@ -123,7 +121,7 @@ export function createColors(buttonColors) {
     if ($isOpen) {
       return Color.MAIN;
     }
-    return $isDisabled ? disabled.color : base.borderColor;
+    return $isDisabled ? disabled.borderColor : base.borderColor;
   }, disabled.color, disabled.bgColor, disabled.borderColor, ({
     $isOpen
   }) => $isOpen ? '' : hoverCss /* sc-custom "display: none;" */, hover.color, hover.bgColor, hover.borderColor);

package/Calendar/CalendarSuperForm/components/CalendarRangePicker/CalendarRangePicker.js

@@ -18,7 +18,7 @@ export const CalendarRangePicker = ({
   firstDayOfWeek,
   initialVisibleMonth
 }) => {
-  const startMonthRef = useRef();
+  const startMonthRef = useRef(undefined);
   if (!startMonthRef.current) {
     const d = new Date();
     startMonthRef.current = initialVisibleMonth ?? value[0] ?? {

package/Drawer/components/Drawer/Drawer.js

@@ -28,7 +28,7 @@ export function Drawer({
   withoutLockScreen = false,
   closeOnClickOutside = true
 }) {
-  const ref = useRef();
+  const ref = useRef(undefined);
   const [element] = useState(createDivElement);
   const {
     zIndex: resolvedZIndex

package/Modal/components/Modal/Modal.js

@@ -26,7 +26,7 @@ export function Modal(props) {
     onClose,
     children
   } = props;
-  const ref = useRef();
+  const ref = useRef(undefined);
   const [element] = useState(createDivElement);
   const {
     zIndex: resolvedZIndex

package/NotificationInbox/NotificationInbox.js

@@ -155,7 +155,9 @@ export function NotificationInbox({
                 children: notification.title
               }), notification.description && _jsx(NotificationDescription, {
                 as: "div",
-                ref: element => descriptionRefs.current[notification.id] = element || null,
+                ref: element => {
+                  descriptionRefs.current[notification.id] = element || null;
+                },
                 "$variant": "standard",
                 "$color": Color.MAIN,
                 "$visibleLines": VISIBLE_LINES,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pushwoosh/dumb-components",
-  "version": "2.9.5",
+  "version": "2.9.7",
   "description": "React components to build Pushwoosh products",
   "main": "index.js",
   "module": "index.js",