@elliemae/ds-circular-progress-indicator 3.22.0-next.3 → 3.22.0-next.31

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 (20) hide show
  1. package/dist/cjs/DSCircularProgressIndicator.js.map +1 -1
  2. package/dist/cjs/index.js.map +1 -1
  3. package/dist/cjs/v2/DSCircularIndeterminateIndicator.js +1 -0
  4. package/dist/cjs/v2/DSCircularIndeterminateIndicator.js.map +3 -3
  5. package/dist/cjs/v2/constants.js.map +1 -1
  6. package/dist/cjs/v2/index.js.map +1 -1
  7. package/dist/cjs/v2/react-desc-prop-types.js.map +2 -2
  8. package/dist/cjs/v2/styled.js +3 -1
  9. package/dist/cjs/v2/styled.js.map +3 -3
  10. package/dist/esm/DSCircularProgressIndicator.js.map +1 -1
  11. package/dist/esm/index.js.map +1 -1
  12. package/dist/esm/v2/DSCircularIndeterminateIndicator.js +1 -0
  13. package/dist/esm/v2/DSCircularIndeterminateIndicator.js.map +3 -3
  14. package/dist/esm/v2/constants.js.map +1 -1
  15. package/dist/esm/v2/index.js.map +1 -1
  16. package/dist/esm/v2/react-desc-prop-types.js.map +2 -2
  17. package/dist/esm/v2/styled.js +3 -1
  18. package/dist/esm/v2/styled.js.map +3 -3
  19. package/dist/types/v2/react-desc-prop-types.d.ts +2 -2
  20. package/package.json +15 -15
