@elliemae/ds-circular-progress-indicator 3.80.0-next.55 → 3.80.0-next.57
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/DSCircularProgressIndicator.js +60 -103
- package/dist/cjs/DSCircularProgressIndicator.js.map +2 -2
- package/dist/cjs/constants/index.js +158 -0
- package/dist/cjs/constants/index.js.map +7 -0
- package/dist/cjs/index.js +9 -6
- package/dist/cjs/index.js.map +3 -3
- package/dist/cjs/react-desc-prop-types.js +53 -0
- package/dist/cjs/react-desc-prop-types.js.map +7 -0
- package/dist/cjs/typescript-testing/slot-props.js +43 -0
- package/dist/cjs/typescript-testing/slot-props.js.map +7 -0
- package/dist/cjs/typescript-testing/typescript-circular-indeterminate-indicator-valid.js +108 -0
- package/dist/cjs/typescript-testing/typescript-circular-indeterminate-indicator-valid.js.map +7 -0
- package/dist/cjs/typescript-testing/typescript-circular-progress-indicator-valid.js +74 -0
- package/dist/cjs/typescript-testing/typescript-circular-progress-indicator-valid.js.map +7 -0
- package/dist/cjs/v2/DSCircularIndeterminateIndicator.js +22 -7
- package/dist/cjs/v2/DSCircularIndeterminateIndicator.js.map +2 -2
- package/dist/cjs/v2/index.js +0 -2
- package/dist/cjs/v2/index.js.map +2 -2
- package/dist/cjs/v2/react-desc-prop-types.js +6 -1
- package/dist/cjs/v2/react-desc-prop-types.js.map +2 -2
- package/dist/cjs/v2/styled.js +30 -8
- package/dist/cjs/v2/styled.js.map +2 -2
- package/dist/esm/DSCircularProgressIndicator.js +71 -104
- package/dist/esm/DSCircularProgressIndicator.js.map +2 -2
- package/dist/esm/constants/index.js +128 -0
- package/dist/esm/constants/index.js.map +7 -0
- package/dist/esm/index.js +11 -5
- package/dist/esm/index.js.map +3 -3
- package/dist/esm/react-desc-prop-types.js +23 -0
- package/dist/esm/react-desc-prop-types.js.map +7 -0
- package/dist/esm/typescript-testing/slot-props.js +20 -0
- package/dist/esm/typescript-testing/slot-props.js.map +7 -0
- package/dist/esm/typescript-testing/typescript-circular-indeterminate-indicator-valid.js +85 -0
- package/dist/esm/typescript-testing/typescript-circular-indeterminate-indicator-valid.js.map +7 -0
- package/dist/esm/typescript-testing/typescript-circular-progress-indicator-valid.js +51 -0
- package/dist/esm/typescript-testing/typescript-circular-progress-indicator-valid.js.map +7 -0
- package/dist/esm/v2/DSCircularIndeterminateIndicator.js +25 -9
- package/dist/esm/v2/DSCircularIndeterminateIndicator.js.map +2 -2
- package/dist/esm/v2/index.js +0 -1
- package/dist/esm/v2/index.js.map +2 -2
- package/dist/esm/v2/react-desc-prop-types.js +12 -2
- package/dist/esm/v2/react-desc-prop-types.js.map +2 -2
- package/dist/esm/v2/styled.js +31 -9
- package/dist/esm/v2/styled.js.map +2 -2
- package/dist/types/DSCircularProgressIndicator.d.ts +6 -26
- package/dist/types/constants/index.d.ts +83 -0
- package/dist/types/index.d.ts +5 -4
- package/dist/types/react-desc-prop-types.d.ts +22 -0
- package/dist/types/v2/index.d.ts +1 -1
- package/dist/types/v2/react-desc-prop-types.d.ts +17 -6
- package/package.json +10 -8
- package/dist/cjs/v2/constants.js +0 -80
- package/dist/cjs/v2/constants.js.map +0 -7
- package/dist/esm/v2/constants.js +0 -50
- package/dist/esm/v2/constants.js.map +0 -7
- package/dist/types/v2/constants.d.ts +0 -39
|
@@ -1,102 +1,74 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
2
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
3
3
|
import { convertPropToCssClassName } from "@elliemae/ds-classnames";
|
|
4
|
-
import { describe,
|
|
4
|
+
import { describe, useDeprecateComponent } from "@elliemae/ds-props-helpers";
|
|
5
5
|
import { DSTooltipV3 } from "@elliemae/ds-tooltip-v3";
|
|
6
|
-
|
|
7
|
-
|
|
6
|
+
import { DSTypography } from "@elliemae/ds-typography";
|
|
7
|
+
import {
|
|
8
|
+
DSCircularProgressIndicatorPropTypesSchema,
|
|
9
|
+
defaultProps
|
|
10
|
+
} from "./react-desc-prop-types.js";
|
|
11
|
+
import {
|
|
12
|
+
CIRCULAR_PROGRESS_INDICATOR_DATA_TESTID,
|
|
13
|
+
CIRCULAR_PROGRESS_INDICATOR_TOOLTIP_ID,
|
|
14
|
+
DSCircularProgressIndicatorName,
|
|
15
|
+
legacyBaseGeometry,
|
|
16
|
+
legacyGeometryBySize,
|
|
17
|
+
legacyInheritedTypography
|
|
18
|
+
} from "./constants/index.js";
|
|
19
|
+
const legacyClassNames = convertPropToCssClassName("circular-progress-indicator");
|
|
20
|
+
const withLegacyDefaults = ({
|
|
21
|
+
size = defaultProps.size,
|
|
22
|
+
showLabel = defaultProps.showLabel,
|
|
23
|
+
showTooltip = defaultProps.showTooltip,
|
|
24
|
+
waiting = defaultProps.waiting,
|
|
25
|
+
loading = defaultProps.loading
|
|
26
|
+
}) => ({
|
|
27
|
+
size,
|
|
28
|
+
showLabel,
|
|
29
|
+
showTooltip,
|
|
30
|
+
waiting,
|
|
31
|
+
loading
|
|
32
|
+
});
|
|
33
|
+
const DSCircularProgressIndicator = (props) => {
|
|
8
34
|
useDeprecateComponent({ componentName: "ds-circular-progress-indicator", version: "TBD Date: 2023 Q3" });
|
|
35
|
+
const { size, showLabel, showTooltip, waiting, loading } = withLegacyDefaults(props);
|
|
9
36
|
const waitingLabel = "Waiting...";
|
|
10
37
|
const loadingLabel = "Loading...";
|
|
11
38
|
const currentLabel = waiting && !loading ? waitingLabel : loadingLabel;
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
sizePx = 8;
|
|
23
|
-
sizeLabel = 12;
|
|
24
|
-
strokeWidth = 10;
|
|
25
|
-
trackWidth = 3;
|
|
26
|
-
markerHeight = "1";
|
|
27
|
-
grayArcStrokeDasharray = "46 174";
|
|
28
|
-
grayArcStrokeDashoffset = "133";
|
|
29
|
-
break;
|
|
30
|
-
case "S":
|
|
31
|
-
sizePx = 16;
|
|
32
|
-
sizeLabel = 12;
|
|
33
|
-
strokeWidth = 8;
|
|
34
|
-
trackWidth = 3;
|
|
35
|
-
markerHeight = "1";
|
|
36
|
-
grayArcStrokeDasharray = "46 174";
|
|
37
|
-
grayArcStrokeDashoffset = "133";
|
|
38
|
-
break;
|
|
39
|
-
case "M":
|
|
40
|
-
sizePx = 24;
|
|
41
|
-
sizeLabel = 12;
|
|
42
|
-
strokeWidth = 7;
|
|
43
|
-
trackWidth = 3;
|
|
44
|
-
markerHeight = "1";
|
|
45
|
-
markerRefY = "5.5";
|
|
46
|
-
grayArcStrokeDasharray = "46 174";
|
|
47
|
-
grayArcStrokeDashoffset = "133";
|
|
48
|
-
break;
|
|
49
|
-
case "L":
|
|
50
|
-
sizePx = 32;
|
|
51
|
-
sizeLabel = 13;
|
|
52
|
-
strokeWidth = 6;
|
|
53
|
-
trackWidth = 3;
|
|
54
|
-
markerRefY = "5";
|
|
55
|
-
break;
|
|
56
|
-
case "XL":
|
|
57
|
-
sizePx = 48;
|
|
58
|
-
sizeLabel = 14;
|
|
59
|
-
strokeWidth = 5;
|
|
60
|
-
trackWidth = 1;
|
|
61
|
-
break;
|
|
62
|
-
case "XXL":
|
|
63
|
-
sizePx = 56;
|
|
64
|
-
sizeLabel = 16;
|
|
65
|
-
strokeWidth = 4;
|
|
66
|
-
trackWidth = 1;
|
|
67
|
-
break;
|
|
68
|
-
case "XXXL":
|
|
69
|
-
sizePx = 64;
|
|
70
|
-
sizeLabel = 16;
|
|
71
|
-
strokeWidth = 5;
|
|
72
|
-
trackWidth = 2;
|
|
73
|
-
break;
|
|
74
|
-
default:
|
|
75
|
-
break;
|
|
76
|
-
}
|
|
39
|
+
const {
|
|
40
|
+
sizePx,
|
|
41
|
+
sizeLabel,
|
|
42
|
+
strokeWidth,
|
|
43
|
+
trackWidth,
|
|
44
|
+
markerHeight,
|
|
45
|
+
markerRefY,
|
|
46
|
+
grayArcStrokeDasharray,
|
|
47
|
+
grayArcStrokeDashoffset
|
|
48
|
+
} = { ...legacyBaseGeometry, ...legacyGeometryBySize[size.toUpperCase()] };
|
|
77
49
|
const labelText = /* @__PURE__ */ jsx(
|
|
78
50
|
"p",
|
|
79
51
|
{
|
|
80
|
-
"data-testid":
|
|
81
|
-
className: classNameElement("label"),
|
|
52
|
+
"data-testid": CIRCULAR_PROGRESS_INDICATOR_DATA_TESTID.LABEL,
|
|
53
|
+
className: legacyClassNames.classNameElement("label"),
|
|
82
54
|
style: { fontSize: `${sizeLabel}px` },
|
|
83
|
-
children: currentLabel
|
|
55
|
+
children: /* @__PURE__ */ jsx(DSTypography, { component: "span", variant: "b2", style: legacyInheritedTypography, children: currentLabel })
|
|
84
56
|
}
|
|
85
57
|
);
|
|
86
|
-
const buildIndicator = (
|
|
58
|
+
const buildIndicator = (indicatorElement) => sizePx !== void 0 && sizePx < 17 || showTooltip ? /* @__PURE__ */ jsx(
|
|
87
59
|
DSTooltipV3,
|
|
88
60
|
{
|
|
89
|
-
id:
|
|
61
|
+
id: CIRCULAR_PROGRESS_INDICATOR_TOOLTIP_ID,
|
|
90
62
|
text: currentLabel,
|
|
91
63
|
startPlacementPreference: "bottom",
|
|
92
|
-
"data-testid":
|
|
93
|
-
children:
|
|
64
|
+
"data-testid": CIRCULAR_PROGRESS_INDICATOR_TOOLTIP_ID,
|
|
65
|
+
children: indicatorElement
|
|
94
66
|
}
|
|
95
|
-
) :
|
|
67
|
+
) : indicatorElement;
|
|
96
68
|
const grayTrack = /* @__PURE__ */ jsx(
|
|
97
69
|
"circle",
|
|
98
70
|
{
|
|
99
|
-
className: classNameElement("track"),
|
|
71
|
+
className: legacyClassNames.classNameElement("track"),
|
|
100
72
|
cx: "50%",
|
|
101
73
|
cy: "50%",
|
|
102
74
|
fill: "none",
|
|
@@ -107,7 +79,7 @@ const CircularProgressIndicator = ({ size, showLabel, showTooltip, waiting, load
|
|
|
107
79
|
const grayArc = /* @__PURE__ */ jsx(
|
|
108
80
|
"circle",
|
|
109
81
|
{
|
|
110
|
-
className: classNameElement("arc-gray"),
|
|
82
|
+
className: legacyClassNames.classNameElement("arc-gray"),
|
|
111
83
|
stroke: "#E0E3E8",
|
|
112
84
|
strokeDasharray: `${grayArcStrokeDasharray}`,
|
|
113
85
|
strokeDashoffset: `${grayArcStrokeDashoffset}`,
|
|
@@ -125,7 +97,7 @@ const CircularProgressIndicator = ({ size, showLabel, showTooltip, waiting, load
|
|
|
125
97
|
version: "1.1",
|
|
126
98
|
viewBox: "0 0 66 66",
|
|
127
99
|
width: `${sizePx}px`,
|
|
128
|
-
"data-testid":
|
|
100
|
+
"data-testid": CIRCULAR_PROGRESS_INDICATOR_DATA_TESTID.INDICATOR,
|
|
129
101
|
"aria-label": waiting && !loading ? waitingLabel : loadingLabel,
|
|
130
102
|
children: [
|
|
131
103
|
/* @__PURE__ */ jsxs("defs", { children: [
|
|
@@ -172,18 +144,18 @@ const CircularProgressIndicator = ({ size, showLabel, showTooltip, waiting, load
|
|
|
172
144
|
/* @__PURE__ */ jsx(
|
|
173
145
|
"path",
|
|
174
146
|
{
|
|
175
|
-
className: classNameElement("arc-blue"),
|
|
147
|
+
className: legacyClassNames.classNameElement("arc-blue"),
|
|
176
148
|
d: "M30,5 C17.536025,6 6,17.536027 5,31",
|
|
177
149
|
stroke: "#5594e2",
|
|
178
150
|
strokeWidth: `${strokeWidth - 0.5}px`,
|
|
179
151
|
strokeLinecap: "round",
|
|
180
|
-
"data-testid":
|
|
152
|
+
"data-testid": CIRCULAR_PROGRESS_INDICATOR_DATA_TESTID.BLUE_ARC
|
|
181
153
|
}
|
|
182
154
|
),
|
|
183
155
|
/* @__PURE__ */ jsx(
|
|
184
156
|
"path",
|
|
185
157
|
{
|
|
186
|
-
className: classNameElement("arc-white"),
|
|
158
|
+
className: legacyClassNames.classNameElement("arc-white"),
|
|
187
159
|
d: "M33,5 C17.536027,5 5,17.536027 5,33",
|
|
188
160
|
stroke: "#FFF",
|
|
189
161
|
strokeWidth: `${strokeWidth + 2}px`,
|
|
@@ -196,31 +168,26 @@ const CircularProgressIndicator = ({ size, showLabel, showTooltip, waiting, load
|
|
|
196
168
|
]
|
|
197
169
|
}
|
|
198
170
|
);
|
|
199
|
-
return /* @__PURE__ */ jsxs(
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
const circularProgressIndicatorProps = {
|
|
212
|
-
size: PropTypes.oneOf(["xs", "s", "m", "l", "xl", "xxl", "xxxl"]).description("Defines the size of the indicator").defaultValue("m"),
|
|
213
|
-
showLabel: PropTypes.bool.description("Wheter the indicator displays its state on a label or not").defaultValue(false),
|
|
214
|
-
showTooltip: PropTypes.bool.description("Wheter the indicator displays its state on a tooltip or not").defaultValue(false),
|
|
215
|
-
waiting: PropTypes.bool.description("Defines the state of the indicator as Waiting and only displays the gray track").defaultValue(false),
|
|
216
|
-
loading: PropTypes.bool.description("Defines the state of the indicator as Loading and displays a blue spinner animation").defaultValue(false)
|
|
171
|
+
return /* @__PURE__ */ jsxs(
|
|
172
|
+
"div",
|
|
173
|
+
{
|
|
174
|
+
className: legacyClassNames.classNameBlock("wrapper"),
|
|
175
|
+
role: "status",
|
|
176
|
+
"aria-hidden": waiting || loading ? "false" : "true",
|
|
177
|
+
children: [
|
|
178
|
+
buildIndicator(indicator),
|
|
179
|
+
showLabel && labelText
|
|
180
|
+
]
|
|
181
|
+
}
|
|
182
|
+
);
|
|
217
183
|
};
|
|
218
|
-
|
|
219
|
-
const CircularProgressIndicatorWithSchema = describe(
|
|
220
|
-
CircularProgressIndicatorWithSchema.propTypes =
|
|
221
|
-
var DSCircularProgressIndicator_default =
|
|
184
|
+
DSCircularProgressIndicator.displayName = DSCircularProgressIndicatorName;
|
|
185
|
+
const CircularProgressIndicatorWithSchema = describe(DSCircularProgressIndicator);
|
|
186
|
+
CircularProgressIndicatorWithSchema.propTypes = DSCircularProgressIndicatorPropTypesSchema;
|
|
187
|
+
var DSCircularProgressIndicator_default = DSCircularProgressIndicator;
|
|
222
188
|
export {
|
|
223
189
|
CircularProgressIndicatorWithSchema,
|
|
190
|
+
DSCircularProgressIndicator,
|
|
224
191
|
DSCircularProgressIndicator_default as default
|
|
225
192
|
};
|
|
226
193
|
//# sourceMappingURL=DSCircularProgressIndicator.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/DSCircularProgressIndicator.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { convertPropToCssClassName } from '@elliemae/ds-classnames';\nimport { describe, useDeprecateComponent } from '@elliemae/ds-props-helpers';\nimport { DSTooltipV3 } from '@elliemae/ds-tooltip-v3';\nimport { DSTypography } from '@elliemae/ds-typography';\nimport {\n type DSCircularProgressIndicatorT,\n DSCircularProgressIndicatorPropTypesSchema,\n defaultProps,\n} from './react-desc-prop-types.js';\nimport {\n CIRCULAR_PROGRESS_INDICATOR_DATA_TESTID,\n CIRCULAR_PROGRESS_INDICATOR_TOOLTIP_ID,\n DSCircularProgressIndicatorName,\n legacyBaseGeometry,\n legacyGeometryBySize,\n legacyInheritedTypography,\n} from './constants/index.js';\n\nconst legacyClassNames = convertPropToCssClassName('circular-progress-indicator');\n\n// Destructuring defaults keep the semantics of the static `defaultProps` this component used to declare:\n// a prop that is missing or explicitly `undefined` gets its default, any other value (`null` included) is kept.\nconst withLegacyDefaults = ({\n size = defaultProps.size,\n showLabel = defaultProps.showLabel,\n showTooltip = defaultProps.showTooltip,\n waiting = defaultProps.waiting,\n loading = defaultProps.loading,\n}: DSCircularProgressIndicatorT.Props): DSCircularProgressIndicatorT.InternalProps => ({\n size,\n showLabel,\n showTooltip,\n waiting,\n loading,\n});\n\nconst DSCircularProgressIndicator: React.ComponentType<DSCircularProgressIndicatorT.Props> = (props) => {\n useDeprecateComponent({ componentName: 'ds-circular-progress-indicator', version: 'TBD Date: 2023 Q3' });\n\n const { size, showLabel, showTooltip, waiting, loading } = withLegacyDefaults(props);\n\n const waitingLabel = 'Waiting...';\n const loadingLabel = 'Loading...';\n const currentLabel = waiting && !loading ? waitingLabel : loadingLabel;\n // a size outside the table keeps the base values (undefined sizes, NaN stroke width), which render the same\n // attributes the switch this lookup replaced did\n const {\n sizePx,\n sizeLabel,\n strokeWidth,\n trackWidth,\n markerHeight,\n markerRefY,\n grayArcStrokeDasharray,\n grayArcStrokeDashoffset,\n } = { ...legacyBaseGeometry, ...legacyGeometryBySize[size.toUpperCase()] };\n\n const labelText = (\n <p\n data-testid={CIRCULAR_PROGRESS_INDICATOR_DATA_TESTID.LABEL}\n className={legacyClassNames.classNameElement('label')}\n style={{ fontSize: `${sizeLabel}px` }}\n >\n <DSTypography component=\"span\" variant=\"b2\" style={legacyInheritedTypography}>\n {currentLabel}\n </DSTypography>\n </p>\n );\n\n // Only adds the tooltip if sizePx < 17 or showTooltip is true\n const buildIndicator = (indicatorElement: React.JSX.Element) =>\n (sizePx !== undefined && sizePx < 17) || showTooltip ? (\n <DSTooltipV3\n id={CIRCULAR_PROGRESS_INDICATOR_TOOLTIP_ID}\n text={currentLabel}\n startPlacementPreference=\"bottom\"\n data-testid={CIRCULAR_PROGRESS_INDICATOR_TOOLTIP_ID}\n >\n {indicatorElement}\n </DSTooltipV3>\n ) : (\n indicatorElement\n );\n\n const grayTrack = (\n <circle\n className={legacyClassNames.classNameElement('track')}\n cx=\"50%\"\n cy=\"50%\"\n fill=\"none\"\n r=\"28\"\n strokeWidth={`${trackWidth}px`}\n />\n );\n\n const grayArc = (\n <circle\n className={legacyClassNames.classNameElement('arc-gray')}\n stroke=\"#E0E3E8\"\n strokeDasharray={`${grayArcStrokeDasharray}`}\n strokeDashoffset={`${grayArcStrokeDashoffset}`}\n cx=\"50%\"\n cy=\"50%\"\n fill=\"none\"\n r=\"28\"\n strokeWidth={`${trackWidth}px`}\n />\n );\n\n const indicator = (\n <svg\n height={`${sizePx}px`}\n version=\"1.1\"\n viewBox=\"0 0 66 66\"\n width={`${sizePx}px`}\n data-testid={CIRCULAR_PROGRESS_INDICATOR_DATA_TESTID.INDICATOR}\n aria-label={waiting && !loading ? waitingLabel : loadingLabel}\n >\n <defs>\n <linearGradient id=\"grad1\" x1=\"0%\" x2=\"100%\" y1=\"100%\" y2=\"0%\">\n <stop offset=\"0%\" style={{ stopColor: '#E0E3E8', stopOpacity: 1 }} />\n <stop offset=\"89%\" style={{ stopColor: '#5594e2', stopOpacity: 1 }} />\n <stop offset=\"100%\" style={{ stopColor: '#5594e2', stopOpacity: 1 }} />\n </linearGradient>\n <linearGradient id=\"grad2\" x1=\"0%\" x2=\"100%\" y1=\"100%\" y2=\"0%\">\n <stop offset=\"0%\" style={{ stopColor: '#5594e2', stopOpacity: 1 }} />\n <stop offset=\"11%\" style={{ stopColor: '#5594e2', stopOpacity: 1 }} />\n <stop offset=\"100%\" style={{ stopColor: '#E0E3E8', stopOpacity: 1 }} />\n </linearGradient>\n <marker\n id=\"inverseL\"\n viewBox=\"0 0 5 10\"\n refX=\"0.5\"\n refY={`${markerRefY}`}\n markerUnits=\"strokeWidth\"\n markerWidth=\"0.5\"\n markerHeight={`${markerHeight}`}\n orient=\"auto\"\n >\n <path d=\"M 0 0 L 6 0 A 5 5 0 0 0 6 10 L 0 10 z\" fill=\"#FFF\" />\n </marker>\n <marker\n id=\"inverseR\"\n viewBox=\"0 0 5 10\"\n refX=\"0\"\n refY=\"5\"\n markerUnits=\"strokeWidth\"\n markerWidth=\"0.7\"\n markerHeight={`${markerHeight}`}\n >\n <path d=\"M 0 0 L 6 0 A 5 5 0 0 0 6 10 L 0 10 z\" fill=\"#FFF\" />\n </marker>\n </defs>\n {grayTrack}\n {!waiting && (\n <g fill=\"none\" fillRule=\"evenodd\" stroke=\"none\" strokeWidth=\"1\">\n <path\n className={legacyClassNames.classNameElement('arc-blue')}\n d=\"M30,5 C17.536025,6 6,17.536027 5,31\"\n stroke=\"#5594e2\"\n strokeWidth={`${strokeWidth - 0.5}px`}\n strokeLinecap=\"round\"\n data-testid={CIRCULAR_PROGRESS_INDICATOR_DATA_TESTID.BLUE_ARC}\n />\n <path\n className={legacyClassNames.classNameElement('arc-white')}\n d=\"M33,5 C17.536027,5 5,17.536027 5,33\"\n stroke=\"#FFF\"\n strokeWidth={`${strokeWidth + 2}px`}\n markerStart=\"url(#inverseR)\"\n markerEnd=\"url(#inverseL)\"\n />\n {grayArc}\n </g>\n )}\n </svg>\n );\n\n return (\n <div\n className={legacyClassNames.classNameBlock('wrapper')}\n role=\"status\"\n aria-hidden={waiting || loading ? 'false' : 'true'}\n >\n {buildIndicator(indicator)}\n {showLabel && labelText}\n </div>\n );\n};\n\nDSCircularProgressIndicator.displayName = DSCircularProgressIndicatorName;\nconst CircularProgressIndicatorWithSchema = describe(DSCircularProgressIndicator);\nCircularProgressIndicatorWithSchema.propTypes = DSCircularProgressIndicatorPropTypesSchema;\n\nexport { DSCircularProgressIndicator, CircularProgressIndicatorWithSchema };\nexport default DSCircularProgressIndicator;\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACgEjB,cAwDE,YAxDF;AA/DN,SAAS,iCAAiC;AAC1C,SAAS,UAAU,6BAA6B;AAChD,SAAS,mBAAmB;AAC5B,SAAS,oBAAoB;AAC7B;AAAA,EAEE;AAAA,EACA;AAAA,OACK;AACP;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP,MAAM,mBAAmB,0BAA0B,6BAA6B;AAIhF,MAAM,qBAAqB,CAAC;AAAA,EAC1B,OAAO,aAAa;AAAA,EACpB,YAAY,aAAa;AAAA,EACzB,cAAc,aAAa;AAAA,EAC3B,UAAU,aAAa;AAAA,EACvB,UAAU,aAAa;AACzB,OAAuF;AAAA,EACrF;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;AAEA,MAAM,8BAAuF,CAAC,UAAU;AACtG,wBAAsB,EAAE,eAAe,kCAAkC,SAAS,oBAAoB,CAAC;AAEvG,QAAM,EAAE,MAAM,WAAW,aAAa,SAAS,QAAQ,IAAI,mBAAmB,KAAK;AAEnF,QAAM,eAAe;AACrB,QAAM,eAAe;AACrB,QAAM,eAAe,WAAW,CAAC,UAAU,eAAe;AAG1D,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,EAAE,GAAG,oBAAoB,GAAG,qBAAqB,KAAK,YAAY,CAAC,EAAE;AAEzE,QAAM,YACJ;AAAA,IAAC;AAAA;AAAA,MACC,eAAa,wCAAwC;AAAA,MACrD,WAAW,iBAAiB,iBAAiB,OAAO;AAAA,MACpD,OAAO,EAAE,UAAU,GAAG,SAAS,KAAK;AAAA,MAEpC,8BAAC,gBAAa,WAAU,QAAO,SAAQ,MAAK,OAAO,2BAChD,wBACH;AAAA;AAAA,EACF;AAIF,QAAM,iBAAiB,CAAC,qBACrB,WAAW,UAAa,SAAS,MAAO,cACvC;AAAA,IAAC;AAAA;AAAA,MACC,IAAI;AAAA,MACJ,MAAM;AAAA,MACN,0BAAyB;AAAA,MACzB,eAAa;AAAA,MAEZ;AAAA;AAAA,EACH,IAEA;AAGJ,QAAM,YACJ;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,iBAAiB,iBAAiB,OAAO;AAAA,MACpD,IAAG;AAAA,MACH,IAAG;AAAA,MACH,MAAK;AAAA,MACL,GAAE;AAAA,MACF,aAAa,GAAG,UAAU;AAAA;AAAA,EAC5B;AAGF,QAAM,UACJ;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,iBAAiB,iBAAiB,UAAU;AAAA,MACvD,QAAO;AAAA,MACP,iBAAiB,GAAG,sBAAsB;AAAA,MAC1C,kBAAkB,GAAG,uBAAuB;AAAA,MAC5C,IAAG;AAAA,MACH,IAAG;AAAA,MACH,MAAK;AAAA,MACL,GAAE;AAAA,MACF,aAAa,GAAG,UAAU;AAAA;AAAA,EAC5B;AAGF,QAAM,YACJ;AAAA,IAAC;AAAA;AAAA,MACC,QAAQ,GAAG,MAAM;AAAA,MACjB,SAAQ;AAAA,MACR,SAAQ;AAAA,MACR,OAAO,GAAG,MAAM;AAAA,MAChB,eAAa,wCAAwC;AAAA,MACrD,cAAY,WAAW,CAAC,UAAU,eAAe;AAAA,MAEjD;AAAA,6BAAC,UACC;AAAA,+BAAC,oBAAe,IAAG,SAAQ,IAAG,MAAK,IAAG,QAAO,IAAG,QAAO,IAAG,MACxD;AAAA,gCAAC,UAAK,QAAO,MAAK,OAAO,EAAE,WAAW,WAAW,aAAa,EAAE,GAAG;AAAA,YACnE,oBAAC,UAAK,QAAO,OAAM,OAAO,EAAE,WAAW,WAAW,aAAa,EAAE,GAAG;AAAA,YACpE,oBAAC,UAAK,QAAO,QAAO,OAAO,EAAE,WAAW,WAAW,aAAa,EAAE,GAAG;AAAA,aACvE;AAAA,UACA,qBAAC,oBAAe,IAAG,SAAQ,IAAG,MAAK,IAAG,QAAO,IAAG,QAAO,IAAG,MACxD;AAAA,gCAAC,UAAK,QAAO,MAAK,OAAO,EAAE,WAAW,WAAW,aAAa,EAAE,GAAG;AAAA,YACnE,oBAAC,UAAK,QAAO,OAAM,OAAO,EAAE,WAAW,WAAW,aAAa,EAAE,GAAG;AAAA,YACpE,oBAAC,UAAK,QAAO,QAAO,OAAO,EAAE,WAAW,WAAW,aAAa,EAAE,GAAG;AAAA,aACvE;AAAA,UACA;AAAA,YAAC;AAAA;AAAA,cACC,IAAG;AAAA,cACH,SAAQ;AAAA,cACR,MAAK;AAAA,cACL,MAAM,GAAG,UAAU;AAAA,cACnB,aAAY;AAAA,cACZ,aAAY;AAAA,cACZ,cAAc,GAAG,YAAY;AAAA,cAC7B,QAAO;AAAA,cAEP,8BAAC,UAAK,GAAE,yCAAwC,MAAK,QAAO;AAAA;AAAA,UAC9D;AAAA,UACA;AAAA,YAAC;AAAA;AAAA,cACC,IAAG;AAAA,cACH,SAAQ;AAAA,cACR,MAAK;AAAA,cACL,MAAK;AAAA,cACL,aAAY;AAAA,cACZ,aAAY;AAAA,cACZ,cAAc,GAAG,YAAY;AAAA,cAE7B,8BAAC,UAAK,GAAE,yCAAwC,MAAK,QAAO;AAAA;AAAA,UAC9D;AAAA,WACF;AAAA,QACC;AAAA,QACA,CAAC,WACA,qBAAC,OAAE,MAAK,QAAO,UAAS,WAAU,QAAO,QAAO,aAAY,KAC1D;AAAA;AAAA,YAAC;AAAA;AAAA,cACC,WAAW,iBAAiB,iBAAiB,UAAU;AAAA,cACvD,GAAE;AAAA,cACF,QAAO;AAAA,cACP,aAAa,GAAG,cAAc,GAAG;AAAA,cACjC,eAAc;AAAA,cACd,eAAa,wCAAwC;AAAA;AAAA,UACvD;AAAA,UACA;AAAA,YAAC;AAAA;AAAA,cACC,WAAW,iBAAiB,iBAAiB,WAAW;AAAA,cACxD,GAAE;AAAA,cACF,QAAO;AAAA,cACP,aAAa,GAAG,cAAc,CAAC;AAAA,cAC/B,aAAY;AAAA,cACZ,WAAU;AAAA;AAAA,UACZ;AAAA,UACC;AAAA,WACH;AAAA;AAAA;AAAA,EAEJ;AAGF,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,iBAAiB,eAAe,SAAS;AAAA,MACpD,MAAK;AAAA,MACL,eAAa,WAAW,UAAU,UAAU;AAAA,MAE3C;AAAA,uBAAe,SAAS;AAAA,QACxB,aAAa;AAAA;AAAA;AAAA,EAChB;AAEJ;AAEA,4BAA4B,cAAc;AAC1C,MAAM,sCAAsC,SAAS,2BAA2B;AAChF,oCAAoC,YAAY;AAGhD,IAAO,sCAAQ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -0,0 +1,128 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import { slotObjectToDataTestIds } from "@elliemae/ds-system";
|
|
3
|
+
const DSCircularIndeterminateIndicatorName = "DSCircularindeterminateindicator";
|
|
4
|
+
const CIRCULAR_INDETERMINATE_INDICATOR_SLOTS = {
|
|
5
|
+
ROOT: "root",
|
|
6
|
+
SVG: "svg",
|
|
7
|
+
LABEL: "label",
|
|
8
|
+
CIRCLE: "circle",
|
|
9
|
+
PATH: "path",
|
|
10
|
+
RECT: "rect"
|
|
11
|
+
};
|
|
12
|
+
const CIRCULAR_INDETERMINATE_INDICATOR_DATA_TESTID = {
|
|
13
|
+
...slotObjectToDataTestIds(DSCircularIndeterminateIndicatorName, CIRCULAR_INDETERMINATE_INDICATOR_SLOTS),
|
|
14
|
+
// legacy value — the root has always rendered this data-testid, breaking change if removed
|
|
15
|
+
ROOT: "ds-circular-indeterminate-indicator-root"
|
|
16
|
+
};
|
|
17
|
+
const DSCircularIndeterminateIndicatorSlots = CIRCULAR_INDETERMINATE_INDICATOR_SLOTS;
|
|
18
|
+
const DSCircularIndeterminateIndicatorDataTestIds = slotObjectToDataTestIds(
|
|
19
|
+
DSCircularIndeterminateIndicatorName,
|
|
20
|
+
CIRCULAR_INDETERMINATE_INDICATOR_SLOTS
|
|
21
|
+
);
|
|
22
|
+
const sizeToPx = {
|
|
23
|
+
xs: 16,
|
|
24
|
+
s: 24,
|
|
25
|
+
m: 32,
|
|
26
|
+
l: 48,
|
|
27
|
+
xl: 56,
|
|
28
|
+
xxl: 64
|
|
29
|
+
};
|
|
30
|
+
const sizeToWeight = {
|
|
31
|
+
xs: "3px",
|
|
32
|
+
s: "3px",
|
|
33
|
+
m: "3px",
|
|
34
|
+
l: "4px",
|
|
35
|
+
xl: "5px",
|
|
36
|
+
xxl: "6px"
|
|
37
|
+
};
|
|
38
|
+
const colorToHex = {
|
|
39
|
+
light: "#EBF6FF",
|
|
40
|
+
dark: "#1394E5"
|
|
41
|
+
};
|
|
42
|
+
const sizeToTextSize = {
|
|
43
|
+
xs: "12px",
|
|
44
|
+
s: "12px",
|
|
45
|
+
m: "12px",
|
|
46
|
+
l: "13px",
|
|
47
|
+
xl: "14px",
|
|
48
|
+
xxl: "16px"
|
|
49
|
+
};
|
|
50
|
+
const DSCircularProgressIndicatorName = "CircularProgressIndicator";
|
|
51
|
+
const CIRCULAR_PROGRESS_INDICATOR_DATA_TESTID = {
|
|
52
|
+
INDICATOR: "circular-indicator",
|
|
53
|
+
LABEL: "circular-indicator-label",
|
|
54
|
+
BLUE_ARC: "circular-indicator-blue-arc"
|
|
55
|
+
};
|
|
56
|
+
const CIRCULAR_PROGRESS_INDICATOR_TOOLTIP_ID = "circular-indicator-title";
|
|
57
|
+
const legacyBaseGeometry = {
|
|
58
|
+
// the arcs derive their widths from it: NaN renders the same `NaNpx` the untyped `undefined - 0.5` used to
|
|
59
|
+
strokeWidth: NaN,
|
|
60
|
+
markerHeight: "0.7",
|
|
61
|
+
markerRefY: "4.8",
|
|
62
|
+
grayArcStrokeDasharray: "45 170",
|
|
63
|
+
grayArcStrokeDashoffset: "127.5"
|
|
64
|
+
};
|
|
65
|
+
const legacyGeometryBySize = {
|
|
66
|
+
XS: {
|
|
67
|
+
sizePx: 8,
|
|
68
|
+
sizeLabel: 12,
|
|
69
|
+
strokeWidth: 10,
|
|
70
|
+
trackWidth: 3,
|
|
71
|
+
markerHeight: "1",
|
|
72
|
+
grayArcStrokeDasharray: "46 174",
|
|
73
|
+
grayArcStrokeDashoffset: "133"
|
|
74
|
+
},
|
|
75
|
+
S: {
|
|
76
|
+
sizePx: 16,
|
|
77
|
+
sizeLabel: 12,
|
|
78
|
+
strokeWidth: 8,
|
|
79
|
+
trackWidth: 3,
|
|
80
|
+
markerHeight: "1",
|
|
81
|
+
grayArcStrokeDasharray: "46 174",
|
|
82
|
+
grayArcStrokeDashoffset: "133"
|
|
83
|
+
},
|
|
84
|
+
M: {
|
|
85
|
+
sizePx: 24,
|
|
86
|
+
sizeLabel: 12,
|
|
87
|
+
strokeWidth: 7,
|
|
88
|
+
trackWidth: 3,
|
|
89
|
+
markerHeight: "1",
|
|
90
|
+
markerRefY: "5.5",
|
|
91
|
+
grayArcStrokeDasharray: "46 174",
|
|
92
|
+
grayArcStrokeDashoffset: "133"
|
|
93
|
+
},
|
|
94
|
+
L: { sizePx: 32, sizeLabel: 13, strokeWidth: 6, trackWidth: 3, markerRefY: "5" },
|
|
95
|
+
XL: { sizePx: 48, sizeLabel: 14, strokeWidth: 5, trackWidth: 1 },
|
|
96
|
+
XXL: { sizePx: 56, sizeLabel: 16, strokeWidth: 4, trackWidth: 1 },
|
|
97
|
+
XXXL: { sizePx: 64, sizeLabel: 16, strokeWidth: 5, trackWidth: 2 }
|
|
98
|
+
};
|
|
99
|
+
const legacyInheritedTypography = {
|
|
100
|
+
fontFamily: "inherit",
|
|
101
|
+
fontSize: "inherit",
|
|
102
|
+
fontWeight: "inherit",
|
|
103
|
+
fontStyle: "inherit",
|
|
104
|
+
lineHeight: "inherit",
|
|
105
|
+
color: "inherit",
|
|
106
|
+
whiteSpace: "inherit",
|
|
107
|
+
overflowWrap: "inherit",
|
|
108
|
+
margin: 0,
|
|
109
|
+
padding: 0
|
|
110
|
+
};
|
|
111
|
+
export {
|
|
112
|
+
CIRCULAR_INDETERMINATE_INDICATOR_DATA_TESTID,
|
|
113
|
+
CIRCULAR_INDETERMINATE_INDICATOR_SLOTS,
|
|
114
|
+
CIRCULAR_PROGRESS_INDICATOR_DATA_TESTID,
|
|
115
|
+
CIRCULAR_PROGRESS_INDICATOR_TOOLTIP_ID,
|
|
116
|
+
DSCircularIndeterminateIndicatorDataTestIds,
|
|
117
|
+
DSCircularIndeterminateIndicatorName,
|
|
118
|
+
DSCircularIndeterminateIndicatorSlots,
|
|
119
|
+
DSCircularProgressIndicatorName,
|
|
120
|
+
colorToHex,
|
|
121
|
+
legacyBaseGeometry,
|
|
122
|
+
legacyGeometryBySize,
|
|
123
|
+
legacyInheritedTypography,
|
|
124
|
+
sizeToPx,
|
|
125
|
+
sizeToTextSize,
|
|
126
|
+
sizeToWeight
|
|
127
|
+
};
|
|
128
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/constants/index.ts"],
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import type { CSSProperties } from 'react';\nimport { slotObjectToDataTestIds } from '@elliemae/ds-system';\n\n// ============================================================================================================\n// DSCircularIndeterminateIndicator (v2)\n// ============================================================================================================\n\nexport const DSCircularIndeterminateIndicatorName = 'DSCircularindeterminateindicator';\n\n// we are naming this with the ${component_name}_slots convention to namespace & avoid errors on duplicate exports variables in aggregators\nexport const CIRCULAR_INDETERMINATE_INDICATOR_SLOTS = {\n ROOT: 'root',\n SVG: 'svg',\n LABEL: 'label',\n CIRCLE: 'circle',\n PATH: 'path',\n RECT: 'rect',\n} as const;\n\n// we are naming this with the ${component_name}_data_testid convention to namespace & avoid errors on duplicate exports variables in aggregators\nexport const CIRCULAR_INDETERMINATE_INDICATOR_DATA_TESTID = {\n ...slotObjectToDataTestIds(DSCircularIndeterminateIndicatorName, CIRCULAR_INDETERMINATE_INDICATOR_SLOTS),\n // legacy value \u2014 the root has always rendered this data-testid, breaking change if removed\n ROOT: 'ds-circular-indeterminate-indicator-root',\n} as const;\n\n// pre-convention public names, kept so existing imports keep working.\n// DSCircularIndeterminateIndicatorDataTestIds.ROOT keeps its original value ('ds-circularindeterminateindicator-root'),\n// which never matched the rendered root \u2014 use CIRCULAR_INDETERMINATE_INDICATOR_DATA_TESTID.ROOT to query the DOM.\nexport const DSCircularIndeterminateIndicatorSlots = CIRCULAR_INDETERMINATE_INDICATOR_SLOTS;\nexport const DSCircularIndeterminateIndicatorDataTestIds = slotObjectToDataTestIds(\n DSCircularIndeterminateIndicatorName,\n CIRCULAR_INDETERMINATE_INDICATOR_SLOTS,\n);\n\nexport const sizeToPx = {\n xs: 16,\n s: 24,\n m: 32,\n l: 48,\n xl: 56,\n xxl: 64,\n};\n\nexport const sizeToWeight = {\n xs: '3px',\n s: '3px',\n m: '3px',\n l: '4px',\n xl: '5px',\n xxl: '6px',\n};\n\nexport const colorToHex = {\n light: '#EBF6FF',\n dark: '#1394E5',\n};\n\nexport const sizeToTextSize = {\n xs: '12px',\n s: '12px',\n m: '12px',\n l: '13px',\n xl: '14px',\n xxl: '16px',\n};\n\n// ============================================================================================================\n// DSCircularProgressIndicator (legacy, deprecated in favour of DSCircularIndeterminateIndicator)\n// ============================================================================================================\n\nexport const DSCircularProgressIndicatorName = 'CircularProgressIndicator';\n\n// The legacy component predates the slot system and is deprecated, so it renders no slots: these are the\n// data-testid values it has always hardcoded \u2014 breaking change if any of them is removed or renamed.\nexport const CIRCULAR_PROGRESS_INDICATOR_DATA_TESTID = {\n INDICATOR: 'circular-indicator',\n LABEL: 'circular-indicator-label',\n BLUE_ARC: 'circular-indicator-blue-arc',\n} as const;\n\n// The legacy tooltip `id`. DSTooltipV3 appends it to its own trigger data-testid\n// (`ds-tooltip-v3-trigger-wrapper_circular-indicator-title`) \u2014 breaking change if renamed.\nexport const CIRCULAR_PROGRESS_INDICATOR_TOOLTIP_ID = 'circular-indicator-title';\n\ninterface LegacyGeometry {\n sizePx?: number;\n sizeLabel?: number;\n strokeWidth: number;\n trackWidth?: number;\n markerHeight: string;\n markerRefY: string;\n grayArcStrokeDasharray: string;\n grayArcStrokeDashoffset: string;\n}\n\n// Geometry of the legacy indicator per size (matched case-insensitively), applied over the base values\nexport const legacyBaseGeometry: LegacyGeometry = {\n // the arcs derive their widths from it: NaN renders the same `NaNpx` the untyped `undefined - 0.5` used to\n strokeWidth: NaN,\n markerHeight: '0.7',\n markerRefY: '4.8',\n grayArcStrokeDasharray: '45 170',\n grayArcStrokeDashoffset: '127.5',\n};\n\nexport const legacyGeometryBySize: Record<string, Partial<LegacyGeometry>> = {\n XS: {\n sizePx: 8,\n sizeLabel: 12,\n strokeWidth: 10,\n trackWidth: 3,\n markerHeight: '1',\n grayArcStrokeDasharray: '46 174',\n grayArcStrokeDashoffset: '133',\n },\n S: {\n sizePx: 16,\n sizeLabel: 12,\n strokeWidth: 8,\n trackWidth: 3,\n markerHeight: '1',\n grayArcStrokeDasharray: '46 174',\n grayArcStrokeDashoffset: '133',\n },\n M: {\n sizePx: 24,\n sizeLabel: 12,\n strokeWidth: 7,\n trackWidth: 3,\n markerHeight: '1',\n markerRefY: '5.5',\n grayArcStrokeDasharray: '46 174',\n grayArcStrokeDashoffset: '133',\n },\n L: { sizePx: 32, sizeLabel: 13, strokeWidth: 6, trackWidth: 3, markerRefY: '5' },\n XL: { sizePx: 48, sizeLabel: 14, strokeWidth: 5, trackWidth: 1 },\n XXL: { sizePx: 56, sizeLabel: 16, strokeWidth: 4, trackWidth: 1 },\n XXXL: { sizePx: 64, sizeLabel: 16, strokeWidth: 5, trackWidth: 2 },\n};\n\n// Typography (PUI-18946): the label text renders through DSTypography, nested inside the original `<p>` so its\n// data-testid, class and inline font size stay where they were. The DSTypography span inherits everything from the\n// `<p>` so nothing renders differently: inline, because this deprecated component has no styled slots to carry a rule.\n// Longhands, one per property DSTypography's b2 variant sets (the `font` shorthand would also work in browsers).\nexport const legacyInheritedTypography: CSSProperties = {\n fontFamily: 'inherit',\n fontSize: 'inherit',\n fontWeight: 'inherit',\n fontStyle: 'inherit',\n lineHeight: 'inherit',\n color: 'inherit',\n whiteSpace: 'inherit',\n overflowWrap: 'inherit',\n margin: 0,\n padding: 0,\n};\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACCvB,SAAS,+BAA+B;AAMjC,MAAM,uCAAuC;AAG7C,MAAM,yCAAyC;AAAA,EACpD,MAAM;AAAA,EACN,KAAK;AAAA,EACL,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,MAAM;AAAA,EACN,MAAM;AACR;AAGO,MAAM,+CAA+C;AAAA,EAC1D,GAAG,wBAAwB,sCAAsC,sCAAsC;AAAA;AAAA,EAEvG,MAAM;AACR;AAKO,MAAM,wCAAwC;AAC9C,MAAM,8CAA8C;AAAA,EACzD;AAAA,EACA;AACF;AAEO,MAAM,WAAW;AAAA,EACtB,IAAI;AAAA,EACJ,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,IAAI;AAAA,EACJ,KAAK;AACP;AAEO,MAAM,eAAe;AAAA,EAC1B,IAAI;AAAA,EACJ,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,IAAI;AAAA,EACJ,KAAK;AACP;AAEO,MAAM,aAAa;AAAA,EACxB,OAAO;AAAA,EACP,MAAM;AACR;AAEO,MAAM,iBAAiB;AAAA,EAC5B,IAAI;AAAA,EACJ,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,IAAI;AAAA,EACJ,KAAK;AACP;AAMO,MAAM,kCAAkC;AAIxC,MAAM,0CAA0C;AAAA,EACrD,WAAW;AAAA,EACX,OAAO;AAAA,EACP,UAAU;AACZ;AAIO,MAAM,yCAAyC;AAc/C,MAAM,qBAAqC;AAAA;AAAA,EAEhD,aAAa;AAAA,EACb,cAAc;AAAA,EACd,YAAY;AAAA,EACZ,wBAAwB;AAAA,EACxB,yBAAyB;AAC3B;AAEO,MAAM,uBAAgE;AAAA,EAC3E,IAAI;AAAA,IACF,QAAQ;AAAA,IACR,WAAW;AAAA,IACX,aAAa;AAAA,IACb,YAAY;AAAA,IACZ,cAAc;AAAA,IACd,wBAAwB;AAAA,IACxB,yBAAyB;AAAA,EAC3B;AAAA,EACA,GAAG;AAAA,IACD,QAAQ;AAAA,IACR,WAAW;AAAA,IACX,aAAa;AAAA,IACb,YAAY;AAAA,IACZ,cAAc;AAAA,IACd,wBAAwB;AAAA,IACxB,yBAAyB;AAAA,EAC3B;AAAA,EACA,GAAG;AAAA,IACD,QAAQ;AAAA,IACR,WAAW;AAAA,IACX,aAAa;AAAA,IACb,YAAY;AAAA,IACZ,cAAc;AAAA,IACd,YAAY;AAAA,IACZ,wBAAwB;AAAA,IACxB,yBAAyB;AAAA,EAC3B;AAAA,EACA,GAAG,EAAE,QAAQ,IAAI,WAAW,IAAI,aAAa,GAAG,YAAY,GAAG,YAAY,IAAI;AAAA,EAC/E,IAAI,EAAE,QAAQ,IAAI,WAAW,IAAI,aAAa,GAAG,YAAY,EAAE;AAAA,EAC/D,KAAK,EAAE,QAAQ,IAAI,WAAW,IAAI,aAAa,GAAG,YAAY,EAAE;AAAA,EAChE,MAAM,EAAE,QAAQ,IAAI,WAAW,IAAI,aAAa,GAAG,YAAY,EAAE;AACnE;AAMO,MAAM,4BAA2C;AAAA,EACtD,YAAY;AAAA,EACZ,UAAU;AAAA,EACV,YAAY;AAAA,EACZ,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,OAAO;AAAA,EACP,YAAY;AAAA,EACZ,cAAc;AAAA,EACd,QAAQ;AAAA,EACR,SAAS;AACX;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
package/dist/esm/index.js
CHANGED
|
@@ -1,22 +1,28 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
|
-
import DSCircularProgressIndicator from "./DSCircularProgressIndicator.js";
|
|
3
|
-
import { CircularProgressIndicatorWithSchema } from "./DSCircularProgressIndicator.js";
|
|
2
|
+
import { DSCircularProgressIndicator } from "./DSCircularProgressIndicator.js";
|
|
3
|
+
import { DSCircularProgressIndicator as DSCircularProgressIndicator2, CircularProgressIndicatorWithSchema } from "./DSCircularProgressIndicator.js";
|
|
4
4
|
import {
|
|
5
5
|
DSCircularIndeterminateIndicator,
|
|
6
|
-
DSCircularIndeterminateIndicatorWithSchema
|
|
6
|
+
DSCircularIndeterminateIndicatorWithSchema
|
|
7
|
+
} from "./v2/index.js";
|
|
8
|
+
import {
|
|
7
9
|
DSCircularIndeterminateIndicatorName,
|
|
10
|
+
CIRCULAR_INDETERMINATE_INDICATOR_SLOTS,
|
|
11
|
+
CIRCULAR_INDETERMINATE_INDICATOR_DATA_TESTID,
|
|
8
12
|
DSCircularIndeterminateIndicatorSlots,
|
|
9
13
|
DSCircularIndeterminateIndicatorDataTestIds
|
|
10
|
-
} from "./
|
|
14
|
+
} from "./constants/index.js";
|
|
11
15
|
var index_default = DSCircularProgressIndicator;
|
|
12
16
|
export {
|
|
17
|
+
CIRCULAR_INDETERMINATE_INDICATOR_DATA_TESTID,
|
|
18
|
+
CIRCULAR_INDETERMINATE_INDICATOR_SLOTS,
|
|
13
19
|
CircularProgressIndicatorWithSchema,
|
|
14
20
|
DSCircularIndeterminateIndicator,
|
|
15
21
|
DSCircularIndeterminateIndicatorDataTestIds,
|
|
16
22
|
DSCircularIndeterminateIndicatorName,
|
|
17
23
|
DSCircularIndeterminateIndicatorSlots,
|
|
18
24
|
DSCircularIndeterminateIndicatorWithSchema,
|
|
19
|
-
DSCircularProgressIndicator,
|
|
25
|
+
DSCircularProgressIndicator2 as DSCircularProgressIndicator,
|
|
20
26
|
index_default as default
|
|
21
27
|
};
|
|
22
28
|
//# sourceMappingURL=index.js.map
|
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", "
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;
|
|
6
|
-
"names": []
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { DSCircularProgressIndicator } from './DSCircularProgressIndicator.js';\n\nexport { DSCircularProgressIndicator, CircularProgressIndicatorWithSchema } from './DSCircularProgressIndicator.js';\nexport { type DSCircularProgressIndicatorT } from './react-desc-prop-types.js';\nexport {\n DSCircularIndeterminateIndicator,\n DSCircularIndeterminateIndicatorWithSchema,\n type DSCircularIndeterminateIndicatorT,\n} from './v2/index.js';\nexport {\n DSCircularIndeterminateIndicatorName,\n CIRCULAR_INDETERMINATE_INDICATOR_SLOTS,\n CIRCULAR_INDETERMINATE_INDICATOR_DATA_TESTID,\n DSCircularIndeterminateIndicatorSlots,\n DSCircularIndeterminateIndicatorDataTestIds,\n} from './constants/index.js';\n\n// leftover default export, kept to avoid a breaking change\nexport default DSCircularProgressIndicator;\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,mCAAmC;AAE5C,SAAS,+BAAAA,8BAA6B,2CAA2C;AAEjF;AAAA,EACE;AAAA,EACA;AAAA,OAEK;AACP;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAGP,IAAO,gBAAQ;",
|
|
6
|
+
"names": ["DSCircularProgressIndicator"]
|
|
7
7
|
}
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import { PropTypes } from "@elliemae/ds-props-helpers";
|
|
3
|
+
const defaultProps = {
|
|
4
|
+
size: "m",
|
|
5
|
+
showLabel: false,
|
|
6
|
+
showTooltip: false,
|
|
7
|
+
waiting: false,
|
|
8
|
+
loading: false
|
|
9
|
+
};
|
|
10
|
+
const DSCircularProgressIndicatorPropTypes = {
|
|
11
|
+
size: PropTypes.oneOf(["xs", "s", "m", "l", "xl", "xxl", "xxxl"]).description("Defines the size of the indicator").defaultValue("m"),
|
|
12
|
+
showLabel: PropTypes.bool.description("Whether the indicator displays its state on a label or not").defaultValue(false),
|
|
13
|
+
showTooltip: PropTypes.bool.description("Whether the indicator displays its state on a tooltip or not").defaultValue(false),
|
|
14
|
+
waiting: PropTypes.bool.description("Defines the state of the indicator as Waiting and only displays the gray track").defaultValue(false),
|
|
15
|
+
loading: PropTypes.bool.description("Defines the state of the indicator as Loading and displays a blue spinner animation").defaultValue(false)
|
|
16
|
+
};
|
|
17
|
+
const DSCircularProgressIndicatorPropTypesSchema = DSCircularProgressIndicatorPropTypes;
|
|
18
|
+
export {
|
|
19
|
+
DSCircularProgressIndicatorPropTypes,
|
|
20
|
+
DSCircularProgressIndicatorPropTypesSchema,
|
|
21
|
+
defaultProps
|
|
22
|
+
};
|
|
23
|
+
//# 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.ts"],
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import type { DSPropTypesSchema, ValidationMap } from '@elliemae/ds-props-helpers';\nimport { PropTypes } from '@elliemae/ds-props-helpers';\n\n// Types of the legacy DSCircularProgressIndicator, deprecated in favour of DSCircularIndeterminateIndicator.\n// The component predates global attributes, xstyled props and slots, and only ever read these five props.\nexport declare namespace DSCircularProgressIndicatorT {\n type TShirtSizes = 'xs' | 's' | 'm' | 'l' | 'xl' | 'xxl' | 'xxxl';\n\n export interface DefaultProps {\n // the size is matched case-insensitively, so the uppercase spellings have always worked too\n size: TShirtSizes | Uppercase<TShirtSizes>;\n showLabel: boolean;\n showTooltip: boolean;\n waiting: boolean;\n loading: boolean;\n }\n\n export interface OptionalProps {}\n\n export interface RequiredProps {}\n\n export interface Props extends Partial<DefaultProps>, OptionalProps, RequiredProps {}\n\n export interface InternalProps extends DefaultProps, OptionalProps, RequiredProps {}\n}\n\nexport const defaultProps: DSCircularProgressIndicatorT.DefaultProps = {\n size: 'm',\n showLabel: false,\n showTooltip: false,\n waiting: false,\n loading: false,\n};\n\nexport const DSCircularProgressIndicatorPropTypes: DSPropTypesSchema<DSCircularProgressIndicatorT.Props> = {\n size: PropTypes.oneOf(['xs', 's', 'm', 'l', 'xl', 'xxl', 'xxxl'])\n .description('Defines the size of the indicator')\n .defaultValue('m'),\n showLabel: PropTypes.bool\n .description('Whether the indicator displays its state on a label or not')\n .defaultValue(false),\n showTooltip: PropTypes.bool\n .description('Whether the indicator displays its state on a tooltip or not')\n .defaultValue(false),\n waiting: PropTypes.bool\n .description('Defines the state of the indicator as Waiting and only displays the gray track')\n .defaultValue(false),\n loading: PropTypes.bool\n .description('Defines the state of the indicator as Loading and displays a blue spinner animation')\n .defaultValue(false),\n};\n\nexport const DSCircularProgressIndicatorPropTypesSchema =\n DSCircularProgressIndicatorPropTypes as unknown as ValidationMap<DSCircularProgressIndicatorT.Props>;\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACCvB,SAAS,iBAAiB;AAyBnB,MAAM,eAA0D;AAAA,EACrE,MAAM;AAAA,EACN,WAAW;AAAA,EACX,aAAa;AAAA,EACb,SAAS;AAAA,EACT,SAAS;AACX;AAEO,MAAM,uCAA8F;AAAA,EACzG,MAAM,UAAU,MAAM,CAAC,MAAM,KAAK,KAAK,KAAK,MAAM,OAAO,MAAM,CAAC,EAC7D,YAAY,mCAAmC,EAC/C,aAAa,GAAG;AAAA,EACnB,WAAW,UAAU,KAClB,YAAY,4DAA4D,EACxE,aAAa,KAAK;AAAA,EACrB,aAAa,UAAU,KACpB,YAAY,8DAA8D,EAC1E,aAAa,KAAK;AAAA,EACrB,SAAS,UAAU,KAChB,YAAY,gFAAgF,EAC5F,aAAa,KAAK;AAAA,EACrB,SAAS,UAAU,KAChB,YAAY,qFAAqF,EACjG,aAAa,KAAK;AACvB;AAEO,MAAM,6CACX;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
const SlotPropsAsObject = {
|
|
3
|
+
dsCircularindeterminateindicatorRoot: { "aria-label": "just a typescript test" },
|
|
4
|
+
dsCircularindeterminateindicatorSvg: { "aria-label": "just a typescript test" },
|
|
5
|
+
dsCircularindeterminateindicatorLabel: { "aria-label": "just a typescript test" },
|
|
6
|
+
dsCircularindeterminateindicatorCircle: { "aria-label": "just a typescript test" },
|
|
7
|
+
dsCircularindeterminateindicatorPath: { "aria-label": "just a typescript test" },
|
|
8
|
+
dsCircularindeterminateindicatorRect: { "aria-label": "just a typescript test" }
|
|
9
|
+
};
|
|
10
|
+
const SlotPropsAsFunctions = {
|
|
11
|
+
dsCircularindeterminateindicatorRoot: () => ({ "aria-label": "just a typescript test" }),
|
|
12
|
+
dsCircularindeterminateindicatorSvg: () => ({ "aria-label": "just a typescript test" }),
|
|
13
|
+
dsCircularindeterminateindicatorLabel: () => ({ "aria-label": "just a typescript test" }),
|
|
14
|
+
dsCircularindeterminateindicatorCircle: () => ({ "aria-label": "just a typescript test" }),
|
|
15
|
+
dsCircularindeterminateindicatorPath: () => ({ "aria-label": "just a typescript test" }),
|
|
16
|
+
dsCircularindeterminateindicatorRect: () => ({ "aria-label": "just a typescript test" })
|
|
17
|
+
};
|
|
18
|
+
const SlotFunctionsAreValidProps = SlotPropsAsFunctions;
|
|
19
|
+
const EnsureAllSlotsExistInSlotFunctionArguments = SlotPropsAsFunctions;
|
|
20
|
+
//# sourceMappingURL=slot-props.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/typescript-testing/slot-props.ts"],
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable @typescript-eslint/no-unused-vars, no-unused-vars */\nimport { type TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport type {\n DSCircularIndeterminateIndicatorName,\n CIRCULAR_INDETERMINATE_INDICATOR_SLOTS,\n} from '../constants/index.js';\nimport type { DSCircularIndeterminateIndicatorT } from '../v2/react-desc-prop-types.js';\n\nconst SlotPropsAsObject: Partial<DSCircularIndeterminateIndicatorT.Props> = {\n dsCircularindeterminateindicatorRoot: { 'aria-label': 'just a typescript test' },\n dsCircularindeterminateindicatorSvg: { 'aria-label': 'just a typescript test' },\n dsCircularindeterminateindicatorLabel: { 'aria-label': 'just a typescript test' },\n dsCircularindeterminateindicatorCircle: { 'aria-label': 'just a typescript test' },\n dsCircularindeterminateindicatorPath: { 'aria-label': 'just a typescript test' },\n dsCircularindeterminateindicatorRect: { 'aria-label': 'just a typescript test' },\n};\n\nconst SlotPropsAsFunctions: DSCircularIndeterminateIndicatorT.SlotFunctionArguments = {\n dsCircularindeterminateindicatorRoot: () => ({ 'aria-label': 'just a typescript test' }),\n dsCircularindeterminateindicatorSvg: () => ({ 'aria-label': 'just a typescript test' }),\n dsCircularindeterminateindicatorLabel: () => ({ 'aria-label': 'just a typescript test' }),\n dsCircularindeterminateindicatorCircle: () => ({ 'aria-label': 'just a typescript test' }),\n dsCircularindeterminateindicatorPath: () => ({ 'aria-label': 'just a typescript test' }),\n dsCircularindeterminateindicatorRect: () => ({ 'aria-label': 'just a typescript test' }),\n};\n\n// The function form must also be accepted by the public Props, slot by slot\nconst SlotFunctionsAreValidProps: Partial<DSCircularIndeterminateIndicatorT.Props> = SlotPropsAsFunctions;\n\n// Exhaustiveness check \u2014 fails compilation if a slot is missing from SlotFunctionArguments\nconst EnsureAllSlotsExistInSlotFunctionArguments: Required<\n TypescriptHelpersT.PropsForSlots<\n typeof DSCircularIndeterminateIndicatorName,\n typeof CIRCULAR_INDETERMINATE_INDICATOR_SLOTS\n >\n> = SlotPropsAsFunctions;\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACQvB,MAAM,oBAAsE;AAAA,EAC1E,sCAAsC,EAAE,cAAc,yBAAyB;AAAA,EAC/E,qCAAqC,EAAE,cAAc,yBAAyB;AAAA,EAC9E,uCAAuC,EAAE,cAAc,yBAAyB;AAAA,EAChF,wCAAwC,EAAE,cAAc,yBAAyB;AAAA,EACjF,sCAAsC,EAAE,cAAc,yBAAyB;AAAA,EAC/E,sCAAsC,EAAE,cAAc,yBAAyB;AACjF;AAEA,MAAM,uBAAgF;AAAA,EACpF,sCAAsC,OAAO,EAAE,cAAc,yBAAyB;AAAA,EACtF,qCAAqC,OAAO,EAAE,cAAc,yBAAyB;AAAA,EACrF,uCAAuC,OAAO,EAAE,cAAc,yBAAyB;AAAA,EACvF,wCAAwC,OAAO,EAAE,cAAc,yBAAyB;AAAA,EACxF,sCAAsC,OAAO,EAAE,cAAc,yBAAyB;AAAA,EACtF,sCAAsC,OAAO,EAAE,cAAc,yBAAyB;AACxF;AAGA,MAAM,6BAA+E;AAGrF,MAAM,6CAKF;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|