@pushwoosh/dumb-components 1.0.2 → 1.0.4

package/Button/colors.js

@@ -123,7 +123,7 @@ export function createColors(buttonColors) {
     if ($isOpen) {
       return Color.MAIN;
     }
-    return $isDisabled ? disabled.color : base.bgColor;
+    return $isDisabled ? disabled.color : base.borderColor;
   }, disabled.color, disabled.bgColor, disabled.borderColor, ({
     $isOpen
   }) => $isOpen ? '' : hoverCss /* sc-custom "display: none;" */, hover.color, hover.bgColor, hover.borderColor);

package/Button/styles.js

@@ -30,7 +30,7 @@ const dangerGhostColors = createColors(colors.danger.ghost);
 export const ButtonBoxDangerGhostCompact = styled(ButtonBox).withConfig({
   displayName: "ButtonBoxDangerGhostCompact",
   componentId: "sc-qltvdl-4"
-})(["height:16px;padding:0;font-size:", ";font-weight:", ";text-transform:uppercase;& ", "{padding:0;}& ", " + ", "{padding:0 0 0 ", ";}", ";--danger-ghost-hover-bg-color:transparent;"], FontSize.SMALL, FontWeight.BOLD, /* sc-selector */ButtonContent, /* sc-selector */ButtonIcon, /* sc-selector */ButtonContent, Spacing.S1, /* sc-custom "display: none;" */dangerGhostColors);
+})(["height:16px;padding:0;font-size:", ";font-weight:", ";text-transform:uppercase;& ", "{padding:0;}", ";--danger-ghost-hover-bg-color:transparent;"], FontSize.SMALL, FontWeight.BOLD, /* sc-selector */ButtonContent, /* sc-custom "display: none;" */dangerGhostColors);
 export const ButtonBoxDangerGhostField = styled(ButtonBox).withConfig({
   displayName: "ButtonBoxDangerGhostField",
   componentId: "sc-qltvdl-5"
@@ -60,7 +60,7 @@ const primaryGhostColors = createColors(colors.primary.ghost);
 export const ButtonBoxPrimaryGhostCompact = styled(ButtonBox).withConfig({
   displayName: "ButtonBoxPrimaryGhostCompact",
   componentId: "sc-qltvdl-10"
-})(["height:16px;padding:0;font-size:", ";font-weight:", ";text-transform:uppercase;& ", "{padding:0;}& ", " + ", "{padding:0 0 0 ", ";}", ";--primary-ghost-hover-bg-color:transparent;"], FontSize.SMALL, FontWeight.BOLD, /* sc-selector */ButtonContent, /* sc-selector */ButtonIcon, /* sc-selector */ButtonContent, Spacing.S1, /* sc-custom "display: none;" */primaryGhostColors);
+})(["height:16px;padding:0;font-size:", ";font-weight:", ";text-transform:uppercase;& ", "{padding:0;}", ";--primary-ghost-hover-bg-color:transparent;"], FontSize.SMALL, FontWeight.BOLD, /* sc-selector */ButtonContent, /* sc-custom "display: none;" */primaryGhostColors);
 export const ButtonBoxPrimaryGhostField = styled(ButtonBox).withConfig({
   displayName: "ButtonBoxPrimaryGhostField",
   componentId: "sc-qltvdl-11"
@@ -70,7 +70,7 @@ const secondaryGhostColors = createColors(colors.secondary.ghost);
 export const ButtonBoxSecondaryGhostCompact = styled(ButtonBox).withConfig({
   displayName: "ButtonBoxSecondaryGhostCompact",
   componentId: "sc-qltvdl-12"
-})(["height:16px;padding:0;font-size:", ";font-weight:", ";text-transform:uppercase;& ", "{padding:0;}& ", " + ", "{padding:0 0 0 ", ";}", ";--secondary-ghost-base-color:", ";--secondary-ghost-hover-bg-color:transparent;"], FontSize.SMALL, FontWeight.BOLD, /* sc-selector */ButtonContent, /* sc-selector */ButtonIcon, /* sc-selector */ButtonContent, Spacing.S1, /* sc-custom "display: none;" */secondaryGhostColors, Color.SOFT);
+})(["height:16px;padding:0;font-size:", ";font-weight:", ";text-transform:uppercase;& ", "{padding:0;}", ";--secondary-ghost-base-color:", ";--secondary-ghost-hover-bg-color:transparent;"], FontSize.SMALL, FontWeight.BOLD, /* sc-selector */ButtonContent, /* sc-custom "display: none;" */secondaryGhostColors, Color.SOFT);
 export const ButtonBoxSecondaryGhostField = styled(ButtonBox).withConfig({
   displayName: "ButtonBoxSecondaryGhostField",
   componentId: "sc-qltvdl-13"

package/DropdownMenu/components/DropdownMenuContainer/DropdownMenuContainer.js

@@ -1,6 +1,6 @@
 import React, { useLayoutEffect, useRef } from 'react';
-import { useOnClickOutside, useElementWidth } from '@pushwoosh/kit-hooks';
 import { DropdownIcon as Icon } from '@pushwoosh/kit-icons';
+import { useOnClickOutside, useElementWidth } from '../../../hooks';
 import { useDropdownMenuContext } from '../DropdownMenu';
 import { DropdownMenuContainerButtonMap } from './maps';
 import { DropdownMenuContainerBox, DropdownMenuContainerChevron, DropdownMenuContainerIcon, DropdownMenuContainerPortal, DropdownMenuContainerTitle, DropdownMenuContainerWindow } from './styles';

package/DropdownMenu/components/DropdownMenuItemCheckbox/DropdownMenuItemCheckbox.d.ts

@@ -1,3 +1,3 @@
 import { type ReactElement } from 'react';
-import { type CheckboxProps } from '@pushwoosh/kit-checkbox';
+import { type CheckboxProps } from '../../../Checkbox';
 export declare function DropdownMenuItemCheckbox(props: CheckboxProps): ReactElement;

package/DropdownMenu/components/DropdownMenuItemCheckbox/DropdownMenuItemCheckbox.js

@@ -1,6 +1,6 @@
 import React from 'react';
-import { Checkbox } from '@pushwoosh/kit-checkbox';
 import { DropdownMenuItemCheckboxBox } from './styles';
+import { Checkbox } from '../../../Checkbox';
 export function DropdownMenuItemCheckbox(props) {
   return React.createElement(DropdownMenuItemCheckboxBox, null, React.createElement(Checkbox, {
     color: "main",

package/Spinner/Spinner.js

@@ -7,8 +7,8 @@ export function Spinner(props) {
     size,
     ...rest
   } = props;
-  const Icon = AssetsMap[size];
-  if (!Icon) {
+  const icon = AssetsMap[size];
+  if (!icon) {
     console.error(`[Spinner]: incorrect size: ${size}!`);
     return null;
   }
@@ -16,5 +16,8 @@ export function Spinner(props) {
     ...rest,
     size: size,
     ref: boxRef
-  }, React.createElement(SpinnerAnimate, null, React.createElement(Icon, null)));
+  }, React.createElement(SpinnerAnimate, null, React.createElement("img", {
+    src: icon,
+    alt: `${size} spinner`
+  })));
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pushwoosh/dumb-components",
-  "version": "1.0.2",
+  "version": "1.0.4",
   "description": "React components to build Pushwoosh products",
   "main": "index.js",
   "module": "index.js",
@@ -16,9 +16,8 @@
   },
   "pre-commit": "check",
   "devDependencies": {
-    "@pushwoosh/frontend-builder-engine": "^1.0.11",
+    "@pushwoosh/frontend-builder-engine": "^1.0.12",
     "@pushwoosh/kit-constants": "^1.6.7",
-    "@pushwoosh/kit-dropdown-menu": "^1.6.8",
     "@types/lodash": "^4.17.13",
     "@types/react": "^18.2.69",
     "@types/react-dom": "^18.2.22",
@@ -43,6 +42,7 @@
     "@pushwoosh/kit-helpers": "^4.6.2",
     "@pushwoosh/kit-icons": "^2.1.1",
     "@pushwoosh/kit-typography": "^1.7.1",
+    "@tippyjs/react": "^4.2.6",
     "liquidjs": "^10.18.0",
     "lodash": "^4.17.21",
     "polished": "^4.3.1",