package/dist/cjs/DSCircularProgressIndicator.js.map CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../src/DSCircularProgressIndicator.tsx", "../../../../scripts/build/transpile/react-shim.js"],
3
+ "sources": ["../../src/DSCircularProgressIndicator.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
4
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-utilities';\nimport { describe, PropTypes } from '@elliemae/ds-props-helpers';\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 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 >\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
5
  "mappings": "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",
6
6
  "names": ["DSTooltip"]
package/dist/cjs/index.js.map CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../src/index.tsx", "../../../../scripts/build/transpile/react-shim.js"],
3
+ "sources": ["../../src/index.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
4
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
5
  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,yCAIO;AACP,gBAMO;",
6
6
  "names": []
package/dist/cjs/v2/DSCircularIndeterminateIndicator.js CHANGED
@@ -76,6 +76,7 @@ const DSCircularIndeterminateIndicator = (props) => {
76
76
  height: import_constants.sizeToPx[size],
77
77
  getOwnerProps,
78
78
  getOwnerPropsArguments,
79
+ "aria-hidden": "true",
79
80
  children: [
80
81
  /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("defs", { children: [
81
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%" }) }),
package/dist/cjs/v2/DSCircularIndeterminateIndicator.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
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-tooltip';\n\nimport {\n describe,\n useGetGlobalAttributes,\n useMemoMergePropsWithDefault,\n useGetXstyledProps,\n} from '@elliemae/ds-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 >\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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",
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-tooltip';\n\nimport {\n describe,\n useGetGlobalAttributes,\n useMemoMergePropsWithDefault,\n useGetXstyledProps,\n} from '@elliemae/ds-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
6
  "names": []
7
7
  }
package/dist/cjs/v2/constants.js.map CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../../src/v2/constants.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
3
+ "sources": ["../../../src/v2/constants.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
4
4
  "sourcesContent": ["import { slotObjectToDataTestIds } from '@elliemae/ds-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
5
  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAAwC;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
6
  "names": []
package/dist/cjs/v2/index.js.map CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../../src/v2/index.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
3
+ "sources": ["../../../src/v2/index.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
4
4
  "sourcesContent": ["export {\n DSCircularIndeterminateIndicator,\n DSCircularIndeterminateIndicatorWithSchema,\n} from './DSCircularIndeterminateIndicator.js';\nexport * from './constants.js';\n", "import * as React from 'react';\nexport { React };\n"],
5
5
  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,8CAGO;AACP,uBAAc,2BAJd;",
6
6
  "names": []
package/dist/cjs/v2/react-desc-prop-types.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../../src/v2/react-desc-prop-types.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["/* eslint-disable @typescript-eslint/no-empty-interface */\n/* eslint-disable max-lines */\nimport type {} from '@elliemae/ds-utilities';\nimport type { GlobalAttributesT, XstyledProps } from '@elliemae/ds-props-helpers';\nimport { PropTypes, globalAttributesPropTypes } from '@elliemae/ds-props-helpers';\nimport { type DSTooltipV3T } from '@elliemae/ds-tooltip';\nimport type { WeakValidationMap } from 'react';\n\nexport const defaultProps: DSCircularIndeterminateIndicatorT.DefaultProps = {\n size: 'm',\n color: 'dark',\n text: '',\n showText: true,\n withTooltip: false,\n tooltipStartPlacementPreference: 'bottom',\n};\n\nexport declare namespace DSCircularIndeterminateIndicatorT {\n type TShirtSizes = 'xs' | 's' | 'm' | 'l' | 'xl' | 'xxl';\n type SupportedColors = 'light' | 'dark';\n export interface DefaultProps {\n size: TShirtSizes;\n color: SupportedColors;\n text: string;\n showText: boolean;\n withTooltip: boolean;\n tooltipStartPlacementPreference: DSTooltipV3T.Placement;\n }\n export interface OptionalProps {}\n export interface RequiredProps {}\n\n export interface Props\n extends Partial<DefaultProps>,\n OptionalProps,\n Omit<GlobalAttributesT<HTMLButtonElement>, keyof DefaultProps | keyof OptionalProps | keyof RequiredProps>,\n XstyledProps,\n RequiredProps {}\n\n export interface InternalProps\n extends DefaultProps,\n OptionalProps,\n Omit<GlobalAttributesT<HTMLButtonElement>, keyof DefaultProps | keyof OptionalProps | keyof RequiredProps>,\n XstyledProps,\n RequiredProps {}\n}\n\nexport const CircularIndeterminateIndicatorPropTypes = {\n ...globalAttributesPropTypes,\n size: PropTypes.oneOf(['xs', 's', 'm', 'l', 'xl', 'xxl']).description('Size of the indicator').defaultValue('m'),\n color: PropTypes.oneOf(['light', 'dark']).description('Color mode for the indicator').defaultValue('dark'),\n text: PropTypes.string.description('Optional text to show under the indicator').defaultValue(''),\n showText: PropTypes.bool.description('Whether to show the optional text or not').defaultValue(true),\n withTooltip: PropTypes.bool\n .description('Whether to include a tooltip that shows the optional text on hover')\n .defaultValue(false),\n tooltipStartPlacementPreference: PropTypes.oneOf([\n 'top-start',\n 'top',\n 'top-end',\n 'right-start',\n 'right',\n 'right-end',\n 'bottom-end',\n 'bottom',\n 'bottom-start',\n 'left-end',\n 'left',\n 'left-start',\n ])\n .description('start placement preference for the tooltip')\n .defaultValue('center'),\n} as WeakValidationMap<unknown>;\n", "import * as React from 'react';\nexport { React };\n"],
3
+ "sources": ["../../../src/v2/react-desc-prop-types.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
4
+ "sourcesContent": ["/* eslint-disable @typescript-eslint/no-empty-interface */\n/* eslint-disable max-lines */\nimport type {} from '@elliemae/ds-utilities';\nimport type { GlobalAttributesT, XstyledProps } from '@elliemae/ds-props-helpers';\nimport { PropTypes, globalAttributesPropTypes } from '@elliemae/ds-props-helpers';\nimport { type DSTooltipV3T } from '@elliemae/ds-tooltip';\nimport type { WeakValidationMap } from 'react';\n\nexport const defaultProps: DSCircularIndeterminateIndicatorT.DefaultProps = {\n size: 'm',\n color: 'dark',\n text: '',\n showText: true,\n withTooltip: false,\n tooltipStartPlacementPreference: 'bottom',\n};\n\nexport declare namespace DSCircularIndeterminateIndicatorT {\n type TShirtSizes = 'xs' | 's' | 'm' | 'l' | 'xl' | 'xxl';\n type SupportedColors = 'light' | 'dark';\n export interface DefaultProps {\n size: TShirtSizes;\n color: SupportedColors;\n text: string;\n showText: boolean;\n withTooltip: boolean;\n tooltipStartPlacementPreference: DSTooltipV3T.Placement;\n }\n export interface OptionalProps {}\n export interface RequiredProps {}\n\n export interface Props\n extends Partial<DefaultProps>,\n OptionalProps,\n Omit<GlobalAttributesT<HTMLButtonElement>, keyof DefaultProps | keyof OptionalProps>,\n XstyledProps,\n RequiredProps {}\n\n export interface InternalProps\n extends DefaultProps,\n OptionalProps,\n Omit<GlobalAttributesT<HTMLButtonElement>, keyof DefaultProps | keyof OptionalProps>,\n XstyledProps,\n RequiredProps {}\n}\n\nexport const CircularIndeterminateIndicatorPropTypes = {\n ...globalAttributesPropTypes,\n size: PropTypes.oneOf(['xs', 's', 'm', 'l', 'xl', 'xxl']).description('Size of the indicator').defaultValue('m'),\n color: PropTypes.oneOf(['light', 'dark']).description('Color mode for the indicator').defaultValue('dark'),\n text: PropTypes.string.description('Optional text to show under the indicator').defaultValue(''),\n showText: PropTypes.bool.description('Whether to show the optional text or not').defaultValue(true),\n withTooltip: PropTypes.bool\n .description('Whether to include a tooltip that shows the optional text on hover')\n .defaultValue(false),\n tooltipStartPlacementPreference: PropTypes.oneOf([\n 'top-start',\n 'top',\n 'top-end',\n 'right-start',\n 'right',\n 'right-end',\n 'bottom-end',\n 'bottom',\n 'bottom-start',\n 'left-end',\n 'left',\n 'left-start',\n ])\n .description('start placement preference for the tooltip')\n .defaultValue('center'),\n} as WeakValidationMap<unknown>;\n", "import * as React from 'react';\nexport { React };\n"],
5
5
  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADIvB,8BAAqD;AAI9C,MAAM,eAA+D;AAAA,EAC1E,MAAM;AAAA,EACN,OAAO;AAAA,EACP,MAAM;AAAA,EACN,UAAU;AAAA,EACV,aAAa;AAAA,EACb,iCAAiC;AACnC;AA+BO,MAAM,0CAA0C;AAAA,EACrD,GAAG;AAAA,EACH,MAAM,kCAAU,MAAM,CAAC,MAAM,KAAK,KAAK,KAAK,MAAM,KAAK,CAAC,EAAE,YAAY,uBAAuB,EAAE,aAAa,GAAG;AAAA,EAC/G,OAAO,kCAAU,MAAM,CAAC,SAAS,MAAM,CAAC,EAAE,YAAY,8BAA8B,EAAE,aAAa,MAAM;AAAA,EACzG,MAAM,kCAAU,OAAO,YAAY,2CAA2C,EAAE,aAAa,EAAE;AAAA,EAC/F,UAAU,kCAAU,KAAK,YAAY,0CAA0C,EAAE,aAAa,IAAI;AAAA,EAClG,aAAa,kCAAU,KACpB,YAAY,oEAAoE,EAChF,aAAa,KAAK;AAAA,EACrB,iCAAiC,kCAAU,MAAM;AAAA,IAC/C;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC,EACE,YAAY,4CAA4C,EACxD,aAAa,QAAQ;AAC1B;",
6
6
  "names": []
7
7
  }
package/dist/cjs/v2/styled.js CHANGED
@@ -142,7 +142,9 @@ const StyledSvg = (0, import_ds_system.styled)("svg", {
142
142
  `;
143
143
  const StyledPath = import_ds_system.styled.path`
144
144
  transform-origin: center center;
145
- animation: ${rotateAnimation} 10s linear infinite, ${(props) => strokeTailAnimation(props.r)} 2.5s linear infinite;
145
+ animation:
146
+ ${rotateAnimation} 10s linear infinite,
147
+ ${(props) => strokeTailAnimation(props.r)} 2.5s linear infinite;
146
148
  `;
147
149
  const StyledRect = import_ds_system.styled.rect`
148
150
  transform-origin: center center;
package/dist/cjs/v2/styled.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../../src/v2/styled.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["/* eslint-disable no-underscore-dangle */\nimport { Grid } from '@elliemae/ds-grid';\nimport { kfrm, styled } from '@elliemae/ds-system';\nimport { DSCircularIndeterminateIndicatorName, DSCircularIndeterminateIndicatorSlots } from './constants.js';\nconst { PI } = Math;\n\nconst getArcLength = (percentage: number, radius: number) => ((2 * PI * radius) / 100) * percentage;\n\nconst svgRotateAnimation = kfrm`\n 0% {\n transform: rotate(0);\n }\n 100% {\n transform: rotate(360deg);\n }\n`;\n\nconst strokeTailAnimation = (r: number) => {\n const miniDash = `${getArcLength(0, r)} ${getArcLength(100, r)}`;\n const fullDash = `${getArcLength(75, r)} ${getArcLength(25, r)}`;\n\n return kfrm`\n 0% {\n stroke-dasharray: ${miniDash};\n }\n 50% {\n stroke-dasharray: ${fullDash};\n }\n 100% {\n stroke-dasharray: ${miniDash};\n }\n`;\n};\n\nconst rotateAnimation = kfrm`\n 0%, 12.5% {\n transform: rotate(0);\n }\n 25%, 37.5% {\n transform: rotate(270deg);\n }\n 50%, 62.5% {\n transform: rotate(540deg);\n }\n 75%, 87.5% {\n transform: rotate(810deg);\n }\n 100% {\n transform: rotate(1080deg);\n }\n`;\n\nconst dashAnimation = (r: number) => {\n const miniDash = `${getArcLength(0, r)} ${getArcLength(100, r)}`;\n const fullDash = `${getArcLength(75, r)} ${getArcLength(25, r)}`;\n\n return kfrm`\n 0% {\n stroke-dasharray: ${miniDash};\n stroke-dashoffset: 0;\n }\n 12.5% {\n stroke-dasharray: ${fullDash};\n stroke-dashoffset: 0;\n }\n 25% {\n stroke-dasharray: ${miniDash};\n stroke-dashoffset: ${getArcLength(-75, r)};\n }\n 37.5% {\n stroke-dasharray: ${fullDash};\n stroke-dashoffset: ${getArcLength(-75, r)};\n }\n 50% {\n stroke-dasharray: ${miniDash};\n stroke-dashoffset: ${getArcLength(-150, r)};\n }\n 62.5% {\n stroke-dasharray: ${fullDash};\n stroke-dashoffset: ${getArcLength(-150, r)};\n }\n 75% {\n stroke-dasharray: ${miniDash};\n stroke-dashoffset: ${getArcLength(-225, r)};\n }\n 87.5% {\n stroke-dasharray: ${fullDash};\n stroke-dashoffset: ${getArcLength(-225, r)};\n }\n 100% {\n stroke-dasharray: ${miniDash};\n stroke-dashoffset: ${getArcLength(-300, r)};\n }\n`;\n};\n\nexport const StyledContainer = styled(Grid, {\n name: DSCircularIndeterminateIndicatorName,\n slot: DSCircularIndeterminateIndicatorSlots.ROOT,\n})`\n z-index: ${({ theme }) => theme.zIndex.loader};\n`;\n\nexport const StyledSvg = styled('svg', {\n name: DSCircularIndeterminateIndicatorName,\n slot: DSCircularIndeterminateIndicatorSlots.SVG,\n})`\n display: block;\n margin: auto;\n transform-origin: center center;\n transform: rotate(-90deg);\n animation: ${svgRotateAnimation} 2.5s linear infinite;\n`;\n\nexport const StyledPath = styled.path<{ r: number }>`\n transform-origin: center center;\n animation: ${rotateAnimation} 10s linear infinite, ${(props) => strokeTailAnimation(props.r)} 2.5s linear infinite;\n`;\n\nexport const StyledRect = styled.rect`\n transform-origin: center center;\n animation: ${rotateAnimation} 10s linear infinite;\n`;\n\nexport const StyledCircle = styled.circle<{ r: number }>`\n stroke-dashoffset: 0;\n fill: none;\n animation: ${(props) => dashAnimation(props.r)} 10s linear infinite;\n clip-path: ${(props) => props.clipPath};\n -webkit-clip-path: ${(props) => props.clipPath};\n`;\n\nexport const StyledLabel = styled('span', {\n name: DSCircularIndeterminateIndicatorName,\n slot: DSCircularIndeterminateIndicatorSlots.LABEL,\n})``;\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,qBAAqB;AACrB,uBAA6B;AAC7B,uBAA4F;AAC5F,MAAM,EAAE,GAAG,IAAI;AAEf,MAAM,eAAe,CAAC,YAAoB,WAAqB,IAAI,KAAK,SAAU,MAAO;AAEzF,MAAM,qBAAqB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAS3B,MAAM,sBAAsB,CAAC,MAAc;AACzC,QAAM,WAAW,GAAG,aAAa,GAAG,CAAC,KAAK,aAAa,KAAK,CAAC;AAC7D,QAAM,WAAW,GAAG,aAAa,IAAI,CAAC,KAAK,aAAa,IAAI,CAAC;AAE7D,SAAO;AAAA;AAAA,4BAEmB;AAAA;AAAA;AAAA,4BAGA;AAAA;AAAA;AAAA,4BAGA;AAAA;AAAA;AAG5B;AAEA,MAAM,kBAAkB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAkBxB,MAAM,gBAAgB,CAAC,MAAc;AACnC,QAAM,WAAW,GAAG,aAAa,GAAG,CAAC,KAAK,aAAa,KAAK,CAAC;AAC7D,QAAM,WAAW,GAAG,aAAa,IAAI,CAAC,KAAK,aAAa,IAAI,CAAC;AAE7D,SAAO;AAAA;AAAA,4BAEmB;AAAA;AAAA;AAAA;AAAA,4BAIA;AAAA;AAAA;AAAA;AAAA,4BAIA;AAAA,6BACC,aAAa,KAAK,CAAC;AAAA;AAAA;AAAA,4BAGpB;AAAA,6BACC,aAAa,KAAK,CAAC;AAAA;AAAA;AAAA,4BAGpB;AAAA,6BACC,aAAa,MAAM,CAAC;AAAA;AAAA;AAAA,4BAGrB;AAAA,6BACC,aAAa,MAAM,CAAC;AAAA;AAAA;AAAA,4BAGrB;AAAA,6BACC,aAAa,MAAM,CAAC;AAAA;AAAA;AAAA,4BAGrB;AAAA,6BACC,aAAa,MAAM,CAAC;AAAA;AAAA;AAAA,4BAGrB;AAAA,6BACC,aAAa,MAAM,CAAC;AAAA;AAAA;AAGjD;AAEO,MAAM,sBAAkB,yBAAO,qBAAM;AAAA,EAC1C,MAAM;AAAA,EACN,MAAM,uDAAsC;AAC9C,CAAC;AAAA,aACY,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO;AAAA;AAGlC,MAAM,gBAAY,yBAAO,OAAO;AAAA,EACrC,MAAM;AAAA,EACN,MAAM,uDAAsC;AAC9C,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA,eAKc;AAAA;AAGR,MAAM,aAAa,wBAAO;AAAA;AAAA,eAElB,wCAAwC,CAAC,UAAU,oBAAoB,MAAM,CAAC;AAAA;AAGtF,MAAM,aAAa,wBAAO;AAAA;AAAA,eAElB;AAAA;AAGR,MAAM,eAAe,wBAAO;AAAA;AAAA;AAAA,eAGpB,CAAC,UAAU,cAAc,MAAM,CAAC;AAAA,eAChC,CAAC,UAAU,MAAM;AAAA,uBACT,CAAC,UAAU,MAAM;AAAA;AAGjC,MAAM,kBAAc,yBAAO,QAAQ;AAAA,EACxC,MAAM;AAAA,EACN,MAAM,uDAAsC;AAC9C,CAAC;",
3
+ "sources": ["../../../src/v2/styled.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
4
+ "sourcesContent": ["/* eslint-disable no-underscore-dangle */\nimport { Grid } from '@elliemae/ds-grid';\nimport { kfrm, styled } from '@elliemae/ds-system';\nimport { DSCircularIndeterminateIndicatorName, DSCircularIndeterminateIndicatorSlots } from './constants.js';\nconst { PI } = Math;\n\nconst getArcLength = (percentage: number, radius: number) => ((2 * PI * radius) / 100) * percentage;\n\nconst svgRotateAnimation = kfrm`\n 0% {\n transform: rotate(0);\n }\n 100% {\n transform: rotate(360deg);\n }\n`;\n\nconst strokeTailAnimation = (r: number) => {\n const miniDash = `${getArcLength(0, r)} ${getArcLength(100, r)}`;\n const fullDash = `${getArcLength(75, r)} ${getArcLength(25, r)}`;\n\n return kfrm`\n 0% {\n stroke-dasharray: ${miniDash};\n }\n 50% {\n stroke-dasharray: ${fullDash};\n }\n 100% {\n stroke-dasharray: ${miniDash};\n }\n`;\n};\n\nconst rotateAnimation = kfrm`\n 0%, 12.5% {\n transform: rotate(0);\n }\n 25%, 37.5% {\n transform: rotate(270deg);\n }\n 50%, 62.5% {\n transform: rotate(540deg);\n }\n 75%, 87.5% {\n transform: rotate(810deg);\n }\n 100% {\n transform: rotate(1080deg);\n }\n`;\n\nconst dashAnimation = (r: number) => {\n const miniDash = `${getArcLength(0, r)} ${getArcLength(100, r)}`;\n const fullDash = `${getArcLength(75, r)} ${getArcLength(25, r)}`;\n\n return kfrm`\n 0% {\n stroke-dasharray: ${miniDash};\n stroke-dashoffset: 0;\n }\n 12.5% {\n stroke-dasharray: ${fullDash};\n stroke-dashoffset: 0;\n }\n 25% {\n stroke-dasharray: ${miniDash};\n stroke-dashoffset: ${getArcLength(-75, r)};\n }\n 37.5% {\n stroke-dasharray: ${fullDash};\n stroke-dashoffset: ${getArcLength(-75, r)};\n }\n 50% {\n stroke-dasharray: ${miniDash};\n stroke-dashoffset: ${getArcLength(-150, r)};\n }\n 62.5% {\n stroke-dasharray: ${fullDash};\n stroke-dashoffset: ${getArcLength(-150, r)};\n }\n 75% {\n stroke-dasharray: ${miniDash};\n stroke-dashoffset: ${getArcLength(-225, r)};\n }\n 87.5% {\n stroke-dasharray: ${fullDash};\n stroke-dashoffset: ${getArcLength(-225, r)};\n }\n 100% {\n stroke-dasharray: ${miniDash};\n stroke-dashoffset: ${getArcLength(-300, r)};\n }\n`;\n};\n\nexport const StyledContainer = styled(Grid, {\n name: DSCircularIndeterminateIndicatorName,\n slot: DSCircularIndeterminateIndicatorSlots.ROOT,\n})`\n z-index: ${({ theme }) => theme.zIndex.loader};\n`;\n\nexport const StyledSvg = styled('svg', {\n name: DSCircularIndeterminateIndicatorName,\n slot: DSCircularIndeterminateIndicatorSlots.SVG,\n})`\n display: block;\n margin: auto;\n transform-origin: center center;\n transform: rotate(-90deg);\n animation: ${svgRotateAnimation} 2.5s linear infinite;\n`;\n\nexport const StyledPath = styled.path<{ r: number }>`\n transform-origin: center center;\n animation:\n ${rotateAnimation} 10s linear infinite,\n ${(props) => strokeTailAnimation(props.r)} 2.5s linear infinite;\n`;\n\nexport const StyledRect = styled.rect`\n transform-origin: center center;\n animation: ${rotateAnimation} 10s linear infinite;\n`;\n\nexport const StyledCircle = styled.circle<{ r: number }>`\n stroke-dashoffset: 0;\n fill: none;\n animation: ${(props) => dashAnimation(props.r)} 10s linear infinite;\n clip-path: ${(props) => props.clipPath};\n -webkit-clip-path: ${(props) => props.clipPath};\n`;\n\nexport const StyledLabel = styled('span', {\n name: DSCircularIndeterminateIndicatorName,\n slot: DSCircularIndeterminateIndicatorSlots.LABEL,\n})``;\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,qBAAqB;AACrB,uBAA6B;AAC7B,uBAA4F;AAC5F,MAAM,EAAE,GAAG,IAAI;AAEf,MAAM,eAAe,CAAC,YAAoB,WAAqB,IAAI,KAAK,SAAU,MAAO;AAEzF,MAAM,qBAAqB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAS3B,MAAM,sBAAsB,CAAC,MAAc;AACzC,QAAM,WAAW,GAAG,aAAa,GAAG,CAAC,KAAK,aAAa,KAAK,CAAC;AAC7D,QAAM,WAAW,GAAG,aAAa,IAAI,CAAC,KAAK,aAAa,IAAI,CAAC;AAE7D,SAAO;AAAA;AAAA,4BAEmB;AAAA;AAAA;AAAA,4BAGA;AAAA;AAAA;AAAA,4BAGA;AAAA;AAAA;AAG5B;AAEA,MAAM,kBAAkB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAkBxB,MAAM,gBAAgB,CAAC,MAAc;AACnC,QAAM,WAAW,GAAG,aAAa,GAAG,CAAC,KAAK,aAAa,KAAK,CAAC;AAC7D,QAAM,WAAW,GAAG,aAAa,IAAI,CAAC,KAAK,aAAa,IAAI,CAAC;AAE7D,SAAO;AAAA;AAAA,4BAEmB;AAAA;AAAA;AAAA;AAAA,4BAIA;AAAA;AAAA;AAAA;AAAA,4BAIA;AAAA,6BACC,aAAa,KAAK,CAAC;AAAA;AAAA;AAAA,4BAGpB;AAAA,6BACC,aAAa,KAAK,CAAC;AAAA;AAAA;AAAA,4BAGpB;AAAA,6BACC,aAAa,MAAM,CAAC;AAAA;AAAA;AAAA,4BAGrB;AAAA,6BACC,aAAa,MAAM,CAAC;AAAA;AAAA;AAAA,4BAGrB;AAAA,6BACC,aAAa,MAAM,CAAC;AAAA;AAAA;AAAA,4BAGrB;AAAA,6BACC,aAAa,MAAM,CAAC;AAAA;AAAA;AAAA,4BAGrB;AAAA,6BACC,aAAa,MAAM,CAAC;AAAA;AAAA;AAGjD;AAEO,MAAM,sBAAkB,yBAAO,qBAAM;AAAA,EAC1C,MAAM;AAAA,EACN,MAAM,uDAAsC;AAC9C,CAAC;AAAA,aACY,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO;AAAA;AAGlC,MAAM,gBAAY,yBAAO,OAAO;AAAA,EACrC,MAAM;AAAA,EACN,MAAM,uDAAsC;AAC9C,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA,eAKc;AAAA;AAGR,MAAM,aAAa,wBAAO;AAAA;AAAA;AAAA,MAG3B;AAAA,MACA,CAAC,UAAU,oBAAoB,MAAM,CAAC;AAAA;AAGrC,MAAM,aAAa,wBAAO;AAAA;AAAA,eAElB;AAAA;AAGR,MAAM,eAAe,wBAAO;AAAA;AAAA;AAAA,eAGpB,CAAC,UAAU,cAAc,MAAM,CAAC;AAAA,eAChC,CAAC,UAAU,MAAM;AAAA,uBACT,CAAC,UAAU,MAAM;AAAA;AAGjC,MAAM,kBAAc,yBAAO,QAAQ;AAAA,EACxC,MAAM;AAAA,EACN,MAAM,uDAAsC;AAC9C,CAAC;",
6
6
  "names": []
7
7
  }
package/dist/esm/DSCircularProgressIndicator.js.map CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/DSCircularProgressIndicator.tsx"],
3
+ "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/DSCircularProgressIndicator.tsx"],
4
4
  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* 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-utilities';\nimport { describe, PropTypes } from '@elliemae/ds-props-helpers';\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 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 >\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"],
5
5
  "mappings": "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",
6
6
  "names": []
package/dist/esm/index.js.map CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/index.tsx"],
3
+ "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/index.tsx"],
4
4
  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* 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"],
5
5
  "mappings": "AAAA,YAAY,WAAW;ACCvB;AAAA,EACE,WAAAA;AAAA,EACW,WAAXA;AAAA,EACA;AAAA,OACK;AACP;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;",
6
6
  "names": ["default"]
package/dist/esm/v2/DSCircularIndeterminateIndicator.js CHANGED
@@ -53,6 +53,7 @@ const DSCircularIndeterminateIndicator = (props) => {
53
53
  height: sizeToPx[size],
54
54
  getOwnerProps,
55
55
  getOwnerPropsArguments,
56
+ "aria-hidden": "true",
56
57
  children: [
57
58
  /* @__PURE__ */ jsxs("defs", { children: [
58
59
  /* @__PURE__ */ jsx("clipPath", { id: `not-gradient-clip-${uniqueId}`, children: /* @__PURE__ */ jsx(StyledRect, { x: "0%", y: "0%", width: "52%", height: "100%" }) }),
package/dist/esm/v2/DSCircularIndeterminateIndicator.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/v2/DSCircularIndeterminateIndicator.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable @typescript-eslint/naming-convention */\nimport React, { useMemo, useCallback } from 'react';\nimport { omit } from 'lodash';\nimport { DSTooltipV3 } from '@elliemae/ds-tooltip';\n\nimport {\n describe,\n useGetGlobalAttributes,\n useMemoMergePropsWithDefault,\n useGetXstyledProps,\n} from '@elliemae/ds-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 >\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"],
5
- "mappings": "AAAA,YAAY,WAAW;ACuB0B,wBA8CrC,YA9CqC;AAtBjD,SAAgB,SAAS,mBAAmB;AAC5C,SAAS,YAAY;AACrB,SAAS,mBAAmB;AAE5B;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,WAAW;AAEpB,SAAS,yCAAyC,oBAAoB;AACtE;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,cAAc,iBAAiB,YAAY,YAAY,WAAW,mBAAmB;AAE9F,MAAM,YAAgC,CAAC,UAAU,gCAAG,gBAAM,UAAS;AAE5D,MAAM,mCAAiG,CAC5G,UACG;AACH,QAAM,mBAAmB;AAAA,IACvB;AAAA,IACA;AAAA,EACF;AACA,QAAM,mBAAmB,KAAK,uBAAuB,gBAAgB,GAAG,CAAC,UAAU,SAAS,QAAQ,QAAQ,MAAM,CAAC;AACnH,QAAM,oBAAoB,mBAAmB,gBAAgB;AAE7D,QAAM,EAAE,MAAM,OAAO,MAAM,UAAU,aAAa,gCAAgC,IAAI;AAEtF,QAAM,UAA8B,QAAQ,MAAO,cAAc,cAAc,WAAY,CAAC,WAAW,CAAC;AAExG,QAAM,WAAW,QAAQ,MAAM,IAAI,EAAE,GAAG,CAAC,CAAC;AAE1C,QAAM,eAAe,QAAQ,OAAO,SAAS,IAAI,IAAI,OAAO,SAAS,aAAa,IAAI,GAAG,EAAE,KAAK,GAAG,CAAC,IAAI,CAAC;AAEzG,QAAM,gBAAgB,YAAY,MAAM,kBAAkB,CAAC,gBAAgB,CAAC;AAC5E,QAAM,yBAAyB,YAAY,OAAO,CAAC,IAAI,CAAC,CAAC;AAEzD,SACE;AAAA,IAAC;AAAA;AAAA,MACC,QAAO;AAAA,MACP,gBAAe;AAAA,MACf,MAAK;AAAA,MACL,cAAY,QAAQ;AAAA,MACpB,eAAY;AAAA,MACX,GAAG;AAAA,MACH,GAAG;AAAA,MACJ;AAAA,MACA;AAAA,MAEA,+BAAC,WAAQ,MAAY,WAAU,UAAS,0BAA0B,iCAChE;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,OAAO,SAAS,IAAI;AAAA,YACpB,QAAQ,SAAS,IAAI;AAAA,YACrB;AAAA,YACA;AAAA,YAEA;AAAA,mCAAC,UACC;AAAA,oCAAC,cAAS,IAAI,qBAAqB,YACjC,8BAAC,cAAW,GAAE,MAAK,GAAE,MAAK,OAAM,OAAM,QAAO,QAAO,GACtD;AAAA,gBACA,qBAAC,oBAAe,IAAI,kBAAkB,YAAY,IAAG,MAAK,IAAG,MAAK,IAAG,MAAK,IAAG,QAC3E;AAAA,sCAAC,UAAK,QAAO,OAAM,WAAW,GAAG,WAAW,KAAK,OAAO;AAAA,kBACxD,oBAAC,UAAK,QAAO,OAAM,WAAW,GAAG,WAAW,KAAK,OAAO;AAAA,mBAC1D;AAAA,iBACF;AAAA,cACA;AAAA,gBAAC;AAAA;AAAA,kBACC,IAAG;AAAA,kBACH,IAAG;AAAA,kBACH,GAAG;AAAA,kBACH,aAAa,aAAa,IAAI;AAAA,kBAC9B,QAAQ,WAAW,KAAK;AAAA,kBACxB,eAAc;AAAA,kBACd,UAAU,0BAA0B;AAAA;AAAA,cACtC;AAAA,cAWA;AAAA,gBAAC;AAAA;AAAA,kBACC,GAAG,KAAK,SAAS,IAAI,IAAI,KAAK,SAAS,IAAI,IAAI;AAAA,oBACvC;AAAA,oBACA,iBAAiB,wBAAwB,iBAAiB;AAAA,kBAClE,aAAa,aAAa,IAAI;AAAA,kBAC9B,MAAK;AAAA,kBACL,QAAQ,uBAAuB;AAAA,kBAC/B,eAAc;AAAA,kBACd,GAAG;AAAA;AAAA,cACL;AAAA;AAAA;AAAA,QACF;AAAA,QACC,SAAS,MAAM,YACd;AAAA,UAAC;AAAA;AAAA,YACC,OAAO,EAAE,OAAO,UAAU,UAAU,YAAY,WAAW,UAAU,eAAe,IAAI,EAAE;AAAA,YAC1F;AAAA,YACA;AAAA,YAEC;AAAA;AAAA,QACH;AAAA,SAEJ;AAAA;AAAA,EACF;AAEJ;AAEA,iCAAiC,YAAY;AAC7C,iCAAiC,cAAc;AACxC,MAAM,6CAA6C,SAAS,gCAAgC;AACnG,2CAA2C,YAAY;",
3
+ "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/v2/DSCircularIndeterminateIndicator.tsx"],
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable @typescript-eslint/naming-convention */\nimport React, { useMemo, useCallback } from 'react';\nimport { omit } from 'lodash';\nimport { DSTooltipV3 } from '@elliemae/ds-tooltip';\n\nimport {\n describe,\n useGetGlobalAttributes,\n useMemoMergePropsWithDefault,\n useGetXstyledProps,\n} from '@elliemae/ds-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"],
5
+ "mappings": "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",
6
6
  "names": []
7
7
  }
package/dist/esm/v2/constants.js.map CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/v2/constants.tsx"],
3
+ "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/v2/constants.tsx"],
4
4
  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { slotObjectToDataTestIds } from '@elliemae/ds-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"],
5
5
  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,+BAA+B;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,8CAA8C;AAAA,EACzD;AAAA,EACA;AACF;",
6
6
  "names": []
package/dist/esm/v2/index.js.map CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/v2/index.tsx"],
3
+ "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/v2/index.tsx"],
4
4
  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export {\n DSCircularIndeterminateIndicator,\n DSCircularIndeterminateIndicatorWithSchema,\n} from './DSCircularIndeterminateIndicator.js';\nexport * from './constants.js';\n"],
5
5
  "mappings": "AAAA,YAAY,WAAW;ACAvB;AAAA,EACE;AAAA,EACA;AAAA,OACK;AACP,cAAc;",
6
6
  "names": []
package/dist/esm/v2/react-desc-prop-types.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/v2/react-desc-prop-types.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable @typescript-eslint/no-empty-interface */\n/* eslint-disable max-lines */\nimport type {} from '@elliemae/ds-utilities';\nimport type { GlobalAttributesT, XstyledProps } from '@elliemae/ds-props-helpers';\nimport { PropTypes, globalAttributesPropTypes } from '@elliemae/ds-props-helpers';\nimport { type DSTooltipV3T } from '@elliemae/ds-tooltip';\nimport type { WeakValidationMap } from 'react';\n\nexport const defaultProps: DSCircularIndeterminateIndicatorT.DefaultProps = {\n size: 'm',\n color: 'dark',\n text: '',\n showText: true,\n withTooltip: false,\n tooltipStartPlacementPreference: 'bottom',\n};\n\nexport declare namespace DSCircularIndeterminateIndicatorT {\n type TShirtSizes = 'xs' | 's' | 'm' | 'l' | 'xl' | 'xxl';\n type SupportedColors = 'light' | 'dark';\n export interface DefaultProps {\n size: TShirtSizes;\n color: SupportedColors;\n text: string;\n showText: boolean;\n withTooltip: boolean;\n tooltipStartPlacementPreference: DSTooltipV3T.Placement;\n }\n export interface OptionalProps {}\n export interface RequiredProps {}\n\n export interface Props\n extends Partial<DefaultProps>,\n OptionalProps,\n Omit<GlobalAttributesT<HTMLButtonElement>, keyof DefaultProps | keyof OptionalProps | keyof RequiredProps>,\n XstyledProps,\n RequiredProps {}\n\n export interface InternalProps\n extends DefaultProps,\n OptionalProps,\n Omit<GlobalAttributesT<HTMLButtonElement>, keyof DefaultProps | keyof OptionalProps | keyof RequiredProps>,\n XstyledProps,\n RequiredProps {}\n}\n\nexport const CircularIndeterminateIndicatorPropTypes = {\n ...globalAttributesPropTypes,\n size: PropTypes.oneOf(['xs', 's', 'm', 'l', 'xl', 'xxl']).description('Size of the indicator').defaultValue('m'),\n color: PropTypes.oneOf(['light', 'dark']).description('Color mode for the indicator').defaultValue('dark'),\n text: PropTypes.string.description('Optional text to show under the indicator').defaultValue(''),\n showText: PropTypes.bool.description('Whether to show the optional text or not').defaultValue(true),\n withTooltip: PropTypes.bool\n .description('Whether to include a tooltip that shows the optional text on hover')\n .defaultValue(false),\n tooltipStartPlacementPreference: PropTypes.oneOf([\n 'top-start',\n 'top',\n 'top-end',\n 'right-start',\n 'right',\n 'right-end',\n 'bottom-end',\n 'bottom',\n 'bottom-start',\n 'left-end',\n 'left',\n 'left-start',\n ])\n .description('start placement preference for the tooltip')\n .defaultValue('center'),\n} as WeakValidationMap<unknown>;\n"],
3
+ "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/v2/react-desc-prop-types.tsx"],
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable @typescript-eslint/no-empty-interface */\n/* eslint-disable max-lines */\nimport type {} from '@elliemae/ds-utilities';\nimport type { GlobalAttributesT, XstyledProps } from '@elliemae/ds-props-helpers';\nimport { PropTypes, globalAttributesPropTypes } from '@elliemae/ds-props-helpers';\nimport { type DSTooltipV3T } from '@elliemae/ds-tooltip';\nimport type { WeakValidationMap } from 'react';\n\nexport const defaultProps: DSCircularIndeterminateIndicatorT.DefaultProps = {\n size: 'm',\n color: 'dark',\n text: '',\n showText: true,\n withTooltip: false,\n tooltipStartPlacementPreference: 'bottom',\n};\n\nexport declare namespace DSCircularIndeterminateIndicatorT {\n type TShirtSizes = 'xs' | 's' | 'm' | 'l' | 'xl' | 'xxl';\n type SupportedColors = 'light' | 'dark';\n export interface DefaultProps {\n size: TShirtSizes;\n color: SupportedColors;\n text: string;\n showText: boolean;\n withTooltip: boolean;\n tooltipStartPlacementPreference: DSTooltipV3T.Placement;\n }\n export interface OptionalProps {}\n export interface RequiredProps {}\n\n export interface Props\n extends Partial<DefaultProps>,\n OptionalProps,\n Omit<GlobalAttributesT<HTMLButtonElement>, keyof DefaultProps | keyof OptionalProps>,\n XstyledProps,\n RequiredProps {}\n\n export interface InternalProps\n extends DefaultProps,\n OptionalProps,\n Omit<GlobalAttributesT<HTMLButtonElement>, keyof DefaultProps | keyof OptionalProps>,\n XstyledProps,\n RequiredProps {}\n}\n\nexport const CircularIndeterminateIndicatorPropTypes = {\n ...globalAttributesPropTypes,\n size: PropTypes.oneOf(['xs', 's', 'm', 'l', 'xl', 'xxl']).description('Size of the indicator').defaultValue('m'),\n color: PropTypes.oneOf(['light', 'dark']).description('Color mode for the indicator').defaultValue('dark'),\n text: PropTypes.string.description('Optional text to show under the indicator').defaultValue(''),\n showText: PropTypes.bool.description('Whether to show the optional text or not').defaultValue(true),\n withTooltip: PropTypes.bool\n .description('Whether to include a tooltip that shows the optional text on hover')\n .defaultValue(false),\n tooltipStartPlacementPreference: PropTypes.oneOf([\n 'top-start',\n 'top',\n 'top-end',\n 'right-start',\n 'right',\n 'right-end',\n 'bottom-end',\n 'bottom',\n 'bottom-start',\n 'left-end',\n 'left',\n 'left-start',\n ])\n .description('start placement preference for the tooltip')\n .defaultValue('center'),\n} as WeakValidationMap<unknown>;\n"],
5
5
  "mappings": "AAAA,YAAY,WAAW;ACIvB,SAAS,WAAW,iCAAiC;AAI9C,MAAM,eAA+D;AAAA,EAC1E,MAAM;AAAA,EACN,OAAO;AAAA,EACP,MAAM;AAAA,EACN,UAAU;AAAA,EACV,aAAa;AAAA,EACb,iCAAiC;AACnC;AA+BO,MAAM,0CAA0C;AAAA,EACrD,GAAG;AAAA,EACH,MAAM,UAAU,MAAM,CAAC,MAAM,KAAK,KAAK,KAAK,MAAM,KAAK,CAAC,EAAE,YAAY,uBAAuB,EAAE,aAAa,GAAG;AAAA,EAC/G,OAAO,UAAU,MAAM,CAAC,SAAS,MAAM,CAAC,EAAE,YAAY,8BAA8B,EAAE,aAAa,MAAM;AAAA,EACzG,MAAM,UAAU,OAAO,YAAY,2CAA2C,EAAE,aAAa,EAAE;AAAA,EAC/F,UAAU,UAAU,KAAK,YAAY,0CAA0C,EAAE,aAAa,IAAI;AAAA,EAClG,aAAa,UAAU,KACpB,YAAY,oEAAoE,EAChF,aAAa,KAAK;AAAA,EACrB,iCAAiC,UAAU,MAAM;AAAA,IAC/C;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC,EACE,YAAY,4CAA4C,EACxD,aAAa,QAAQ;AAC1B;",
6
6
  "names": []
7
7
  }
package/dist/esm/v2/styled.js CHANGED
@@ -104,7 +104,9 @@ const StyledSvg = styled("svg", {
104
104
  `;
105
105
  const StyledPath = styled.path`
106
106
  transform-origin: center center;
107
- animation: ${rotateAnimation} 10s linear infinite, ${(props) => strokeTailAnimation(props.r)} 2.5s linear infinite;
107
+ animation:
108
+ ${rotateAnimation} 10s linear infinite,
109
+ ${(props) => strokeTailAnimation(props.r)} 2.5s linear infinite;
108
110
  `;
109
111
  const StyledRect = styled.rect`
110
112
  transform-origin: center center;
package/dist/esm/v2/styled.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/v2/styled.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable no-underscore-dangle */\nimport { Grid } from '@elliemae/ds-grid';\nimport { kfrm, styled } from '@elliemae/ds-system';\nimport { DSCircularIndeterminateIndicatorName, DSCircularIndeterminateIndicatorSlots } from './constants.js';\nconst { PI } = Math;\n\nconst getArcLength = (percentage: number, radius: number) => ((2 * PI * radius) / 100) * percentage;\n\nconst svgRotateAnimation = kfrm`\n 0% {\n transform: rotate(0);\n }\n 100% {\n transform: rotate(360deg);\n }\n`;\n\nconst strokeTailAnimation = (r: number) => {\n const miniDash = `${getArcLength(0, r)} ${getArcLength(100, r)}`;\n const fullDash = `${getArcLength(75, r)} ${getArcLength(25, r)}`;\n\n return kfrm`\n 0% {\n stroke-dasharray: ${miniDash};\n }\n 50% {\n stroke-dasharray: ${fullDash};\n }\n 100% {\n stroke-dasharray: ${miniDash};\n }\n`;\n};\n\nconst rotateAnimation = kfrm`\n 0%, 12.5% {\n transform: rotate(0);\n }\n 25%, 37.5% {\n transform: rotate(270deg);\n }\n 50%, 62.5% {\n transform: rotate(540deg);\n }\n 75%, 87.5% {\n transform: rotate(810deg);\n }\n 100% {\n transform: rotate(1080deg);\n }\n`;\n\nconst dashAnimation = (r: number) => {\n const miniDash = `${getArcLength(0, r)} ${getArcLength(100, r)}`;\n const fullDash = `${getArcLength(75, r)} ${getArcLength(25, r)}`;\n\n return kfrm`\n 0% {\n stroke-dasharray: ${miniDash};\n stroke-dashoffset: 0;\n }\n 12.5% {\n stroke-dasharray: ${fullDash};\n stroke-dashoffset: 0;\n }\n 25% {\n stroke-dasharray: ${miniDash};\n stroke-dashoffset: ${getArcLength(-75, r)};\n }\n 37.5% {\n stroke-dasharray: ${fullDash};\n stroke-dashoffset: ${getArcLength(-75, r)};\n }\n 50% {\n stroke-dasharray: ${miniDash};\n stroke-dashoffset: ${getArcLength(-150, r)};\n }\n 62.5% {\n stroke-dasharray: ${fullDash};\n stroke-dashoffset: ${getArcLength(-150, r)};\n }\n 75% {\n stroke-dasharray: ${miniDash};\n stroke-dashoffset: ${getArcLength(-225, r)};\n }\n 87.5% {\n stroke-dasharray: ${fullDash};\n stroke-dashoffset: ${getArcLength(-225, r)};\n }\n 100% {\n stroke-dasharray: ${miniDash};\n stroke-dashoffset: ${getArcLength(-300, r)};\n }\n`;\n};\n\nexport const StyledContainer = styled(Grid, {\n name: DSCircularIndeterminateIndicatorName,\n slot: DSCircularIndeterminateIndicatorSlots.ROOT,\n})`\n z-index: ${({ theme }) => theme.zIndex.loader};\n`;\n\nexport const StyledSvg = styled('svg', {\n name: DSCircularIndeterminateIndicatorName,\n slot: DSCircularIndeterminateIndicatorSlots.SVG,\n})`\n display: block;\n margin: auto;\n transform-origin: center center;\n transform: rotate(-90deg);\n animation: ${svgRotateAnimation} 2.5s linear infinite;\n`;\n\nexport const StyledPath = styled.path<{ r: number }>`\n transform-origin: center center;\n animation: ${rotateAnimation} 10s linear infinite, ${(props) => strokeTailAnimation(props.r)} 2.5s linear infinite;\n`;\n\nexport const StyledRect = styled.rect`\n transform-origin: center center;\n animation: ${rotateAnimation} 10s linear infinite;\n`;\n\nexport const StyledCircle = styled.circle<{ r: number }>`\n stroke-dashoffset: 0;\n fill: none;\n animation: ${(props) => dashAnimation(props.r)} 10s linear infinite;\n clip-path: ${(props) => props.clipPath};\n -webkit-clip-path: ${(props) => props.clipPath};\n`;\n\nexport const StyledLabel = styled('span', {\n name: DSCircularIndeterminateIndicatorName,\n slot: DSCircularIndeterminateIndicatorSlots.LABEL,\n})``;\n"],
5
- "mappings": "AAAA,YAAY,WAAW;ACCvB,SAAS,YAAY;AACrB,SAAS,MAAM,cAAc;AAC7B,SAAS,sCAAsC,6CAA6C;AAC5F,MAAM,EAAE,GAAG,IAAI;AAEf,MAAM,eAAe,CAAC,YAAoB,WAAqB,IAAI,KAAK,SAAU,MAAO;AAEzF,MAAM,qBAAqB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAS3B,MAAM,sBAAsB,CAAC,MAAc;AACzC,QAAM,WAAW,GAAG,aAAa,GAAG,CAAC,KAAK,aAAa,KAAK,CAAC;AAC7D,QAAM,WAAW,GAAG,aAAa,IAAI,CAAC,KAAK,aAAa,IAAI,CAAC;AAE7D,SAAO;AAAA;AAAA,4BAEmB;AAAA;AAAA;AAAA,4BAGA;AAAA;AAAA;AAAA,4BAGA;AAAA;AAAA;AAG5B;AAEA,MAAM,kBAAkB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAkBxB,MAAM,gBAAgB,CAAC,MAAc;AACnC,QAAM,WAAW,GAAG,aAAa,GAAG,CAAC,KAAK,aAAa,KAAK,CAAC;AAC7D,QAAM,WAAW,GAAG,aAAa,IAAI,CAAC,KAAK,aAAa,IAAI,CAAC;AAE7D,SAAO;AAAA;AAAA,4BAEmB;AAAA;AAAA;AAAA;AAAA,4BAIA;AAAA;AAAA;AAAA;AAAA,4BAIA;AAAA,6BACC,aAAa,KAAK,CAAC;AAAA;AAAA;AAAA,4BAGpB;AAAA,6BACC,aAAa,KAAK,CAAC;AAAA;AAAA;AAAA,4BAGpB;AAAA,6BACC,aAAa,MAAM,CAAC;AAAA;AAAA;AAAA,4BAGrB;AAAA,6BACC,aAAa,MAAM,CAAC;AAAA;AAAA;AAAA,4BAGrB;AAAA,6BACC,aAAa,MAAM,CAAC;AAAA;AAAA;AAAA,4BAGrB;AAAA,6BACC,aAAa,MAAM,CAAC;AAAA;AAAA;AAAA,4BAGrB;AAAA,6BACC,aAAa,MAAM,CAAC;AAAA;AAAA;AAGjD;AAEO,MAAM,kBAAkB,OAAO,MAAM;AAAA,EAC1C,MAAM;AAAA,EACN,MAAM,sCAAsC;AAC9C,CAAC;AAAA,aACY,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO;AAAA;AAGlC,MAAM,YAAY,OAAO,OAAO;AAAA,EACrC,MAAM;AAAA,EACN,MAAM,sCAAsC;AAC9C,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA,eAKc;AAAA;AAGR,MAAM,aAAa,OAAO;AAAA;AAAA,eAElB,wCAAwC,CAAC,UAAU,oBAAoB,MAAM,CAAC;AAAA;AAGtF,MAAM,aAAa,OAAO;AAAA;AAAA,eAElB;AAAA;AAGR,MAAM,eAAe,OAAO;AAAA;AAAA;AAAA,eAGpB,CAAC,UAAU,cAAc,MAAM,CAAC;AAAA,eAChC,CAAC,UAAU,MAAM;AAAA,uBACT,CAAC,UAAU,MAAM;AAAA;AAGjC,MAAM,cAAc,OAAO,QAAQ;AAAA,EACxC,MAAM;AAAA,EACN,MAAM,sCAAsC;AAC9C,CAAC;",
3
+ "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/v2/styled.tsx"],
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable no-underscore-dangle */\nimport { Grid } from '@elliemae/ds-grid';\nimport { kfrm, styled } from '@elliemae/ds-system';\nimport { DSCircularIndeterminateIndicatorName, DSCircularIndeterminateIndicatorSlots } from './constants.js';\nconst { PI } = Math;\n\nconst getArcLength = (percentage: number, radius: number) => ((2 * PI * radius) / 100) * percentage;\n\nconst svgRotateAnimation = kfrm`\n 0% {\n transform: rotate(0);\n }\n 100% {\n transform: rotate(360deg);\n }\n`;\n\nconst strokeTailAnimation = (r: number) => {\n const miniDash = `${getArcLength(0, r)} ${getArcLength(100, r)}`;\n const fullDash = `${getArcLength(75, r)} ${getArcLength(25, r)}`;\n\n return kfrm`\n 0% {\n stroke-dasharray: ${miniDash};\n }\n 50% {\n stroke-dasharray: ${fullDash};\n }\n 100% {\n stroke-dasharray: ${miniDash};\n }\n`;\n};\n\nconst rotateAnimation = kfrm`\n 0%, 12.5% {\n transform: rotate(0);\n }\n 25%, 37.5% {\n transform: rotate(270deg);\n }\n 50%, 62.5% {\n transform: rotate(540deg);\n }\n 75%, 87.5% {\n transform: rotate(810deg);\n }\n 100% {\n transform: rotate(1080deg);\n }\n`;\n\nconst dashAnimation = (r: number) => {\n const miniDash = `${getArcLength(0, r)} ${getArcLength(100, r)}`;\n const fullDash = `${getArcLength(75, r)} ${getArcLength(25, r)}`;\n\n return kfrm`\n 0% {\n stroke-dasharray: ${miniDash};\n stroke-dashoffset: 0;\n }\n 12.5% {\n stroke-dasharray: ${fullDash};\n stroke-dashoffset: 0;\n }\n 25% {\n stroke-dasharray: ${miniDash};\n stroke-dashoffset: ${getArcLength(-75, r)};\n }\n 37.5% {\n stroke-dasharray: ${fullDash};\n stroke-dashoffset: ${getArcLength(-75, r)};\n }\n 50% {\n stroke-dasharray: ${miniDash};\n stroke-dashoffset: ${getArcLength(-150, r)};\n }\n 62.5% {\n stroke-dasharray: ${fullDash};\n stroke-dashoffset: ${getArcLength(-150, r)};\n }\n 75% {\n stroke-dasharray: ${miniDash};\n stroke-dashoffset: ${getArcLength(-225, r)};\n }\n 87.5% {\n stroke-dasharray: ${fullDash};\n stroke-dashoffset: ${getArcLength(-225, r)};\n }\n 100% {\n stroke-dasharray: ${miniDash};\n stroke-dashoffset: ${getArcLength(-300, r)};\n }\n`;\n};\n\nexport const StyledContainer = styled(Grid, {\n name: DSCircularIndeterminateIndicatorName,\n slot: DSCircularIndeterminateIndicatorSlots.ROOT,\n})`\n z-index: ${({ theme }) => theme.zIndex.loader};\n`;\n\nexport const StyledSvg = styled('svg', {\n name: DSCircularIndeterminateIndicatorName,\n slot: DSCircularIndeterminateIndicatorSlots.SVG,\n})`\n display: block;\n margin: auto;\n transform-origin: center center;\n transform: rotate(-90deg);\n animation: ${svgRotateAnimation} 2.5s linear infinite;\n`;\n\nexport const StyledPath = styled.path<{ r: number }>`\n transform-origin: center center;\n animation:\n ${rotateAnimation} 10s linear infinite,\n ${(props) => strokeTailAnimation(props.r)} 2.5s linear infinite;\n`;\n\nexport const StyledRect = styled.rect`\n transform-origin: center center;\n animation: ${rotateAnimation} 10s linear infinite;\n`;\n\nexport const StyledCircle = styled.circle<{ r: number }>`\n stroke-dashoffset: 0;\n fill: none;\n animation: ${(props) => dashAnimation(props.r)} 10s linear infinite;\n clip-path: ${(props) => props.clipPath};\n -webkit-clip-path: ${(props) => props.clipPath};\n`;\n\nexport const StyledLabel = styled('span', {\n name: DSCircularIndeterminateIndicatorName,\n slot: DSCircularIndeterminateIndicatorSlots.LABEL,\n})``;\n"],
5
+ "mappings": "AAAA,YAAY,WAAW;ACCvB,SAAS,YAAY;AACrB,SAAS,MAAM,cAAc;AAC7B,SAAS,sCAAsC,6CAA6C;AAC5F,MAAM,EAAE,GAAG,IAAI;AAEf,MAAM,eAAe,CAAC,YAAoB,WAAqB,IAAI,KAAK,SAAU,MAAO;AAEzF,MAAM,qBAAqB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAS3B,MAAM,sBAAsB,CAAC,MAAc;AACzC,QAAM,WAAW,GAAG,aAAa,GAAG,CAAC,KAAK,aAAa,KAAK,CAAC;AAC7D,QAAM,WAAW,GAAG,aAAa,IAAI,CAAC,KAAK,aAAa,IAAI,CAAC;AAE7D,SAAO;AAAA;AAAA,4BAEmB;AAAA;AAAA;AAAA,4BAGA;AAAA;AAAA;AAAA,4BAGA;AAAA;AAAA;AAG5B;AAEA,MAAM,kBAAkB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAkBxB,MAAM,gBAAgB,CAAC,MAAc;AACnC,QAAM,WAAW,GAAG,aAAa,GAAG,CAAC,KAAK,aAAa,KAAK,CAAC;AAC7D,QAAM,WAAW,GAAG,aAAa,IAAI,CAAC,KAAK,aAAa,IAAI,CAAC;AAE7D,SAAO;AAAA;AAAA,4BAEmB;AAAA;AAAA;AAAA;AAAA,4BAIA;AAAA;AAAA;AAAA;AAAA,4BAIA;AAAA,6BACC,aAAa,KAAK,CAAC;AAAA;AAAA;AAAA,4BAGpB;AAAA,6BACC,aAAa,KAAK,CAAC;AAAA;AAAA;AAAA,4BAGpB;AAAA,6BACC,aAAa,MAAM,CAAC;AAAA;AAAA;AAAA,4BAGrB;AAAA,6BACC,aAAa,MAAM,CAAC;AAAA;AAAA;AAAA,4BAGrB;AAAA,6BACC,aAAa,MAAM,CAAC;AAAA;AAAA;AAAA,4BAGrB;AAAA,6BACC,aAAa,MAAM,CAAC;AAAA;AAAA;AAAA,4BAGrB;AAAA,6BACC,aAAa,MAAM,CAAC;AAAA;AAAA;AAGjD;AAEO,MAAM,kBAAkB,OAAO,MAAM;AAAA,EAC1C,MAAM;AAAA,EACN,MAAM,sCAAsC;AAC9C,CAAC;AAAA,aACY,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO;AAAA;AAGlC,MAAM,YAAY,OAAO,OAAO;AAAA,EACrC,MAAM;AAAA,EACN,MAAM,sCAAsC;AAC9C,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA,eAKc;AAAA;AAGR,MAAM,aAAa,OAAO;AAAA;AAAA;AAAA,MAG3B;AAAA,MACA,CAAC,UAAU,oBAAoB,MAAM,CAAC;AAAA;AAGrC,MAAM,aAAa,OAAO;AAAA;AAAA,eAElB;AAAA;AAGR,MAAM,eAAe,OAAO;AAAA;AAAA;AAAA,eAGpB,CAAC,UAAU,cAAc,MAAM,CAAC;AAAA,eAChC,CAAC,UAAU,MAAM;AAAA,uBACT,CAAC,UAAU,MAAM;AAAA;AAGjC,MAAM,cAAc,OAAO,QAAQ;AAAA,EACxC,MAAM;AAAA,EACN,MAAM,sCAAsC;AAC9C,CAAC;",
6
6
  "names": []
7
7
  }
package/dist/types/v2/react-desc-prop-types.d.ts CHANGED
@@ -17,9 +17,9 @@ export declare namespace DSCircularIndeterminateIndicatorT {
17
17
  }
18
18
  interface RequiredProps {
19
19
  }
20
- interface Props extends Partial<DefaultProps>, OptionalProps, Omit<GlobalAttributesT<HTMLButtonElement>, keyof DefaultProps | keyof OptionalProps | keyof RequiredProps>, XstyledProps, RequiredProps {
20
+ interface Props extends Partial<DefaultProps>, OptionalProps, Omit<GlobalAttributesT<HTMLButtonElement>, keyof DefaultProps | keyof OptionalProps>, XstyledProps, RequiredProps {
21
21
  }
22
- interface InternalProps extends DefaultProps, OptionalProps, Omit<GlobalAttributesT<HTMLButtonElement>, keyof DefaultProps | keyof OptionalProps | keyof RequiredProps>, XstyledProps, RequiredProps {
22
+ interface InternalProps extends DefaultProps, OptionalProps, Omit<GlobalAttributesT<HTMLButtonElement>, keyof DefaultProps | keyof OptionalProps>, XstyledProps, RequiredProps {
23
23
  }
24
24
  }
25
25
  export declare const CircularIndeterminateIndicatorPropTypes: WeakValidationMap<unknown>;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@elliemae/ds-circular-progress-indicator",
3
- "version": "3.22.0-next.3",
3
+ "version": "3.22.0-next.31",
4
4
  "license": "MIT",
5
5
  "description": "ICE MT - Dimsum - Circular progress indicator",
6
6
  "files": [
@@ -53,20 +53,20 @@
53
53
  "dependencies": {
54
54
  "styled-components": "~5.3.9",
55
55
  "uid": "~2.0.1",
56
- "@elliemae/ds-classnames": "3.22.0-next.3",
57
- "@elliemae/ds-grid": "3.22.0-next.3",
58
- "@elliemae/ds-props-helpers": "3.22.0-next.3",
59
- "@elliemae/ds-system": "3.22.0-next.3",
60
- "@elliemae/ds-tooltip": "3.22.0-next.3",
61
- "@elliemae/ds-utilities": "3.22.0-next.3"
56
+ "@elliemae/ds-classnames": "3.22.0-next.31",
57
+ "@elliemae/ds-grid": "3.22.0-next.31",
58
+ "@elliemae/ds-system": "3.22.0-next.31",
59
+ "@elliemae/ds-props-helpers": "3.22.0-next.31",
60
+ "@elliemae/ds-utilities": "3.22.0-next.31",
61
+ "@elliemae/ds-tooltip": "3.22.0-next.31"
62
62
  },
63
63
  "devDependencies": {
64
- "@elliemae/pui-cli": "~9.0.0-next.17",
64
+ "@elliemae/pui-cli": "~9.0.0-next.22",
65
65
  "@testing-library/jest-dom": "~5.16.5",
66
66
  "@testing-library/react": "~12.1.3",
67
67
  "@testing-library/user-event": "~13.5.0",
68
68
  "jest-axe": "^7.0.1",
69
- "@elliemae/ds-monorepo-devops": "3.22.0-next.3"
69
+ "@elliemae/ds-monorepo-devops": "3.22.0-next.31"
70
70
  },
71
71
  "peerDependencies": {
72
72
  "lodash": "^4.17.21",
@@ -78,14 +78,14 @@
78
78
  "typeSafety": false
79
79
  },
80
80
  "scripts": {
81
- "dev": "cross-env NODE_ENV=development node ../../scripts/build/build.mjs --watch",
81
+ "dev": "cross-env NODE_ENV=development node ../../../scripts/build/build.mjs --watch",
82
82
  "test": "pui-cli test --passWithNoTests",
83
- "lint": "node ../../scripts/lint.mjs",
84
- "eslint:fix": "eslint --ext='.js,.jsx,.test.js,.ts,.tsx' --fix --config='../../.eslintrc.js' src/",
85
- "dts": "node ../../scripts/dts.mjs",
86
- "build": "cross-env NODE_ENV=production node ../../scripts/build/build.mjs",
83
+ "lint": "node ../../../scripts/lint.mjs",
84
+ "eslint:fix": "eslint --ext='.js,.jsx,.test.js,.ts,.tsx' --fix --config='../../../.eslintrc.js' src/",
85
+ "dts": "node ../../../scripts/dts.mjs",
86
+ "build": "cross-env NODE_ENV=production node ../../../scripts/build/build.mjs",
87
87
  "dev:build": "pnpm --filter {.}... build",
88
88
  "dev:install": "pnpm --filter {.}... i --no-lockfile && pnpm run dev:build",
89
- "checkDeps": "npm exec ../ds-codemods -- check-missing-packages --projectFolderPath=\"./\" --ignorePackagesGlobPattern=\"\" --ignoreFilesGlobPattern=\"**/test-ables/*,**/tests/*\""
89
+ "checkDeps": "npm exec ../../util/ds-codemods -- check-missing-packages --projectFolderPath=\"./\" --ignorePackagesGlobPattern=\"\" --ignoreFilesGlobPattern=\"**/test-ables/*,**/tests/*\""
90
90
  }
91
91
  }