@pushwoosh/dumb-components 1.0.13 → 1.0.15

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/Modal/components/ModalContent/index.d.ts

@@ -1 +1 @@
-export { ModalHeader, ModalBodyGroup, ModalBodyItem, ModalBody, ModalFooter, } from './styled';
+export { ModalHeader, ModalBodyGroup, ModalBodyItem, ModalBody, ModalFooter, } from './styles';

package/Modal/components/ModalContent/index.js

@@ -1 +1 @@
-export { ModalHeader, ModalBodyGroup, ModalBodyItem, ModalBody, ModalFooter } from './styled';
+export { ModalHeader, ModalBodyGroup, ModalBodyItem, ModalBody, ModalFooter } from './styles';

package/Modal/components/ModalContent/{styled.js → styles.js}

@@ -3,27 +3,27 @@ import { Color, Spacing } from '@pushwoosh/kit-constants';
 import { Vertical } from '@pushwoosh/kit-helpers';
 export const ModalHeader = styled.div.withConfig({
   displayName: "ModalHeader",
-  componentId: "sc-t60vr-0"
+  componentId: "sc-1b5r517-0"
 })(["padding:", " ", " ", ";background-color:", ";"], Spacing.S7, Spacing.S7, Spacing.S3, Color.CLEAR);
 ModalHeader.displayName = 'ModalHeader';
 export const ModalBodyGroup = styled(Vertical).withConfig({
   displayName: "ModalBodyGroup",
-  componentId: "sc-t60vr-1"
+  componentId: "sc-1b5r517-1"
 })(["background-color:", ";gap:1px;"], Color.DIVIDER);
 ModalBodyGroup.displayName = 'ModalBodyGroup';
 export const ModalBodyItem = styled.div.withConfig({
   displayName: "ModalBodyItem",
-  componentId: "sc-t60vr-2"
+  componentId: "sc-1b5r517-2"
 })(["padding:", " ", ";background-color:", ";"], ({
   $vPadding
 }) => $vPadding ? Spacing.S7 : 0, Spacing.S7, Color.CLEAR);
 export const ModalBody = styled.div.withConfig({
   displayName: "ModalBody",
-  componentId: "sc-t60vr-3"
+  componentId: "sc-1b5r517-3"
 })(["background-color:", ";overflow-y:auto;&:not(:has(> ", ")){padding:", ";&:not(:first-child){padding-top:0;}}"], Color.CLEAR, ModalBodyGroup, Spacing.S7);
 ModalBody.displayName = 'ModalBody';
 export const ModalFooter = styled.div.withConfig({
   displayName: "ModalFooter",
-  componentId: "sc-t60vr-4"
+  componentId: "sc-1b5r517-4"
 })(["padding:", ";background-color:", ";border-top:1px solid ", ";"], Spacing.S7, Color.CLEAR, Color.DIVIDER);
 ModalFooter.displayName = 'ModalFooter';

package/Radio/Radio.js

@@ -1,5 +1,5 @@
 import React, { useState } from 'react';
-import { NativeLabel, NativeRadio } from './styled';
+import { NativeLabel, NativeRadio } from './styles';
 // eslint-disable-next-line prefer-const
 let counter = 0;
 export function Radio(props) {

package/Radio/{styled.js → styles.js}

@@ -3,11 +3,11 @@ import { Color, Spacing, FontSize, LineHeight } from '@pushwoosh/kit-constants';
 import { ColorMap } from './maps';
 export const NativeRadio = styled.input.withConfig({
   displayName: "NativeRadio",
-  componentId: "sc-154q01x-0"
+  componentId: "sc-34lgtl-0"
 })(["appearance:none;-webkit-appearance:none;-moz-appearance:none;width:20px;height:20px;border:2px solid ", ";border-radius:50%;background-color:", ";transition:border 0.1s,background-color 0.1s;cursor:pointer;&:focus{outline:none;}&[type=radio]:hover{border-color:", ";}&[type=radio]:disabled{cursor:not-allowed;border-color:", ";background-color:", ";}&[type=radio]:checked{border:6px solid ", ";}&[type=radio]:checked:hover{border-color:", ";}&[type=radio]:checked:disabled{border-color:", ";background-color:", ";}"], Color.PHANTOM, Color.CLEAR, Color.PRIMARY_HOVER, Color.LOCKED, Color.FROZEN, Color.PRIMARY, Color.PRIMARY_HOVER, Color.LOCKED, Color.FROZEN);
 export const NativeLabel = styled.label.withConfig({
   displayName: "NativeLabel",
-  componentId: "sc-154q01x-1"
+  componentId: "sc-34lgtl-1"
 })(["display:inline-flex;align-items:center;font-size:", ";line-height:", ";user-select:none;", " & > ", "{&:not(:last-child){margin-right:", ";}}"], FontSize.REGULAR, LineHeight.REGULAR, ({
   $color
 }) => $color && `color: ${ColorMap[$color]};`, NativeRadio, Spacing.S3);

package/index.d.ts

@@ -1,10 +1,11 @@
-export { ActionsGroup } from './ActionsGroup';
+export { ActionsGroup, ActionsGroupItem } from './ActionsGroup';
 export { Badge, type BadgeColor } from './Badge';
 export { Banner, type BannerType } from './Banner';
 export { Button, GhostButton } from './Button';
 export { CardMetric } from './CardMetric';
 export { Checkbox } from './Checkbox';
 export { Drawer, DrawerHeader, DrawerTitle, DrawerBody, DrawerDocs, useDocs, } from './Drawer';
+export { DatePicker, DatePickerField, DateTimePicker, DateTimePickerField, } from './DateTimePicker';
 export { DropdownMenu, DropdownMenuButton, DropdownMenuSection, DropdownMenuItem, } from './DropdownMenu';
 export { EditableField } from './EditableField';
 export { InputFile } from './InputFile';

package/index.js

@@ -1,10 +1,11 @@
-export { ActionsGroup } from './ActionsGroup';
+export { ActionsGroup, ActionsGroupItem } from './ActionsGroup';
 export { Badge } from './Badge';
 export { Banner } from './Banner';
 export { Button, GhostButton } from './Button';
 export { CardMetric } from './CardMetric';
 export { Checkbox } from './Checkbox';
 export { Drawer, DrawerHeader, DrawerTitle, DrawerBody, DrawerDocs, useDocs } from './Drawer';
+export { DatePicker, DatePickerField, DateTimePicker, DateTimePickerField } from './DateTimePicker';
 export { DropdownMenu, DropdownMenuButton, DropdownMenuSection, DropdownMenuItem } from './DropdownMenu';
 export { EditableField } from './EditableField';
 export { InputFile } from './InputFile';

package/package.json

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