@elliemae/ds-notification-badge 2.3.1-rc.2 → 3.0.0-alpha.2

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.
@@ -0,0 +1,91 @@
1
+ var __create = Object.create;
2
+ var __defProp = Object.defineProperty;
3
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
+ var __getOwnPropNames = Object.getOwnPropertyNames;
5
+ var __getOwnPropSymbols = Object.getOwnPropertySymbols;
6
+ var __getProtoOf = Object.getPrototypeOf;
7
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
8
+ var __propIsEnum = Object.prototype.propertyIsEnumerable;
9
+ var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
10
+ var __spreadValues = (a, b) => {
11
+ for (var prop in b || (b = {}))
12
+ if (__hasOwnProp.call(b, prop))
13
+ __defNormalProp(a, prop, b[prop]);
14
+ if (__getOwnPropSymbols)
15
+ for (var prop of __getOwnPropSymbols(b)) {
16
+ if (__propIsEnum.call(b, prop))
17
+ __defNormalProp(a, prop, b[prop]);
18
+ }
19
+ return a;
20
+ };
21
+ var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
22
+ var __export = (target, all) => {
23
+ for (var name in all)
24
+ __defProp(target, name, { get: all[name], enumerable: true });
25
+ };
26
+ var __reExport = (target, module2, copyDefault, desc) => {
27
+ if (module2 && typeof module2 === "object" || typeof module2 === "function") {
28
+ for (let key of __getOwnPropNames(module2))
29
+ if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
30
+ __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
31
+ }
32
+ return target;
33
+ };
34
+ var __toESM = (module2, isNodeMode) => {
35
+ return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
36
+ };
37
+ var __toCommonJS = /* @__PURE__ */ ((cache) => {
38
+ return (module2, temp) => {
39
+ return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
40
+ };
41
+ })(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
42
+ var NotificationBadge_exports = {};
43
+ __export(NotificationBadge_exports, {
44
+ NotificationBadge: () => NotificationBadge,
45
+ NotificationBadgeWithSchema: () => NotificationBadgeWithSchema
46
+ });
47
+ var React = __toESM(require("react"));
48
+ var import_react = __toESM(require("react"));
49
+ var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
50
+ var import_react_desc_prop_types = require("./react-desc-prop-types");
51
+ var import_style = require("./style");
52
+ const NotificationBadge = (props) => {
53
+ const propsWithDefaults = (0, import_ds_props_helpers.useMemoMergePropsWithDefault)(props, import_react_desc_prop_types.defaultProps);
54
+ (0, import_ds_props_helpers.useValidateTypescriptPropTypes)(propsWithDefaults, import_react_desc_prop_types.NotificationBadgePropTypes);
55
+ const globalAttributes = (0, import_ds_props_helpers.useGetGlobalAttributes)(propsWithDefaults);
56
+ const { type, color, value, size, disabled, position, Component } = propsWithDefaults;
57
+ const Badge = type === "number" ? import_style.NumericBadge : import_style.DotBadge;
58
+ const relatedComponentRef = (0, import_react.useRef)(null);
59
+ const renderBadge = relatedComponentRef?.current || !Component;
60
+ const [relatedComponentHeight, setRelatedComponentHeight] = (0, import_react.useState)(0);
61
+ const [relatedComponentWidth, setRelatedComponentWidth] = (0, import_react.useState)(0);
62
+ (0, import_react.useEffect)(() => {
63
+ const relatedComponent = relatedComponentRef?.current;
64
+ setRelatedComponentHeight(relatedComponent?.offsetHeight || 0);
65
+ setRelatedComponentWidth(relatedComponent?.offsetWidth || 0);
66
+ }, [relatedComponentRef]);
67
+ let top = 0;
68
+ let right = 0;
69
+ let left = 0;
70
+ if (position === "right")
71
+ left = relatedComponentWidth / 2;
72
+ if (position === "left")
73
+ right = relatedComponentWidth / 2;
74
+ top = relatedComponentHeight / 2;
75
+ return /* @__PURE__ */ import_react.default.createElement(import_style.Wrapper, __spreadValues({}, globalAttributes), renderBadge && /* @__PURE__ */ import_react.default.createElement(Badge, {
76
+ color,
77
+ size,
78
+ value,
79
+ disabled,
80
+ top,
81
+ left,
82
+ right
83
+ }, type === "number" && value), Component && /* @__PURE__ */ import_react.default.createElement(Component, {
84
+ innerRef: relatedComponentRef
85
+ }));
86
+ };
87
+ NotificationBadge.propTypes = import_react_desc_prop_types.NotificationBadgePropTypes;
88
+ const NotificationBadgeWithSchema = (0, import_ds_props_helpers.describe)(NotificationBadge);
89
+ NotificationBadgeWithSchema.propTypes = import_react_desc_prop_types.NotificationBadgePropTypes;
90
+ module.exports = __toCommonJS(NotificationBadge_exports);
91
+ //# sourceMappingURL=NotificationBadge.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/NotificationBadge.tsx", "../../../../scripts/build/transpile/react-shim.js"],
4
+ "sourcesContent": ["import React, { useState, useEffect, useRef, WeakValidationMap } from 'react';\nimport {\n useMemoMergePropsWithDefault,\n useValidateTypescriptPropTypes,\n describe,\n useGetGlobalAttributes,\n} from '@elliemae/ds-props-helpers';\n\nimport { NotificationBadgePropTypes, DSNotificationBadgeT, defaultProps } from './react-desc-prop-types';\nimport { Wrapper, NumericBadge, DotBadge } from './style';\n\nconst NotificationBadge: React.ComponentType<DSNotificationBadgeT.Props> = (props) => {\n const propsWithDefaults = useMemoMergePropsWithDefault(props, defaultProps);\n useValidateTypescriptPropTypes<DSNotificationBadgeT.Props>(propsWithDefaults, NotificationBadgePropTypes);\n const globalAttributes = useGetGlobalAttributes(propsWithDefaults);\n\n const { type, color, value, size, disabled, position, Component } = propsWithDefaults;\n\n const Badge = type === 'number' ? NumericBadge : DotBadge;\n const relatedComponentRef = useRef<HTMLSpanElement>(null);\n const renderBadge = relatedComponentRef?.current || !Component;\n const [relatedComponentHeight, setRelatedComponentHeight] = useState(0);\n const [relatedComponentWidth, setRelatedComponentWidth] = useState(0);\n\n useEffect(() => {\n const relatedComponent = relatedComponentRef?.current;\n setRelatedComponentHeight(relatedComponent?.offsetHeight || 0);\n setRelatedComponentWidth(relatedComponent?.offsetWidth || 0);\n }, [relatedComponentRef]);\n\n let top = 0;\n let right = 0;\n let left = 0;\n\n if (position === 'right') left = relatedComponentWidth / 2;\n if (position === 'left') right = relatedComponentWidth / 2;\n top = relatedComponentHeight / 2;\n\n return (\n <Wrapper {...globalAttributes}>\n {renderBadge && (\n <Badge color={color} size={size} value={value} disabled={disabled} top={top} left={left} right={right}>\n {type === 'number' && value}\n </Badge>\n )}\n {Component && <Component innerRef={relatedComponentRef} />}\n </Wrapper>\n );\n};\n\nNotificationBadge.propTypes = NotificationBadgePropTypes as WeakValidationMap<unknown>;\nconst NotificationBadgeWithSchema = describe(NotificationBadge);\nNotificationBadgeWithSchema.propTypes = NotificationBadgePropTypes as WeakValidationMap<unknown>;\n\nexport { NotificationBadge, NotificationBadgeWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAsE;AACtE,8BAKO;AAEP,mCAA+E;AAC/E,mBAAgD;AAEhD,MAAM,oBAAqE,CAAC,UAAU;AACpF,QAAM,oBAAoB,0DAA6B,OAAO;AAC9D,8DAA2D,mBAAmB;AAC9E,QAAM,mBAAmB,oDAAuB;AAEhD,QAAM,EAAE,MAAM,OAAO,OAAO,MAAM,UAAU,UAAU,cAAc;AAEpE,QAAM,QAAQ,SAAS,WAAW,4BAAe;AACjD,QAAM,sBAAsB,yBAAwB;AACpD,QAAM,cAAc,qBAAqB,WAAW,CAAC;AACrD,QAAM,CAAC,wBAAwB,6BAA6B,2BAAS;AACrE,QAAM,CAAC,uBAAuB,4BAA4B,2BAAS;AAEnE,8BAAU,MAAM;AACd,UAAM,mBAAmB,qBAAqB;AAC9C,8BAA0B,kBAAkB,gBAAgB;AAC5D,6BAAyB,kBAAkB,eAAe;AAAA,KACzD,CAAC;AAEJ,MAAI,MAAM;AACV,MAAI,QAAQ;AACZ,MAAI,OAAO;AAEX,MAAI,aAAa;AAAS,WAAO,wBAAwB;AACzD,MAAI,aAAa;AAAQ,YAAQ,wBAAwB;AACzD,QAAM,yBAAyB;AAE/B,SACE,mDAAC,sBAAD,mBAAa,mBACV,eACC,mDAAC,OAAD;AAAA,IAAO;AAAA,IAAc;AAAA,IAAY;AAAA,IAAc;AAAA,IAAoB;AAAA,IAAU;AAAA,IAAY;AAAA,KACtF,SAAS,YAAY,QAGzB,aAAa,mDAAC,WAAD;AAAA,IAAW,UAAU;AAAA;AAAA;AAKzC,kBAAkB,YAAY;AAC9B,MAAM,8BAA8B,sCAAS;AAC7C,4BAA4B,YAAY;",
6
+ "names": []
7
+ }
@@ -0,0 +1,36 @@
1
+ var __create = Object.create;
2
+ var __defProp = Object.defineProperty;
3
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
+ var __getOwnPropNames = Object.getOwnPropertyNames;
5
+ var __getProtoOf = Object.getPrototypeOf;
6
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
7
+ var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
8
+ var __export = (target, all) => {
9
+ for (var name in all)
10
+ __defProp(target, name, { get: all[name], enumerable: true });
11
+ };
12
+ var __reExport = (target, module2, copyDefault, desc) => {
13
+ if (module2 && typeof module2 === "object" || typeof module2 === "function") {
14
+ for (let key of __getOwnPropNames(module2))
15
+ if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
16
+ __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
17
+ }
18
+ return target;
19
+ };
20
+ var __toESM = (module2, isNodeMode) => {
21
+ return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
22
+ };
23
+ var __toCommonJS = /* @__PURE__ */ ((cache) => {
24
+ return (module2, temp) => {
25
+ return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
26
+ };
27
+ })(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
28
+ var src_exports = {};
29
+ __export(src_exports, {
30
+ default: () => import_NotificationBadge.NotificationBadge
31
+ });
32
+ var React = __toESM(require("react"));
33
+ __reExport(src_exports, require("./NotificationBadge"));
34
+ var import_NotificationBadge = require("./NotificationBadge");
35
+ module.exports = __toCommonJS(src_exports);
36
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/index.tsx", "../../../../scripts/build/transpile/react-shim.js"],
4
+ "sourcesContent": ["export * from './NotificationBadge';\nexport { NotificationBadge as default } from './NotificationBadge';\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,wBAAc;AACd,+BAA6C;",
6
+ "names": []
7
+ }
@@ -0,0 +1,71 @@
1
+ var __create = Object.create;
2
+ var __defProp = Object.defineProperty;
3
+ var __defProps = Object.defineProperties;
4
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
+ var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
6
+ var __getOwnPropNames = Object.getOwnPropertyNames;
7
+ var __getOwnPropSymbols = Object.getOwnPropertySymbols;
8
+ var __getProtoOf = Object.getPrototypeOf;
9
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
10
+ var __propIsEnum = Object.prototype.propertyIsEnumerable;
11
+ var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
12
+ var __spreadValues = (a, b) => {
13
+ for (var prop in b || (b = {}))
14
+ if (__hasOwnProp.call(b, prop))
15
+ __defNormalProp(a, prop, b[prop]);
16
+ if (__getOwnPropSymbols)
17
+ for (var prop of __getOwnPropSymbols(b)) {
18
+ if (__propIsEnum.call(b, prop))
19
+ __defNormalProp(a, prop, b[prop]);
20
+ }
21
+ return a;
22
+ };
23
+ var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
24
+ var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
25
+ var __export = (target, all) => {
26
+ for (var name in all)
27
+ __defProp(target, name, { get: all[name], enumerable: true });
28
+ };
29
+ var __reExport = (target, module2, copyDefault, desc) => {
30
+ if (module2 && typeof module2 === "object" || typeof module2 === "function") {
31
+ for (let key of __getOwnPropNames(module2))
32
+ if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
33
+ __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
34
+ }
35
+ return target;
36
+ };
37
+ var __toESM = (module2, isNodeMode) => {
38
+ return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
39
+ };
40
+ var __toCommonJS = /* @__PURE__ */ ((cache) => {
41
+ return (module2, temp) => {
42
+ return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
43
+ };
44
+ })(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
45
+ var react_desc_prop_types_exports = {};
46
+ __export(react_desc_prop_types_exports, {
47
+ NotificationBadgePropTypes: () => NotificationBadgePropTypes,
48
+ defaultProps: () => defaultProps
49
+ });
50
+ var React = __toESM(require("react"));
51
+ var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
52
+ const defaultProps = {
53
+ type: "number",
54
+ size: "s",
55
+ disabled: false,
56
+ position: "right",
57
+ color: void 0,
58
+ Component: void 0,
59
+ value: void 0
60
+ };
61
+ const NotificationBadgePropTypes = __spreadProps(__spreadValues({}, import_ds_props_helpers.globalAttributesPropTypes), {
62
+ type: import_ds_props_helpers.PropTypes.oneOf(["number", "dot"]).description("type of badge: number or dot"),
63
+ value: import_ds_props_helpers.PropTypes.number.description("value of the numeric badge"),
64
+ size: import_ds_props_helpers.PropTypes.oneOf(["s", "l"]).description("size of the badge: s or l"),
65
+ disabled: import_ds_props_helpers.PropTypes.bool.description("whether the badge is disabled"),
66
+ position: import_ds_props_helpers.PropTypes.oneOf(["left", "right"]).description("position of the badge with the related component"),
67
+ Component: import_ds_props_helpers.PropTypes.func.description("Related component"),
68
+ color: import_ds_props_helpers.PropTypes.string.description("Badge background color value")
69
+ });
70
+ module.exports = __toCommonJS(react_desc_prop_types_exports);
71
+ //# sourceMappingURL=react-desc-prop-types.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/react-desc-prop-types.tsx", "../../../../scripts/build/transpile/react-shim.js"],
4
+ "sourcesContent": ["import { PropTypes, globalAttributesPropTypes } from '@elliemae/ds-props-helpers';\n\nexport declare namespace DSNotificationBadgeT {\n interface ComponentT {\n innerRef: React.RefObject<HTMLSpanElement>;\n }\n\n export interface Props {\n [property: string]: unknown;\n type?: string;\n value?: number;\n size?: string;\n disabled?: boolean;\n position?: string;\n Component?: (propsT: ComponentT) => JSX.Element;\n color?: string;\n }\n}\n\nexport const defaultProps: DSNotificationBadgeT.Props = {\n type: 'number',\n size: 's',\n disabled: false,\n position: 'right',\n color: undefined,\n Component: undefined,\n value: undefined,\n};\n\nexport const NotificationBadgePropTypes = {\n ...globalAttributesPropTypes,\n type: PropTypes.oneOf(['number', 'dot']).description('type of badge: number or dot'),\n value: PropTypes.number.description('value of the numeric badge'),\n size: PropTypes.oneOf(['s', 'l']).description('size of the badge: s or l'),\n disabled: PropTypes.bool.description('whether the badge is disabled'),\n position: PropTypes.oneOf(['left', 'right']).description('position of the badge with the related component'),\n Component: PropTypes.func.description('Related component'),\n color: PropTypes.string.description('Badge background color value'),\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,8BAAqD;AAmB9C,MAAM,eAA2C;AAAA,EACtD,MAAM;AAAA,EACN,MAAM;AAAA,EACN,UAAU;AAAA,EACV,UAAU;AAAA,EACV,OAAO;AAAA,EACP,WAAW;AAAA,EACX,OAAO;AAAA;AAGF,MAAM,6BAA6B,iCACrC,oDADqC;AAAA,EAExC,MAAM,kCAAU,MAAM,CAAC,UAAU,QAAQ,YAAY;AAAA,EACrD,OAAO,kCAAU,OAAO,YAAY;AAAA,EACpC,MAAM,kCAAU,MAAM,CAAC,KAAK,MAAM,YAAY;AAAA,EAC9C,UAAU,kCAAU,KAAK,YAAY;AAAA,EACrC,UAAU,kCAAU,MAAM,CAAC,QAAQ,UAAU,YAAY;AAAA,EACzD,WAAW,kCAAU,KAAK,YAAY;AAAA,EACtC,OAAO,kCAAU,OAAO,YAAY;AAAA;",
6
+ "names": []
7
+ }
@@ -0,0 +1,80 @@
1
+ var __create = Object.create;
2
+ var __defProp = Object.defineProperty;
3
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
+ var __getOwnPropNames = Object.getOwnPropertyNames;
5
+ var __getProtoOf = Object.getPrototypeOf;
6
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
7
+ var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
8
+ var __export = (target, all) => {
9
+ for (var name in all)
10
+ __defProp(target, name, { get: all[name], enumerable: true });
11
+ };
12
+ var __reExport = (target, module2, copyDefault, desc) => {
13
+ if (module2 && typeof module2 === "object" || typeof module2 === "function") {
14
+ for (let key of __getOwnPropNames(module2))
15
+ if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
16
+ __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
17
+ }
18
+ return target;
19
+ };
20
+ var __toESM = (module2, isNodeMode) => {
21
+ return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
22
+ };
23
+ var __toCommonJS = /* @__PURE__ */ ((cache) => {
24
+ return (module2, temp) => {
25
+ return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
26
+ };
27
+ })(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
28
+ var style_exports = {};
29
+ __export(style_exports, {
30
+ DotBadge: () => DotBadge,
31
+ GenericBadge: () => GenericBadge,
32
+ NumericBadge: () => NumericBadge,
33
+ Wrapper: () => Wrapper
34
+ });
35
+ var React = __toESM(require("react"));
36
+ var import_styled_components = __toESM(require("styled-components"));
37
+ const Wrapper = import_styled_components.default.div`
38
+ display: flex;
39
+ flex-direction: column;
40
+ justify-content: center;
41
+ align-items: center;
42
+ width: fit-content;
43
+ `;
44
+ const GenericBadge = import_styled_components.default.span`
45
+ position: relative;
46
+ top: ${({ top }) => top ? `${top}px` : "unset"};
47
+ left: ${({ left }) => left ? `${left}px` : "unset"};
48
+ right: ${({ right }) => right ? `${right}px` : "unset"};
49
+ `;
50
+ const NumericBadge = (0, import_styled_components.default)(GenericBadge)`
51
+ display: flex;
52
+ justify-content: center;
53
+ align-items: center;
54
+ width: fit-content;
55
+ color: #fff;
56
+ padding: ${({ value }) => value && value > 9 ? "0 5px" : "0"};
57
+ padding-top: 2px;
58
+ background-color: ${({ disabled, color, theme }) => disabled ? theme.colors.neutral["500"] : color || theme.colors.danger["900"]};
59
+ border-radius: ${({ value }) => value && value > 9 ? "10px" : "50%"};
60
+ font-size: ${({ size }) => size === "l" ? "16px" : "12px"};
61
+ font-weight: ${({ size }) => size === "l" ? "400" : "600"};
62
+ height: ${({ size }) => size === "l" ? "21px" : "15px"};
63
+ min-width: ${({ size, value }) => {
64
+ if (size === "l" && value && value > 9)
65
+ return "30px";
66
+ if (size === "l" && value && value <= 9)
67
+ return "21px";
68
+ if (size === "s" && value && value > 9)
69
+ return "21px";
70
+ return "15px";
71
+ }};
72
+ `;
73
+ const DotBadge = (0, import_styled_components.default)(GenericBadge)`
74
+ background-color: ${({ disabled, theme, color }) => disabled ? theme.colors.neutral["500"] : color || theme.colors.brand[500]};
75
+ width: ${({ size }) => size === "l" ? "15px" : "10px"};
76
+ height: ${({ size }) => size === "l" ? "15px" : "10px"};
77
+ border-radius: 100%;
78
+ `;
79
+ module.exports = __toCommonJS(style_exports);
80
+ //# sourceMappingURL=style.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/style.tsx", "../../../../scripts/build/transpile/react-shim.js"],
4
+ "sourcesContent": ["import styled from 'styled-components';\nimport { DSNotificationBadgeT } from './react-desc-prop-types';\n\ninterface StyledGenericBadgeT {\n top: number;\n left: number;\n right: number;\n}\n\nexport const Wrapper = styled.div`\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n width: fit-content;\n`;\n\nexport const GenericBadge = styled.span<DSNotificationBadgeT.Props & StyledGenericBadgeT>`\n position: relative;\n top: ${({ top }) => (top ? `${top}px` : 'unset')};\n left: ${({ left }) => (left ? `${left}px` : 'unset')};\n right: ${({ right }) => (right ? `${right}px` : 'unset')};\n`;\n\nexport const NumericBadge = styled(GenericBadge)<{\n top: number;\n left: number;\n right: number;\n size?: string;\n disabled?: boolean;\n value?: number;\n color?: string;\n}>`\n display: flex;\n justify-content: center;\n align-items: center;\n width: fit-content;\n color: #fff;\n padding: ${({ value }) => (value && value > 9 ? '0 5px' : '0')};\n padding-top: 2px;\n background-color: ${({ disabled, color, theme }) =>\n disabled ? theme.colors.neutral['500'] : color || theme.colors.danger['900']};\n border-radius: ${({ value }) => (value && value > 9 ? '10px' : '50%')};\n font-size: ${({ size }) => (size === 'l' ? '16px' : '12px')};\n font-weight: ${({ size }) => (size === 'l' ? '400' : '600')};\n height: ${({ size }) => (size === 'l' ? '21px' : '15px')};\n min-width: ${({ size, value }) => {\n if (size === 'l' && value && value > 9) return '30px';\n if (size === 'l' && value && value <= 9) return '21px';\n if (size === 's' && value && value > 9) return '21px';\n return '15px';\n }};\n`;\n\nexport const DotBadge = styled(GenericBadge)<DSNotificationBadgeT.Props>`\n background-color: ${({ disabled, theme, color }) =>\n disabled ? theme.colors.neutral['500'] : color || theme.colors.brand[500]};\n width: ${({ size }) => (size === 'l' ? '15px' : '10px')};\n height: ${({ size }) => (size === 'l' ? '15px' : '10px')};\n border-radius: 100%;\n`;\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,+BAAmB;AASZ,MAAM,UAAU,iCAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQvB,MAAM,eAAe,iCAAO;AAAA;AAAA,SAE1B,CAAC,EAAE,UAAW,MAAM,GAAG,UAAU;AAAA,UAChC,CAAC,EAAE,WAAY,OAAO,GAAG,WAAW;AAAA,WACnC,CAAC,EAAE,YAAa,QAAQ,GAAG,YAAY;AAAA;AAG3C,MAAM,eAAe,sCAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,aActB,CAAC,EAAE,YAAa,SAAS,QAAQ,IAAI,UAAU;AAAA;AAAA,sBAEtC,CAAC,EAAE,UAAU,OAAO,YACtC,WAAW,MAAM,OAAO,QAAQ,SAAS,SAAS,MAAM,OAAO,OAAO;AAAA,mBACvD,CAAC,EAAE,YAAa,SAAS,QAAQ,IAAI,SAAS;AAAA,eAClD,CAAC,EAAE,WAAY,SAAS,MAAM,SAAS;AAAA,iBACrC,CAAC,EAAE,WAAY,SAAS,MAAM,QAAQ;AAAA,YAC3C,CAAC,EAAE,WAAY,SAAS,MAAM,SAAS;AAAA,eACpC,CAAC,EAAE,MAAM,YAAY;AAChC,MAAI,SAAS,OAAO,SAAS,QAAQ;AAAG,WAAO;AAC/C,MAAI,SAAS,OAAO,SAAS,SAAS;AAAG,WAAO;AAChD,MAAI,SAAS,OAAO,SAAS,QAAQ;AAAG,WAAO;AAC/C,SAAO;AAAA;AAAA;AAIJ,MAAM,WAAW,sCAAO;AAAA,sBACT,CAAC,EAAE,UAAU,OAAO,YACtC,WAAW,MAAM,OAAO,QAAQ,SAAS,SAAS,MAAM,OAAO,MAAM;AAAA,WAC9D,CAAC,EAAE,WAAY,SAAS,MAAM,SAAS;AAAA,YACtC,CAAC,EAAE,WAAY,SAAS,MAAM,SAAS;AAAA;AAAA;",
6
+ "names": []
7
+ }
@@ -0,0 +1,69 @@
1
+ var __defProp = Object.defineProperty;
2
+ var __getOwnPropSymbols = Object.getOwnPropertySymbols;
3
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
4
+ var __propIsEnum = Object.prototype.propertyIsEnumerable;
5
+ var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
6
+ var __spreadValues = (a, b) => {
7
+ for (var prop in b || (b = {}))
8
+ if (__hasOwnProp.call(b, prop))
9
+ __defNormalProp(a, prop, b[prop]);
10
+ if (__getOwnPropSymbols)
11
+ for (var prop of __getOwnPropSymbols(b)) {
12
+ if (__propIsEnum.call(b, prop))
13
+ __defNormalProp(a, prop, b[prop]);
14
+ }
15
+ return a;
16
+ };
17
+ import * as React from "react";
18
+ import React2, { useState, useEffect, useRef } from "react";
19
+ import {
20
+ useMemoMergePropsWithDefault,
21
+ useValidateTypescriptPropTypes,
22
+ describe,
23
+ useGetGlobalAttributes
24
+ } from "@elliemae/ds-props-helpers";
25
+ import { NotificationBadgePropTypes, defaultProps } from "./react-desc-prop-types";
26
+ import { Wrapper, NumericBadge, DotBadge } from "./style";
27
+ const NotificationBadge = (props) => {
28
+ const propsWithDefaults = useMemoMergePropsWithDefault(props, defaultProps);
29
+ useValidateTypescriptPropTypes(propsWithDefaults, NotificationBadgePropTypes);
30
+ const globalAttributes = useGetGlobalAttributes(propsWithDefaults);
31
+ const { type, color, value, size, disabled, position, Component } = propsWithDefaults;
32
+ const Badge = type === "number" ? NumericBadge : DotBadge;
33
+ const relatedComponentRef = useRef(null);
34
+ const renderBadge = relatedComponentRef?.current || !Component;
35
+ const [relatedComponentHeight, setRelatedComponentHeight] = useState(0);
36
+ const [relatedComponentWidth, setRelatedComponentWidth] = useState(0);
37
+ useEffect(() => {
38
+ const relatedComponent = relatedComponentRef?.current;
39
+ setRelatedComponentHeight(relatedComponent?.offsetHeight || 0);
40
+ setRelatedComponentWidth(relatedComponent?.offsetWidth || 0);
41
+ }, [relatedComponentRef]);
42
+ let top = 0;
43
+ let right = 0;
44
+ let left = 0;
45
+ if (position === "right")
46
+ left = relatedComponentWidth / 2;
47
+ if (position === "left")
48
+ right = relatedComponentWidth / 2;
49
+ top = relatedComponentHeight / 2;
50
+ return /* @__PURE__ */ React2.createElement(Wrapper, __spreadValues({}, globalAttributes), renderBadge && /* @__PURE__ */ React2.createElement(Badge, {
51
+ color,
52
+ size,
53
+ value,
54
+ disabled,
55
+ top,
56
+ left,
57
+ right
58
+ }, type === "number" && value), Component && /* @__PURE__ */ React2.createElement(Component, {
59
+ innerRef: relatedComponentRef
60
+ }));
61
+ };
62
+ NotificationBadge.propTypes = NotificationBadgePropTypes;
63
+ const NotificationBadgeWithSchema = describe(NotificationBadge);
64
+ NotificationBadgeWithSchema.propTypes = NotificationBadgePropTypes;
65
+ export {
66
+ NotificationBadge,
67
+ NotificationBadgeWithSchema
68
+ };
69
+ //# sourceMappingURL=NotificationBadge.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/NotificationBadge.tsx"],
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useState, useEffect, useRef, WeakValidationMap } from 'react';\nimport {\n useMemoMergePropsWithDefault,\n useValidateTypescriptPropTypes,\n describe,\n useGetGlobalAttributes,\n} from '@elliemae/ds-props-helpers';\n\nimport { NotificationBadgePropTypes, DSNotificationBadgeT, defaultProps } from './react-desc-prop-types';\nimport { Wrapper, NumericBadge, DotBadge } from './style';\n\nconst NotificationBadge: React.ComponentType<DSNotificationBadgeT.Props> = (props) => {\n const propsWithDefaults = useMemoMergePropsWithDefault(props, defaultProps);\n useValidateTypescriptPropTypes<DSNotificationBadgeT.Props>(propsWithDefaults, NotificationBadgePropTypes);\n const globalAttributes = useGetGlobalAttributes(propsWithDefaults);\n\n const { type, color, value, size, disabled, position, Component } = propsWithDefaults;\n\n const Badge = type === 'number' ? NumericBadge : DotBadge;\n const relatedComponentRef = useRef<HTMLSpanElement>(null);\n const renderBadge = relatedComponentRef?.current || !Component;\n const [relatedComponentHeight, setRelatedComponentHeight] = useState(0);\n const [relatedComponentWidth, setRelatedComponentWidth] = useState(0);\n\n useEffect(() => {\n const relatedComponent = relatedComponentRef?.current;\n setRelatedComponentHeight(relatedComponent?.offsetHeight || 0);\n setRelatedComponentWidth(relatedComponent?.offsetWidth || 0);\n }, [relatedComponentRef]);\n\n let top = 0;\n let right = 0;\n let left = 0;\n\n if (position === 'right') left = relatedComponentWidth / 2;\n if (position === 'left') right = relatedComponentWidth / 2;\n top = relatedComponentHeight / 2;\n\n return (\n <Wrapper {...globalAttributes}>\n {renderBadge && (\n <Badge color={color} size={size} value={value} disabled={disabled} top={top} left={left} right={right}>\n {type === 'number' && value}\n </Badge>\n )}\n {Component && <Component innerRef={relatedComponentRef} />}\n </Wrapper>\n );\n};\n\nNotificationBadge.propTypes = NotificationBadgePropTypes as WeakValidationMap<unknown>;\nconst NotificationBadgeWithSchema = describe(NotificationBadge);\nNotificationBadgeWithSchema.propTypes = NotificationBadgePropTypes as WeakValidationMap<unknown>;\n\nexport { NotificationBadge, NotificationBadgeWithSchema };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;AAAA;ACAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAOA;AACA;AAEA,MAAM,oBAAqE,CAAC,UAAU;AACpF,QAAM,oBAAoB,6BAA6B,OAAO;AAC9D,iCAA2D,mBAAmB;AAC9E,QAAM,mBAAmB,uBAAuB;AAEhD,QAAM,EAAE,MAAM,OAAO,OAAO,MAAM,UAAU,UAAU,cAAc;AAEpE,QAAM,QAAQ,SAAS,WAAW,eAAe;AACjD,QAAM,sBAAsB,OAAwB;AACpD,QAAM,cAAc,qBAAqB,WAAW,CAAC;AACrD,QAAM,CAAC,wBAAwB,6BAA6B,SAAS;AACrE,QAAM,CAAC,uBAAuB,4BAA4B,SAAS;AAEnE,YAAU,MAAM;AACd,UAAM,mBAAmB,qBAAqB;AAC9C,8BAA0B,kBAAkB,gBAAgB;AAC5D,6BAAyB,kBAAkB,eAAe;AAAA,KACzD,CAAC;AAEJ,MAAI,MAAM;AACV,MAAI,QAAQ;AACZ,MAAI,OAAO;AAEX,MAAI,aAAa;AAAS,WAAO,wBAAwB;AACzD,MAAI,aAAa;AAAQ,YAAQ,wBAAwB;AACzD,QAAM,yBAAyB;AAE/B,SACE,qCAAC,SAAD,mBAAa,mBACV,eACC,qCAAC,OAAD;AAAA,IAAO;AAAA,IAAc;AAAA,IAAY;AAAA,IAAc;AAAA,IAAoB;AAAA,IAAU;AAAA,IAAY;AAAA,KACtF,SAAS,YAAY,QAGzB,aAAa,qCAAC,WAAD;AAAA,IAAW,UAAU;AAAA;AAAA;AAKzC,kBAAkB,YAAY;AAC9B,MAAM,8BAA8B,SAAS;AAC7C,4BAA4B,YAAY;",
6
+ "names": []
7
+ }
@@ -0,0 +1,7 @@
1
+ import * as React from "react";
2
+ export * from "./NotificationBadge";
3
+ import { NotificationBadge } from "./NotificationBadge";
4
+ export {
5
+ NotificationBadge as default
6
+ };
7
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/index.tsx"],
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export * from './NotificationBadge';\nexport { NotificationBadge as default } from './NotificationBadge';\n"],
5
+ "mappings": "AAAA;ACAA;AACA;",
6
+ "names": []
7
+ }
@@ -0,0 +1,44 @@
1
+ var __defProp = Object.defineProperty;
2
+ var __defProps = Object.defineProperties;
3
+ var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
4
+ var __getOwnPropSymbols = Object.getOwnPropertySymbols;
5
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
6
+ var __propIsEnum = Object.prototype.propertyIsEnumerable;
7
+ var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
8
+ var __spreadValues = (a, b) => {
9
+ for (var prop in b || (b = {}))
10
+ if (__hasOwnProp.call(b, prop))
11
+ __defNormalProp(a, prop, b[prop]);
12
+ if (__getOwnPropSymbols)
13
+ for (var prop of __getOwnPropSymbols(b)) {
14
+ if (__propIsEnum.call(b, prop))
15
+ __defNormalProp(a, prop, b[prop]);
16
+ }
17
+ return a;
18
+ };
19
+ var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
20
+ import * as React from "react";
21
+ import { PropTypes, globalAttributesPropTypes } from "@elliemae/ds-props-helpers";
22
+ const defaultProps = {
23
+ type: "number",
24
+ size: "s",
25
+ disabled: false,
26
+ position: "right",
27
+ color: void 0,
28
+ Component: void 0,
29
+ value: void 0
30
+ };
31
+ const NotificationBadgePropTypes = __spreadProps(__spreadValues({}, globalAttributesPropTypes), {
32
+ type: PropTypes.oneOf(["number", "dot"]).description("type of badge: number or dot"),
33
+ value: PropTypes.number.description("value of the numeric badge"),
34
+ size: PropTypes.oneOf(["s", "l"]).description("size of the badge: s or l"),
35
+ disabled: PropTypes.bool.description("whether the badge is disabled"),
36
+ position: PropTypes.oneOf(["left", "right"]).description("position of the badge with the related component"),
37
+ Component: PropTypes.func.description("Related component"),
38
+ color: PropTypes.string.description("Badge background color value")
39
+ });
40
+ export {
41
+ NotificationBadgePropTypes,
42
+ defaultProps
43
+ };
44
+ //# sourceMappingURL=react-desc-prop-types.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/react-desc-prop-types.tsx"],
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { PropTypes, globalAttributesPropTypes } from '@elliemae/ds-props-helpers';\n\nexport declare namespace DSNotificationBadgeT {\n interface ComponentT {\n innerRef: React.RefObject<HTMLSpanElement>;\n }\n\n export interface Props {\n [property: string]: unknown;\n type?: string;\n value?: number;\n size?: string;\n disabled?: boolean;\n position?: string;\n Component?: (propsT: ComponentT) => JSX.Element;\n color?: string;\n }\n}\n\nexport const defaultProps: DSNotificationBadgeT.Props = {\n type: 'number',\n size: 's',\n disabled: false,\n position: 'right',\n color: undefined,\n Component: undefined,\n value: undefined,\n};\n\nexport const NotificationBadgePropTypes = {\n ...globalAttributesPropTypes,\n type: PropTypes.oneOf(['number', 'dot']).description('type of badge: number or dot'),\n value: PropTypes.number.description('value of the numeric badge'),\n size: PropTypes.oneOf(['s', 'l']).description('size of the badge: s or l'),\n disabled: PropTypes.bool.description('whether the badge is disabled'),\n position: PropTypes.oneOf(['left', 'right']).description('position of the badge with the related component'),\n Component: PropTypes.func.description('Related component'),\n color: PropTypes.string.description('Badge background color value'),\n};\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;AAAA;ACAA;AAmBO,MAAM,eAA2C;AAAA,EACtD,MAAM;AAAA,EACN,MAAM;AAAA,EACN,UAAU;AAAA,EACV,UAAU;AAAA,EACV,OAAO;AAAA,EACP,WAAW;AAAA,EACX,OAAO;AAAA;AAGF,MAAM,6BAA6B,iCACrC,4BADqC;AAAA,EAExC,MAAM,UAAU,MAAM,CAAC,UAAU,QAAQ,YAAY;AAAA,EACrD,OAAO,UAAU,OAAO,YAAY;AAAA,EACpC,MAAM,UAAU,MAAM,CAAC,KAAK,MAAM,YAAY;AAAA,EAC9C,UAAU,UAAU,KAAK,YAAY;AAAA,EACrC,UAAU,UAAU,MAAM,CAAC,QAAQ,UAAU,YAAY;AAAA,EACzD,WAAW,UAAU,KAAK,YAAY;AAAA,EACtC,OAAO,UAAU,OAAO,YAAY;AAAA;",
6
+ "names": []
7
+ }
@@ -0,0 +1,51 @@
1
+ import * as React from "react";
2
+ import styled from "styled-components";
3
+ const Wrapper = styled.div`
4
+ display: flex;
5
+ flex-direction: column;
6
+ justify-content: center;
7
+ align-items: center;
8
+ width: fit-content;
9
+ `;
10
+ const GenericBadge = styled.span`
11
+ position: relative;
12
+ top: ${({ top }) => top ? `${top}px` : "unset"};
13
+ left: ${({ left }) => left ? `${left}px` : "unset"};
14
+ right: ${({ right }) => right ? `${right}px` : "unset"};
15
+ `;
16
+ const NumericBadge = styled(GenericBadge)`
17
+ display: flex;
18
+ justify-content: center;
19
+ align-items: center;
20
+ width: fit-content;
21
+ color: #fff;
22
+ padding: ${({ value }) => value && value > 9 ? "0 5px" : "0"};
23
+ padding-top: 2px;
24
+ background-color: ${({ disabled, color, theme }) => disabled ? theme.colors.neutral["500"] : color || theme.colors.danger["900"]};
25
+ border-radius: ${({ value }) => value && value > 9 ? "10px" : "50%"};
26
+ font-size: ${({ size }) => size === "l" ? "16px" : "12px"};
27
+ font-weight: ${({ size }) => size === "l" ? "400" : "600"};
28
+ height: ${({ size }) => size === "l" ? "21px" : "15px"};
29
+ min-width: ${({ size, value }) => {
30
+ if (size === "l" && value && value > 9)
31
+ return "30px";
32
+ if (size === "l" && value && value <= 9)
33
+ return "21px";
34
+ if (size === "s" && value && value > 9)
35
+ return "21px";
36
+ return "15px";
37
+ }};
38
+ `;
39
+ const DotBadge = styled(GenericBadge)`
40
+ background-color: ${({ disabled, theme, color }) => disabled ? theme.colors.neutral["500"] : color || theme.colors.brand[500]};
41
+ width: ${({ size }) => size === "l" ? "15px" : "10px"};
42
+ height: ${({ size }) => size === "l" ? "15px" : "10px"};
43
+ border-radius: 100%;
44
+ `;
45
+ export {
46
+ DotBadge,
47
+ GenericBadge,
48
+ NumericBadge,
49
+ Wrapper
50
+ };
51
+ //# sourceMappingURL=style.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/style.tsx"],
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import styled from 'styled-components';\nimport { DSNotificationBadgeT } from './react-desc-prop-types';\n\ninterface StyledGenericBadgeT {\n top: number;\n left: number;\n right: number;\n}\n\nexport const Wrapper = styled.div`\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n width: fit-content;\n`;\n\nexport const GenericBadge = styled.span<DSNotificationBadgeT.Props & StyledGenericBadgeT>`\n position: relative;\n top: ${({ top }) => (top ? `${top}px` : 'unset')};\n left: ${({ left }) => (left ? `${left}px` : 'unset')};\n right: ${({ right }) => (right ? `${right}px` : 'unset')};\n`;\n\nexport const NumericBadge = styled(GenericBadge)<{\n top: number;\n left: number;\n right: number;\n size?: string;\n disabled?: boolean;\n value?: number;\n color?: string;\n}>`\n display: flex;\n justify-content: center;\n align-items: center;\n width: fit-content;\n color: #fff;\n padding: ${({ value }) => (value && value > 9 ? '0 5px' : '0')};\n padding-top: 2px;\n background-color: ${({ disabled, color, theme }) =>\n disabled ? theme.colors.neutral['500'] : color || theme.colors.danger['900']};\n border-radius: ${({ value }) => (value && value > 9 ? '10px' : '50%')};\n font-size: ${({ size }) => (size === 'l' ? '16px' : '12px')};\n font-weight: ${({ size }) => (size === 'l' ? '400' : '600')};\n height: ${({ size }) => (size === 'l' ? '21px' : '15px')};\n min-width: ${({ size, value }) => {\n if (size === 'l' && value && value > 9) return '30px';\n if (size === 'l' && value && value <= 9) return '21px';\n if (size === 's' && value && value > 9) return '21px';\n return '15px';\n }};\n`;\n\nexport const DotBadge = styled(GenericBadge)<DSNotificationBadgeT.Props>`\n background-color: ${({ disabled, theme, color }) =>\n disabled ? theme.colors.neutral['500'] : color || theme.colors.brand[500]};\n width: ${({ size }) => (size === 'l' ? '15px' : '10px')};\n height: ${({ size }) => (size === 'l' ? '15px' : '10px')};\n border-radius: 100%;\n`;\n"],
5
+ "mappings": "AAAA;ACAA;AASO,MAAM,UAAU,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQvB,MAAM,eAAe,OAAO;AAAA;AAAA,SAE1B,CAAC,EAAE,UAAW,MAAM,GAAG,UAAU;AAAA,UAChC,CAAC,EAAE,WAAY,OAAO,GAAG,WAAW;AAAA,WACnC,CAAC,EAAE,YAAa,QAAQ,GAAG,YAAY;AAAA;AAG3C,MAAM,eAAe,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,aActB,CAAC,EAAE,YAAa,SAAS,QAAQ,IAAI,UAAU;AAAA;AAAA,sBAEtC,CAAC,EAAE,UAAU,OAAO,YACtC,WAAW,MAAM,OAAO,QAAQ,SAAS,SAAS,MAAM,OAAO,OAAO;AAAA,mBACvD,CAAC,EAAE,YAAa,SAAS,QAAQ,IAAI,SAAS;AAAA,eAClD,CAAC,EAAE,WAAY,SAAS,MAAM,SAAS;AAAA,iBACrC,CAAC,EAAE,WAAY,SAAS,MAAM,QAAQ;AAAA,YAC3C,CAAC,EAAE,WAAY,SAAS,MAAM,SAAS;AAAA,eACpC,CAAC,EAAE,MAAM,YAAY;AAChC,MAAI,SAAS,OAAO,SAAS,QAAQ;AAAG,WAAO;AAC/C,MAAI,SAAS,OAAO,SAAS,SAAS;AAAG,WAAO;AAChD,MAAI,SAAS,OAAO,SAAS,QAAQ;AAAG,WAAO;AAC/C,SAAO;AAAA;AAAA;AAIJ,MAAM,WAAW,OAAO;AAAA,sBACT,CAAC,EAAE,UAAU,OAAO,YACtC,WAAW,MAAM,OAAO,QAAQ,SAAS,SAAS,MAAM,OAAO,MAAM;AAAA,WAC9D,CAAC,EAAE,WAAY,SAAS,MAAM,SAAS;AAAA,YACtC,CAAC,EAAE,WAAY,SAAS,MAAM,SAAS;AAAA;AAAA;",
6
+ "names": []
7
+ }