@pushwoosh/dumb-components 1.1.19 → 1.1.21

package/DropdownMenu/components/DropdownMenu/index.d.ts

@@ -1,2 +1 @@
 export { DropdownMenu } from './DropdownMenu';
-export { DropdownMenuSection } from './styles';

package/DropdownMenu/components/DropdownMenu/index.js

@@ -1,2 +1 @@
-export { DropdownMenu } from './DropdownMenu';
-export { DropdownMenuSection } from './styles';
+export { DropdownMenu } from './DropdownMenu';

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

@@ -59,59 +59,3 @@ export declare const Place: import("styled-components").StyledComponent<"div", a
     $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;
-    $alignItems?: "end" | "start" | "center" | "stretch" | "baseline" | undefined;
-    $bgColor?: string | undefined;
-    $border?: string | ({
-        top?: string | undefined;
-        right?: string | undefined;
-        bottom?: string | undefined;
-        left?: string | undefined;
-    } | {
-        horizontal: string;
-        top?: string | undefined;
-        bottom?: string | undefined;
-    } | {
-        vertical: string;
-        right?: string | undefined;
-        left?: string | undefined;
-    }) | undefined;
-    $borderRadius?: (string | number) | undefined;
-    $boxShadow?: string | undefined;
-    $gap?: (string | number) | undefined;
-    $gridAutoFlow?: "row" | "column" | "dense" | "row dense" | "column dense" | undefined;
-    $justifyContent?: "end" | "start" | "center" | "space-between" | "space-around" | "space-evenly" | "stretch" | undefined;
-    $justifyItems?: "end" | "start" | "center" | "stretch" | "baseline" | undefined;
-    $margin?: (string | number) | ({
-        top?: (string | number) | undefined;
-        right?: (string | number) | undefined;
-        bottom?: (string | number) | undefined;
-        left?: (string | number) | undefined;
-    } | {
-        horizontal: string | number;
-        top?: (string | number) | undefined;
-        bottom?: (string | number) | undefined;
-    } | {
-        vertical: string | number;
-        right?: (string | number) | undefined;
-        left?: (string | number) | undefined;
-    }) | undefined;
-    $padding?: (string | number) | ({
-        top?: (string | number) | undefined;
-        right?: (string | number) | undefined;
-        bottom?: (string | number) | undefined;
-        left?: (string | number) | undefined;
-    } | {
-        horizontal: string | number;
-        top?: (string | number) | undefined;
-        bottom?: (string | number) | undefined;
-    } | {
-        vertical: string | number;
-        right?: (string | number) | undefined;
-        left?: (string | number) | undefined;
-    }) | undefined;
-    $placeItems?: "end" | "start" | "center" | "stretch" | undefined;
-} & {
-    $gridAutoFlow: string;
-}, "$gridAutoFlow">;

package/DropdownMenu/components/DropdownMenu/styles.js

@@ -1,5 +1,5 @@
 import styled, { css } from 'styled-components';
-import { Color, Shadow, ShapeRadius, Spacing } from '@pushwoosh/kit-constants';
+import { Color, Shadow, ShapeRadius } 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({
@@ -13,8 +13,4 @@ export const Place = styled(Vertical).withConfig({
   $scrollable
 }) => $scrollable && scrollableCss, ShapeRadius.CONTROL, Shadow.REGULAR, ({
   $zIndex
-}) => $zIndex || 10);
-export const DropdownMenuSection = styled(Vertical).withConfig({
-  displayName: "DropdownMenuSection",
-  componentId: "sc-ij8wqc-1"
-})(["padding:", " 0;&:not(:first-child){border-top:1px solid ", ";}"], Spacing.S3, Color.FORM);
+}) => $zIndex || 10);

package/DropdownMenu/components/DropdownMenuItem/styles.js

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

package/DropdownMenu/components/DropdownMenuSection/DropdownMenuSection.d.ts

@@ -0,0 +1,3 @@
+import { type FC } from 'react';
+import { type DropdownMenuSectionProps } from './types';
+export declare const DropdownMenuSection: FC<DropdownMenuSectionProps>;

package/DropdownMenu/components/DropdownMenuSection/DropdownMenuSection.js

@@ -0,0 +1,17 @@
+import React from 'react';
+import { Color } from '@pushwoosh/kit-constants';
+import { Horizontal } from '@pushwoosh/kit-helpers';
+import { Text } from '@pushwoosh/kit-typography';
+import { DropdownMenuSectionRoot } from './styles';
+export const DropdownMenuSection = ({
+  title,
+  children
+}) => {
+  return React.createElement(DropdownMenuSectionRoot, null, title && React.createElement(Horizontal, {
+    "$padding": "8px 12px"
+  }, React.createElement(Text, {
+    "$variant": "h5",
+    "$color": Color.LOCKED,
+    "$uppercase": true
+  }, title)), children);
+};

package/DropdownMenu/components/DropdownMenuSection/index.d.ts

@@ -0,0 +1 @@
+export { DropdownMenuSection } from './DropdownMenuSection';

package/DropdownMenu/components/DropdownMenuSection/index.js

@@ -0,0 +1 @@
+export { DropdownMenuSection } from './DropdownMenuSection';

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

