@elliemae/ds-notification-badge 3.0.0-next.77 → 3.0.0-next.78
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.
- package/dist/cjs/NotificationBadge.js +7 -6
- package/dist/cjs/NotificationBadge.js.map +2 -2
- package/dist/cjs/index.js.map +2 -2
- package/dist/cjs/react-desc-prop-types.js +3 -6
- package/dist/cjs/react-desc-prop-types.js.map +2 -2
- package/dist/cjs/style.js +6 -6
- package/dist/cjs/style.js.map +2 -2
- package/dist/esm/NotificationBadge.js +7 -6
- package/dist/esm/NotificationBadge.js.map +2 -2
- package/dist/esm/index.js.map +2 -2
- package/dist/esm/react-desc-prop-types.js +3 -6
- package/dist/esm/react-desc-prop-types.js.map +2 -2
- package/dist/esm/style.js +6 -6
- package/dist/esm/style.js.map +2 -2
- package/package.json +1 -1
|
@@ -55,11 +55,12 @@ var import_react = __toESM(require("react"));
|
|
|
55
55
|
var import_ds_utilities = require("@elliemae/ds-utilities");
|
|
56
56
|
var import_react_desc_prop_types = require("./react-desc-prop-types");
|
|
57
57
|
var import_style = require("./style");
|
|
58
|
+
const getValueCharactersCount = (val) => String(val).length;
|
|
58
59
|
const NotificationBadge = (props) => {
|
|
59
60
|
const propsWithDefaults = (0, import_ds_utilities.useMemoMergePropsWithDefault)(props, import_react_desc_prop_types.defaultProps);
|
|
60
61
|
(0, import_ds_utilities.useValidateTypescriptPropTypes)(propsWithDefaults, import_react_desc_prop_types.NotificationBadgePropTypes);
|
|
61
|
-
const
|
|
62
|
-
const
|
|
62
|
+
const _a = propsWithDefaults, { type, color, value, size, disabled, position, Component } = _a, rest = __objRest(_a, ["type", "color", "value", "size", "disabled", "position", "Component"]);
|
|
63
|
+
const globalAttributes = (0, import_ds_utilities.useGetGlobalAttributes)(rest);
|
|
63
64
|
const Badge = type === "number" ? import_style.NumericBadge : import_style.DotBadge;
|
|
64
65
|
const relatedComponentRef = (0, import_react.useRef)(null);
|
|
65
66
|
const renderBadge = relatedComponentRef?.current || !Component;
|
|
@@ -78,8 +79,7 @@ const NotificationBadge = (props) => {
|
|
|
78
79
|
if (position === "left")
|
|
79
80
|
right = relatedComponentWidth / 2;
|
|
80
81
|
top = relatedComponentHeight / 2;
|
|
81
|
-
|
|
82
|
-
return /* @__PURE__ */ import_react.default.createElement(import_style.Wrapper, __spreadValues({}, restGlobals), renderBadge && /* @__PURE__ */ import_react.default.createElement(Badge, {
|
|
82
|
+
return /* @__PURE__ */ import_react.default.createElement(import_style.Wrapper, __spreadValues({}, globalAttributes), renderBadge && /* @__PURE__ */ import_react.default.createElement(Badge, {
|
|
83
83
|
"data-testid": "ds-notification-badge",
|
|
84
84
|
color,
|
|
85
85
|
size,
|
|
@@ -87,8 +87,9 @@ const NotificationBadge = (props) => {
|
|
|
87
87
|
disabled,
|
|
88
88
|
top,
|
|
89
89
|
left,
|
|
90
|
-
right
|
|
91
|
-
|
|
90
|
+
right,
|
|
91
|
+
charCount: getValueCharactersCount(value)
|
|
92
|
+
}, type === "number" ? value : null), Component && /* @__PURE__ */ import_react.default.createElement(Component, {
|
|
92
93
|
innerRef: relatedComponentRef
|
|
93
94
|
}));
|
|
94
95
|
};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
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-utilities';\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
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAsE;AACtE,0BAKO;AAEP,mCAA+E;AAC/E,mBAAgD;AAEhD,MAAM,oBAAqE,CAAC,UAAU;AACpF,QAAM,oBAAoB,sDAA6B,OAAO,yCAAY;AAC1E,0DAA2D,mBAAmB,uDAA0B;AACxG,
|
|
4
|
+
"sourcesContent": ["import React, { useState, useEffect, useRef, WeakValidationMap } from 'react';\nimport {\n useMemoMergePropsWithDefault,\n useValidateTypescriptPropTypes,\n describe,\n useGetGlobalAttributes,\n} from '@elliemae/ds-utilities';\n\nimport { NotificationBadgePropTypes, DSNotificationBadgeT, defaultProps } from './react-desc-prop-types';\nimport { Wrapper, NumericBadge, DotBadge } from './style';\n\nconst getValueCharactersCount = (val: string | number): number => String(val).length;\n\nconst NotificationBadge: React.ComponentType<DSNotificationBadgeT.Props> = (props) => {\n const propsWithDefaults = useMemoMergePropsWithDefault(props, defaultProps);\n useValidateTypescriptPropTypes<DSNotificationBadgeT.Props>(propsWithDefaults, NotificationBadgePropTypes);\n const { type, color, value, size, disabled, position, Component, ...rest } = propsWithDefaults;\n const globalAttributes = useGetGlobalAttributes(rest);\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\n data-testid=\"ds-notification-badge\"\n color={color}\n size={size}\n value={value}\n disabled={disabled}\n top={top}\n left={left}\n right={right}\n charCount={getValueCharactersCount(value)}\n >\n {type === 'number' ? value : null}\n </Badge>\n )}\n {Component && <Component innerRef={relatedComponentRef} />}\n </Wrapper>\n );\n};\n\nNotificationBadge.propTypes = NotificationBadgePropTypes as WeakValidationMap<unknown>;\nNotificationBadge.displayName = 'NotificationBadge';\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;AAAA;ACAA,YAAuB;ADAvB,mBAAsE;AACtE,0BAKO;AAEP,mCAA+E;AAC/E,mBAAgD;AAEhD,MAAM,0BAA0B,CAAC,QAAiC,OAAO,GAAG,EAAE;AAE9E,MAAM,oBAAqE,CAAC,UAAU;AACpF,QAAM,oBAAoB,sDAA6B,OAAO,yCAAY;AAC1E,0DAA2D,mBAAmB,uDAA0B;AACxG,QAA6E,wBAArE,QAAM,OAAO,OAAO,MAAM,UAAU,UAAU,cAAuB,IAAT,iBAAS,IAAT,CAA5D,QAAM,SAAO,SAAO,QAAM,YAAU,YAAU;AACtD,QAAM,mBAAmB,gDAAuB,IAAI;AAEpD,QAAM,QAAQ,SAAS,WAAW,4BAAe;AACjD,QAAM,sBAAsB,yBAAwB,IAAI;AACxD,QAAM,cAAc,qBAAqB,WAAW,CAAC;AACrD,QAAM,CAAC,wBAAwB,6BAA6B,2BAAS,CAAC;AACtE,QAAM,CAAC,uBAAuB,4BAA4B,2BAAS,CAAC;AAEpE,8BAAU,MAAM;AACd,UAAM,mBAAmB,qBAAqB;AAC9C,8BAA0B,kBAAkB,gBAAgB,CAAC;AAC7D,6BAAyB,kBAAkB,eAAe,CAAC;AAAA,EAC7D,GAAG,CAAC,mBAAmB,CAAC;AAExB,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,yCAAY,mBACV,eACC,mDAAC;AAAA,IACC,eAAY;AAAA,IACZ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,WAAW,wBAAwB,KAAK;AAAA,KAEvC,SAAS,WAAW,QAAQ,IAC/B,GAED,aAAa,mDAAC;AAAA,IAAU,UAAU;AAAA,GAAqB,CAC1D;AAEJ;AAEA,kBAAkB,YAAY;AAC9B,kBAAkB,cAAc;AAChC,MAAM,8BAA8B,kCAAS,iBAAiB;AAC9D,4BAA4B,YAAY;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/cjs/index.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
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;AAAA;ACAA,YAAuB;ADAvB,wBAAc,gCAAd;
|
|
4
|
+
"sourcesContent": ["export * from './NotificationBadge';\n// eslint-disable-next-line no-restricted-exports\nexport { NotificationBadge as default } from './NotificationBadge';\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,wBAAc,gCAAd;AAEA,+BAA6C;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -47,17 +47,14 @@ const defaultProps = {
|
|
|
47
47
|
type: "number",
|
|
48
48
|
size: "s",
|
|
49
49
|
disabled: false,
|
|
50
|
-
position: "right"
|
|
51
|
-
color: void 0,
|
|
52
|
-
Component: void 0,
|
|
53
|
-
value: void 0
|
|
50
|
+
position: "right"
|
|
54
51
|
};
|
|
55
52
|
const NotificationBadgePropTypes = __spreadProps(__spreadValues({}, import_ds_utilities.globalAttributesPropTypes), {
|
|
53
|
+
value: import_ds_utilities.PropTypes.oneOfType([import_ds_utilities.PropTypes.string, import_ds_utilities.PropTypes.number]).description("value of the numeric badge"),
|
|
56
54
|
type: import_ds_utilities.PropTypes.oneOf(["number", "dot"]).description("type of badge: number or dot"),
|
|
57
|
-
value: import_ds_utilities.PropTypes.number.description("value of the numeric badge"),
|
|
58
55
|
size: import_ds_utilities.PropTypes.oneOf(["s", "l"]).description("size of the badge: s or l"),
|
|
59
|
-
disabled: import_ds_utilities.PropTypes.bool.description("whether the badge is disabled"),
|
|
60
56
|
position: import_ds_utilities.PropTypes.oneOf(["left", "right"]).description("position of the badge with the related component"),
|
|
57
|
+
disabled: import_ds_utilities.PropTypes.bool.description("whether the badge is disabled"),
|
|
61
58
|
Component: import_ds_utilities.PropTypes.func.description("Related component"),
|
|
62
59
|
color: import_ds_utilities.PropTypes.string.description("Badge background color value")
|
|
63
60
|
});
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/react-desc-prop-types.tsx", "../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import { PropTypes, globalAttributesPropTypes } from '@elliemae/ds-utilities';\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?:
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,0BAAqD;
|
|
4
|
+
"sourcesContent": ["import { PropTypes, globalAttributesPropTypes } from '@elliemae/ds-utilities';\n\nexport declare namespace DSNotificationBadgeT {\n interface ComponentT {\n innerRef: React.RefObject<HTMLSpanElement>;\n }\n type BadgeType = 'number' | 'dot';\n type BadgeSize = 's' | 'l';\n type BadgePosition = 'left' | 'right';\n\n export interface Props {\n [property: string]: unknown;\n type?: BadgeType;\n value?: number | string;\n size?: BadgeSize;\n disabled?: boolean;\n position?: BadgePosition;\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};\n\nexport const NotificationBadgePropTypes = {\n ...globalAttributesPropTypes,\n value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).description('value of the numeric badge'),\n type: PropTypes.oneOf(['number', 'dot']).description('type of badge: number or dot'),\n size: PropTypes.oneOf(['s', 'l']).description('size of the badge: s or l'),\n position: PropTypes.oneOf(['left', 'right']).description('position of the badge with the related component'),\n disabled: PropTypes.bool.description('whether the badge is disabled'),\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;AAAA;ACAA,YAAuB;ADAvB,0BAAqD;AAsB9C,MAAM,eAA2C;AAAA,EACtD,MAAM;AAAA,EACN,MAAM;AAAA,EACN,UAAU;AAAA,EACV,UAAU;AACZ;AAEO,MAAM,6BAA6B,iCACrC,gDADqC;AAAA,EAExC,OAAO,8BAAU,UAAU,CAAC,8BAAU,QAAQ,8BAAU,MAAM,CAAC,EAAE,YAAY,4BAA4B;AAAA,EACzG,MAAM,8BAAU,MAAM,CAAC,UAAU,KAAK,CAAC,EAAE,YAAY,8BAA8B;AAAA,EACnF,MAAM,8BAAU,MAAM,CAAC,KAAK,GAAG,CAAC,EAAE,YAAY,2BAA2B;AAAA,EACzE,UAAU,8BAAU,MAAM,CAAC,QAAQ,OAAO,CAAC,EAAE,YAAY,kDAAkD;AAAA,EAC3G,UAAU,8BAAU,KAAK,YAAY,+BAA+B;AAAA,EACpE,WAAW,8BAAU,KAAK,YAAY,mBAAmB;AAAA,EACzD,OAAO,8BAAU,OAAO,YAAY,8BAA8B;AACpE;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/cjs/style.js
CHANGED
|
@@ -47,19 +47,19 @@ const NumericBadge = (0, import_styled_components.default)(GenericBadge)`
|
|
|
47
47
|
align-items: center;
|
|
48
48
|
width: fit-content;
|
|
49
49
|
color: #fff;
|
|
50
|
-
padding: ${({
|
|
50
|
+
padding: ${({ charCount }) => charCount > 1 ? "0 5px" : "0"};
|
|
51
51
|
padding-top: 2px;
|
|
52
52
|
background-color: ${({ disabled, color, theme }) => disabled ? theme.colors.neutral["500"] : color || theme.colors.danger["900"]};
|
|
53
|
-
border-radius: ${({
|
|
53
|
+
border-radius: ${({ charCount }) => charCount > 1 ? "10px" : "50%"};
|
|
54
54
|
font-size: ${({ size }) => size === "l" ? "16px" : "12px"};
|
|
55
55
|
font-weight: ${({ size }) => size === "l" ? "400" : "600"};
|
|
56
56
|
height: ${({ size }) => size === "l" ? "21px" : "15px"};
|
|
57
|
-
min-width: ${({ size,
|
|
58
|
-
if (size === "l" &&
|
|
57
|
+
min-width: ${({ size, charCount }) => {
|
|
58
|
+
if (size === "l" && charCount > 1)
|
|
59
59
|
return "30px";
|
|
60
|
-
if (size === "l" &&
|
|
60
|
+
if (size === "l" && charCount <= 1)
|
|
61
61
|
return "21px";
|
|
62
|
-
if (size === "s" &&
|
|
62
|
+
if (size === "s" && charCount > 1)
|
|
63
63
|
return "21px";
|
|
64
64
|
return "15px";
|
|
65
65
|
}};
|
package/dist/cjs/style.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
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
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;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,YAAY;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,
|
|
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 charCount: number;\n size?: string;\n value?: number | string;\n disabled?: boolean;\n color?: string;\n}>`\n display: flex;\n justify-content: center;\n align-items: center;\n width: fit-content;\n color: #fff;\n padding: ${({ charCount }) => (charCount > 1 ? '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: ${({ charCount }) => (charCount > 1 ? '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, charCount }) => {\n if (size === 'l' && charCount > 1) return '30px';\n if (size === 'l' && charCount <= 1) return '21px';\n if (size === 's' && charCount > 1) 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;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,YAAY;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,aAelC,CAAC,EAAE,gBAAiB,YAAY,IAAI,UAAU;AAAA;AAAA,sBAErC,CAAC,EAAE,UAAU,OAAO,YACtC,WAAW,MAAM,OAAO,QAAQ,SAAS,SAAS,MAAM,OAAO,OAAO;AAAA,mBACvD,CAAC,EAAE,gBAAiB,YAAY,IAAI,SAAS;AAAA,eACjD,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,gBAAgB;AACpC,MAAI,SAAS,OAAO,YAAY;AAAG,WAAO;AAC1C,MAAI,SAAS,OAAO,aAAa;AAAG,WAAO;AAC3C,MAAI,SAAS,OAAO,YAAY;AAAG,WAAO;AAC1C,SAAO;AACT;AAAA;AAGK,MAAM,WAAW,sCAAO,YAAY;AAAA,sBACrB,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
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -36,11 +36,12 @@ import {
|
|
|
36
36
|
} from "@elliemae/ds-utilities";
|
|
37
37
|
import { NotificationBadgePropTypes, defaultProps } from "./react-desc-prop-types";
|
|
38
38
|
import { Wrapper, NumericBadge, DotBadge } from "./style";
|
|
39
|
+
const getValueCharactersCount = (val) => String(val).length;
|
|
39
40
|
const NotificationBadge = (props) => {
|
|
40
41
|
const propsWithDefaults = useMemoMergePropsWithDefault(props, defaultProps);
|
|
41
42
|
useValidateTypescriptPropTypes(propsWithDefaults, NotificationBadgePropTypes);
|
|
42
|
-
const
|
|
43
|
-
const
|
|
43
|
+
const _a = propsWithDefaults, { type, color, value, size, disabled, position, Component } = _a, rest = __objRest(_a, ["type", "color", "value", "size", "disabled", "position", "Component"]);
|
|
44
|
+
const globalAttributes = useGetGlobalAttributes(rest);
|
|
44
45
|
const Badge = type === "number" ? NumericBadge : DotBadge;
|
|
45
46
|
const relatedComponentRef = useRef(null);
|
|
46
47
|
const renderBadge = relatedComponentRef?.current || !Component;
|
|
@@ -59,8 +60,7 @@ const NotificationBadge = (props) => {
|
|
|
59
60
|
if (position === "left")
|
|
60
61
|
right = relatedComponentWidth / 2;
|
|
61
62
|
top = relatedComponentHeight / 2;
|
|
62
|
-
|
|
63
|
-
return /* @__PURE__ */ React2.createElement(Wrapper, __spreadValues({}, restGlobals), renderBadge && /* @__PURE__ */ React2.createElement(Badge, {
|
|
63
|
+
return /* @__PURE__ */ React2.createElement(Wrapper, __spreadValues({}, globalAttributes), renderBadge && /* @__PURE__ */ React2.createElement(Badge, {
|
|
64
64
|
"data-testid": "ds-notification-badge",
|
|
65
65
|
color,
|
|
66
66
|
size,
|
|
@@ -68,8 +68,9 @@ const NotificationBadge = (props) => {
|
|
|
68
68
|
disabled,
|
|
69
69
|
top,
|
|
70
70
|
left,
|
|
71
|
-
right
|
|
72
|
-
|
|
71
|
+
right,
|
|
72
|
+
charCount: getValueCharactersCount(value)
|
|
73
|
+
}, type === "number" ? value : null), Component && /* @__PURE__ */ React2.createElement(Component, {
|
|
73
74
|
innerRef: relatedComponentRef
|
|
74
75
|
}));
|
|
75
76
|
};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
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-utilities';\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
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;ACAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAOA;AACA;AAEA,MAAM,oBAAqE,CAAC,UAAU;AACpF,QAAM,oBAAoB,6BAA6B,OAAO,YAAY;AAC1E,iCAA2D,mBAAmB,0BAA0B;AACxG,
|
|
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-utilities';\n\nimport { NotificationBadgePropTypes, DSNotificationBadgeT, defaultProps } from './react-desc-prop-types';\nimport { Wrapper, NumericBadge, DotBadge } from './style';\n\nconst getValueCharactersCount = (val: string | number): number => String(val).length;\n\nconst NotificationBadge: React.ComponentType<DSNotificationBadgeT.Props> = (props) => {\n const propsWithDefaults = useMemoMergePropsWithDefault(props, defaultProps);\n useValidateTypescriptPropTypes<DSNotificationBadgeT.Props>(propsWithDefaults, NotificationBadgePropTypes);\n const { type, color, value, size, disabled, position, Component, ...rest } = propsWithDefaults;\n const globalAttributes = useGetGlobalAttributes(rest);\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\n data-testid=\"ds-notification-badge\"\n color={color}\n size={size}\n value={value}\n disabled={disabled}\n top={top}\n left={left}\n right={right}\n charCount={getValueCharactersCount(value)}\n >\n {type === 'number' ? value : null}\n </Badge>\n )}\n {Component && <Component innerRef={relatedComponentRef} />}\n </Wrapper>\n );\n};\n\nNotificationBadge.propTypes = NotificationBadgePropTypes as WeakValidationMap<unknown>;\nNotificationBadge.displayName = 'NotificationBadge';\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,0BAA0B,CAAC,QAAiC,OAAO,GAAG,EAAE;AAE9E,MAAM,oBAAqE,CAAC,UAAU;AACpF,QAAM,oBAAoB,6BAA6B,OAAO,YAAY;AAC1E,iCAA2D,mBAAmB,0BAA0B;AACxG,QAA6E,wBAArE,QAAM,OAAO,OAAO,MAAM,UAAU,UAAU,cAAuB,IAAT,iBAAS,IAAT,CAA5D,QAAM,SAAO,SAAO,QAAM,YAAU,YAAU;AACtD,QAAM,mBAAmB,uBAAuB,IAAI;AAEpD,QAAM,QAAQ,SAAS,WAAW,eAAe;AACjD,QAAM,sBAAsB,OAAwB,IAAI;AACxD,QAAM,cAAc,qBAAqB,WAAW,CAAC;AACrD,QAAM,CAAC,wBAAwB,6BAA6B,SAAS,CAAC;AACtE,QAAM,CAAC,uBAAuB,4BAA4B,SAAS,CAAC;AAEpE,YAAU,MAAM;AACd,UAAM,mBAAmB,qBAAqB;AAC9C,8BAA0B,kBAAkB,gBAAgB,CAAC;AAC7D,6BAAyB,kBAAkB,eAAe,CAAC;AAAA,EAC7D,GAAG,CAAC,mBAAmB,CAAC;AAExB,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,4BAAY,mBACV,eACC,qCAAC;AAAA,IACC,eAAY;AAAA,IACZ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,WAAW,wBAAwB,KAAK;AAAA,KAEvC,SAAS,WAAW,QAAQ,IAC/B,GAED,aAAa,qCAAC;AAAA,IAAU,UAAU;AAAA,GAAqB,CAC1D;AAEJ;AAEA,kBAAkB,YAAY;AAC9B,kBAAkB,cAAc;AAChC,MAAM,8BAA8B,SAAS,iBAAiB;AAC9D,4BAA4B,YAAY;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/esm/index.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
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;
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export * from './NotificationBadge';\n// eslint-disable-next-line no-restricted-exports\nexport { NotificationBadge as default } from './NotificationBadge';\n"],
|
|
5
|
+
"mappings": "AAAA;ACAA;AAEA;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -23,17 +23,14 @@ const defaultProps = {
|
|
|
23
23
|
type: "number",
|
|
24
24
|
size: "s",
|
|
25
25
|
disabled: false,
|
|
26
|
-
position: "right"
|
|
27
|
-
color: void 0,
|
|
28
|
-
Component: void 0,
|
|
29
|
-
value: void 0
|
|
26
|
+
position: "right"
|
|
30
27
|
};
|
|
31
28
|
const NotificationBadgePropTypes = __spreadProps(__spreadValues({}, globalAttributesPropTypes), {
|
|
29
|
+
value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).description("value of the numeric badge"),
|
|
32
30
|
type: PropTypes.oneOf(["number", "dot"]).description("type of badge: number or dot"),
|
|
33
|
-
value: PropTypes.number.description("value of the numeric badge"),
|
|
34
31
|
size: PropTypes.oneOf(["s", "l"]).description("size of the badge: s or l"),
|
|
35
|
-
disabled: PropTypes.bool.description("whether the badge is disabled"),
|
|
36
32
|
position: PropTypes.oneOf(["left", "right"]).description("position of the badge with the related component"),
|
|
33
|
+
disabled: PropTypes.bool.description("whether the badge is disabled"),
|
|
37
34
|
Component: PropTypes.func.description("Related component"),
|
|
38
35
|
color: PropTypes.string.description("Badge background color value")
|
|
39
36
|
});
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
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-utilities';\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?:
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;AAAA;ACAA;
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { PropTypes, globalAttributesPropTypes } from '@elliemae/ds-utilities';\n\nexport declare namespace DSNotificationBadgeT {\n interface ComponentT {\n innerRef: React.RefObject<HTMLSpanElement>;\n }\n type BadgeType = 'number' | 'dot';\n type BadgeSize = 's' | 'l';\n type BadgePosition = 'left' | 'right';\n\n export interface Props {\n [property: string]: unknown;\n type?: BadgeType;\n value?: number | string;\n size?: BadgeSize;\n disabled?: boolean;\n position?: BadgePosition;\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};\n\nexport const NotificationBadgePropTypes = {\n ...globalAttributesPropTypes,\n value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).description('value of the numeric badge'),\n type: PropTypes.oneOf(['number', 'dot']).description('type of badge: number or dot'),\n size: PropTypes.oneOf(['s', 'l']).description('size of the badge: s or l'),\n position: PropTypes.oneOf(['left', 'right']).description('position of the badge with the related component'),\n disabled: PropTypes.bool.description('whether the badge is disabled'),\n Component: PropTypes.func.description('Related component'),\n color: PropTypes.string.description('Badge background color value'),\n};\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;AAAA;ACAA;AAsBO,MAAM,eAA2C;AAAA,EACtD,MAAM;AAAA,EACN,MAAM;AAAA,EACN,UAAU;AAAA,EACV,UAAU;AACZ;AAEO,MAAM,6BAA6B,iCACrC,4BADqC;AAAA,EAExC,OAAO,UAAU,UAAU,CAAC,UAAU,QAAQ,UAAU,MAAM,CAAC,EAAE,YAAY,4BAA4B;AAAA,EACzG,MAAM,UAAU,MAAM,CAAC,UAAU,KAAK,CAAC,EAAE,YAAY,8BAA8B;AAAA,EACnF,MAAM,UAAU,MAAM,CAAC,KAAK,GAAG,CAAC,EAAE,YAAY,2BAA2B;AAAA,EACzE,UAAU,UAAU,MAAM,CAAC,QAAQ,OAAO,CAAC,EAAE,YAAY,kDAAkD;AAAA,EAC3G,UAAU,UAAU,KAAK,YAAY,+BAA+B;AAAA,EACpE,WAAW,UAAU,KAAK,YAAY,mBAAmB;AAAA,EACzD,OAAO,UAAU,OAAO,YAAY,8BAA8B;AACpE;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/esm/style.js
CHANGED
|
@@ -19,19 +19,19 @@ const NumericBadge = styled(GenericBadge)`
|
|
|
19
19
|
align-items: center;
|
|
20
20
|
width: fit-content;
|
|
21
21
|
color: #fff;
|
|
22
|
-
padding: ${({
|
|
22
|
+
padding: ${({ charCount }) => charCount > 1 ? "0 5px" : "0"};
|
|
23
23
|
padding-top: 2px;
|
|
24
24
|
background-color: ${({ disabled, color, theme }) => disabled ? theme.colors.neutral["500"] : color || theme.colors.danger["900"]};
|
|
25
|
-
border-radius: ${({
|
|
25
|
+
border-radius: ${({ charCount }) => charCount > 1 ? "10px" : "50%"};
|
|
26
26
|
font-size: ${({ size }) => size === "l" ? "16px" : "12px"};
|
|
27
27
|
font-weight: ${({ size }) => size === "l" ? "400" : "600"};
|
|
28
28
|
height: ${({ size }) => size === "l" ? "21px" : "15px"};
|
|
29
|
-
min-width: ${({ size,
|
|
30
|
-
if (size === "l" &&
|
|
29
|
+
min-width: ${({ size, charCount }) => {
|
|
30
|
+
if (size === "l" && charCount > 1)
|
|
31
31
|
return "30px";
|
|
32
|
-
if (size === "l" &&
|
|
32
|
+
if (size === "l" && charCount <= 1)
|
|
33
33
|
return "21px";
|
|
34
|
-
if (size === "s" &&
|
|
34
|
+
if (size === "s" && charCount > 1)
|
|
35
35
|
return "21px";
|
|
36
36
|
return "15px";
|
|
37
37
|
}};
|
package/dist/esm/style.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
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
|
|
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,YAAY;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,
|
|
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 charCount: number;\n size?: string;\n value?: number | string;\n disabled?: boolean;\n color?: string;\n}>`\n display: flex;\n justify-content: center;\n align-items: center;\n width: fit-content;\n color: #fff;\n padding: ${({ charCount }) => (charCount > 1 ? '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: ${({ charCount }) => (charCount > 1 ? '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, charCount }) => {\n if (size === 'l' && charCount > 1) return '30px';\n if (size === 'l' && charCount <= 1) return '21px';\n if (size === 's' && charCount > 1) 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,YAAY;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,aAelC,CAAC,EAAE,gBAAiB,YAAY,IAAI,UAAU;AAAA;AAAA,sBAErC,CAAC,EAAE,UAAU,OAAO,YACtC,WAAW,MAAM,OAAO,QAAQ,SAAS,SAAS,MAAM,OAAO,OAAO;AAAA,mBACvD,CAAC,EAAE,gBAAiB,YAAY,IAAI,SAAS;AAAA,eACjD,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,gBAAgB;AACpC,MAAI,SAAS,OAAO,YAAY;AAAG,WAAO;AAC1C,MAAI,SAAS,OAAO,aAAa;AAAG,WAAO;AAC3C,MAAI,SAAS,OAAO,YAAY;AAAG,WAAO;AAC1C,SAAO;AACT;AAAA;AAGK,MAAM,WAAW,OAAO,YAAY;AAAA,sBACrB,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
6
|
"names": []
|
|
7
7
|
}
|