@elliemae/ds-legacy-circular-progress-indicator 1.0.0-rc.1

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.
Files changed (41) hide show
  1. package/dist/cjs/DSCircularProgressIndicator.js +261 -0
  2. package/dist/cjs/DSCircularProgressIndicator.js.map +7 -0
  3. package/dist/cjs/index.js +44 -0
  4. package/dist/cjs/index.js.map +7 -0
  5. package/dist/cjs/package.json +7 -0
  6. package/dist/cjs/v2/DSCircularIndeterminateIndicator.js +133 -0
  7. package/dist/cjs/v2/DSCircularIndeterminateIndicator.js.map +7 -0
  8. package/dist/cjs/v2/constants.js +80 -0
  9. package/dist/cjs/v2/constants.js.map +7 -0
  10. package/dist/cjs/v2/index.js +39 -0
  11. package/dist/cjs/v2/index.js.map +7 -0
  12. package/dist/cjs/v2/react-desc-prop-types.js +67 -0
  13. package/dist/cjs/v2/react-desc-prop-types.js.map +7 -0
  14. package/dist/cjs/v2/styled.js +164 -0
  15. package/dist/cjs/v2/styled.js.map +7 -0
  16. package/dist/esm/DSCircularProgressIndicator.js +231 -0
  17. package/dist/esm/DSCircularProgressIndicator.js.map +7 -0
  18. package/dist/esm/index.js +24 -0
  19. package/dist/esm/index.js.map +7 -0
  20. package/dist/esm/package.json +7 -0
  21. package/dist/esm/v2/DSCircularIndeterminateIndicator.js +114 -0
  22. package/dist/esm/v2/DSCircularIndeterminateIndicator.js.map +7 -0
  23. package/dist/esm/v2/constants.js +50 -0
  24. package/dist/esm/v2/constants.js.map +7 -0
  25. package/dist/esm/v2/index.js +11 -0
  26. package/dist/esm/v2/index.js.map +7 -0
  27. package/dist/esm/v2/react-desc-prop-types.js +37 -0
  28. package/dist/esm/v2/react-desc-prop-types.js.map +7 -0
  29. package/dist/esm/v2/styled.js +134 -0
  30. package/dist/esm/v2/styled.js.map +7 -0
  31. package/dist/types/DSCircularProgressIndicator.d.ts +33 -0
  32. package/dist/types/index.d.ts +2 -0
  33. package/dist/types/tests/DSCircularIndeterminateIndicator.axe.test.d.ts +1 -0
  34. package/dist/types/tests/DSCircularIndeterminateIndicator.test.d.ts +1 -0
  35. package/dist/types/tests/DSCircularProgressIndicator.test.d.ts +1 -0
  36. package/dist/types/v2/DSCircularIndeterminateIndicator.d.ts +4 -0
  37. package/dist/types/v2/constants.d.ts +35 -0
  38. package/dist/types/v2/index.d.ts +2 -0
  39. package/dist/types/v2/react-desc-prop-types.d.ts +25 -0
  40. package/dist/types/v2/styled.d.ts +11 -0
  41. package/package.json +87 -0
