@pushwoosh/dumb-components 1.1.29 → 1.1.31

package/Chip/Chip.d.ts

@@ -3,6 +3,7 @@ export declare const Chip: React.ForwardRefExoticComponent<{
     $variant?: import("./Chip.types").ChipVariant;
     $selected?: boolean;
     $onClose?: React.HTMLAttributes<HTMLDivElement>["onClick"];
+    $readOnly?: boolean;
     as?: string;
 } & {
     children?: React.ReactNode | undefined;

package/Chip/Chip.js

@@ -4,6 +4,7 @@ import { ChipStyled } from './styles';
 export const Chip = forwardRef(({
   $variant = 'primary',
   $selected,
+  $readOnly,
   $onClose,
   children,
   as,
@@ -14,6 +15,7 @@ export const Chip = forwardRef(({
     "$variant": $variant,
     "$selected": $selected,
     "$closeable": !!$onClose,
+    "$readOnly": $readOnly,
     as: as,
     ...rest
   }, children, $onClose && React.createElement(CloseIcon, {

package/Chip/Chip.types.d.ts

@@ -4,5 +4,6 @@ export type ChipProps = PropsWithChildren<{
     $variant?: ChipVariant;
     $selected?: boolean;
     $onClose?: HTMLAttributes<HTMLDivElement>['onClick'];
+    $readOnly?: boolean;
     as?: string;
 }> & HTMLAttributes<HTMLDivElement>;

package/Chip/styles.d.ts

@@ -3,4 +3,5 @@ export declare const ChipStyled: import("styled-components").StyledComponent<"di
     $variant: ChipVariant;
     $selected?: boolean;
     $closeable?: boolean;
+    $readOnly?: boolean;
 }, never>;

package/Chip/styles.js

@@ -8,8 +8,20 @@ export const ChipStyled = styled.div.withConfig({
   $closeable
 }) => $closeable ? '4px' : '8px', ({
   $variant,
-  $selected
-}) => $selected ? Color.CLEAR : variants[$variant].color, ({
+  $selected,
+  $readOnly
+}) => {
+  if ($readOnly) {
+    return Color.MAIN;
+  }
+  return $selected ? Color.CLEAR : variants[$variant].color;
+}, ({
   $variant,
-  $selected
-}) => $selected ? Color.MAIN : variants[$variant].background);
+  $selected,
+  $readOnly
+}) => {
+  if ($readOnly) {
+    return Color.SOFT_LIGHT;
+  }
+  return $selected ? Color.MAIN : variants[$variant].background;
+});

package/FrequencyCapping/FrequencyCappingEdit.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { type CappingBase, type FrequencyCappingEditProps } from './types';
+export declare function FrequencyCappingEdit<T extends CappingBase>({ capping, globalCapping, onChange, applicationCode }: FrequencyCappingEditProps<T>): React.JSX.Element;

package/FrequencyCapping/FrequencyCappingEdit.js

@@ -0,0 +1,90 @@
+import React from 'react';
+import { Color } from '@pushwoosh/kit-constants';
+import { Vertical } from '@pushwoosh/kit-helpers';
+import { OpenIcon } from '@pushwoosh/kit-icons';
+import { Description } from './components/Description';
+import { EditCappingSettings } from './components/Settings';
+import { getCappingOption, getCappingOptions } from './helpers/getCappingOption';
+import { CappingTypes } from './types';
+import { FieldBox } from '../FieldBox';
+import { Link } from '../Link';
+import { Select } from '../Select';
+import { Container, LinkWrapper } from './styles';
+export function FrequencyCappingEdit({
+  capping,
+  globalCapping,
+  onChange,
+  applicationCode
+}) {
+  const {
+    enabled,
+    messages,
+    days,
+    ignoreGlobalCapping
+  } = capping;
+  const cappingOption = getCappingOption(enabled, ignoreGlobalCapping);
+  const isGlobalCappingDisabled = globalCapping.count === 0 && globalCapping.days === 0;
+  const globalCappingLinkText = isGlobalCappingDisabled ? 'Set up' : 'Settings';
+  const cappingOptions = getCappingOptions(isGlobalCappingDisabled);
+  const onChangeFrequencyCapping = React.useCallback(value => {
+    if (value === CappingTypes.IGNORE) {
+      onChange({
+        ...capping,
+        enabled: false,
+        ignoreGlobalCapping: true
+      });
+    }
+    if (value === CappingTypes.CUSTOM) {
+      onChange({
+        ...capping,
+        enabled: true,
+        ignoreGlobalCapping: false,
+        messages: 5,
+        days: 1
+      });
+    }
+    if (value === CappingTypes.GLOBAL) {
+      onChange({
+        ...capping,
+        enabled: false,
+        ignoreGlobalCapping: false
+      });
+    }
+  }, [capping, onChange]);
+  const onSettingsChange = React.useCallback((messages, days) => {
+    onChange({
+      ...capping,
+      messages,
+      days
+    });
+  }, [capping, onChange]);
+  return React.createElement(Container, {
+    "$padding": 16,
+    "$bgColor": Color.SOFT_LIGHT,
+    "$borderRadius": 8
+  }, React.createElement(Vertical, {
+    "$gap": 12
+  }, React.createElement(FieldBox, {
+    title: "Frequency capping"
+  }, React.createElement(Select, {
+    name: "cappingOption",
+    options: cappingOptions,
+    value: cappingOptions.find(option => option.value === cappingOption),
+    onChange: newValue => onChangeFrequencyCapping(newValue.value)
+  })), React.createElement(Description, {
+    cappingOption: cappingOption,
+    messages: globalCapping.count,
+    days: globalCapping.days
+  }, cappingOption === CappingTypes.GLOBAL && React.createElement(Link, {
+    href: `/applications/${applicationCode}/message-delivery-settings?tab=capping`,
+    title: globalCappingLinkText
+  }, React.createElement(LinkWrapper, null, globalCappingLinkText, React.createElement(OpenIcon, {
+    size: "small",
+    view: "lined",
+    as: "span"
+  })))), cappingOption === CappingTypes.CUSTOM && React.createElement(EditCappingSettings, {
+    messages: messages,
+    days: days,
+    onChange: onSettingsChange
+  })));
+}

package/FrequencyCapping/FrequencyCappingReadonly.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { type CappingBase, type FrequencyCappingReadonlyProps } from './types';
+export declare function FrequencyCappingReadonly<T extends CappingBase>({ capping, globalCapping, applicationCode }: FrequencyCappingReadonlyProps<T>): React.JSX.Element;

package/FrequencyCapping/FrequencyCappingReadonly.js

@@ -0,0 +1,35 @@
+import React from 'react';
+import { Horizontal, Vertical } from '@pushwoosh/kit-helpers';
+import { OpenIcon } from '@pushwoosh/kit-icons';
+import { Link } from '../Link';
+import { getCappingOption } from './helpers/getCappingOption';
+import { getReadonlyCappingIcon, getReadonlyCappingLabel } from './helpers/getReadonlyCappingHelpers';
+import { CappingTypes } from './types';
+export function FrequencyCappingReadonly({
+  capping,
+  globalCapping,
+  applicationCode
+}) {
+  const cappingOption = getCappingOption(capping === null || capping === void 0 ? void 0 : capping.enabled, capping === null || capping === void 0 ? void 0 : capping.ignoreGlobalCapping);
+  const isGlobalCappingDisabled = globalCapping.count === 0 && globalCapping.days === 0;
+  const globalCappingLinkText = isGlobalCappingDisabled ? 'Set up' : 'Settings';
+  const label = getReadonlyCappingLabel(cappingOption, isGlobalCappingDisabled, capping, globalCapping);
+  const checkIcon = getReadonlyCappingIcon(cappingOption, isGlobalCappingDisabled);
+  return React.createElement(Vertical, {
+    "$gap": 24
+  }, React.createElement(Horizontal, {
+    "$gap": 8,
+    "$justifyContent": "start",
+    "$alignItems": "center"
+  }, checkIcon, label, cappingOption === CappingTypes.GLOBAL && React.createElement(Link, {
+    href: `/applications/${applicationCode}/message-delivery-settings?tab=capping`,
+    title: globalCappingLinkText
+  }, React.createElement(Horizontal, {
+    "$gap": 4,
+    "$justifyContent": "start",
+    "$alignItems": "center"
+  }, globalCappingLinkText, React.createElement(OpenIcon, {
+    size: "small",
+    view: "lined"
+  })))));
+}

package/FrequencyCapping/components/Condition/index.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+type ConditionProps = {
+    messages: number;
+    days: number;
+    tooltip?: string;
+};
+export declare function Condition({ messages, days, tooltip }: ConditionProps): React.JSX.Element;
+export {};

package/FrequencyCapping/components/Condition/index.js

@@ -0,0 +1,29 @@
+import React from 'react';
+import { Color } from '@pushwoosh/kit-constants';
+import { HelpRoundIcon } from '@pushwoosh/kit-icons';
+import { ChipWithinTextContainer } from './styles';
+import { Chip } from '../../../Chip';
+import { Tooltip } from '../../../Tooltip';
+export function Condition({
+  messages,
+  days,
+  tooltip
+}) {
+  return React.createElement(ChipWithinTextContainer, null, tooltip ? React.createElement(Tooltip, {
+    content: tooltip,
+    position: "top-middle"
+  }, React.createElement(Chip, {
+    "$variant": "primary",
+    "$readOnly": true,
+    as: "span"
+  }, `${messages} messages per ${days} ${days > 1 ? 'days' : 'day'}`, React.createElement(HelpRoundIcon, {
+    as: "span",
+    size: "small",
+    view: "lined",
+    color: Color.PHANTOM
+  }))) : React.createElement(Chip, {
+    "$variant": "primary",
+    "$readOnly": true,
+    as: "span"
+  }, `${messages} messages per ${days} ${days > 1 ? 'days' : 'day'}`));
+}

package/FrequencyCapping/components/Condition/styles.d.ts

@@ -0,0 +1 @@
+export declare const ChipWithinTextContainer: import("styled-components").StyledComponent<"span", any, {}, never>;

package/FrequencyCapping/components/Condition/styles.js

@@ -0,0 +1,5 @@
+import styled from 'styled-components';
+export const ChipWithinTextContainer = styled.span.withConfig({
+  displayName: "ChipWithinTextContainer",
+  componentId: "sc-pqahx9-0"
+})(["margin:0 8px;span{line-height:1;}"]);

package/FrequencyCapping/components/Description/index.d.ts

@@ -0,0 +1,10 @@
+import React, { type ReactNode } from 'react';
+import { CappingTypes } from '../../types';
+type Props = {
+    cappingOption: CappingTypes;
+    messages: number;
+    days: number;
+    children?: ReactNode;
+};
+export declare function Description(props: Props): React.JSX.Element | undefined;
+export {};

package/FrequencyCapping/components/Description/index.js

@@ -0,0 +1,27 @@
+import React from 'react';
+import { Paragraph } from '@pushwoosh/kit-typography';
+import { CappingTypes } from '../../types';
+import { Condition } from '../Condition';
+export function Description(props) {
+  const {
+    cappingOption,
+    messages,
+    days,
+    children
+  } = props;
+  if (cappingOption === CappingTypes.GLOBAL) {
+    if (messages === 0 && days === 0) {
+      return React.createElement(Paragraph, null, "To ensure you don\u2019t overwhelm your subscribers with excessive communication, consider setting up Global frequency capping.", ' ', children);
+    }
+    return React.createElement(Paragraph, null, "Under the current setup, If the user receives more than", React.createElement(Condition, {
+      messages: messages,
+      days: days
+    }), ", this message will not be delivered, and the user will proceed to the next step.", ' ', children);
+  }
+  if (cappingOption === CappingTypes.CUSTOM) {
+    return React.createElement(Paragraph, null, "Instead of Global frequency capping, the limit of sent messages you set will be used. If the subscriber exceeds the limit of received messages, they will not receive this message and will proceed to the next step.", ' ', children);
+  }
+  if (cappingOption === CappingTypes.IGNORE) {
+    return React.createElement(Paragraph, null, "The user will receive this message regardless, even if they have exceeded the set message limits for the channel. Use with caution to avoid sending too many messages.", ' ', children);
+  }
+}

package/FrequencyCapping/components/Settings/index.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+type Props = {
+    messages: number;
+    days: number;
+    onChange: (messages: number, days: number) => void;
+};
+export declare function EditCappingSettings(props: Props): React.JSX.Element;
+export {};

package/FrequencyCapping/components/Settings/index.js

@@ -0,0 +1,34 @@
+import React from 'react';
+import { Horizontal } from '@pushwoosh/kit-helpers';
+import { Paragraph } from '@pushwoosh/kit-typography';
+import { NumberPicker } from '../../../NumberPicker';
+export function EditCappingSettings(props) {
+  const {
+    messages,
+    days,
+    onChange
+  } = props;
+  const onMessagesChange = React.useCallback(value => {
+    onChange(value, days);
+  }, [days, onChange]);
+  const onDaysChange = React.useCallback(value => {
+    onChange(messages, value);
+  }, [messages, onChange]);
+  return React.createElement(Horizontal, {
+    "$gap": 12,
+    "$alignItems": "center",
+    style: {
+      gridTemplateColumns: '145px 70px 90px 70px 40px'
+    }
+  }, React.createElement(Paragraph, null, "Limit to a maximum of"), React.createElement(NumberPicker, {
+    onChange: value => onMessagesChange(value),
+    value: messages,
+    minValue: 1,
+    maxValue: 1000
+  }), React.createElement(Paragraph, null, "messages per"), React.createElement(NumberPicker, {
+    maxValue: 30,
+    minValue: 1,
+    onChange: value => onDaysChange(value),
+    value: days
+  }), React.createElement(Paragraph, null, "day(s)"));
+}

package/FrequencyCapping/helpers/getCappingOption.d.ts

@@ -0,0 +1,6 @@
+import { CappingTypes } from '../types';
+export declare const getCappingOption: (enabled: boolean, ignoreGlobalCapping: boolean) => CappingTypes;
+export declare const getCappingOptions: (isGlobalCappingDisabled: boolean) => {
+    value: CappingTypes;
+    label: string;
+}[];

package/FrequencyCapping/helpers/getCappingOption.js

@@ -0,0 +1,20 @@
+import { CappingTypes } from '../types';
+export const getCappingOption = (enabled, ignoreGlobalCapping) => {
+  if (enabled) {
+    return CappingTypes.CUSTOM;
+  }
+  if (ignoreGlobalCapping) {
+    return CappingTypes.IGNORE;
+  }
+  return CappingTypes.GLOBAL;
+};
+export const getCappingOptions = isGlobalCappingDisabled => [{
+  value: CappingTypes.GLOBAL,
+  label: `Use global frequency capping settings${isGlobalCappingDisabled ? ' (currently inactive)' : ''}`
+}, {
+  value: CappingTypes.IGNORE,
+  label: 'Send messages without global frequency capping'
+}, {
+  value: CappingTypes.CUSTOM,
+  label: 'Use custom frequency capping'
+}];

package/FrequencyCapping/helpers/getReadonlyCappingHelpers.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { type CappingBase, CappingTypes } from '../types';
+export declare function getReadonlyCappingIcon(cappingOption: CappingTypes, isGlobalCappingDisabled: boolean): React.JSX.Element;
+export declare function getReadonlyCappingLabel<T extends CappingBase>(cappingOption: CappingTypes, isGlobalCappingDisabled: boolean, capping: T, globalCapping: {
+    count: number;
+    days: number;
+}): React.JSX.Element;

package/FrequencyCapping/helpers/getReadonlyCappingHelpers.js

@@ -0,0 +1,79 @@
+import React from 'react';
+import { Color } from '@pushwoosh/kit-constants';
+import { Horizontal } from '@pushwoosh/kit-helpers';
+import { CheckRoundIcon, CloseRoundIcon, HelpRoundIcon } from '@pushwoosh/kit-icons';
+import { Paragraph } from '@pushwoosh/kit-typography';
+import { Tooltip } from '../../Tooltip';
+import { Condition } from '../components/Condition';
+import { IconWrapper } from '../styles';
+import { CappingTypes } from '../types';
+export function getReadonlyCappingIcon(cappingOption, isGlobalCappingDisabled) {
+  if (cappingOption === CappingTypes.GLOBAL && isGlobalCappingDisabled) {
+    return React.createElement(CloseRoundIcon, {
+      size: "small",
+      view: "filled",
+      color: Color.LOCKED
+    });
+    ;
+  }
+  return React.createElement(CheckRoundIcon, {
+    size: "small",
+    view: "filled",
+    type: "fill",
+    color: Color.BRIGHT
+  });
+}
+export function getReadonlyCappingLabel(cappingOption, isGlobalCappingDisabled, capping, globalCapping) {
+  const tooltip = getReadonlyTooltip(cappingOption, isGlobalCappingDisabled);
+  if (cappingOption === CappingTypes.CUSTOM) {
+    return React.createElement(Paragraph, null, "Custom frequency capping for this message:", React.createElement(Condition, {
+      messages: capping.messages,
+      days: capping.days,
+      tooltip: tooltip
+    }));
+  }
+  if (cappingOption === CappingTypes.IGNORE) {
+    return React.createElement(Horizontal, {
+      "$alignItems": "center",
+      "$gap": 4,
+      "$justifyContent": "start"
+    }, "Send messages without global frequency capping", React.createElement(Tooltip, {
+      content: tooltip,
+      position: "top-middle"
+    }, React.createElement(IconWrapper, {
+      "$padding": "4px 0"
+    }, React.createElement(HelpRoundIcon, {
+      size: "small",
+      view: "lined"
+    }))));
+  }
+  return isGlobalCappingDisabled ? React.createElement(Horizontal, {
+    "$alignItems": "center",
+    "$gap": 4,
+    "$justifyContent": "start"
+  }, "Global frequency capping is not active for this channel", React.createElement(Tooltip, {
+    content: tooltip,
+    position: "top-middle"
+  }, React.createElement(IconWrapper, {
+    "$padding": "4px 0"
+  }, React.createElement(HelpRoundIcon, {
+    size: "small",
+    view: "lined"
+  })))) : React.createElement(Paragraph, null, "Global frequency capping:", React.createElement(Condition, {
+    messages: globalCapping.count,
+    days: globalCapping.days,
+    tooltip: tooltip
+  }));
+}
+function getReadonlyTooltip(cappingOption, isGlobalCappingDisabled) {
+  if (cappingOption === CappingTypes.CUSTOM) {
+    return 'If the subscriber exceeds the limit of received messages, they will not receive this message and will proceed to the next step';
+  }
+  if (cappingOption === CappingTypes.IGNORE) {
+    return 'The user will receive this message regardless, even if they have exceeded the set limits for the channel';
+  }
+  if (isGlobalCappingDisabled) {
+    return 'Messages will be sent without global limits because capping is currently not active for this channel';
+  }
+  return 'If the subscriber exceeds the limit of received messages, they will not receive this message and will proceed to the next step';
+}

package/FrequencyCapping/index.d.ts

@@ -0,0 +1,3 @@
+export { FrequencyCappingEdit } from './FrequencyCappingEdit';
+export { FrequencyCappingReadonly } from './FrequencyCappingReadonly';
+export type { FrequencyCappingEditProps, FrequencyCappingReadonlyProps, CappingBase as LocalCapping } from './types';

package/FrequencyCapping/index.js

@@ -0,0 +1,2 @@
+export { FrequencyCappingEdit } from './FrequencyCappingEdit';
+export { FrequencyCappingReadonly } from './FrequencyCappingReadonly';

package/FrequencyCapping/styles.d.ts

@@ -0,0 +1,113 @@
+export declare const Container: 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">;
+export declare const IconWrapper: 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">;
+export declare const LinkWrapper: import("styled-components").StyledComponent<"span", any, {}, never>;

package/FrequencyCapping/styles.js

@@ -0,0 +1,15 @@
+import styled from 'styled-components';
+import { Color } from '@pushwoosh/kit-constants';
+import { Horizontal, Vertical } from '@pushwoosh/kit-helpers';
+export const Container = styled(Vertical).withConfig({
+  displayName: "Container",
+  componentId: "sc-1z3915-0"
+})(["max-width:560px;"]);
+export const IconWrapper = styled(Horizontal).withConfig({
+  displayName: "IconWrapper",
+  componentId: "sc-1z3915-1"
+})(["color:", ";&:hover{color:", ";cursor:pointer;}"], Color.PHANTOM, Color.PRIMARY_HOVER);
+export const LinkWrapper = styled.span.withConfig({
+  displayName: "LinkWrapper",
+  componentId: "sc-1z3915-2"
+})(["display:inline-flex;gap:4px;align-items:center;justify-content:start;text-decoration:none;"]);

package/FrequencyCapping/types.d.ts

@@ -0,0 +1,32 @@
+export declare enum CappingTypes {
+    GLOBAL = "global",
+    IGNORE = "ignore",
+    CUSTOM = "custom"
+}
+export type CappingOption = {
+    label: string;
+    value: CappingTypes;
+};
+export type CappingBase = {
+    enabled: boolean;
+    messages: number;
+    days: number;
+    ignoreGlobalCapping: boolean;
+};
+export type FrequencyCappingEditProps<T extends CappingBase> = {
+    capping: T;
+    globalCapping: {
+        count: number;
+        days: number;
+    };
+    onChange: (newCappingState: T) => void;
+    applicationCode: string;
+};
+export type FrequencyCappingReadonlyProps<T extends CappingBase> = {
+    capping: T;
+    globalCapping: {
+        count: number;
+        days: number;
+    };
+    applicationCode: string;
+};

package/FrequencyCapping/types.js

@@ -0,0 +1,6 @@
+export var CappingTypes;
+(function (CappingTypes) {
+  CappingTypes["GLOBAL"] = "global";
+  CappingTypes["IGNORE"] = "ignore";
+  CappingTypes["CUSTOM"] = "custom";
+})(CappingTypes || (CappingTypes = {}));

package/SendRate/SendRateEdit.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+import { type SendRateBase } from './types';
+export type SendRateEditProps<T extends SendRateBase> = {
+    sendRate: T;
+    globalSendRate: {
+        count: number;
+        seconds: number;
+    };
+    onChange: (newSendRateState: T) => void;
+    applicationCode: string;
+    minValue: number;
+    maxValue: number;
+};
+export declare function SendRateEdit<T extends SendRateBase>({ sendRate, globalSendRate, onChange, applicationCode, minValue, maxValue }: SendRateEditProps<T>): React.JSX.Element;