@@ -0,0 +1,56 @@
+export declare const DropdownMenuSectionRoot: import("styled-components").StyledComponent<"div", any, {
+    $alignContent?: "end" | "start" | "center" | "space-between" | "space-around" | "space-evenly" | "stretch" | undefined;
+    $alignItems?: "end" | "start" | "center" | "stretch" | "baseline" | undefined;
+    $bgColor?: string | undefined;
+    $border?: string | ({
+        top?: string | undefined;
+        right?: string | undefined;
+        bottom?: string | undefined;
+        left?: string | undefined;
+    } | {
+        horizontal: string;
+        top?: string | undefined;
+        bottom?: string | undefined;
+    } | {
+        vertical: string;
+        right?: string | undefined;
+        left?: string | undefined;
+    }) | undefined;
+    $borderRadius?: (string | number) | undefined;
+    $boxShadow?: string | undefined;
+    $gap?: (string | number) | undefined;
+    $gridAutoFlow?: "row" | "column" | "dense" | "row dense" | "column dense" | undefined;
+    $justifyContent?: "end" | "start" | "center" | "space-between" | "space-around" | "space-evenly" | "stretch" | undefined;
+    $justifyItems?: "end" | "start" | "center" | "stretch" | "baseline" | undefined;
+    $margin?: (string | number) | ({
+        top?: (string | number) | undefined;
+        right?: (string | number) | undefined;
+        bottom?: (string | number) | undefined;
+        left?: (string | number) | undefined;
+    } | {
+        horizontal: string | number;
+        top?: (string | number) | undefined;
+        bottom?: (string | number) | undefined;
+    } | {
+        vertical: string | number;
+        right?: (string | number) | undefined;
+        left?: (string | number) | undefined;
+    }) | undefined;
+    $padding?: (string | number) | ({
+        top?: (string | number) | undefined;
+        right?: (string | number) | undefined;
+        bottom?: (string | number) | undefined;
+        left?: (string | number) | undefined;
+    } | {
+        horizontal: string | number;
+        top?: (string | number) | undefined;
+        bottom?: (string | number) | undefined;
+    } | {
+        vertical: string | number;
+        right?: (string | number) | undefined;
+        left?: (string | number) | undefined;
+    }) | undefined;
+    $placeItems?: "end" | "start" | "center" | "stretch" | undefined;
+} & {
+    $gridAutoFlow: string;
+}, "$gridAutoFlow">;

package/DropdownMenu/components/DropdownMenuSection/styles.js

@@ -0,0 +1,7 @@
+import styled from 'styled-components';
+import { Color } from '@pushwoosh/kit-constants';
+import { Vertical } from '@pushwoosh/kit-helpers';
+export const DropdownMenuSectionRoot = styled(Vertical).withConfig({
+  displayName: "DropdownMenuSectionRoot",
+  componentId: "sc-xi4vra-0"
+})(["padding:8px 0;&:not(:first-child){border-top:1px solid ", ";}"], Color.FORM);

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

@@ -0,0 +1,4 @@
+import { type PropsWithChildren } from 'react';
+export type DropdownMenuSectionProps = PropsWithChildren<{
+    title?: string;
+}>;

package/DropdownMenu/components/DropdownMenuSection/types.js

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

package/DropdownMenu/index.d.ts

@@ -1,3 +1,4 @@
-export { DropdownMenu, DropdownMenuSection } from './components/DropdownMenu';
+export { DropdownMenu } from './components/DropdownMenu';
 export { DropdownMenuButton } from './components/DropdownMenuButton';
 export { DropdownMenuItem } from './components/DropdownMenuItem';
+export { DropdownMenuSection } from './components/DropdownMenuSection';

package/DropdownMenu/index.js

@@ -1,3 +1,4 @@
-export { DropdownMenu, DropdownMenuSection } from './components/DropdownMenu';
+export { DropdownMenu } from './components/DropdownMenu';
 export { DropdownMenuButton } from './components/DropdownMenuButton';
-export { DropdownMenuItem } from './components/DropdownMenuItem';
+export { DropdownMenuItem } from './components/DropdownMenuItem';
+export { DropdownMenuSection } from './components/DropdownMenuSection';

package/StatisticCard/StatisticCard.js

@@ -28,12 +28,12 @@ export function StatisticCard(props) {
       return React.createElement(Horizontal, {
         "$alignItems": "end",
         "$gap": 8
-      }, React.createElement(StatValue, null, formatNumber(value, 'spaced')), React.createElement(Text, {
+      }, React.createElement(StatValue, null, typeof value === 'number' ? formatNumber(value, 'spaced') : value), React.createElement(Text, {
         "$variant": "footnote",
         "$color": Color.LOCKED
       }, valueSubtext));
     }
-    return React.createElement(StatValue, null, formatNumber(value, 'spaced'));
+    return React.createElement(StatValue, null, typeof value === 'number' ? formatNumber(value, 'spaced') : value);
   }, [isLoading, value, valueSubtext]);
   return React.createElement(Container, {
     "$active": active,

package/StatisticCard/types.d.ts

@@ -2,7 +2,7 @@ import { type ReactNode } from 'react';
 export type StatisticCardProps = CommonProps & (SelectableProps | NonSelectableProps);
 export type CommonProps = {
     title: ReactNode;
-    value: number;
+    value: number | string;
     valueSubtext?: string;
     rightSlot?: ReactNode;
     footer?: string;

package/package.json

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