@activecollab/components 2.0.109 → 2.0.110
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/components/ProgressRing/ProgressRing.js +2 -1
- package/dist/cjs/components/ProgressRing/ProgressRing.js.map +1 -1
- package/dist/esm/components/ProgressRing/ProgressRing.js +1 -1
- package/dist/esm/components/ProgressRing/ProgressRing.js.map +1 -1
- package/dist/index.js +2 -1
- package/dist/index.js.map +1 -1
- package/dist/index.min.js +1 -1
- package/dist/index.min.js.map +1 -1
- package/package.json +1 -1
|
@@ -22,7 +22,8 @@ var ProgressCircle = exports.ProgressCircle = function ProgressCircle(_ref) {
|
|
|
22
22
|
radius = _ref$radius === void 0 ? 20 : _ref$radius,
|
|
23
23
|
_ref$stroke = _ref.stroke,
|
|
24
24
|
stroke = _ref$stroke === void 0 ? 3 : _ref$stroke,
|
|
25
|
-
roundStroke = _ref.roundStroke,
|
|
25
|
+
_ref$roundStroke = _ref.roundStroke,
|
|
26
|
+
roundStroke = _ref$roundStroke === void 0 ? false : _ref$roundStroke,
|
|
26
27
|
className = _ref.className,
|
|
27
28
|
_ref$showPercentage = _ref.showPercentage,
|
|
28
29
|
showPercentage = _ref$showPercentage === void 0 ? false : _ref$showPercentage,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ProgressRing.js","names":["_react","_interopRequireWildcard","require","_classnames","_interopRequireDefault","_Styles","_excluded","obj","__esModule","default","_getRequireWildcardCache","e","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","_objectWithoutProperties","source","excluded","target","_objectWithoutPropertiesLoose","key","getOwnPropertySymbols","sourceSymbolKeys","length","indexOf","propertyIsEnumerable","sourceKeys","keys","ProgressCircle","exports","_ref","backgroundColor","progressColor","_ref$progress","progress","_ref$radius","radius","_ref$stroke","stroke","roundStroke","className","_ref$showPercentage","showPercentage","fontSize","console","warn","progressNumber","useMemo","width","normalizedRadius","circumference","Math","PI","strokeDashoffsetOuter","strokeDashoffsetInner","createElement","StyledSvg","height","StyledBackgroundCircle","$color","$strokeDashOffset","strokeWidth","strokeDasharray","concat","cx","cy","StyledForegroundCircle","$roundStroke","StyledProgressRingPercentage","$fontSize","x","y","dominantBaseline","textAnchor","ProgressRing","_ref2","children","rest","StyledWrapper","classNames","StyledChildrenWrapper","displayName"],"sources":["../../../../src/components/ProgressRing/ProgressRing.tsx"],"sourcesContent":["import React, { ReactNode, useMemo } from \"react\";\n\nimport classNames from \"classnames\";\n\nimport {\n StyledWrapper,\n StyledChildrenWrapper,\n StyledBackgroundCircle,\n StyledForegroundCircle,\n StyledSvg,\n StyledProgressRingPercentage,\n} from \"./Styles\";\n\nexport interface ProgressCircleProps {\n /** Progress prop can be number */\n progress?: number;\n /** Background color */\n backgroundColor?: string;\n /** Progress color */\n progressColor?: string;\n /** Radius size */\n radius?: number;\n /** Stroke size */\n stroke?: number;\n /** Should stroke line be rounded */\n roundStroke?: boolean;\n /** Applies passed classes */\n className?: string;\n /** Should the percentage be displayed inside ring or not */\n showPercentage?: boolean;\n /** Size of displayed percentage */\n fontSize?: number;\n}\n\nexport interface ProgressRingProps extends ProgressCircleProps {\n children?: ReactNode;\n}\n\nexport const ProgressCircle = ({\n backgroundColor,\n progressColor,\n progress = 0,\n radius = 20,\n stroke = 3,\n roundStroke,\n className,\n showPercentage = false,\n fontSize,\n}: ProgressCircleProps) => {\n if (stroke > radius) {\n console.warn(\"Stroke can not have value greater than the radius.\");\n stroke = radius;\n }\n const progressNumber = useMemo(() => {\n let width = progress;\n if (progress > 100) {\n width = 100;\n }\n if (progress < 0) {\n width = 0;\n }\n return width;\n }, [progress]);\n\n const normalizedRadius = useMemo(() => radius - stroke / 2, [radius, stroke]);\n const circumference = useMemo(\n () => normalizedRadius * 2 * Math.PI,\n [normalizedRadius]\n );\n const strokeDashoffsetOuter = useMemo(\n () => circumference - ((100 - progressNumber) / 100) * circumference,\n [circumference, progressNumber]\n );\n const strokeDashoffsetInner = useMemo(\n () => circumference - (progressNumber / 100) * circumference,\n [circumference, progressNumber]\n );\n return (\n <StyledSvg height={radius * 2} width={radius * 2} className={className}>\n <StyledBackgroundCircle\n $color={backgroundColor}\n $strokeDashOffset={-strokeDashoffsetOuter}\n strokeWidth={stroke}\n strokeDasharray={`${circumference} ${circumference}`}\n r={normalizedRadius}\n cx={radius}\n cy={radius}\n />\n <StyledForegroundCircle\n $color={progressColor}\n $strokeDashOffset={strokeDashoffsetInner}\n strokeWidth={stroke}\n strokeDasharray={`${circumference} ${circumference}`}\n $roundStroke={roundStroke}\n r={normalizedRadius}\n cx={radius}\n cy={radius}\n />\n {showPercentage ? (\n <StyledProgressRingPercentage\n $color={progressColor}\n $fontSize={fontSize}\n x=\"50%\"\n y=\"-50%\"\n dominantBaseline=\"central\"\n textAnchor=\"middle\"\n >\n {progressNumber}%\n </StyledProgressRingPercentage>\n ) : null}\n </StyledSvg>\n );\n};\n\nexport const ProgressRing = ({\n className,\n children,\n ...rest\n}: ProgressRingProps) => {\n return (\n <StyledWrapper\n className={classNames(className)}\n data-testid=\"progress-ring\"\n >\n <ProgressCircle {...rest} />\n {children ? (\n <StyledChildrenWrapper>{children}</StyledChildrenWrapper>\n ) : null}\n </StyledWrapper>\n );\n};\n\nProgressRing.displayName = \"ProgressRing\";\n"],"mappings":"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
|
|
1
|
+
{"version":3,"file":"ProgressRing.js","names":["_react","_interopRequireWildcard","require","_classnames","_interopRequireDefault","_Styles","_excluded","obj","__esModule","default","_getRequireWildcardCache","e","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","_objectWithoutProperties","source","excluded","target","_objectWithoutPropertiesLoose","key","getOwnPropertySymbols","sourceSymbolKeys","length","indexOf","propertyIsEnumerable","sourceKeys","keys","ProgressCircle","exports","_ref","backgroundColor","progressColor","_ref$progress","progress","_ref$radius","radius","_ref$stroke","stroke","_ref$roundStroke","roundStroke","className","_ref$showPercentage","showPercentage","fontSize","console","warn","progressNumber","useMemo","width","normalizedRadius","circumference","Math","PI","strokeDashoffsetOuter","strokeDashoffsetInner","createElement","StyledSvg","height","StyledBackgroundCircle","$color","$strokeDashOffset","strokeWidth","strokeDasharray","concat","cx","cy","StyledForegroundCircle","$roundStroke","StyledProgressRingPercentage","$fontSize","x","y","dominantBaseline","textAnchor","ProgressRing","_ref2","children","rest","StyledWrapper","classNames","StyledChildrenWrapper","displayName"],"sources":["../../../../src/components/ProgressRing/ProgressRing.tsx"],"sourcesContent":["import React, { ReactNode, useMemo } from \"react\";\n\nimport classNames from \"classnames\";\n\nimport {\n StyledWrapper,\n StyledChildrenWrapper,\n StyledBackgroundCircle,\n StyledForegroundCircle,\n StyledSvg,\n StyledProgressRingPercentage,\n} from \"./Styles\";\n\nexport interface ProgressCircleProps {\n /** Progress prop can be number */\n progress?: number;\n /** Background color */\n backgroundColor?: string;\n /** Progress color */\n progressColor?: string;\n /** Radius size */\n radius?: number;\n /** Stroke size */\n stroke?: number;\n /** Should stroke line be rounded */\n roundStroke?: boolean;\n /** Applies passed classes */\n className?: string;\n /** Should the percentage be displayed inside ring or not */\n showPercentage?: boolean;\n /** Size of displayed percentage */\n fontSize?: number;\n}\n\nexport interface ProgressRingProps extends ProgressCircleProps {\n children?: ReactNode;\n}\n\nexport const ProgressCircle = ({\n backgroundColor,\n progressColor,\n progress = 0,\n radius = 20,\n stroke = 3,\n roundStroke = false,\n className,\n showPercentage = false,\n fontSize,\n}: ProgressCircleProps) => {\n if (stroke > radius) {\n console.warn(\"Stroke can not have value greater than the radius.\");\n stroke = radius;\n }\n const progressNumber = useMemo(() => {\n let width = progress;\n if (progress > 100) {\n width = 100;\n }\n if (progress < 0) {\n width = 0;\n }\n return width;\n }, [progress]);\n\n const normalizedRadius = useMemo(() => radius - stroke / 2, [radius, stroke]);\n const circumference = useMemo(\n () => normalizedRadius * 2 * Math.PI,\n [normalizedRadius]\n );\n const strokeDashoffsetOuter = useMemo(\n () => circumference - ((100 - progressNumber) / 100) * circumference,\n [circumference, progressNumber]\n );\n const strokeDashoffsetInner = useMemo(\n () => circumference - (progressNumber / 100) * circumference,\n [circumference, progressNumber]\n );\n return (\n <StyledSvg height={radius * 2} width={radius * 2} className={className}>\n <StyledBackgroundCircle\n $color={backgroundColor}\n $strokeDashOffset={-strokeDashoffsetOuter}\n strokeWidth={stroke}\n strokeDasharray={`${circumference} ${circumference}`}\n r={normalizedRadius}\n cx={radius}\n cy={radius}\n />\n <StyledForegroundCircle\n $color={progressColor}\n $strokeDashOffset={strokeDashoffsetInner}\n strokeWidth={stroke}\n strokeDasharray={`${circumference} ${circumference}`}\n $roundStroke={roundStroke}\n r={normalizedRadius}\n cx={radius}\n cy={radius}\n />\n {showPercentage ? (\n <StyledProgressRingPercentage\n $color={progressColor}\n $fontSize={fontSize}\n x=\"50%\"\n y=\"-50%\"\n dominantBaseline=\"central\"\n textAnchor=\"middle\"\n >\n {progressNumber}%\n </StyledProgressRingPercentage>\n ) : null}\n </StyledSvg>\n );\n};\n\nexport const ProgressRing = ({\n className,\n children,\n ...rest\n}: ProgressRingProps) => {\n return (\n <StyledWrapper\n className={classNames(className)}\n data-testid=\"progress-ring\"\n >\n <ProgressCircle {...rest} />\n {children ? (\n <StyledChildrenWrapper>{children}</StyledChildrenWrapper>\n ) : null}\n </StyledWrapper>\n );\n};\n\nProgressRing.displayName = \"ProgressRing\";\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ProgressRing.js","names":["React","useMemo","classNames","StyledWrapper","StyledChildrenWrapper","StyledBackgroundCircle","StyledForegroundCircle","StyledSvg","StyledProgressRingPercentage","ProgressCircle","_ref","backgroundColor","progressColor","progress","radius","stroke","roundStroke","className","showPercentage","fontSize","console","warn","progressNumber","width","normalizedRadius","circumference","Math","PI","strokeDashoffsetOuter","strokeDashoffsetInner","createElement","height","$color","$strokeDashOffset","strokeWidth","strokeDasharray","r","cx","cy","$roundStroke","$fontSize","x","y","dominantBaseline","textAnchor","ProgressRing","_ref2","children","rest","displayName"],"sources":["../../../../src/components/ProgressRing/ProgressRing.tsx"],"sourcesContent":["import React, { ReactNode, useMemo } from \"react\";\n\nimport classNames from \"classnames\";\n\nimport {\n StyledWrapper,\n StyledChildrenWrapper,\n StyledBackgroundCircle,\n StyledForegroundCircle,\n StyledSvg,\n StyledProgressRingPercentage,\n} from \"./Styles\";\n\nexport interface ProgressCircleProps {\n /** Progress prop can be number */\n progress?: number;\n /** Background color */\n backgroundColor?: string;\n /** Progress color */\n progressColor?: string;\n /** Radius size */\n radius?: number;\n /** Stroke size */\n stroke?: number;\n /** Should stroke line be rounded */\n roundStroke?: boolean;\n /** Applies passed classes */\n className?: string;\n /** Should the percentage be displayed inside ring or not */\n showPercentage?: boolean;\n /** Size of displayed percentage */\n fontSize?: number;\n}\n\nexport interface ProgressRingProps extends ProgressCircleProps {\n children?: ReactNode;\n}\n\nexport const ProgressCircle = ({\n backgroundColor,\n progressColor,\n progress = 0,\n radius = 20,\n stroke = 3,\n roundStroke,\n className,\n showPercentage = false,\n fontSize,\n}: ProgressCircleProps) => {\n if (stroke > radius) {\n console.warn(\"Stroke can not have value greater than the radius.\");\n stroke = radius;\n }\n const progressNumber = useMemo(() => {\n let width = progress;\n if (progress > 100) {\n width = 100;\n }\n if (progress < 0) {\n width = 0;\n }\n return width;\n }, [progress]);\n\n const normalizedRadius = useMemo(() => radius - stroke / 2, [radius, stroke]);\n const circumference = useMemo(\n () => normalizedRadius * 2 * Math.PI,\n [normalizedRadius]\n );\n const strokeDashoffsetOuter = useMemo(\n () => circumference - ((100 - progressNumber) / 100) * circumference,\n [circumference, progressNumber]\n );\n const strokeDashoffsetInner = useMemo(\n () => circumference - (progressNumber / 100) * circumference,\n [circumference, progressNumber]\n );\n return (\n <StyledSvg height={radius * 2} width={radius * 2} className={className}>\n <StyledBackgroundCircle\n $color={backgroundColor}\n $strokeDashOffset={-strokeDashoffsetOuter}\n strokeWidth={stroke}\n strokeDasharray={`${circumference} ${circumference}`}\n r={normalizedRadius}\n cx={radius}\n cy={radius}\n />\n <StyledForegroundCircle\n $color={progressColor}\n $strokeDashOffset={strokeDashoffsetInner}\n strokeWidth={stroke}\n strokeDasharray={`${circumference} ${circumference}`}\n $roundStroke={roundStroke}\n r={normalizedRadius}\n cx={radius}\n cy={radius}\n />\n {showPercentage ? (\n <StyledProgressRingPercentage\n $color={progressColor}\n $fontSize={fontSize}\n x=\"50%\"\n y=\"-50%\"\n dominantBaseline=\"central\"\n textAnchor=\"middle\"\n >\n {progressNumber}%\n </StyledProgressRingPercentage>\n ) : null}\n </StyledSvg>\n );\n};\n\nexport const ProgressRing = ({\n className,\n children,\n ...rest\n}: ProgressRingProps) => {\n return (\n <StyledWrapper\n className={classNames(className)}\n data-testid=\"progress-ring\"\n >\n <ProgressCircle {...rest} />\n {children ? (\n <StyledChildrenWrapper>{children}</StyledChildrenWrapper>\n ) : null}\n </StyledWrapper>\n );\n};\n\nProgressRing.displayName = \"ProgressRing\";\n"],"mappings":"AAAA,OAAOA,KAAK,IAAeC,OAAO,QAAQ,OAAO;AAEjD,OAAOC,UAAU,MAAM,YAAY;AAEnC,SACEC,aAAa,EACbC,qBAAqB,EACrBC,sBAAsB,EACtBC,sBAAsB,EACtBC,SAAS,EACTC,4BAA4B,QACvB,UAAU;AA2BjB,OAAO,MAAMC,cAAc,GAAGC,IAAA,IAUH;EAAA,IAVI;IAC7BC,eAAe;IACfC,aAAa;IACbC,QAAQ,GAAG,CAAC;IACZC,MAAM,GAAG,EAAE;IACXC,MAAM,GAAG,CAAC;IACVC,WAAW;
|
|
1
|
+
{"version":3,"file":"ProgressRing.js","names":["React","useMemo","classNames","StyledWrapper","StyledChildrenWrapper","StyledBackgroundCircle","StyledForegroundCircle","StyledSvg","StyledProgressRingPercentage","ProgressCircle","_ref","backgroundColor","progressColor","progress","radius","stroke","roundStroke","className","showPercentage","fontSize","console","warn","progressNumber","width","normalizedRadius","circumference","Math","PI","strokeDashoffsetOuter","strokeDashoffsetInner","createElement","height","$color","$strokeDashOffset","strokeWidth","strokeDasharray","r","cx","cy","$roundStroke","$fontSize","x","y","dominantBaseline","textAnchor","ProgressRing","_ref2","children","rest","displayName"],"sources":["../../../../src/components/ProgressRing/ProgressRing.tsx"],"sourcesContent":["import React, { ReactNode, useMemo } from \"react\";\n\nimport classNames from \"classnames\";\n\nimport {\n StyledWrapper,\n StyledChildrenWrapper,\n StyledBackgroundCircle,\n StyledForegroundCircle,\n StyledSvg,\n StyledProgressRingPercentage,\n} from \"./Styles\";\n\nexport interface ProgressCircleProps {\n /** Progress prop can be number */\n progress?: number;\n /** Background color */\n backgroundColor?: string;\n /** Progress color */\n progressColor?: string;\n /** Radius size */\n radius?: number;\n /** Stroke size */\n stroke?: number;\n /** Should stroke line be rounded */\n roundStroke?: boolean;\n /** Applies passed classes */\n className?: string;\n /** Should the percentage be displayed inside ring or not */\n showPercentage?: boolean;\n /** Size of displayed percentage */\n fontSize?: number;\n}\n\nexport interface ProgressRingProps extends ProgressCircleProps {\n children?: ReactNode;\n}\n\nexport const ProgressCircle = ({\n backgroundColor,\n progressColor,\n progress = 0,\n radius = 20,\n stroke = 3,\n roundStroke = false,\n className,\n showPercentage = false,\n fontSize,\n}: ProgressCircleProps) => {\n if (stroke > radius) {\n console.warn(\"Stroke can not have value greater than the radius.\");\n stroke = radius;\n }\n const progressNumber = useMemo(() => {\n let width = progress;\n if (progress > 100) {\n width = 100;\n }\n if (progress < 0) {\n width = 0;\n }\n return width;\n }, [progress]);\n\n const normalizedRadius = useMemo(() => radius - stroke / 2, [radius, stroke]);\n const circumference = useMemo(\n () => normalizedRadius * 2 * Math.PI,\n [normalizedRadius]\n );\n const strokeDashoffsetOuter = useMemo(\n () => circumference - ((100 - progressNumber) / 100) * circumference,\n [circumference, progressNumber]\n );\n const strokeDashoffsetInner = useMemo(\n () => circumference - (progressNumber / 100) * circumference,\n [circumference, progressNumber]\n );\n return (\n <StyledSvg height={radius * 2} width={radius * 2} className={className}>\n <StyledBackgroundCircle\n $color={backgroundColor}\n $strokeDashOffset={-strokeDashoffsetOuter}\n strokeWidth={stroke}\n strokeDasharray={`${circumference} ${circumference}`}\n r={normalizedRadius}\n cx={radius}\n cy={radius}\n />\n <StyledForegroundCircle\n $color={progressColor}\n $strokeDashOffset={strokeDashoffsetInner}\n strokeWidth={stroke}\n strokeDasharray={`${circumference} ${circumference}`}\n $roundStroke={roundStroke}\n r={normalizedRadius}\n cx={radius}\n cy={radius}\n />\n {showPercentage ? (\n <StyledProgressRingPercentage\n $color={progressColor}\n $fontSize={fontSize}\n x=\"50%\"\n y=\"-50%\"\n dominantBaseline=\"central\"\n textAnchor=\"middle\"\n >\n {progressNumber}%\n </StyledProgressRingPercentage>\n ) : null}\n </StyledSvg>\n );\n};\n\nexport const ProgressRing = ({\n className,\n children,\n ...rest\n}: ProgressRingProps) => {\n return (\n <StyledWrapper\n className={classNames(className)}\n data-testid=\"progress-ring\"\n >\n <ProgressCircle {...rest} />\n {children ? (\n <StyledChildrenWrapper>{children}</StyledChildrenWrapper>\n ) : null}\n </StyledWrapper>\n );\n};\n\nProgressRing.displayName = \"ProgressRing\";\n"],"mappings":"AAAA,OAAOA,KAAK,IAAeC,OAAO,QAAQ,OAAO;AAEjD,OAAOC,UAAU,MAAM,YAAY;AAEnC,SACEC,aAAa,EACbC,qBAAqB,EACrBC,sBAAsB,EACtBC,sBAAsB,EACtBC,SAAS,EACTC,4BAA4B,QACvB,UAAU;AA2BjB,OAAO,MAAMC,cAAc,GAAGC,IAAA,IAUH;EAAA,IAVI;IAC7BC,eAAe;IACfC,aAAa;IACbC,QAAQ,GAAG,CAAC;IACZC,MAAM,GAAG,EAAE;IACXC,MAAM,GAAG,CAAC;IACVC,WAAW,GAAG,KAAK;IACnBC,SAAS;IACTC,cAAc,GAAG,KAAK;IACtBC;EACmB,CAAC,GAAAT,IAAA;EACpB,IAAIK,MAAM,GAAGD,MAAM,EAAE;IACnBM,OAAO,CAACC,IAAI,CAAC,oDAAoD,CAAC;IAClEN,MAAM,GAAGD,MAAM;EACjB;EACA,MAAMQ,cAAc,GAAGrB,OAAO,CAAC,MAAM;IACnC,IAAIsB,KAAK,GAAGV,QAAQ;IACpB,IAAIA,QAAQ,GAAG,GAAG,EAAE;MAClBU,KAAK,GAAG,GAAG;IACb;IACA,IAAIV,QAAQ,GAAG,CAAC,EAAE;MAChBU,KAAK,GAAG,CAAC;IACX;IACA,OAAOA,KAAK;EACd,CAAC,EAAE,CAACV,QAAQ,CAAC,CAAC;EAEd,MAAMW,gBAAgB,GAAGvB,OAAO,CAAC,MAAMa,MAAM,GAAGC,MAAM,GAAG,CAAC,EAAE,CAACD,MAAM,EAAEC,MAAM,CAAC,CAAC;EAC7E,MAAMU,aAAa,GAAGxB,OAAO,CAC3B,MAAMuB,gBAAgB,GAAG,CAAC,GAAGE,IAAI,CAACC,EAAE,EACpC,CAACH,gBAAgB,CACnB,CAAC;EACD,MAAMI,qBAAqB,GAAG3B,OAAO,CACnC,MAAMwB,aAAa,GAAI,CAAC,GAAG,GAAGH,cAAc,IAAI,GAAG,GAAIG,aAAa,EACpE,CAACA,aAAa,EAAEH,cAAc,CAChC,CAAC;EACD,MAAMO,qBAAqB,GAAG5B,OAAO,CACnC,MAAMwB,aAAa,GAAIH,cAAc,GAAG,GAAG,GAAIG,aAAa,EAC5D,CAACA,aAAa,EAAEH,cAAc,CAChC,CAAC;EACD,oBACEtB,KAAA,CAAA8B,aAAA,CAACvB,SAAS;IAACwB,MAAM,EAAEjB,MAAM,GAAG,CAAE;IAACS,KAAK,EAAET,MAAM,GAAG,CAAE;IAACG,SAAS,EAAEA;EAAU,gBACrEjB,KAAA,CAAA8B,aAAA,CAACzB,sBAAsB;IACrB2B,MAAM,EAAErB,eAAgB;IACxBsB,iBAAiB,EAAE,CAACL,qBAAsB;IAC1CM,WAAW,EAAEnB,MAAO;IACpBoB,eAAe,EAAKV,aAAa,SAAIA,aAAgB;IACrDW,CAAC,EAAEZ,gBAAiB;IACpBa,EAAE,EAAEvB,MAAO;IACXwB,EAAE,EAAExB;EAAO,CACZ,CAAC,eACFd,KAAA,CAAA8B,aAAA,CAACxB,sBAAsB;IACrB0B,MAAM,EAAEpB,aAAc;IACtBqB,iBAAiB,EAAEJ,qBAAsB;IACzCK,WAAW,EAAEnB,MAAO;IACpBoB,eAAe,EAAKV,aAAa,SAAIA,aAAgB;IACrDc,YAAY,EAAEvB,WAAY;IAC1BoB,CAAC,EAAEZ,gBAAiB;IACpBa,EAAE,EAAEvB,MAAO;IACXwB,EAAE,EAAExB;EAAO,CACZ,CAAC,EACDI,cAAc,gBACblB,KAAA,CAAA8B,aAAA,CAACtB,4BAA4B;IAC3BwB,MAAM,EAAEpB,aAAc;IACtB4B,SAAS,EAAErB,QAAS;IACpBsB,CAAC,EAAC,KAAK;IACPC,CAAC,EAAC,MAAM;IACRC,gBAAgB,EAAC,SAAS;IAC1BC,UAAU,EAAC;EAAQ,GAElBtB,cAAc,EAAC,GACY,CAAC,GAC7B,IACK,CAAC;AAEhB,CAAC;AAED,OAAO,MAAMuB,YAAY,GAAGC,KAAA,IAIH;EAAA,IAJI;IAC3B7B,SAAS;IACT8B,QAAQ;IACR,GAAGC;EACc,CAAC,GAAAF,KAAA;EAClB,oBACE9C,KAAA,CAAA8B,aAAA,CAAC3B,aAAa;IACZc,SAAS,EAAEf,UAAU,CAACe,SAAS,CAAE;IACjC,eAAY;EAAe,gBAE3BjB,KAAA,CAAA8B,aAAA,CAACrB,cAAc,EAAKuC,IAAO,CAAC,EAC3BD,QAAQ,gBACP/C,KAAA,CAAA8B,aAAA,CAAC1B,qBAAqB,QAAE2C,QAAgC,CAAC,GACvD,IACS,CAAC;AAEpB,CAAC;AAEDF,YAAY,CAACI,WAAW,GAAG,cAAc"}
|
package/dist/index.js
CHANGED
|
@@ -17269,7 +17269,8 @@
|
|
|
17269
17269
|
radius = _ref$radius === void 0 ? 20 : _ref$radius,
|
|
17270
17270
|
_ref$stroke = _ref.stroke,
|
|
17271
17271
|
stroke = _ref$stroke === void 0 ? 3 : _ref$stroke,
|
|
17272
|
-
roundStroke = _ref.roundStroke,
|
|
17272
|
+
_ref$roundStroke = _ref.roundStroke,
|
|
17273
|
+
roundStroke = _ref$roundStroke === void 0 ? false : _ref$roundStroke,
|
|
17273
17274
|
className = _ref.className,
|
|
17274
17275
|
_ref$showPercentage = _ref.showPercentage,
|
|
17275
17276
|
showPercentage = _ref$showPercentage === void 0 ? false : _ref$showPercentage,
|