@pushwoosh/dumb-components 2.11.3 → 2.11.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -42,5 +42,5 @@ export declare const CodeText: import("styled-components/dist/types").IStyledCom
42
42
  [key: `--${string}`]: string | number | undefined;
43
43
  }) | undefined;
44
44
  }, "children" | "key" | "slot" | "style" | "title" | "ref" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "autoCapitalize" | "autoFocus" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "enterKeyHint" | "hidden" | "id" | "lang" | "nonce" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "content" | "datatype" | "inlist" | "prefix" | "property" | "rel" | "resource" | "rev" | "typeof" | "vocab" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "exportparts" | "part" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-description" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowindextext" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerLeave" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "$color" | "$variant" | "as" | "forwardedAs" | "$textAlign" | "$textTransform" | "$ellipsis">>> & string;
45
- export declare const RewardTitle: import("styled-components/dist/types").IStyledComponentBase<"web", Omit<import("../NativeRichMediaTitle").NativeRichMediaTitleProps, "children" | "className" | "$color" | "$size" | "$clamp" | "$marginTop" | "$align" | "$truncate"> & Partial<Pick<import("../NativeRichMediaTitle").NativeRichMediaTitleProps, "children" | "className" | "$color" | "$size" | "$clamp" | "$marginTop" | "$align" | "$truncate">>> & string & Omit<typeof NativeRichMediaTitle, keyof import("react").Component<any, {}, any>>;
45
+ export declare const RewardTitle: import("styled-components/dist/types").IStyledComponentBase<"web", Omit<import("../NativeRichMediaTitle").NativeRichMediaTitleProps, "children" | "className" | "$color" | "$size" | "$textAlign" | "$clamp" | "$marginTop" | "$truncate"> & Partial<Pick<import("../NativeRichMediaTitle").NativeRichMediaTitleProps, "children" | "className" | "$color" | "$size" | "$textAlign" | "$clamp" | "$marginTop" | "$truncate">>> & string & Omit<typeof NativeRichMediaTitle, keyof import("react").Component<any, {}, any>>;
46
46
  export declare const RewardMessage: import("styled-components/dist/types").IStyledComponentBase<"web", Omit<import("../NativeRichMediaText").NativeRichMediaTextProps, "children" | "className" | "$color" | "$clamp" | "$marginTop" | "$align"> & Partial<Pick<import("../NativeRichMediaText").NativeRichMediaTextProps, "children" | "className" | "$color" | "$clamp" | "$marginTop" | "$align">>> & string & Omit<typeof NativeRichMediaText, keyof import("react").Component<any, {}, any>>;
@@ -19,7 +19,7 @@ export const CodeText = styled(Text).attrs({
19
19
  componentId: "sc-z83bc4-1"
20
20
  })([""]);
