@pushwoosh/dumb-components 1.0.14 → 1.0.15

package/DropdownMenu/components/DropdownMenu/DropdownMenu.js

@@ -6,6 +6,7 @@ const defaultPlacements = ['top-start', 'top-end', 'bottom-start', 'bottom-end']
 export const DropdownMenu = ({
   renderHandler,
   children,
+  isScrollable,
   menuZIndex,
   menuPlacement
 }) => {
@@ -41,6 +42,7 @@ export const DropdownMenu = ({
   }), isOpen && React.createElement(Place, {
     ref: refs.setFloating,
     style: floatingStyles,
+    "$scrollable": isScrollable,
     "$zIndex": menuZIndex
   }, typeof children === 'function' ? children() : children));
 };

package/DropdownMenu/components/DropdownMenu/styles.d.ts

@@ -12,6 +12,7 @@ export declare const Place: import("styled-components").StyledComponent<"div", a
     $gridAutoFlow: string;
 } & {
     $zIndex?: number;
+    $scrollable?: boolean;
 }, "$gridAutoFlow">;
 export declare const DropdownMenuSection: import("styled-components").StyledComponent<"div", any, {
     $alignContent?: "end" | "start" | "center" | "space-between" | "space-around" | "space-evenly" | "stretch" | undefined;

package/DropdownMenu/components/DropdownMenu/styles.js

@@ -1,10 +1,13 @@
-import styled from 'styled-components';
+import styled, { css } from 'styled-components';
 import { Color, Shadow, ShapeRadius, Spacing } from '@pushwoosh/kit-constants';
 import { Vertical } from '@pushwoosh/kit-helpers';
+const scrollableCss = css(["max-height:248px;overflow-y:auto;"]);
 export const Place = styled(Vertical).withConfig({
   displayName: "Place",
   componentId: "sc-ij8wqc-0"
-})(["border:1px solid ", ";background-color:", ";min-width:200px;max-height:300px;overflow-y:auto;border-radius:", ";box-shadow:", ";z-index:", ";"], Color.FORM, Color.FROZEN, ShapeRadius.CONTROL, Shadow.REGULAR, ({
+})(["border:1px solid ", ";background-color:", ";min-width:140px;", " border-radius:", ";box-shadow:", ";z-index:", ";"], Color.FORM, Color.FROZEN, ({
+  $scrollable
+}) => $scrollable && scrollableCss, ShapeRadius.CONTROL, Shadow.REGULAR, ({
   $zIndex
 }) => $zIndex || 10);
 export const DropdownMenuSection = styled(Vertical).withConfig({

package/DropdownMenu/components/DropdownMenu/types.d.ts

@@ -8,6 +8,7 @@ export type HandlerProps = {
 export type DropdownMenuProps = {
     renderHandler: (args: HandlerProps) => ReactNode;
     children: (() => ReactNode) | ReactNode;
+    isScrollable?: boolean;
     menuZIndex?: number;
     menuPlacement?: Placement;
 };

package/DropdownMenu/components/DropdownMenuButton/DropdownMenuButton.js

@@ -3,12 +3,14 @@ import { Button } from '../../../Button';
 import { DropdownMenu } from '../DropdownMenu';
 export const DropdownMenuButton = ({
   label,
+  isScrollable,
   menuZIndex,
   menuPlacement,
   children,
   ...buttonProps
 }) => {
   return React.createElement(DropdownMenu, {
+    isScrollable: isScrollable,
     menuZIndex: menuZIndex,
     menuPlacement: menuPlacement,
     renderHandler: ({

package/DropdownMenu/components/DropdownMenuButton/types.d.ts

@@ -3,6 +3,7 @@ import { type ReactNode } from 'react';
 import { type RequiredButtonProps } from '../../../Button';
 export type DropdownMenuButtonProps = {
     label: ReactNode;
+    isScrollable?: boolean;
     menuZIndex?: number;
     menuPlacement?: Placement;
     color: RequiredButtonProps['color'];

package/DropdownMenu/components/DropdownMenuItem/styles.js

@@ -3,7 +3,7 @@ import { Color, Spacing, UnitSize } from '@pushwoosh/kit-constants';
 export const DropdownMenuItemStyled = styled.button.withConfig({
   displayName: "DropdownMenuItemStyled",
   componentId: "sc-1wmyvxp-0"
-})(["appearance:none;display:flex;align-items:center;padding:0 ", ";height:", ";border:none;color:", ";background:none;cursor:pointer;&:hover{background:", ";color:", ";}&:disabled{color:", ";cursor:not-allowed;}"], Spacing.S3, UnitSize.FIELD_HEIGHT, ({
+})(["appearance:none;display:flex;align-items:center;padding:0 ", ";height:", ";border:none;color:", ";background:none;cursor:pointer;&:hover{background:", ";color:", ";}&:disabled{color:", ";cursor:not-allowed;}"], Spacing.S4, UnitSize.FIELD_HEIGHT, ({
   $active,
   $danger
 }) => {

package/package.json

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