@elliemae/ds-dataviz 3.70.0-next.63 → 3.70.0-next.69
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/graphs/Chart/SingleStackedBar/SingleStackedBar.js +20 -16
- package/dist/cjs/graphs/Chart/SingleStackedBar/SingleStackedBar.js.map +2 -2
- package/dist/cjs/graphs/Chart/SingleStackedBar/react-desc-prop-types.js.map +2 -2
- package/dist/esm/graphs/Chart/SingleStackedBar/SingleStackedBar.js +20 -16
- package/dist/esm/graphs/Chart/SingleStackedBar/SingleStackedBar.js.map +2 -2
- package/dist/esm/graphs/Chart/SingleStackedBar/react-desc-prop-types.js.map +2 -2
- package/dist/types/graphs/Chart/SingleStackedBar/react-desc-prop-types.d.ts +3 -3
- package/package.json +7 -7
|
@@ -72,6 +72,7 @@ const Bar = import_react.default.memo((props) => {
|
|
|
72
72
|
const handleMouseLeave = (0, import_react.useCallback)(() => {
|
|
73
73
|
setIsHover(false);
|
|
74
74
|
}, []);
|
|
75
|
+
const backgroundColor = datum.color in import_colorPallet.COLOR_PALLET ? import_colorPallet.COLOR_PALLET[datum.color] : datum.color;
|
|
75
76
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [
|
|
76
77
|
TooltipRenderer && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
77
78
|
import_ds_floating_context.FloatingWrapper,
|
|
@@ -92,7 +93,7 @@ const Bar = import_react.default.memo((props) => {
|
|
|
92
93
|
{
|
|
93
94
|
onMouseEnter: handleMouseEnter,
|
|
94
95
|
onMouseLeave: handleMouseLeave,
|
|
95
|
-
bg,
|
|
96
|
+
bg: backgroundColor,
|
|
96
97
|
height,
|
|
97
98
|
borderRadius,
|
|
98
99
|
innerRef: (0, import_ds_system.mergeRefs)(handleRefCallback, refs.setReference),
|
|
@@ -159,21 +160,24 @@ const DSSingleStackedBar = (props) => {
|
|
|
159
160
|
onBlur: (e) => e.currentTarget !== e.target && setIsChartFocused(false),
|
|
160
161
|
...xstyledProps,
|
|
161
162
|
...globalAttributes,
|
|
162
|
-
children: data.map((datum, i) =>
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
163
|
+
children: data.map((datum, i) => {
|
|
164
|
+
const backgroundColor = datum.color in import_colorPallet.COLOR_PALLET ? import_colorPallet.COLOR_PALLET[datum.color] : datum.color;
|
|
165
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ds_grid.Grid, { rows, children: [
|
|
166
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
167
|
+
Bar,
|
|
168
|
+
{
|
|
169
|
+
datum,
|
|
170
|
+
isFocused: barNames[keyBarFocused] === datum.name && isChartFocused,
|
|
171
|
+
borderRadius: getBorderRadius(i),
|
|
172
|
+
bg: backgroundColor,
|
|
173
|
+
tabIndex: i === keyBarFocused ? 0 : -1,
|
|
174
|
+
...props
|
|
175
|
+
},
|
|
176
|
+
datum.name
|
|
177
|
+
),
|
|
178
|
+
LegendRenderer !== void 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(LegendRenderer, { datum }, `${datum.name}-legend`) : null
|
|
179
|
+
] });
|
|
180
|
+
})
|
|
177
181
|
}
|
|
178
182
|
);
|
|
179
183
|
};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../src/graphs/Chart/SingleStackedBar/SingleStackedBar.tsx", "../../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable max-lines */\nimport type { DSGridT } from '@elliemae/ds-grid';\nimport { Grid } from '@elliemae/ds-grid';\nimport { useFloatingContext, FloatingWrapper, PopoverArrow } from '@elliemae/ds-floating-context';\nimport {\n describe,\n useGetGlobalAttributes,\n useGetXstyledProps,\n useMemoMergePropsWithDefault,\n useValidateTypescriptPropTypes,\n} from '@elliemae/ds-props-helpers';\nimport { mergeRefs } from '@elliemae/ds-system';\nimport React, { useCallback, useMemo, useState, type WeakValidationMap } from 'react';\nimport { COLOR_PALLET } from '../helpers/colorPallet.js';\nimport { DSSingleStackedBarName } from './exported-related/index.js';\nimport { DSSingleStackedBarPropTypes, defaultProps, type DSSingleStackedBarT } from './react-desc-prop-types.js';\nimport { StyledBar, StyledMouseOverDetectionBox, StyledTooltipContainer, Wrapper } from './styles.js';\nconst Bar = React.memo((props: DSSingleStackedBarT.BarT) => {\n const [isHover, setIsHover] = useState(false);\n const { height, TooltipRenderer, datum, tabIndex, isFocused, borderRadius, bg } = props;\n\n const isTooltipOpen = (isFocused || isHover) && !!TooltipRenderer;\n const {\n refs,\n floatingStyles,\n arrowStyles,\n context,\n isOpen: isFloatingOpen,\n } = useFloatingContext({\n externallyControlledIsOpen: isTooltipOpen,\n withoutAnimation: true,\n customOffset: [0, 14],\n });\n\n const handleRefCallback = useCallback(\n (_ref: HTMLDivElement | null) => {\n if (isFocused) {\n _ref?.focus();\n }\n },\n [isFocused],\n );\n\n const handleMouseEnter = useCallback(() => {\n setIsHover(true);\n }, []);\n\n const handleMouseLeave = useCallback(() => {\n setIsHover(false);\n }, []);\n return (\n <div>\n {TooltipRenderer && (\n <FloatingWrapper\n innerRef={refs.setFloating}\n isOpen={isFloatingOpen}\n floatingStyles={floatingStyles}\n context={context}\n >\n <StyledMouseOverDetectionBox />\n <StyledTooltipContainer>\n <TooltipRenderer datum={datum} />\n </StyledTooltipContainer>\n <PopoverArrow {...arrowStyles} />\n </FloatingWrapper>\n )}\n <StyledBar\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n bg={
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;
|
|
4
|
+
"sourcesContent": ["/* eslint-disable max-lines */\nimport type { DSGridT } from '@elliemae/ds-grid';\nimport { Grid } from '@elliemae/ds-grid';\nimport { useFloatingContext, FloatingWrapper, PopoverArrow } from '@elliemae/ds-floating-context';\nimport {\n describe,\n useGetGlobalAttributes,\n useGetXstyledProps,\n useMemoMergePropsWithDefault,\n useValidateTypescriptPropTypes,\n} from '@elliemae/ds-props-helpers';\nimport { mergeRefs } from '@elliemae/ds-system';\nimport React, { useCallback, useMemo, useState, type WeakValidationMap } from 'react';\nimport { COLOR_PALLET } from '../helpers/colorPallet.js';\nimport { DSSingleStackedBarName } from './exported-related/index.js';\nimport { DSSingleStackedBarPropTypes, defaultProps, type DSSingleStackedBarT } from './react-desc-prop-types.js';\nimport { StyledBar, StyledMouseOverDetectionBox, StyledTooltipContainer, Wrapper } from './styles.js';\nconst Bar = React.memo((props: DSSingleStackedBarT.BarT) => {\n const [isHover, setIsHover] = useState(false);\n const { height, TooltipRenderer, datum, tabIndex, isFocused, borderRadius, bg } = props;\n\n const isTooltipOpen = (isFocused || isHover) && !!TooltipRenderer;\n const {\n refs,\n floatingStyles,\n arrowStyles,\n context,\n isOpen: isFloatingOpen,\n } = useFloatingContext({\n externallyControlledIsOpen: isTooltipOpen,\n withoutAnimation: true,\n customOffset: [0, 14],\n });\n\n const handleRefCallback = useCallback(\n (_ref: HTMLDivElement | null) => {\n if (isFocused) {\n _ref?.focus();\n }\n },\n [isFocused],\n );\n\n const handleMouseEnter = useCallback(() => {\n setIsHover(true);\n }, []);\n\n const handleMouseLeave = useCallback(() => {\n setIsHover(false);\n }, []);\n\n const backgroundColor =\n datum.color in COLOR_PALLET ? COLOR_PALLET[datum.color as keyof typeof COLOR_PALLET] : datum.color;\n return (\n <div>\n {TooltipRenderer && (\n <FloatingWrapper\n innerRef={refs.setFloating}\n isOpen={isFloatingOpen}\n floatingStyles={floatingStyles}\n context={context}\n >\n <StyledMouseOverDetectionBox />\n <StyledTooltipContainer>\n <TooltipRenderer datum={datum} />\n </StyledTooltipContainer>\n <PopoverArrow {...arrowStyles} />\n </FloatingWrapper>\n )}\n <StyledBar\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n bg={backgroundColor}\n height={height}\n borderRadius={borderRadius}\n innerRef={mergeRefs(handleRefCallback, refs.setReference)}\n tabIndex={tabIndex}\n role=\"img\"\n // until uziel work is merged we keep this default value\n aria-label={`${datum.name} value: ${datum.data}`}\n />\n </div>\n );\n});\n\nconst DSSingleStackedBar: React.ComponentType<DSSingleStackedBarT.Props> = (props) => {\n const propsWithDefaults = useMemoMergePropsWithDefault<DSSingleStackedBarT.InternalProps>(props, defaultProps);\n useValidateTypescriptPropTypes(propsWithDefaults, DSSingleStackedBarPropTypes, 'DSSingleStackedBar');\n\n const globalAttributes = useGetGlobalAttributes<DSSingleStackedBarT.InternalProps, HTMLDivElement, DSGridT.Props>(\n propsWithDefaults,\n );\n\n const xstyledProps = useGetXstyledProps(propsWithDefaults);\n\n const { data, LegendRenderer, gutter, height } = propsWithDefaults;\n const [keyBarFocused, setKeyBarFocused] = useState<number>(0);\n const [isChartFocused, setIsChartFocused] = useState(false);\n\n const total = useMemo(() => data.map((datum) => datum.data).reduce((acc, curr) => acc + curr, 0), [data]);\n const cols = useMemo(() => data.map((datum) => `${Math.ceil(datum.data * 100) / total}%`), [data, total]);\n const rows = useMemo(\n () => (LegendRenderer !== undefined ? [`${height}px`, 'auto'] : [`${height}px`]),\n [LegendRenderer, height],\n );\n const barNames = useMemo(() => data.map((datum) => datum.name), [data]);\n const getBorderRadius = useCallback(\n (index: number) => {\n if (index === 0) return '50px 0 0 50px';\n if (index === data.length - 1) return '0 50px 50px 0';\n return undefined;\n },\n [data.length],\n );\n\n const handleOnKeyDown: React.KeyboardEventHandler = useCallback(\n (e) => {\n if (e.code === 'ArrowRight') {\n if (barNames[keyBarFocused + 1]) {\n setKeyBarFocused(keyBarFocused + 1);\n } else {\n setKeyBarFocused(0);\n }\n }\n if (e.code === 'ArrowLeft') {\n if (barNames[keyBarFocused - 1]) {\n setKeyBarFocused(keyBarFocused - 1);\n } else {\n setKeyBarFocused(barNames.length - 1);\n }\n }\n },\n [keyBarFocused, barNames],\n );\n\n return (\n <Wrapper\n cols={cols}\n gutter={gutter}\n role=\"region\"\n onKeyDown={handleOnKeyDown}\n tabIndex={-1}\n onFocus={() => setIsChartFocused(true)}\n onBlur={(e) => e.currentTarget !== e.target && setIsChartFocused(false)}\n {...xstyledProps}\n {...globalAttributes}\n >\n {data.map((datum, i) => {\n const backgroundColor =\n datum.color in COLOR_PALLET ? COLOR_PALLET[datum.color as keyof typeof COLOR_PALLET] : datum.color;\n return (\n <Grid rows={rows}>\n <Bar\n key={datum.name}\n datum={datum}\n isFocused={barNames[keyBarFocused] === datum.name && isChartFocused}\n borderRadius={getBorderRadius(i)}\n bg={backgroundColor}\n tabIndex={i === keyBarFocused ? 0 : -1}\n {...props}\n />\n {LegendRenderer !== undefined ? <LegendRenderer key={`${datum.name}-legend`} datum={datum} /> : null}\n </Grid>\n );\n })}\n </Wrapper>\n );\n};\n\nDSSingleStackedBar.displayName = DSSingleStackedBarName;\nconst DSSingleStackedBarWithSchema = describe(DSSingleStackedBar);\nDSSingleStackedBarWithSchema.propTypes =\n DSSingleStackedBarPropTypes as unknown as WeakValidationMap<DSSingleStackedBarT.Props>;\n\nexport { DSSingleStackedBar, DSSingleStackedBarWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../src/graphs/Chart/SingleStackedBar/react-desc-prop-types.tsx", "../../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import {
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;
|
|
4
|
+
"sourcesContent": ["import type { DSPropTypesSchema, GlobalAttributesT, XstyledProps } from '@elliemae/ds-props-helpers';\nimport { PropTypes, globalAttributesPropTypes, xstyledPropTypes } from '@elliemae/ds-props-helpers';\nimport { type BorderProps } from '@elliemae/ds-system';\n\nexport declare namespace DSSingleStackedBarT {\n export type DatumT = {\n name: string;\n data: number;\n color: string;\n };\n export type SingleStackedBarDatumT = DatumT[];\n export type TooltipRenderDataT = {\n datum: DatumT;\n };\n export interface SingleStackedBarT {\n data: SingleStackedBarDatumT;\n TooltipRenderer?: React.ComponentType<TooltipRenderDataT>;\n LegendRenderer?: React.ComponentType<TooltipRenderDataT>;\n height: string | number;\n gutter?: string | number;\n }\n\n export interface BarT extends SingleStackedBarT {\n isFocused: boolean;\n borderRadius?: BorderProps['borderRadius'];\n bg: string;\n tabIndex?: 0 | -1;\n datum: DatumT;\n }\n\n export interface RequiredProps {\n height: string | number;\n data: DatumT[];\n }\n\n export interface DefaultProps {\n gutter: string;\n }\n\n export interface OptionalProps {\n TooltipRenderer?: React.ComponentType<TooltipRenderDataT>;\n LegendRenderer?: React.ComponentType<TooltipRenderDataT>;\n }\n\n export interface Props\n extends\n Partial<DefaultProps>,\n OptionalProps,\n Omit<GlobalAttributesT<HTMLButtonElement>, keyof DefaultProps | keyof OptionalProps | keyof RequiredProps>,\n XstyledProps,\n RequiredProps {}\n\n export interface InternalProps\n extends\n DefaultProps,\n OptionalProps,\n Omit<GlobalAttributesT<HTMLButtonElement>, keyof DefaultProps | keyof OptionalProps | keyof RequiredProps>,\n XstyledProps,\n RequiredProps {}\n}\n\nexport const defaultProps: DSSingleStackedBarT.DefaultProps = {\n gutter: 'xxxs',\n};\n\nexport const DSSingleStackedBarPropTypes: DSPropTypesSchema<DSSingleStackedBarT.Props> = {\n ...globalAttributesPropTypes,\n ...xstyledPropTypes,\n height: PropTypes.string.description('Height of the bar').isRequired,\n gutter: PropTypes.string.description('Gap between the bars').defaultValue('xxxs'),\n TooltipRenderer: PropTypes.func.description('Callback function that returns a custom renderer for the tooltip'),\n LegendRenderer: PropTypes.func.description('Callback function that returns a custom renderer for the legend'),\n data: PropTypes.arrayOf(\n PropTypes.shape({ name: PropTypes.string, data: PropTypes.number, color: PropTypes.string }),\n ).description('Array of the series which represent the chart'),\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,8BAAuE;AA4DhE,MAAM,eAAiD;AAAA,EAC5D,QAAQ;AACV;AAEO,MAAM,8BAA4E;AAAA,EACvF,GAAG;AAAA,EACH,GAAG;AAAA,EACH,QAAQ,kCAAU,OAAO,YAAY,mBAAmB,EAAE;AAAA,EAC1D,QAAQ,kCAAU,OAAO,YAAY,sBAAsB,EAAE,aAAa,MAAM;AAAA,EAChF,iBAAiB,kCAAU,KAAK,YAAY,kEAAkE;AAAA,EAC9G,gBAAgB,kCAAU,KAAK,YAAY,iEAAiE;AAAA,EAC5G,MAAM,kCAAU;AAAA,IACd,kCAAU,MAAM,EAAE,MAAM,kCAAU,QAAQ,MAAM,kCAAU,QAAQ,OAAO,kCAAU,OAAO,CAAC;AAAA,EAC7F,EAAE,YAAY,+CAA+C;AAC/D;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -44,6 +44,7 @@ const Bar = React2.memo((props) => {
|
|
|
44
44
|
const handleMouseLeave = useCallback(() => {
|
|
45
45
|
setIsHover(false);
|
|
46
46
|
}, []);
|
|
47
|
+
const backgroundColor = datum.color in COLOR_PALLET ? COLOR_PALLET[datum.color] : datum.color;
|
|
47
48
|
return /* @__PURE__ */ jsxs("div", { children: [
|
|
48
49
|
TooltipRenderer && /* @__PURE__ */ jsxs(
|
|
49
50
|
FloatingWrapper,
|
|
@@ -64,7 +65,7 @@ const Bar = React2.memo((props) => {
|
|
|
64
65
|
{
|
|
65
66
|
onMouseEnter: handleMouseEnter,
|
|
66
67
|
onMouseLeave: handleMouseLeave,
|
|
67
|
-
bg,
|
|
68
|
+
bg: backgroundColor,
|
|
68
69
|
height,
|
|
69
70
|
borderRadius,
|
|
70
71
|
innerRef: mergeRefs(handleRefCallback, refs.setReference),
|
|
@@ -131,21 +132,24 @@ const DSSingleStackedBar = (props) => {
|
|
|
131
132
|
onBlur: (e) => e.currentTarget !== e.target && setIsChartFocused(false),
|
|
132
133
|
...xstyledProps,
|
|
133
134
|
...globalAttributes,
|
|
134
|
-
children: data.map((datum, i) =>
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
135
|
+
children: data.map((datum, i) => {
|
|
136
|
+
const backgroundColor = datum.color in COLOR_PALLET ? COLOR_PALLET[datum.color] : datum.color;
|
|
137
|
+
return /* @__PURE__ */ jsxs(Grid, { rows, children: [
|
|
138
|
+
/* @__PURE__ */ jsx(
|
|
139
|
+
Bar,
|
|
140
|
+
{
|
|
141
|
+
datum,
|
|
142
|
+
isFocused: barNames[keyBarFocused] === datum.name && isChartFocused,
|
|
143
|
+
borderRadius: getBorderRadius(i),
|
|
144
|
+
bg: backgroundColor,
|
|
145
|
+
tabIndex: i === keyBarFocused ? 0 : -1,
|
|
146
|
+
...props
|
|
147
|
+
},
|
|
148
|
+
datum.name
|
|
149
|
+
),
|
|
150
|
+
LegendRenderer !== void 0 ? /* @__PURE__ */ jsx(LegendRenderer, { datum }, `${datum.name}-legend`) : null
|
|
151
|
+
] });
|
|
152
|
+
})
|
|
149
153
|
}
|
|
150
154
|
);
|
|
151
155
|
};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../src/graphs/Chart/SingleStackedBar/SingleStackedBar.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport type { DSGridT } from '@elliemae/ds-grid';\nimport { Grid } from '@elliemae/ds-grid';\nimport { useFloatingContext, FloatingWrapper, PopoverArrow } from '@elliemae/ds-floating-context';\nimport {\n describe,\n useGetGlobalAttributes,\n useGetXstyledProps,\n useMemoMergePropsWithDefault,\n useValidateTypescriptPropTypes,\n} from '@elliemae/ds-props-helpers';\nimport { mergeRefs } from '@elliemae/ds-system';\nimport React, { useCallback, useMemo, useState, type WeakValidationMap } from 'react';\nimport { COLOR_PALLET } from '../helpers/colorPallet.js';\nimport { DSSingleStackedBarName } from './exported-related/index.js';\nimport { DSSingleStackedBarPropTypes, defaultProps, type DSSingleStackedBarT } from './react-desc-prop-types.js';\nimport { StyledBar, StyledMouseOverDetectionBox, StyledTooltipContainer, Wrapper } from './styles.js';\nconst Bar = React.memo((props: DSSingleStackedBarT.BarT) => {\n const [isHover, setIsHover] = useState(false);\n const { height, TooltipRenderer, datum, tabIndex, isFocused, borderRadius, bg } = props;\n\n const isTooltipOpen = (isFocused || isHover) && !!TooltipRenderer;\n const {\n refs,\n floatingStyles,\n arrowStyles,\n context,\n isOpen: isFloatingOpen,\n } = useFloatingContext({\n externallyControlledIsOpen: isTooltipOpen,\n withoutAnimation: true,\n customOffset: [0, 14],\n });\n\n const handleRefCallback = useCallback(\n (_ref: HTMLDivElement | null) => {\n if (isFocused) {\n _ref?.focus();\n }\n },\n [isFocused],\n );\n\n const handleMouseEnter = useCallback(() => {\n setIsHover(true);\n }, []);\n\n const handleMouseLeave = useCallback(() => {\n setIsHover(false);\n }, []);\n return (\n <div>\n {TooltipRenderer && (\n <FloatingWrapper\n innerRef={refs.setFloating}\n isOpen={isFloatingOpen}\n floatingStyles={floatingStyles}\n context={context}\n >\n <StyledMouseOverDetectionBox />\n <StyledTooltipContainer>\n <TooltipRenderer datum={datum} />\n </StyledTooltipContainer>\n <PopoverArrow {...arrowStyles} />\n </FloatingWrapper>\n )}\n <StyledBar\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n bg={
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport type { DSGridT } from '@elliemae/ds-grid';\nimport { Grid } from '@elliemae/ds-grid';\nimport { useFloatingContext, FloatingWrapper, PopoverArrow } from '@elliemae/ds-floating-context';\nimport {\n describe,\n useGetGlobalAttributes,\n useGetXstyledProps,\n useMemoMergePropsWithDefault,\n useValidateTypescriptPropTypes,\n} from '@elliemae/ds-props-helpers';\nimport { mergeRefs } from '@elliemae/ds-system';\nimport React, { useCallback, useMemo, useState, type WeakValidationMap } from 'react';\nimport { COLOR_PALLET } from '../helpers/colorPallet.js';\nimport { DSSingleStackedBarName } from './exported-related/index.js';\nimport { DSSingleStackedBarPropTypes, defaultProps, type DSSingleStackedBarT } from './react-desc-prop-types.js';\nimport { StyledBar, StyledMouseOverDetectionBox, StyledTooltipContainer, Wrapper } from './styles.js';\nconst Bar = React.memo((props: DSSingleStackedBarT.BarT) => {\n const [isHover, setIsHover] = useState(false);\n const { height, TooltipRenderer, datum, tabIndex, isFocused, borderRadius, bg } = props;\n\n const isTooltipOpen = (isFocused || isHover) && !!TooltipRenderer;\n const {\n refs,\n floatingStyles,\n arrowStyles,\n context,\n isOpen: isFloatingOpen,\n } = useFloatingContext({\n externallyControlledIsOpen: isTooltipOpen,\n withoutAnimation: true,\n customOffset: [0, 14],\n });\n\n const handleRefCallback = useCallback(\n (_ref: HTMLDivElement | null) => {\n if (isFocused) {\n _ref?.focus();\n }\n },\n [isFocused],\n );\n\n const handleMouseEnter = useCallback(() => {\n setIsHover(true);\n }, []);\n\n const handleMouseLeave = useCallback(() => {\n setIsHover(false);\n }, []);\n\n const backgroundColor =\n datum.color in COLOR_PALLET ? COLOR_PALLET[datum.color as keyof typeof COLOR_PALLET] : datum.color;\n return (\n <div>\n {TooltipRenderer && (\n <FloatingWrapper\n innerRef={refs.setFloating}\n isOpen={isFloatingOpen}\n floatingStyles={floatingStyles}\n context={context}\n >\n <StyledMouseOverDetectionBox />\n <StyledTooltipContainer>\n <TooltipRenderer datum={datum} />\n </StyledTooltipContainer>\n <PopoverArrow {...arrowStyles} />\n </FloatingWrapper>\n )}\n <StyledBar\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n bg={backgroundColor}\n height={height}\n borderRadius={borderRadius}\n innerRef={mergeRefs(handleRefCallback, refs.setReference)}\n tabIndex={tabIndex}\n role=\"img\"\n // until uziel work is merged we keep this default value\n aria-label={`${datum.name} value: ${datum.data}`}\n />\n </div>\n );\n});\n\nconst DSSingleStackedBar: React.ComponentType<DSSingleStackedBarT.Props> = (props) => {\n const propsWithDefaults = useMemoMergePropsWithDefault<DSSingleStackedBarT.InternalProps>(props, defaultProps);\n useValidateTypescriptPropTypes(propsWithDefaults, DSSingleStackedBarPropTypes, 'DSSingleStackedBar');\n\n const globalAttributes = useGetGlobalAttributes<DSSingleStackedBarT.InternalProps, HTMLDivElement, DSGridT.Props>(\n propsWithDefaults,\n );\n\n const xstyledProps = useGetXstyledProps(propsWithDefaults);\n\n const { data, LegendRenderer, gutter, height } = propsWithDefaults;\n const [keyBarFocused, setKeyBarFocused] = useState<number>(0);\n const [isChartFocused, setIsChartFocused] = useState(false);\n\n const total = useMemo(() => data.map((datum) => datum.data).reduce((acc, curr) => acc + curr, 0), [data]);\n const cols = useMemo(() => data.map((datum) => `${Math.ceil(datum.data * 100) / total}%`), [data, total]);\n const rows = useMemo(\n () => (LegendRenderer !== undefined ? [`${height}px`, 'auto'] : [`${height}px`]),\n [LegendRenderer, height],\n );\n const barNames = useMemo(() => data.map((datum) => datum.name), [data]);\n const getBorderRadius = useCallback(\n (index: number) => {\n if (index === 0) return '50px 0 0 50px';\n if (index === data.length - 1) return '0 50px 50px 0';\n return undefined;\n },\n [data.length],\n );\n\n const handleOnKeyDown: React.KeyboardEventHandler = useCallback(\n (e) => {\n if (e.code === 'ArrowRight') {\n if (barNames[keyBarFocused + 1]) {\n setKeyBarFocused(keyBarFocused + 1);\n } else {\n setKeyBarFocused(0);\n }\n }\n if (e.code === 'ArrowLeft') {\n if (barNames[keyBarFocused - 1]) {\n setKeyBarFocused(keyBarFocused - 1);\n } else {\n setKeyBarFocused(barNames.length - 1);\n }\n }\n },\n [keyBarFocused, barNames],\n );\n\n return (\n <Wrapper\n cols={cols}\n gutter={gutter}\n role=\"region\"\n onKeyDown={handleOnKeyDown}\n tabIndex={-1}\n onFocus={() => setIsChartFocused(true)}\n onBlur={(e) => e.currentTarget !== e.target && setIsChartFocused(false)}\n {...xstyledProps}\n {...globalAttributes}\n >\n {data.map((datum, i) => {\n const backgroundColor =\n datum.color in COLOR_PALLET ? COLOR_PALLET[datum.color as keyof typeof COLOR_PALLET] : datum.color;\n return (\n <Grid rows={rows}>\n <Bar\n key={datum.name}\n datum={datum}\n isFocused={barNames[keyBarFocused] === datum.name && isChartFocused}\n borderRadius={getBorderRadius(i)}\n bg={backgroundColor}\n tabIndex={i === keyBarFocused ? 0 : -1}\n {...props}\n />\n {LegendRenderer !== undefined ? <LegendRenderer key={`${datum.name}-legend`} datum={datum} /> : null}\n </Grid>\n );\n })}\n </Wrapper>\n );\n};\n\nDSSingleStackedBar.displayName = DSSingleStackedBarName;\nconst DSSingleStackedBarWithSchema = describe(DSSingleStackedBar);\nDSSingleStackedBarWithSchema.propTypes =\n DSSingleStackedBarPropTypes as unknown as WeakValidationMap<DSSingleStackedBarT.Props>;\n\nexport { DSSingleStackedBar, DSSingleStackedBarWithSchema };\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../src/graphs/Chart/SingleStackedBar/react-desc-prop-types.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import {
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import type { DSPropTypesSchema, GlobalAttributesT, XstyledProps } from '@elliemae/ds-props-helpers';\nimport { PropTypes, globalAttributesPropTypes, xstyledPropTypes } from '@elliemae/ds-props-helpers';\nimport { type BorderProps } from '@elliemae/ds-system';\n\nexport declare namespace DSSingleStackedBarT {\n export type DatumT = {\n name: string;\n data: number;\n color: string;\n };\n export type SingleStackedBarDatumT = DatumT[];\n export type TooltipRenderDataT = {\n datum: DatumT;\n };\n export interface SingleStackedBarT {\n data: SingleStackedBarDatumT;\n TooltipRenderer?: React.ComponentType<TooltipRenderDataT>;\n LegendRenderer?: React.ComponentType<TooltipRenderDataT>;\n height: string | number;\n gutter?: string | number;\n }\n\n export interface BarT extends SingleStackedBarT {\n isFocused: boolean;\n borderRadius?: BorderProps['borderRadius'];\n bg: string;\n tabIndex?: 0 | -1;\n datum: DatumT;\n }\n\n export interface RequiredProps {\n height: string | number;\n data: DatumT[];\n }\n\n export interface DefaultProps {\n gutter: string;\n }\n\n export interface OptionalProps {\n TooltipRenderer?: React.ComponentType<TooltipRenderDataT>;\n LegendRenderer?: React.ComponentType<TooltipRenderDataT>;\n }\n\n export interface Props\n extends\n Partial<DefaultProps>,\n OptionalProps,\n Omit<GlobalAttributesT<HTMLButtonElement>, keyof DefaultProps | keyof OptionalProps | keyof RequiredProps>,\n XstyledProps,\n RequiredProps {}\n\n export interface InternalProps\n extends\n DefaultProps,\n OptionalProps,\n Omit<GlobalAttributesT<HTMLButtonElement>, keyof DefaultProps | keyof OptionalProps | keyof RequiredProps>,\n XstyledProps,\n RequiredProps {}\n}\n\nexport const defaultProps: DSSingleStackedBarT.DefaultProps = {\n gutter: 'xxxs',\n};\n\nexport const DSSingleStackedBarPropTypes: DSPropTypesSchema<DSSingleStackedBarT.Props> = {\n ...globalAttributesPropTypes,\n ...xstyledPropTypes,\n height: PropTypes.string.description('Height of the bar').isRequired,\n gutter: PropTypes.string.description('Gap between the bars').defaultValue('xxxs'),\n TooltipRenderer: PropTypes.func.description('Callback function that returns a custom renderer for the tooltip'),\n LegendRenderer: PropTypes.func.description('Callback function that returns a custom renderer for the legend'),\n data: PropTypes.arrayOf(\n PropTypes.shape({ name: PropTypes.string, data: PropTypes.number, color: PropTypes.string }),\n ).description('Array of the series which represent the chart'),\n};\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACCvB,SAAS,WAAW,2BAA2B,wBAAwB;AA4DhE,MAAM,eAAiD;AAAA,EAC5D,QAAQ;AACV;AAEO,MAAM,8BAA4E;AAAA,EACvF,GAAG;AAAA,EACH,GAAG;AAAA,EACH,QAAQ,UAAU,OAAO,YAAY,mBAAmB,EAAE;AAAA,EAC1D,QAAQ,UAAU,OAAO,YAAY,sBAAsB,EAAE,aAAa,MAAM;AAAA,EAChF,iBAAiB,UAAU,KAAK,YAAY,kEAAkE;AAAA,EAC9G,gBAAgB,UAAU,KAAK,YAAY,iEAAiE;AAAA,EAC5G,MAAM,UAAU;AAAA,IACd,UAAU,MAAM,EAAE,MAAM,UAAU,QAAQ,MAAM,UAAU,QAAQ,OAAO,UAAU,OAAO,CAAC;AAAA,EAC7F,EAAE,YAAY,+CAA+C;AAC/D;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import type { GlobalAttributesT, XstyledProps
|
|
2
|
-
import { type
|
|
1
|
+
import type { DSPropTypesSchema, GlobalAttributesT, XstyledProps } from '@elliemae/ds-props-helpers';
|
|
2
|
+
import { type BorderProps } from '@elliemae/ds-system';
|
|
3
3
|
export declare namespace DSSingleStackedBarT {
|
|
4
4
|
type DatumT = {
|
|
5
5
|
name: string;
|
|
@@ -20,7 +20,7 @@ export declare namespace DSSingleStackedBarT {
|
|
|
20
20
|
interface BarT extends SingleStackedBarT {
|
|
21
21
|
isFocused: boolean;
|
|
22
22
|
borderRadius?: BorderProps['borderRadius'];
|
|
23
|
-
bg:
|
|
23
|
+
bg: string;
|
|
24
24
|
tabIndex?: 0 | -1;
|
|
25
25
|
datum: DatumT;
|
|
26
26
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@elliemae/ds-dataviz",
|
|
3
|
-
"version": "3.70.0-next.
|
|
3
|
+
"version": "3.70.0-next.69",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "ICE MT - Dimsum - DataViz",
|
|
6
6
|
"files": [
|
|
@@ -39,18 +39,18 @@
|
|
|
39
39
|
"d3": "~7.9.0",
|
|
40
40
|
"resize-observer-polyfill": "~1.5.1",
|
|
41
41
|
"uid": "^2.0.2",
|
|
42
|
-
"@elliemae/ds-floating-context": "3.70.0-next.
|
|
43
|
-
"@elliemae/ds-props-helpers": "3.70.0-next.
|
|
44
|
-
"@elliemae/ds-grid": "3.70.0-next.
|
|
45
|
-
"@elliemae/ds-system": "3.70.0-next.
|
|
42
|
+
"@elliemae/ds-floating-context": "3.70.0-next.69",
|
|
43
|
+
"@elliemae/ds-props-helpers": "3.70.0-next.69",
|
|
44
|
+
"@elliemae/ds-grid": "3.70.0-next.69",
|
|
45
|
+
"@elliemae/ds-system": "3.70.0-next.69"
|
|
46
46
|
},
|
|
47
47
|
"devDependencies": {
|
|
48
48
|
"@elliemae/pui-theme": "~2.13.0",
|
|
49
49
|
"@types/d3": "~7.4.0",
|
|
50
50
|
"jest": "^30.0.0",
|
|
51
51
|
"styled-components": "~5.3.11",
|
|
52
|
-
"@elliemae/ds-monorepo-devops": "3.70.0-next.
|
|
53
|
-
"@elliemae/ds-test-utils": "3.70.0-next.
|
|
52
|
+
"@elliemae/ds-monorepo-devops": "3.70.0-next.69",
|
|
53
|
+
"@elliemae/ds-test-utils": "3.70.0-next.69"
|
|
54
54
|
},
|
|
55
55
|
"peerDependencies": {
|
|
56
56
|
"@elliemae/pui-theme": "~2.13.0",
|