21
21
  export const RewardTitle = styled(NativeRichMediaTitle).attrs({
22
- $align: 'center'
22
+ $textAlign: 'center'
23
23
  }).withConfig({
24
24
  displayName: "RewardTitle",
25
25
  componentId: "sc-z83bc4-2"
@@ -19,7 +19,6 @@ export declare const TitleRoot: import("styled-components/dist/types").IStyledCo
19
19
  $size?: "h3" | "h4";
20
20
  }>, {
21
21
  $color?: string;
22
- $align?: "center";
23
22
  $marginTop?: number;
24
23
  $size?: "h3" | "h4";
25
24
  $truncate?: boolean;
@@ -45,7 +44,6 @@ export declare const TitleRoot: import("styled-components/dist/types").IStyledCo
45
44
  $size?: "h3" | "h4";
46
45
  }>, {
47
46
  $color?: string;
48
- $align?: "center";
49
47
  $marginTop?: number;
50
48
  $size?: "h3" | "h4";
51
49
  $truncate?: boolean;
@@ -7,11 +7,9 @@ export const TitleRoot = styled(Text).attrs(({
7
7
  })).withConfig({
8
8
  displayName: "TitleRoot",
9
9
  componentId: "sc-1oklc22-0"
10
- })(["display:block;color:", ";", " ", " ", " ", ""], ({
10
+ })(["display:block;color:", ";", " ", " ", ""], ({
11
11
  $color
12
12
  }) => $color, ({
13
- $align
14
- }) => $align ? `text-align: ${$align};` : '', ({
15
13
  $marginTop
16
14
  }) => $marginTop !== undefined ? `margin-top: ${$marginTop}px;` : '', ({
17
15
  $truncate
@@ -3,7 +3,7 @@ export type NativeRichMediaTitleProps = {
3
3
  children?: ReactNode;
4
4
  className?: string;
5
5
  $color?: string;
6
- $align?: 'center';
6
+ $textAlign?: 'center';
7
7
  $marginTop?: number;
8
8
  $size?: 'h3' | 'h4';
9
9
  $truncate?: boolean;
@@ -26,7 +26,7 @@ export function NativeRichMediaModalView(props) {
26
26
  "$gap": 4,
27
27
  children: [title.text && _jsx(NativeRichMediaTitle, {
28
28
  "$color": title.color,
29
- "$align": "center",
29
+ "$textAlign": "center",
30
30
  children: title.text
31
31
  }), message.text && _jsx(NativeRichMediaText, {
32
32
  "$color": message.color,
@@ -24,7 +24,7 @@ export function NativeRichMediaScratchcardView(props) {
24
24
  children: [(title.text || message.text) && _jsxs(TextBlock, {
25
25
  children: [title.text && _jsx(NativeRichMediaTitle, {
26
26
  "$color": title.color,
27
- "$align": "center",
27
+ "$textAlign": "center",
28
28
  children: title.text
29
29
  }), message.text && _jsx(NativeRichMediaText, {
30
30
  "$color": message.color,
@@ -22,7 +22,7 @@ export function NativeRichMediaSpinwheelView(props) {
22
22
  "$background": surfaceBackground(block.background, '#FFFFFF'),
23
23
  children: [title.text && _jsx(NativeRichMediaTitle, {
24
24
  "$color": title.color,
25
- "$align": "center",
25
+ "$textAlign": "center",
26
26
  children: title.text
27
27
  }), message.text && _jsx(NativeRichMediaText, {
28
28
  "$color": message.color,
@@ -53,6 +53,7 @@ export function NotificationBar({
53
53
  }), hasNotifications && _jsx(NotificationBarBadge, {
54
54
  children: _jsx(NotificationBarBadgeText, {
55
55
  "$variant": "h5",
56
+ "$textTransform": "uppercase",
56
57
  children: count
57
58
  })
58
59
  })]
@@ -10,7 +10,7 @@ import { Badge } from '../Badge';
10
10
  import { Spinner } from '../Spinner';
11
11
  import emptyNotificationsIcon from './assets/EmptyNotifications.svg?url';
12
12
  import { Lang } from './polyglot';
13
- import { NotificationInboxContainer, NotificationInboxHeader, NotificationInboxTitle, NotificationInboxList, NotificationItem, NotificationIndicator, NotificationHeader, NotificationDescription, NotificationActionLink, NotificationInboxEmptyIcon, NotificationInboxEmptyText } from './styles';
13
+ import { NotificationInboxContainer, NotificationInboxHeader, NotificationInboxTitle, NotificationInboxList, NotificationItem, NotificationIndicator, NotificationHeader, NotificationDescription, NotificationActionLink, NotificationInboxEmptyIcon } from './styles';
14
14
  /**
15
15
  * Scrollable notification list with severity indicators, read state, per-item
16
16
  * actions, infinite scroll and an empty state.
@@ -80,13 +80,15 @@ export function NotificationInbox({
80
80
  "$justifyContent": "center",
81
81
  "$justifyItems": "center",
82
82
  "$alignContent": "center",
83
- children: [_jsx(NotificationInboxEmptyText, {
83
+ children: [_jsx(Text, {
84
84
  "$variant": "h4",
85
85
  "$color": Color.LOCKED,
86
+ "$textAlign": "center",
86
87
  children: emptyStateTitle
87
- }), _jsx(NotificationInboxEmptyText, {
88
+ }), _jsx(Text, {
88
89
  "$variant": "footnote",
89
90
  "$color": Color.LOCKED,
91
+ "$textAlign": "center",
90
92
  children: emptyStateDescription
91
93
  })]
92
94
  })]
@@ -347,24 +347,6 @@ export declare const NotificationActionLink: import("styled-components/dist/type
347
347
  export declare const NotificationInboxEmptyIcon: import("styled-components/dist/types").IStyledComponentBase<"web", Omit<import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, "style"> & {
348
348
  style?: import("react").CSSProperties | import("styled-components/dist/types").CSSPropertiesWithVars | undefined;
349
349
  }> & string;
350
- export declare const NotificationInboxEmptyText: import("styled-components/dist/types").IStyledComponentBase<"web", Omit<Omit<import("styled-components").FastOmit<import("styled-components/dist/types").Merged<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "style"> & {
351
- style?: import("react").CSSProperties | import("styled-components/dist/types").CSSPropertiesWithVars | undefined;
352
- }, {
353
- $color?: string;
354
- $textAlign?: import("react").CSSProperties["textAlign"];
355
- $textTransform?: import("react").CSSProperties["textTransform"];
356
- $ellipsis?: boolean;
357
- $variant?: import("@pushwoosh/kit-typography").TypographyVariant;
358
- }>, "as" | "forwardedAs"> & {
359
- as?: import("styled-components").WebTarget | undefined;
360
- forwardedAs?: import("styled-components").WebTarget | undefined;
361
- }, "ref"> & {
362
- ref?: ((instance: HTMLSpanElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLSpanElement> | null | undefined;
363
- }, "style"> & {
364
- style?: import("react").CSSProperties | import("styled-components/dist/types").CSSPropertiesWithVars | (import("react").CSSProperties & {
365
- [key: `--${string}`]: string | number | undefined;
366
- }) | undefined;
367
- }> & string;
368
350
  export declare const NotificationBarButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Merged<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "style"> & {
369
351
  style?: import("react").CSSProperties | import("styled-components/dist/types").CSSPropertiesWithVars | undefined;
370
352
  }, {
@@ -49,13 +49,9 @@ export const NotificationInboxEmptyIcon = styled.img.withConfig({
49
49
  displayName: "NotificationInboxEmptyIcon",
50
50
  componentId: "sc-1nrene1-9"
51
51
  })(["display:flex;align-items:center;justify-content:center;width:120px;height:120px;margin:0 auto;object-fit:contain;"]);
52
- export const NotificationInboxEmptyText = styled(Text).withConfig({
53
- displayName: "NotificationInboxEmptyText",
54
- componentId: "sc-1nrene1-10"
55
- })(["text-align:center;"]);
56
52
  export const NotificationBarButton = styled.button.withConfig({
57
53
  displayName: "NotificationBarButton",
58
- componentId: "sc-1nrene1-11"
54
+ componentId: "sc-1nrene1-10"
59
55
  })(["display:flex;gap:8px;align-items:center;padding:8px 16px 8px 12px;width:260px;border:none;border-top:1px solid ", ";border-bottom:0;border-left:0;border-right:0;cursor:pointer;transition:background-color 0.2s,opacity 0.2s;background-color:", ";--icon-color:", ";--text-color:", ";--badge-bg:", ";--badge-text-color:", ";&:hover:not(:disabled){background-color:", ";--icon-color:", ";--text-color:", ";--badge-bg:", ";--badge-text-color:", ";}&:active:not(:disabled){opacity:0.5;--icon-color:", ";--text-color:", ";--badge-bg:", ";}"], Color.FORM, ({
60
56
  $type,
61
57
  $isOpened,
@@ -219,23 +215,23 @@ export const NotificationBarButton = styled.button.withConfig({
219
215
  });
220
216
  export const NotificationBarIcon = styled.div.withConfig({
221
217
  displayName: "NotificationBarIcon",
222
- componentId: "sc-1nrene1-12"
218
+ componentId: "sc-1nrene1-11"
223
219
  })(["width:16px;height:16px;flex-shrink:0;display:flex;align-items:center;justify-content:center;transition:color 0.2s;color:var(--icon-color);"]);
224
220
  export const NotificationBarText = styled.div.withConfig({
225
221
  displayName: "NotificationBarText",
226
- componentId: "sc-1nrene1-13"
222
+ componentId: "sc-1nrene1-12"
227
223
  })(["display:flex;align-items:center;justify-content:start;flex:1 0 0;font-size:", ";font-family:", ";font-weight:", ";line-height:1.4;transition:color 0.2s;color:var(--text-color);white-space:pre-wrap;"], FontSize.REGULAR, FontFamily.MAIN, FontWeight.MEDIUM);
228
224
  export const NotificationBarBadge = styled.div.withConfig({
229
225
  displayName: "NotificationBarBadge",
230
- componentId: "sc-1nrene1-14"
226
+ componentId: "sc-1nrene1-13"
231
227
  })(["flex-shrink:0;transition:background-color 0.2s;background-color:var(--badge-bg);border-radius:", ";padding:2px 6px;display:flex;align-items:center;justify-content:center;"], ShapeRadius.CONTROL);
232
228
  export const NotificationBarBadgeText = styled(Text).withConfig({
233
229
  displayName: "NotificationBarBadgeText",
234
- componentId: "sc-1nrene1-15"
235
- })(["text-transform:uppercase;transition:color 0.2s;color:var(--badge-text-color);"]);
230
+ componentId: "sc-1nrene1-14"
231
+ })(["transition:color 0.2s;color:var(--badge-text-color);"]);
236
232
  export const NotificationBellButton = styled.button.withConfig({
237
233
  displayName: "NotificationBellButton",
238
- componentId: "sc-1nrene1-16"
234
+ componentId: "sc-1nrene1-15"
239
235
  })(["position:relative;width:36px;height:36px;padding:6px;border:none;background:", ";border-radius:", ";cursor:pointer;display:flex;align-items:center;justify-content:center;color:", ";transition:background-color 0.2s,color 0.2s;&:hover:not(:disabled){background-color:", ";color:", ";}"], ({
240
236
  $isOpened
241
237
  }) => $isOpened ? Color.MAIN : 'transparent', ShapeRadius.CONTROL, ({
@@ -247,11 +243,11 @@ export const NotificationBellButton = styled.button.withConfig({
247
243
  }) => $isOpened ? Color.CLEAR : Color.PRIMARY_HOVER);
248
244
  export const NotificationBellBadge = styled.div.withConfig({
249
245
  displayName: "NotificationBellBadge",
250
- componentId: "sc-1nrene1-17"
246
+ componentId: "sc-1nrene1-16"
251
247
  })(["position:absolute;right:4px;top:4px;z-index:1;"]);
252
248
  export const NotificationBellBadgeDot = styled.div.withConfig({
253
249
  displayName: "NotificationBellBadgeDot",
254
- componentId: "sc-1nrene1-18"
250
+ componentId: "sc-1nrene1-17"
255
251
  })(["background-color:", ";border-radius:100px;", " display:flex;align-items:center;justify-content:center;font-size:10px;font-family:", ";font-weight:", ";line-height:1;color:", ";white-space:nowrap;"], ({
256
252
  $color
257
253
  }) => $color, ({
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@pushwoosh/dumb-components",
3
- "version": "2.11.3",
3
+ "version": "2.11.4",
4
4
  "description": "React components to build Pushwoosh products",
5
5
  "main": "index.js",
6
6
  "module": "index.js",