@elliemae/ds-circular-progress-indicator 1.61.12 → 1.61.13
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.
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DSCircularProgressIndicator.js","sources":["../../src/DSCircularProgressIndicator.tsx"],"sourcesContent":["/* eslint-disable complexity */\n/* eslint-disable max-lines */\n/* eslint-disable max-statements */\nimport React from 'react';\nimport { describe, PropTypes } from 'react-desc';\nimport { convertPropToCssClassName } from '@elliemae/ds-classnames';\nimport DSTooltip from '@elliemae/ds-tooltip';\n\nconst { classNameBlock, classNameElement } = convertPropToCssClassName('circular-progress-indicator');\n\nconst CircularProgressIndicator = ({ size, showLabel, showTooltip, waiting, loading }) => {\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 >\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;\n\nconst CircularProgressIndicatorWithSchema = describe(CircularProgressIndicator);\nCircularProgressIndicatorWithSchema.propTypes = circularProgressIndicatorProps;\n\nexport { CircularProgressIndicatorWithSchema };\nexport default CircularProgressIndicator;\n"],"names":["convertPropToCssClassName","classNameBlock","classNameElement","CircularProgressIndicator","size","showLabel","showTooltip","waiting","loading","waitingLabel","loadingLabel","currentLabel","sizePx","sizeLabel","strokeWidth","trackWidth","markerHeight","markerRefY","grayArcStrokeDasharray","grayArcStrokeDashoffset","toUpperCase","labelText","React","fontSize","buildIndicator","Component","DSTooltip","id","grayTrack","grayArc","indicator","stopColor","stopOpacity","defaultProps","circularProgressIndicatorProps","PropTypes","oneOf","description","defaultValue","bool","propTypes","CircularProgressIndicatorWithSchema","describe"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"DSCircularProgressIndicator.js","sources":["../../src/DSCircularProgressIndicator.tsx"],"sourcesContent":["/* eslint-disable complexity */\n/* eslint-disable max-lines */\n/* eslint-disable max-statements */\nimport React from 'react';\nimport { describe, PropTypes } from 'react-desc';\nimport { convertPropToCssClassName } from '@elliemae/ds-classnames';\nimport DSTooltip from '@elliemae/ds-tooltip';\n\nconst { classNameBlock, classNameElement } = convertPropToCssClassName('circular-progress-indicator');\n\nconst CircularProgressIndicator = ({ size, showLabel, showTooltip, waiting, loading }) => {\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 >\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;\n\nconst CircularProgressIndicatorWithSchema = describe(CircularProgressIndicator);\nCircularProgressIndicatorWithSchema.propTypes = circularProgressIndicatorProps;\n\nexport { CircularProgressIndicatorWithSchema };\nexport default CircularProgressIndicator;\n"],"names":["convertPropToCssClassName","classNameBlock","classNameElement","CircularProgressIndicator","size","showLabel","showTooltip","waiting","loading","waitingLabel","loadingLabel","currentLabel","sizePx","sizeLabel","strokeWidth","trackWidth","markerHeight","markerRefY","grayArcStrokeDasharray","grayArcStrokeDashoffset","toUpperCase","labelText","React","fontSize","buildIndicator","Component","DSTooltip","id","grayTrack","grayArc","indicator","stopColor","stopOpacity","defaultProps","circularProgressIndicatorProps","PropTypes","oneOf","description","defaultValue","bool","propTypes","CircularProgressIndicatorWithSchema","describe"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DSCircularProgressIndicator.js","sources":["../../src/DSCircularProgressIndicator.tsx"],"sourcesContent":["/* eslint-disable complexity */\n/* eslint-disable max-lines */\n/* eslint-disable max-statements */\nimport React from 'react';\nimport { describe, PropTypes } from 'react-desc';\nimport { convertPropToCssClassName } from '@elliemae/ds-classnames';\nimport DSTooltip from '@elliemae/ds-tooltip';\n\nconst { classNameBlock, classNameElement } = convertPropToCssClassName('circular-progress-indicator');\n\nconst CircularProgressIndicator = ({ size, showLabel, showTooltip, waiting, loading }) => {\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 >\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;\n\nconst CircularProgressIndicatorWithSchema = describe(CircularProgressIndicator);\nCircularProgressIndicatorWithSchema.propTypes = circularProgressIndicatorProps;\n\nexport { CircularProgressIndicatorWithSchema };\nexport default CircularProgressIndicator;\n"],"names":["convertPropToCssClassName","classNameBlock","classNameElement","CircularProgressIndicator","size","showLabel","showTooltip","waiting","loading","waitingLabel","loadingLabel","currentLabel","sizePx","sizeLabel","strokeWidth","trackWidth","markerHeight","markerRefY","grayArcStrokeDasharray","grayArcStrokeDashoffset","toUpperCase","labelText","fontSize","buildIndicator","Component","id","grayTrack","grayArc","indicator","stopColor","stopOpacity","defaultProps","circularProgressIndicatorProps","PropTypes","oneOf","description","defaultValue","bool","propTypes","CircularProgressIndicatorWithSchema","describe"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"DSCircularProgressIndicator.js","sources":["../../src/DSCircularProgressIndicator.tsx"],"sourcesContent":["/* eslint-disable complexity */\n/* eslint-disable max-lines */\n/* eslint-disable max-statements */\nimport React from 'react';\nimport { describe, PropTypes } from 'react-desc';\nimport { convertPropToCssClassName } from '@elliemae/ds-classnames';\nimport DSTooltip from '@elliemae/ds-tooltip';\n\nconst { classNameBlock, classNameElement } = convertPropToCssClassName('circular-progress-indicator');\n\nconst CircularProgressIndicator = ({ size, showLabel, showTooltip, waiting, loading }) => {\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 >\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;\n\nconst CircularProgressIndicatorWithSchema = describe(CircularProgressIndicator);\nCircularProgressIndicatorWithSchema.propTypes = circularProgressIndicatorProps;\n\nexport { CircularProgressIndicatorWithSchema };\nexport default CircularProgressIndicator;\n"],"names":["convertPropToCssClassName","classNameBlock","classNameElement","CircularProgressIndicator","size","showLabel","showTooltip","waiting","loading","waitingLabel","loadingLabel","currentLabel","sizePx","sizeLabel","strokeWidth","trackWidth","markerHeight","markerRefY","grayArcStrokeDasharray","grayArcStrokeDashoffset","toUpperCase","labelText","fontSize","buildIndicator","Component","id","grayTrack","grayArc","indicator","stopColor","stopOpacity","defaultProps","circularProgressIndicatorProps","PropTypes","oneOf","description","defaultValue","bool","propTypes","CircularProgressIndicatorWithSchema","describe"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@elliemae/ds-circular-progress-indicator",
|
|
3
|
-
"version": "1.61.
|
|
3
|
+
"version": "1.61.13",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "Ellie Mae - Dim Sum - Circular progress indicator",
|
|
6
6
|
"module": "esm/index.js",
|
|
@@ -16,8 +16,8 @@
|
|
|
16
16
|
"build": "node ../../scripts/build/build.js"
|
|
17
17
|
},
|
|
18
18
|
"dependencies": {
|
|
19
|
-
"@elliemae/ds-classnames": "1.61.
|
|
20
|
-
"@elliemae/ds-tooltip": "1.61.
|
|
19
|
+
"@elliemae/ds-classnames": "1.61.13",
|
|
20
|
+
"@elliemae/ds-tooltip": "1.61.13",
|
|
21
21
|
"react-desc": "^4.1.2"
|
|
22
22
|
},
|
|
23
23
|
"peerDependencies": {
|