@@ -0,0 +1,261 @@
1
+ "use strict";
2
+ var __create = Object.create;
3
+ var __defProp = Object.defineProperty;
4
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
+ var __getOwnPropNames = Object.getOwnPropertyNames;
6
+ var __getProtoOf = Object.getPrototypeOf;
7
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
8
+ var __export = (target, all) => {
9
+ for (var name in all)
10
+ __defProp(target, name, { get: all[name], enumerable: true });
11
+ };
12
+ var __copyProps = (to, from, except, desc) => {
13
+ if (from && typeof from === "object" || typeof from === "function") {
14
+ for (let key of __getOwnPropNames(from))
15
+ if (!__hasOwnProp.call(to, key) && key !== except)
16
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
17
+ }
18
+ return to;
19
+ };
20
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
21
+ // If the importer is in node compatibility mode or this is not an ESM
22
+ // file that has been converted to a CommonJS file using a Babel-
23
+ // compatible transform (i.e. "__esModule" has not been set), then set
24
+ // "default" to the CommonJS "module.exports" for node compatibility.
25
+ isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
26
+ mod
27
+ ));
28
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
29
+ var DSCircularProgressIndicator_exports = {};
30
+ __export(DSCircularProgressIndicator_exports, {
31
+ CircularProgressIndicatorWithSchema: () => CircularProgressIndicatorWithSchema,
32
+ default: () => DSCircularProgressIndicator_default
33
+ });
34
+ module.exports = __toCommonJS(DSCircularProgressIndicator_exports);
35
+ var React = __toESM(require("react"));
36
+ var import_jsx_runtime = require("react/jsx-runtime");
37
+ var import_ds_legacy_utilities = require("@elliemae/ds-legacy-utilities");
38
+ var import_ds_legacy_props_helpers = require("@elliemae/ds-legacy-props-helpers");
39
+ var import_ds_legacy_classnames = require("@elliemae/ds-legacy-classnames");
40
+ var import_ds_legacy_tooltip = __toESM(require("@elliemae/ds-legacy-tooltip"));
41
+ const { classNameBlock, classNameElement } = (0, import_ds_legacy_classnames.convertPropToCssClassName)("circular-progress-indicator");
42
+ const CircularProgressIndicator = ({ size, showLabel, showTooltip, waiting, loading }) => {
43
+ (0, import_ds_legacy_utilities.useDeprecateComponent)({ componentName: "ds-circular-progress-indicator", version: "TBD Date: 2023 Q3" });
44
+ const waitingLabel = "Waiting...";
45
+ const loadingLabel = "Loading...";
46
+ const currentLabel = waiting && !loading ? waitingLabel : loadingLabel;
47
+ let sizePx;
48
+ let sizeLabel;
49
+ let strokeWidth;
50
+ let trackWidth;
51
+ let markerHeight = "0.7";
52
+ let markerRefY = "4.8";
53
+ let grayArcStrokeDasharray = "45 170";
54
+ let grayArcStrokeDashoffset = "127.5";
55
+ switch (size.toUpperCase()) {
56
+ case "XS":
57
+ sizePx = 8;
58
+ sizeLabel = 12;
59
+ strokeWidth = 10;
60
+ trackWidth = 3;
61
+ markerHeight = "1";
62
+ grayArcStrokeDasharray = "46 174";
63
+ grayArcStrokeDashoffset = "133";
64
+ break;
65
+ case "S":
66
+ sizePx = 16;
67
+ sizeLabel = 12;
68
+ strokeWidth = 8;
69
+ trackWidth = 3;
70
+ markerHeight = "1";
71
+ grayArcStrokeDasharray = "46 174";
72
+ grayArcStrokeDashoffset = "133";
73
+ break;
74
+ case "M":
75
+ sizePx = 24;
76
+ sizeLabel = 12;
77
+ strokeWidth = 7;
78
+ trackWidth = 3;
79
+ markerHeight = "1";
80
+ markerRefY = "5.5";
81
+ grayArcStrokeDasharray = "46 174";
82
+ grayArcStrokeDashoffset = "133";
83
+ break;
84
+ case "L":
85
+ sizePx = 32;
86
+ sizeLabel = 13;
87
+ strokeWidth = 6;
88
+ trackWidth = 3;
89
+ markerRefY = "5";
90
+ break;
91
+ case "XL":
92
+ sizePx = 48;
93
+ sizeLabel = 14;
94
+ strokeWidth = 5;
95
+ trackWidth = 1;
96
+ break;
97
+ case "XXL":
98
+ sizePx = 56;
99
+ sizeLabel = 16;
100
+ strokeWidth = 4;
101
+ trackWidth = 1;
102
+ break;
103
+ case "XXXL":
104
+ sizePx = 64;
105
+ sizeLabel = 16;
106
+ strokeWidth = 5;
107
+ trackWidth = 2;
108
+ break;
109
+ default:
110
+ break;
111
+ }
112
+ const labelText = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
113
+ "p",
114
+ {
115
+ "data-testid": "circular-indicator-label",
116
+ className: classNameElement("label"),
117
+ style: { fontSize: `${sizeLabel}px` },
118
+ children: currentLabel
119
+ }
120
+ );
121
+ const buildIndicator = (Component) => sizePx < 17 || showTooltip ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
122
+ import_ds_legacy_tooltip.default,
123
+ {
124
+ containerProps: {
125
+ id: "ds-circular-progress-indicator",
126
+ "data-testid": "circular-indicator-title"
127
+ },
128
+ interactionType: "hover",
129
+ title: currentLabel,
130
+ triggerComponent: Component,
131
+ placement: "bottom"
132
+ }
133
+ ) : Component;
134
+ const grayTrack = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
135
+ "circle",
136
+ {
137
+ className: classNameElement("track"),
138
+ cx: "50%",
139
+ cy: "50%",
140
+ fill: "none",
141
+ r: "28",
142
+ strokeWidth: `${trackWidth}px`
143
+ }
144
+ );
145
+ const grayArc = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
146
+ "circle",
147
+ {
148
+ className: classNameElement("arc-gray"),
149
+ stroke: "#E0E3E8",
150
+ strokeDasharray: `${grayArcStrokeDasharray}`,
151
+ strokeDashoffset: `${grayArcStrokeDashoffset}`,
152
+ cx: "50%",
153
+ cy: "50%",
154
+ fill: "none",
155
+ r: "28",
156
+ strokeWidth: `${trackWidth}px`
157
+ }
158
+ );
159
+ const indicator = /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
160
+ "svg",
161
+ {
162
+ height: `${sizePx}px`,
163
+ version: "1.1",
164
+ viewBox: "0 0 66 66",
165
+ width: `${sizePx}px`,
166
+ "data-testid": "circular-indicator",
167
+ "aria-label": waiting && !loading ? waitingLabel : loadingLabel,
168
+ children: [
169
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("defs", { children: [
170
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("linearGradient", { id: "grad1", x1: "0%", x2: "100%", y1: "100%", y2: "0%", children: [
171
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("stop", { offset: "0%", style: { stopColor: "#E0E3E8", stopOpacity: 1 } }),
172
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("stop", { offset: "89%", style: { stopColor: "#5594e2", stopOpacity: 1 } }),
173
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("stop", { offset: "100%", style: { stopColor: "#5594e2", stopOpacity: 1 } })
174
+ ] }),
175
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("linearGradient", { id: "grad2", x1: "0%", x2: "100%", y1: "100%", y2: "0%", children: [
176
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("stop", { offset: "0%", style: { stopColor: "#5594e2", stopOpacity: 1 } }),
177
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("stop", { offset: "11%", style: { stopColor: "#5594e2", stopOpacity: 1 } }),
178
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("stop", { offset: "100%", style: { stopColor: "#E0E3E8", stopOpacity: 1 } })
179
+ ] }),
180
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
181
+ "marker",
182
+ {
183
+ id: "inverseL",
184
+ viewBox: "0 0 5 10",
185
+ refX: "0.5",
186
+ refY: `${markerRefY}`,
187
+ markerUnits: "strokeWidth",
188
+ markerWidth: "0.5",
189
+ markerHeight: `${markerHeight}`,
190
+ orient: "auto",
191
+ children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M 0 0 L 6 0 A 5 5 0 0 0 6 10 L 0 10 z", fill: "#FFF" })
192
+ }
193
+ ),
194
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
195
+ "marker",
196
+ {
197
+ id: "inverseR",
198
+ viewBox: "0 0 5 10",
199
+ refX: "0",
200
+ refY: "5",
201
+ markerUnits: "strokeWidth",
202
+ markerWidth: "0.7",
203
+ markerHeight: `${markerHeight}`,
204
+ children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M 0 0 L 6 0 A 5 5 0 0 0 6 10 L 0 10 z", fill: "#FFF" })
205
+ }
206
+ )
207
+ ] }),
208
+ grayTrack,
209
+ !waiting && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("g", { fill: "none", fillRule: "evenodd", stroke: "none", strokeWidth: "1", children: [
210
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
211
+ "path",
212
+ {
213
+ className: classNameElement("arc-blue"),
214
+ d: "M30,5 C17.536025,6 6,17.536027 5,31",
215
+ stroke: "#5594e2",
216
+ strokeWidth: `${strokeWidth - 0.5}px`,
217
+ strokeLinecap: "round",
218
+ "data-testid": "circular-indicator-blue-arc"
219
+ }
220
+ ),
221
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
222
+ "path",
223
+ {
224
+ className: classNameElement("arc-white"),
225
+ d: "M33,5 C17.536027,5 5,17.536027 5,33",
226
+ stroke: "#FFF",
227
+ strokeWidth: `${strokeWidth + 2}px`,
228
+ markerStart: "url(#inverseR)",
229
+ markerEnd: "url(#inverseL)"
230
+ }
231
+ ),
232
+ grayArc
233
+ ] })
234
+ ]
235
+ }
236
+ );
237
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: classNameBlock("wrapper"), role: "status", "aria-hidden": waiting || loading ? "false" : "true", children: [
238
+ buildIndicator(indicator),
239
+ showLabel && labelText
240
+ ] });
241
+ };
242
+ CircularProgressIndicator.defaultProps = {
243
+ size: "m",
244
+ showLabel: false,
245
+ showTooltip: false,
246
+ waiting: false,
247
+ loading: false
248
+ };
249
+ const circularProgressIndicatorProps = {
250
+ size: import_ds_legacy_props_helpers.PropTypes.oneOf(["xs", "s", "m", "l", "xl", "xxl", "xxxl"]).description("Defines the size of the indicator").defaultValue("m"),
251
+ showLabel: import_ds_legacy_props_helpers.PropTypes.bool.description("Wheter the indicator displays its state on a label or not").defaultValue(false),
252
+ showTooltip: import_ds_legacy_props_helpers.PropTypes.bool.description("Wheter the indicator displays its state on a tooltip or not").defaultValue(false),
253
+ waiting: import_ds_legacy_props_helpers.PropTypes.bool.description("Defines the state of the indicator as Waiting and only displays the gray track").defaultValue(false),
254
+ loading: import_ds_legacy_props_helpers.PropTypes.bool.description("Defines the state of the indicator as Loading and displays a blue spinner animation").defaultValue(false)
255
+ };
256
+ CircularProgressIndicator.propTypes = circularProgressIndicatorProps;
257
+ CircularProgressIndicator.displayName = "CircularProgressIndicator";
258
+ const CircularProgressIndicatorWithSchema = (0, import_ds_legacy_props_helpers.describe)(CircularProgressIndicator);
259
+ CircularProgressIndicatorWithSchema.propTypes = circularProgressIndicatorProps;
260
+ var DSCircularProgressIndicator_default = CircularProgressIndicator;
261
+ //# sourceMappingURL=DSCircularProgressIndicator.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/DSCircularProgressIndicator.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
4
+ "sourcesContent": ["/* eslint-disable eslint-comments/no-unlimited-disable */\n/* eslint-disable */\n// eslint-disable-next-line @typescript-eslint/ban-ts-comment\n// @ts-ignore\n\nimport React from 'react';\nimport { useDeprecateComponent } from '@elliemae/ds-legacy-utilities';\nimport { describe, PropTypes } from '@elliemae/ds-legacy-props-helpers';\nimport { convertPropToCssClassName } from '@elliemae/ds-legacy-classnames';\nimport DSTooltip from '@elliemae/ds-legacy-tooltip';\n\nconst { classNameBlock, classNameElement } = convertPropToCssClassName('circular-progress-indicator');\n\nconst CircularProgressIndicator = ({ size, showLabel, showTooltip, waiting, loading }) => {\n useDeprecateComponent({ componentName: 'ds-circular-progress-indicator', version: 'TBD Date: 2023 Q3' });\n\n const waitingLabel = 'Waiting...';\n const loadingLabel = 'Loading...';\n const currentLabel = waiting && !loading ? waitingLabel : loadingLabel;\n let sizePx;\n let sizeLabel;\n let strokeWidth;\n let trackWidth;\n let markerHeight = '0.7';\n let markerRefY = '4.8';\n let grayArcStrokeDasharray = '45 170';\n let grayArcStrokeDashoffset = '127.5';\n\n switch (size.toUpperCase()) {\n case 'XS':\n sizePx = 8;\n sizeLabel = 12;\n strokeWidth = 10;\n trackWidth = 3;\n markerHeight = '1';\n grayArcStrokeDasharray = '46 174';\n grayArcStrokeDashoffset = '133';\n break;\n case 'S':\n sizePx = 16;\n sizeLabel = 12;\n strokeWidth = 8;\n trackWidth = 3;\n markerHeight = '1';\n grayArcStrokeDasharray = '46 174';\n grayArcStrokeDashoffset = '133';\n break;\n case '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 break;\n case 'L':\n sizePx = 32;\n sizeLabel = 13;\n strokeWidth = 6;\n trackWidth = 3;\n markerRefY = '5';\n break;\n case 'XL':\n sizePx = 48;\n sizeLabel = 14;\n strokeWidth = 5;\n trackWidth = 1;\n break;\n case 'XXL':\n sizePx = 56;\n sizeLabel = 16;\n strokeWidth = 4;\n trackWidth = 1;\n break;\n case 'XXXL':\n sizePx = 64;\n sizeLabel = 16;\n strokeWidth = 5;\n trackWidth = 2;\n break;\n default:\n break;\n }\n\n const labelText = (\n <p\n data-testid=\"circular-indicator-label\"\n className={classNameElement('label')}\n style={{ fontSize: `${sizeLabel}px` }}\n >\n {currentLabel}\n </p>\n );\n\n // Only adds the tooltip if sizePx < 17 or showTooltip is true\n const buildIndicator = (Component: JSX.Element) =>\n sizePx < 17 || showTooltip ? (\n <DSTooltip\n containerProps={{\n id: 'ds-circular-progress-indicator',\n 'data-testid': 'circular-indicator-title',\n }}\n interactionType=\"hover\"\n title={currentLabel}\n triggerComponent={Component}\n placement=\"bottom\"\n />\n ) : (\n Component\n );\n\n const grayTrack = (\n <circle\n className={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={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-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={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-indicator-blue-arc\"\n />\n <path\n className={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 className={classNameBlock('wrapper')} role=\"status\" aria-hidden={waiting || loading ? 'false' : 'true'}>\n {buildIndicator(indicator)}\n {showLabel && labelText}\n </div>\n );\n};\n\nCircularProgressIndicator.defaultProps = {\n size: 'm',\n showLabel: false,\n showTooltip: false,\n waiting: false,\n loading: false,\n};\n\nconst circularProgressIndicatorProps = {\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('Wheter the indicator displays its state on a label or not')\n .defaultValue(false),\n showTooltip: PropTypes.bool\n .description('Wheter 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\nCircularProgressIndicator.propTypes = circularProgressIndicatorProps;\nCircularProgressIndicator.displayName = 'CircularProgressIndicator';\nconst CircularProgressIndicatorWithSchema = describe(CircularProgressIndicator);\nCircularProgressIndicatorWithSchema.propTypes = circularProgressIndicatorProps;\n\nexport { CircularProgressIndicatorWithSchema };\nexport default CircularProgressIndicator;\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": "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",
6
+ "names": ["DSTooltip"]
7
+ }
@@ -0,0 +1,44 @@
1
+ "use strict";
2
+ var __create = Object.create;
3
+ var __defProp = Object.defineProperty;
4
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
+ var __getOwnPropNames = Object.getOwnPropertyNames;
6
+ var __getProtoOf = Object.getPrototypeOf;
7
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
8
+ var __export = (target, all) => {
9
+ for (var name in all)
10
+ __defProp(target, name, { get: all[name], enumerable: true });
11
+ };
12
+ var __copyProps = (to, from, except, desc) => {
13
+ if (from && typeof from === "object" || typeof from === "function") {
14
+ for (let key of __getOwnPropNames(from))
15
+ if (!__hasOwnProp.call(to, key) && key !== except)
16
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
17
+ }
18
+ return to;
19
+ };
20
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
21
+ // If the importer is in node compatibility mode or this is not an ESM
22
+ // file that has been converted to a CommonJS file using a Babel-
23
+ // compatible transform (i.e. "__esModule" has not been set), then set
24
+ // "default" to the CommonJS "module.exports" for node compatibility.
25
+ isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
26
+ mod
27
+ ));
28
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
29
+ var src_exports = {};
30
+ __export(src_exports, {
31
+ CircularProgressIndicatorWithSchema: () => import_DSCircularProgressIndicator.CircularProgressIndicatorWithSchema,
32
+ DSCircularIndeterminateIndicator: () => import_v2.DSCircularIndeterminateIndicator,
33
+ DSCircularIndeterminateIndicatorDataTestIds: () => import_v2.DSCircularIndeterminateIndicatorDataTestIds,
34
+ DSCircularIndeterminateIndicatorName: () => import_v2.DSCircularIndeterminateIndicatorName,
35
+ DSCircularIndeterminateIndicatorSlots: () => import_v2.DSCircularIndeterminateIndicatorSlots,
36
+ DSCircularIndeterminateIndicatorWithSchema: () => import_v2.DSCircularIndeterminateIndicatorWithSchema,
37
+ DSCircularProgressIndicator: () => import_DSCircularProgressIndicator.default,
38
+ default: () => import_DSCircularProgressIndicator.default
39
+ });
40
+ module.exports = __toCommonJS(src_exports);
41
+ var React = __toESM(require("react"));
42
+ var import_DSCircularProgressIndicator = __toESM(require("./DSCircularProgressIndicator.js"));
43
+ var import_v2 = require("./v2/index.js");
44
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/index.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
4
+ "sourcesContent": ["/* eslint-disable import/named */\nexport {\n default,\n default as DSCircularProgressIndicator,\n CircularProgressIndicatorWithSchema,\n} from './DSCircularProgressIndicator.js';\nexport {\n DSCircularIndeterminateIndicator,\n DSCircularIndeterminateIndicatorWithSchema,\n DSCircularIndeterminateIndicatorName,\n DSCircularIndeterminateIndicatorSlots,\n DSCircularIndeterminateIndicatorDataTestIds,\n} from './v2/index.js';\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,yCAIO;AACP,gBAMO;",
6
+ "names": []
7
+ }
@@ -0,0 +1,7 @@
1
+ {
2
+ "type": "commonjs",
3
+ "sideEffects": [
4
+ "*.css",
5
+ "*.scss"
6
+ ]
7
+ }
@@ -0,0 +1,133 @@
1
+ "use strict";
2
+ var __create = Object.create;
3
+ var __defProp = Object.defineProperty;
4
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
+ var __getOwnPropNames = Object.getOwnPropertyNames;
6
+ var __getProtoOf = Object.getPrototypeOf;
7
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
8
+ var __export = (target, all) => {
9
+ for (var name in all)
10
+ __defProp(target, name, { get: all[name], enumerable: true });
11
+ };
12
+ var __copyProps = (to, from, except, desc) => {
13
+ if (from && typeof from === "object" || typeof from === "function") {
14
+ for (let key of __getOwnPropNames(from))
15
+ if (!__hasOwnProp.call(to, key) && key !== except)
16
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
17
+ }
18
+ return to;
19
+ };
20
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
21
+ // If the importer is in node compatibility mode or this is not an ESM
22
+ // file that has been converted to a CommonJS file using a Babel-
23
+ // compatible transform (i.e. "__esModule" has not been set), then set
24
+ // "default" to the CommonJS "module.exports" for node compatibility.
25
+ isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
26
+ mod
27
+ ));
28
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
29
+ var DSCircularIndeterminateIndicator_exports = {};
30
+ __export(DSCircularIndeterminateIndicator_exports, {
31
+ DSCircularIndeterminateIndicator: () => DSCircularIndeterminateIndicator,
32
+ DSCircularIndeterminateIndicatorWithSchema: () => DSCircularIndeterminateIndicatorWithSchema
33
+ });
34
+ module.exports = __toCommonJS(DSCircularIndeterminateIndicator_exports);
35
+ var React = __toESM(require("react"));
36
+ var import_jsx_runtime = require("react/jsx-runtime");
37
+ var import_react = require("react");
38
+ var import_lodash = require("lodash");
39
+ var import_ds_legacy_tooltip = require("@elliemae/ds-legacy-tooltip");
40
+ var import_ds_legacy_props_helpers = require("@elliemae/ds-legacy-props-helpers");
41
+ var import_uid = require("uid");
42
+ var import_react_desc_prop_types = require("./react-desc-prop-types.js");
43
+ var import_constants = require("./constants.js");
44
+ var import_styled = require("./styled.js");
45
+ const EmptyComp = (props) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: props.children });
46
+ const DSCircularIndeterminateIndicator = (props) => {
47
+ const propsWithDefault = (0, import_ds_legacy_props_helpers.useMemoMergePropsWithDefault)(
48
+ props,
49
+ import_react_desc_prop_types.defaultProps
50
+ );
51
+ const globalAttributes = (0, import_lodash.omit)((0, import_ds_legacy_props_helpers.useGetGlobalAttributes)(propsWithDefault), ["height", "width", "rows", "cols", "wrap"]);
52
+ const xstyledAttributes = (0, import_ds_legacy_props_helpers.useGetXstyledProps)(propsWithDefault);
53
+ const { size, color, text, showText, withTooltip, tooltipStartPlacementPreference } = propsWithDefault;
54
+ const Wrapper = (0, import_react.useMemo)(() => withTooltip ? import_ds_legacy_tooltip.DSTooltipV3 : EmptyComp, [withTooltip]);
55
+ const uniqueId = (0, import_react.useMemo)(() => (0, import_uid.uid)(16), []);
56
+ const circleRadius = (0, import_react.useMemo)(() => (import_constants.sizeToPx[size] - Number.parseInt(import_constants.sizeToWeight[size], 10)) / 2, [size]);
57
+ const getOwnerProps = (0, import_react.useCallback)(() => propsWithDefault, [propsWithDefault]);
58
+ const getOwnerPropsArguments = (0, import_react.useCallback)(() => ({}), []);
59
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
60
+ import_styled.StyledContainer,
61
+ {
62
+ gutter: "xs",
63
+ justifyContent: "center",
64
+ role: "status",
65
+ "aria-label": text || "Loading...",
66
+ "data-testid": "ds-circular-indeterminate-indicator-root",
67
+ ...globalAttributes,
68
+ ...xstyledAttributes,
69
+ getOwnerProps,
70
+ getOwnerPropsArguments,
71
+ children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Wrapper, { text, textAlign: "center", startPlacementPreference: tooltipStartPlacementPreference, children: [
72
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
73
+ import_styled.StyledSvg,
74
+ {
75
+ width: import_constants.sizeToPx[size],
76
+ height: import_constants.sizeToPx[size],
77
+ getOwnerProps,
78
+ getOwnerPropsArguments,
79
+ "aria-hidden": "true",
80
+ children: [
81
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("defs", { children: [
82
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("clipPath", { id: `not-gradient-clip-${uniqueId}`, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.StyledRect, { x: "0%", y: "0%", width: "52%", height: "100%" }) }),
83
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("linearGradient", { id: `gradient-color-${uniqueId}`, x1: "0%", x2: "0%", y1: "0%", y2: "100%", children: [
84
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("stop", { offset: "10%", stopColor: `${import_constants.colorToHex[color]}00` }),
85
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("stop", { offset: "90%", stopColor: `${import_constants.colorToHex[color]}FF` })
86
+ ] })
87
+ ] }),
88
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
89
+ import_styled.StyledCircle,
90
+ {
91
+ cx: "50%",
92
+ cy: "50%",
93
+ r: circleRadius,
94
+ strokeWidth: import_constants.sizeToWeight[size],
95
+ stroke: import_constants.colorToHex[color],
96
+ strokeLinecap: "round",
97
+ clipPath: `url(#not-gradient-clip-${uniqueId})`
98
+ }
99
+ ),
100
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
101
+ import_styled.StyledPath,
102
+ {
103
+ d: `M ${import_constants.sizeToPx[size] / 2} ${import_constants.sizeToPx[size] / 2}
104
+ m ${circleRadius}, 0
105
+ a ${circleRadius}, ${circleRadius} 0 0, 1 -${circleRadius}, ${circleRadius}`,
106
+ strokeWidth: import_constants.sizeToWeight[size],
107
+ fill: "transparent",
108
+ stroke: `url(#gradient-color-${uniqueId})`,
109
+ strokeLinecap: "round",
110
+ r: circleRadius
111
+ }
112
+ )
113
+ ]
114
+ }
115
+ ),
116
+ text !== "" && showText && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
117
+ import_styled.StyledLabel,
118
+ {
119
+ style: { color: color === "light" ? "#FFFFFF" : "#353C46", fontSize: import_constants.sizeToTextSize[size] },
120
+ getOwnerProps,
121
+ getOwnerPropsArguments,
122
+ children: text
123
+ }
124
+ )
125
+ ] })
126
+ }
127
+ );
128
+ };
129
+ DSCircularIndeterminateIndicator.propTypes = import_react_desc_prop_types.CircularIndeterminateIndicatorPropTypes;
130
+ DSCircularIndeterminateIndicator.displayName = import_constants.DSCircularIndeterminateIndicatorName;
131
+ const DSCircularIndeterminateIndicatorWithSchema = (0, import_ds_legacy_props_helpers.describe)(DSCircularIndeterminateIndicator);
132
+ DSCircularIndeterminateIndicatorWithSchema.propTypes = import_react_desc_prop_types.CircularIndeterminateIndicatorPropTypes;
133
+ //# sourceMappingURL=DSCircularIndeterminateIndicator.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../src/v2/DSCircularIndeterminateIndicator.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
4
+ "sourcesContent": ["/* eslint-disable @typescript-eslint/naming-convention */\nimport React, { useMemo, useCallback } from 'react';\nimport { omit } from 'lodash';\nimport { DSTooltipV3 } from '@elliemae/ds-legacy-tooltip';\n\nimport {\n describe,\n useGetGlobalAttributes,\n useMemoMergePropsWithDefault,\n useGetXstyledProps,\n} from '@elliemae/ds-legacy-props-helpers';\nimport { uid } from 'uid';\nimport type { DSCircularIndeterminateIndicatorT } from './react-desc-prop-types.js';\nimport { CircularIndeterminateIndicatorPropTypes, defaultProps } from './react-desc-prop-types.js';\nimport {\n colorToHex,\n sizeToPx,\n sizeToTextSize,\n sizeToWeight,\n DSCircularIndeterminateIndicatorName,\n} from './constants.js';\nimport { StyledCircle, StyledContainer, StyledPath, StyledRect, StyledSvg, StyledLabel } from './styled.js';\n// eslint-disable-next-line react/jsx-no-useless-fragment\nconst EmptyComp: typeof DSTooltipV3 = (props) => <>{props.children}</>;\n\nexport const DSCircularIndeterminateIndicator: React.ComponentType<DSCircularIndeterminateIndicatorT.Props> = (\n props,\n) => {\n const propsWithDefault = useMemoMergePropsWithDefault<DSCircularIndeterminateIndicatorT.InternalProps>(\n props,\n defaultProps,\n );\n const globalAttributes = omit(useGetGlobalAttributes(propsWithDefault), ['height', 'width', 'rows', 'cols', 'wrap']);\n const xstyledAttributes = useGetXstyledProps(propsWithDefault);\n\n const { size, color, text, showText, withTooltip, tooltipStartPlacementPreference } = propsWithDefault;\n\n const Wrapper: typeof DSTooltipV3 = useMemo(() => (withTooltip ? DSTooltipV3 : EmptyComp), [withTooltip]);\n\n const uniqueId = useMemo(() => uid(16), []);\n\n const circleRadius = useMemo(() => (sizeToPx[size] - Number.parseInt(sizeToWeight[size], 10)) / 2, [size]);\n\n const getOwnerProps = useCallback(() => propsWithDefault, [propsWithDefault]);\n const getOwnerPropsArguments = useCallback(() => ({}), []);\n\n return (\n <StyledContainer\n gutter=\"xs\"\n justifyContent=\"center\"\n role=\"status\"\n aria-label={text || 'Loading...'}\n data-testid=\"ds-circular-indeterminate-indicator-root\"\n {...globalAttributes}\n {...xstyledAttributes}\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n <Wrapper text={text} textAlign=\"center\" startPlacementPreference={tooltipStartPlacementPreference}>\n <StyledSvg\n width={sizeToPx[size]}\n height={sizeToPx[size]}\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n aria-hidden=\"true\"\n >\n <defs>\n <clipPath id={`not-gradient-clip-${uniqueId}`}>\n <StyledRect x=\"0%\" y=\"0%\" width=\"52%\" height=\"100%\" />\n </clipPath>\n <linearGradient id={`gradient-color-${uniqueId}`} x1=\"0%\" x2=\"0%\" y1=\"0%\" y2=\"100%\">\n <stop offset=\"10%\" stopColor={`${colorToHex[color]}00`} />\n <stop offset=\"90%\" stopColor={`${colorToHex[color]}FF`} />\n </linearGradient>\n </defs>\n <StyledCircle\n cx=\"50%\"\n cy=\"50%\"\n r={circleRadius}\n strokeWidth={sizeToWeight[size]}\n stroke={colorToHex[color]}\n strokeLinecap=\"round\"\n clipPath={`url(#not-gradient-clip-${uniqueId})`}\n />\n {/* \n Here we are using a path because:\n - Flexible enough to build a circle\n - When rotating, the gradient follows the rotation!!! (This is key)\n - We can use the rotation with keyframes, allowing for custom timing\n \n Using a circle does not pass point 2.\n Animating the gradient is not posible with custom timings.\n This is the best solution without using a custom library.\n */}\n <StyledPath\n d={`M ${sizeToPx[size] / 2} ${sizeToPx[size] / 2}\n m ${circleRadius}, 0\n a ${circleRadius}, ${circleRadius} 0 0, 1 -${circleRadius}, ${circleRadius}`}\n strokeWidth={sizeToWeight[size]}\n fill=\"transparent\"\n stroke={`url(#gradient-color-${uniqueId})`}\n strokeLinecap=\"round\"\n r={circleRadius}\n />\n </StyledSvg>\n {text !== '' && showText && (\n <StyledLabel\n style={{ color: color === 'light' ? '#FFFFFF' : '#353C46', fontSize: sizeToTextSize[size] }}\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n {text}\n </StyledLabel>\n )}\n </Wrapper>\n </StyledContainer>\n );\n};\n\nDSCircularIndeterminateIndicator.propTypes = CircularIndeterminateIndicatorPropTypes;\nDSCircularIndeterminateIndicator.displayName = DSCircularIndeterminateIndicatorName;\nexport const DSCircularIndeterminateIndicatorWithSchema = describe(DSCircularIndeterminateIndicator);\nDSCircularIndeterminateIndicatorWithSchema.propTypes = CircularIndeterminateIndicatorPropTypes;\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": "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",
6
+ "names": []
7
+ }
@@ -0,0 +1,80 @@
1
+ "use strict";
2
+ var __create = Object.create;
3
+ var __defProp = Object.defineProperty;
4
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
+ var __getOwnPropNames = Object.getOwnPropertyNames;
6
+ var __getProtoOf = Object.getPrototypeOf;
7
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
8
+ var __export = (target, all) => {
9
+ for (var name in all)
10
+ __defProp(target, name, { get: all[name], enumerable: true });
11
+ };
12
+ var __copyProps = (to, from, except, desc) => {
13
+ if (from && typeof from === "object" || typeof from === "function") {
14
+ for (let key of __getOwnPropNames(from))
15
+ if (!__hasOwnProp.call(to, key) && key !== except)
16
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
17
+ }
18
+ return to;
19
+ };
20
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
21
+ // If the importer is in node compatibility mode or this is not an ESM
22
+ // file that has been converted to a CommonJS file using a Babel-
23
+ // compatible transform (i.e. "__esModule" has not been set), then set
24
+ // "default" to the CommonJS "module.exports" for node compatibility.
25
+ isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
26
+ mod
27
+ ));
28
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
29
+ var constants_exports = {};
30
+ __export(constants_exports, {
31
+ DSCircularIndeterminateIndicatorDataTestIds: () => DSCircularIndeterminateIndicatorDataTestIds,
32
+ DSCircularIndeterminateIndicatorName: () => DSCircularIndeterminateIndicatorName,
33
+ DSCircularIndeterminateIndicatorSlots: () => DSCircularIndeterminateIndicatorSlots,
34
+ colorToHex: () => colorToHex,
35
+ sizeToPx: () => sizeToPx,
36
+ sizeToTextSize: () => sizeToTextSize,
37
+ sizeToWeight: () => sizeToWeight
38
+ });
39
+ module.exports = __toCommonJS(constants_exports);
40
+ var React = __toESM(require("react"));
41
+ var import_ds_legacy_system = require("@elliemae/ds-legacy-system");
42
+ const DSCircularIndeterminateIndicatorName = "DSCircularIndeterminateIndicator";
43
+ const DSCircularIndeterminateIndicatorSlots = {
44
+ ROOT: "root",
45
+ SVG: "svg",
46
+ LABEL: "label"
47
+ };
48
+ const sizeToPx = {
49
+ xs: 16,
50
+ s: 24,
51
+ m: 32,
52
+ l: 48,
53
+ xl: 56,
54
+ xxl: 64
55
+ };
56
+ const sizeToWeight = {
57
+ xs: "3px",
58
+ s: "3px",
59
+ m: "3px",
60
+ l: "4px",
61
+ xl: "5px",
62
+ xxl: "6px"
63
+ };
64
+ const colorToHex = {
65
+ light: "#EBF6FF",
66
+ dark: "#1394E5"
67
+ };
68
+ const sizeToTextSize = {
69
+ xs: "12px",
70
+ s: "12px",
71
+ m: "12px",
72
+ l: "13px",
73
+ xl: "14px",
74
+ xxl: "16px"
75
+ };
76
+ const DSCircularIndeterminateIndicatorDataTestIds = (0, import_ds_legacy_system.slotObjectToDataTestIds)(
77
+ DSCircularIndeterminateIndicatorName,
78
+ DSCircularIndeterminateIndicatorSlots
79
+ );
80
+ //# sourceMappingURL=constants.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../src/v2/constants.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
4
+ "sourcesContent": ["import { slotObjectToDataTestIds } from '@elliemae/ds-legacy-system';\n\nexport const DSCircularIndeterminateIndicatorName = 'DSCircularIndeterminateIndicator';\n\nexport const DSCircularIndeterminateIndicatorSlots = {\n ROOT: 'root',\n SVG: 'svg',\n LABEL: 'label',\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\nexport const DSCircularIndeterminateIndicatorDataTestIds = slotObjectToDataTestIds(\n DSCircularIndeterminateIndicatorName,\n DSCircularIndeterminateIndicatorSlots,\n);\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,8BAAwC;AAEjC,MAAM,uCAAuC;AAE7C,MAAM,wCAAwC;AAAA,EACnD,MAAM;AAAA,EACN,KAAK;AAAA,EACL,OAAO;AACT;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;AAEO,MAAM,kDAA8C;AAAA,EACzD;AAAA,EACA;AACF;",
6
+ "names": []
7
+ }
@@ -0,0 +1,39 @@
1
+ "use strict";
2
+ var __create = Object.create;
3
+ var __defProp = Object.defineProperty;
4
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
+ var __getOwnPropNames = Object.getOwnPropertyNames;
6
+ var __getProtoOf = Object.getPrototypeOf;
7
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
8
+ var __export = (target, all) => {
9
+ for (var name in all)
10
+ __defProp(target, name, { get: all[name], enumerable: true });
11
+ };
12
+ var __copyProps = (to, from, except, desc) => {
13
+ if (from && typeof from === "object" || typeof from === "function") {
14
+ for (let key of __getOwnPropNames(from))
15
+ if (!__hasOwnProp.call(to, key) && key !== except)
16
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
17
+ }
18
+ return to;
19
+ };
20
+ var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
21
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
22
+ // If the importer is in node compatibility mode or this is not an ESM
23
+ // file that has been converted to a CommonJS file using a Babel-
24
+ // compatible transform (i.e. "__esModule" has not been set), then set
25
+ // "default" to the CommonJS "module.exports" for node compatibility.
26
+ isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
27
+ mod
28
+ ));
29
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
30
+ var v2_exports = {};
31
+ __export(v2_exports, {
32
+ DSCircularIndeterminateIndicator: () => import_DSCircularIndeterminateIndicator.DSCircularIndeterminateIndicator,
33
+ DSCircularIndeterminateIndicatorWithSchema: () => import_DSCircularIndeterminateIndicator.DSCircularIndeterminateIndicatorWithSchema
34
+ });
35
+ module.exports = __toCommonJS(v2_exports);
36
+ var React = __toESM(require("react"));
37
+ var import_DSCircularIndeterminateIndicator = require("./DSCircularIndeterminateIndicator.js");
38
+ __reExport(v2_exports, require("./constants.js"), module.exports);
39
+ //# sourceMappingURL=index.js.map