@activecollab/components 2.0.116 → 2.0.117
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/Styles.js +2 -2
- package/dist/cjs/components/ProgressRing/Styles.js.map +1 -1
- package/dist/esm/components/ProgressRing/Styles.js +2 -2
- package/dist/esm/components/ProgressRing/Styles.js.map +1 -1
- package/dist/index.js +2 -2
- 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
|
@@ -25,7 +25,7 @@ StyledSvg.displayName = "StyledSvg";
|
|
|
25
25
|
var StyledBackgroundCircle = exports.StyledBackgroundCircle = _styledComponents.default.circle.withConfig({
|
|
26
26
|
displayName: "Styles__StyledBackgroundCircle",
|
|
27
27
|
componentId: "sc-o6dcyu-3"
|
|
28
|
-
})(["fill:transparent;transition:stroke-dashoffset 0.5s linear;", " ", ""], function (props) {
|
|
28
|
+
})(["fill:transparent;transition:stroke-dashoffset 0.5s linear,stroke 300ms ease-out;", " ", ""], function (props) {
|
|
29
29
|
return props.$color ? (0, _styledComponents.css)(["stroke:", ";"], props.$color) : (0, _styledComponents.css)(["stroke:var(--color-theme-transparent-300);"]);
|
|
30
30
|
}, function (props) {
|
|
31
31
|
return props.$strokeDashOffset && (0, _styledComponents.css)(["stroke-dashoffset:", ";"], props.$strokeDashOffset);
|
|
@@ -34,7 +34,7 @@ StyledBackgroundCircle.displayName = "StyledBackgroundCircle";
|
|
|
34
34
|
var StyledForegroundCircle = exports.StyledForegroundCircle = _styledComponents.default.circle.withConfig({
|
|
35
35
|
displayName: "Styles__StyledForegroundCircle",
|
|
36
36
|
componentId: "sc-o6dcyu-4"
|
|
37
|
-
})(["fill:transparent;transition:stroke-dashoffset 0.5s linear;", " ", " ", ""], function (props) {
|
|
37
|
+
})(["fill:transparent;transition:stroke-dashoffset 0.5s linear,stroke 300ms ease-out;", " ", " ", ""], function (props) {
|
|
38
38
|
return props.$roundStroke && (0, _styledComponents.css)(["stroke-linecap:round;"]);
|
|
39
39
|
}, function (props) {
|
|
40
40
|
return props.$color ? (0, _styledComponents.css)(["stroke:", ";"], props.$color) : (0, _styledComponents.css)(["stroke:var(--color-secondary);"]);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Styles.js","names":["_styledComponents","_interopRequireWildcard","require","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","StyledWrapper","exports","styled","div","withConfig","displayName","componentId","StyledChildrenWrapper","StyledSvg","svg","StyledBackgroundCircle","circle","props","$color","css","$strokeDashOffset","StyledForegroundCircle","$roundStroke","StyledProgressRingPercentage","text","$fontSize"],"sources":["../../../../src/components/ProgressRing/Styles.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\n\ninterface IStyledProgressRing {\n $color?: string;\n $strokeDashOffset?: number;\n $fontSize?: number;\n $roundStroke?: boolean;\n}\n\nexport const StyledWrapper = styled.div`\n position: relative;\n display: inline-flex;\n`;\n\nStyledWrapper.displayName = \"StyledWrapper\";\n\nexport const StyledChildrenWrapper = styled.div`\n position: absolute;\n left: 50%;\n top: 50%;\n transform: translate(-50%, -50%);\n display: inline-flex;\n`;\n\nStyledChildrenWrapper.displayName = \"StyledChildrenWrapper\";\n\nexport const StyledSvg = styled.svg`\n transform: rotate(-90deg);\n`;\n\nStyledSvg.displayName = \"StyledSvg\";\n\nexport const StyledBackgroundCircle = styled.circle<IStyledProgressRing>`\n fill: transparent;\n transition: stroke-dashoffset 0.5s linear;\n\n ${(props) =>\n props.$color\n ? css`\n stroke: ${props.$color};\n `\n : css`\n stroke: var(--color-theme-transparent-300);\n `}\n\n ${(props) =>\n props.$strokeDashOffset &&\n css`\n stroke-dashoffset: ${props.$strokeDashOffset};\n `}\n`;\n\nStyledBackgroundCircle.displayName = \"StyledBackgroundCircle\";\n\nexport const StyledForegroundCircle = styled.circle<IStyledProgressRing>`\n fill: transparent;\n transition: stroke-dashoffset 0.5s linear;\n\n ${(props) =>\n props.$roundStroke &&\n css`\n stroke-linecap: round;\n `}\n\n ${(props) =>\n props.$color\n ? css`\n stroke: ${props.$color};\n `\n : css`\n stroke: var(--color-secondary);\n `}\n\n ${(props) =>\n props.$strokeDashOffset &&\n css`\n stroke-dashoffset: ${props.$strokeDashOffset};\n `}\n`;\n\nStyledForegroundCircle.displayName = \"StyledForegroundCircle\";\n\nexport const StyledProgressRingPercentage = styled.text<IStyledProgressRing>`\n transform: rotate(90deg);\n\n ${(props) =>\n props.$color\n ? css`\n fill: ${props.$color};\n `\n : css`\n fill: var(--color-secondary);\n `}\n\n ${(props) =>\n props.$fontSize\n ? css`\n font-size: ${props.$fontSize}px;\n `\n : css`\n font-size: 10px;\n `}\n`;\n\nStyledProgressRingPercentage.displayName = \"StyledProgressRingPercentage\";\n"],"mappings":";;;;;;AAAA,IAAAA,iBAAA,GAAAC,uBAAA,CAAAC,OAAA;AAAgD,SAAAC,yBAAAC,CAAA,6BAAAC,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,yBAAAC,CAAA,WAAAA,CAAA,GAAAG,CAAA,GAAAD,CAAA,KAAAF,CAAA;AAAA,SAAAH,wBAAAG,CAAA,EAAAE,CAAA,SAAAA,CAAA,IAAAF,CAAA,IAAAA,CAAA,CAAAI,UAAA,SAAAJ,CAAA,eAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,WAAAK,OAAA,EAAAL,CAAA,QAAAG,CAAA,GAAAJ,wBAAA,CAAAG,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAG,GAAA,CAAAN,CAAA,UAAAG,CAAA,CAAAI,GAAA,CAAAP,CAAA,OAAAQ,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAd,CAAA,oBAAAc,CAAA,IAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAjB,CAAA,EAAAc,CAAA,SAAAI,CAAA,GAAAR,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAb,CAAA,EAAAc,CAAA,UAAAI,CAAA,KAAAA,CAAA,CAAAX,GAAA,IAAAW,CAAA,CAAAC,GAAA,IAAAR,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAI,CAAA,IAAAV,CAAA,CAAAM,CAAA,IAAAd,CAAA,CAAAc,CAAA,YAAAN,CAAA,CAAAH,OAAA,GAAAL,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAgB,GAAA,CAAAnB,CAAA,EAAAQ,CAAA,GAAAA,CAAA;AASzC,IAAMY,aAAa,GAAAC,OAAA,CAAAD,aAAA,GAAGE,yBAAM,CAACC,GAAG,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,8CAGtC;AAEDN,aAAa,CAACK,WAAW,GAAG,eAAe;AAEpC,IAAME,qBAAqB,GAAAN,OAAA,CAAAM,qBAAA,GAAGL,yBAAM,CAACC,GAAG,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,8FAM9C;AAEDC,qBAAqB,CAACF,WAAW,GAAG,uBAAuB;AAEpD,IAAMG,SAAS,GAAAP,OAAA,CAAAO,SAAA,GAAGN,yBAAM,CAACO,GAAG,CAAAL,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,iCAElC;AAEDE,SAAS,CAACH,WAAW,GAAG,WAAW;AAE5B,IAAMK,sBAAsB,GAAAT,OAAA,CAAAS,sBAAA,GAAGR,yBAAM,CAACS,MAAM,CAAAP,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,
|
|
1
|
+
{"version":3,"file":"Styles.js","names":["_styledComponents","_interopRequireWildcard","require","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","StyledWrapper","exports","styled","div","withConfig","displayName","componentId","StyledChildrenWrapper","StyledSvg","svg","StyledBackgroundCircle","circle","props","$color","css","$strokeDashOffset","StyledForegroundCircle","$roundStroke","StyledProgressRingPercentage","text","$fontSize"],"sources":["../../../../src/components/ProgressRing/Styles.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\n\ninterface IStyledProgressRing {\n $color?: string;\n $strokeDashOffset?: number;\n $fontSize?: number;\n $roundStroke?: boolean;\n}\n\nexport const StyledWrapper = styled.div`\n position: relative;\n display: inline-flex;\n`;\n\nStyledWrapper.displayName = \"StyledWrapper\";\n\nexport const StyledChildrenWrapper = styled.div`\n position: absolute;\n left: 50%;\n top: 50%;\n transform: translate(-50%, -50%);\n display: inline-flex;\n`;\n\nStyledChildrenWrapper.displayName = \"StyledChildrenWrapper\";\n\nexport const StyledSvg = styled.svg`\n transform: rotate(-90deg);\n`;\n\nStyledSvg.displayName = \"StyledSvg\";\n\nexport const StyledBackgroundCircle = styled.circle<IStyledProgressRing>`\n fill: transparent;\n transition: stroke-dashoffset 0.5s linear, stroke 300ms ease-out;\n\n ${(props) =>\n props.$color\n ? css`\n stroke: ${props.$color};\n `\n : css`\n stroke: var(--color-theme-transparent-300);\n `}\n\n ${(props) =>\n props.$strokeDashOffset &&\n css`\n stroke-dashoffset: ${props.$strokeDashOffset};\n `}\n`;\n\nStyledBackgroundCircle.displayName = \"StyledBackgroundCircle\";\n\nexport const StyledForegroundCircle = styled.circle<IStyledProgressRing>`\n fill: transparent;\n transition: stroke-dashoffset 0.5s linear, stroke 300ms ease-out;\n\n ${(props) =>\n props.$roundStroke &&\n css`\n stroke-linecap: round;\n `}\n\n ${(props) =>\n props.$color\n ? css`\n stroke: ${props.$color};\n `\n : css`\n stroke: var(--color-secondary);\n `}\n\n ${(props) =>\n props.$strokeDashOffset &&\n css`\n stroke-dashoffset: ${props.$strokeDashOffset};\n `}\n`;\n\nStyledForegroundCircle.displayName = \"StyledForegroundCircle\";\n\nexport const StyledProgressRingPercentage = styled.text<IStyledProgressRing>`\n transform: rotate(90deg);\n\n ${(props) =>\n props.$color\n ? css`\n fill: ${props.$color};\n `\n : css`\n fill: var(--color-secondary);\n `}\n\n ${(props) =>\n props.$fontSize\n ? css`\n font-size: ${props.$fontSize}px;\n `\n : css`\n font-size: 10px;\n `}\n`;\n\nStyledProgressRingPercentage.displayName = \"StyledProgressRingPercentage\";\n"],"mappings":"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"}
|
|
@@ -17,12 +17,12 @@ StyledSvg.displayName = "StyledSvg";
|
|
|
17
17
|
export const StyledBackgroundCircle = styled.circle.withConfig({
|
|
18
18
|
displayName: "Styles__StyledBackgroundCircle",
|
|
19
19
|
componentId: "sc-o6dcyu-3"
|
|
20
|
-
})(["fill:transparent;transition:stroke-dashoffset 0.5s linear;", " ", ""], props => props.$color ? css(["stroke:", ";"], props.$color) : css(["stroke:var(--color-theme-transparent-300);"]), props => props.$strokeDashOffset && css(["stroke-dashoffset:", ";"], props.$strokeDashOffset));
|
|
20
|
+
})(["fill:transparent;transition:stroke-dashoffset 0.5s linear,stroke 300ms ease-out;", " ", ""], props => props.$color ? css(["stroke:", ";"], props.$color) : css(["stroke:var(--color-theme-transparent-300);"]), props => props.$strokeDashOffset && css(["stroke-dashoffset:", ";"], props.$strokeDashOffset));
|
|
21
21
|
StyledBackgroundCircle.displayName = "StyledBackgroundCircle";
|
|
22
22
|
export const StyledForegroundCircle = styled.circle.withConfig({
|
|
23
23
|
displayName: "Styles__StyledForegroundCircle",
|
|
24
24
|
componentId: "sc-o6dcyu-4"
|
|
25
|
-
})(["fill:transparent;transition:stroke-dashoffset 0.5s linear;", " ", " ", ""], props => props.$roundStroke && css(["stroke-linecap:round;"]), props => props.$color ? css(["stroke:", ";"], props.$color) : css(["stroke:var(--color-secondary);"]), props => props.$strokeDashOffset && css(["stroke-dashoffset:", ";"], props.$strokeDashOffset));
|
|
25
|
+
})(["fill:transparent;transition:stroke-dashoffset 0.5s linear,stroke 300ms ease-out;", " ", " ", ""], props => props.$roundStroke && css(["stroke-linecap:round;"]), props => props.$color ? css(["stroke:", ";"], props.$color) : css(["stroke:var(--color-secondary);"]), props => props.$strokeDashOffset && css(["stroke-dashoffset:", ";"], props.$strokeDashOffset));
|
|
26
26
|
StyledForegroundCircle.displayName = "StyledForegroundCircle";
|
|
27
27
|
export const StyledProgressRingPercentage = styled.text.withConfig({
|
|
28
28
|
displayName: "Styles__StyledProgressRingPercentage",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Styles.js","names":["styled","css","StyledWrapper","div","withConfig","displayName","componentId","StyledChildrenWrapper","StyledSvg","svg","StyledBackgroundCircle","circle","props","$color","$strokeDashOffset","StyledForegroundCircle","$roundStroke","StyledProgressRingPercentage","text","$fontSize"],"sources":["../../../../src/components/ProgressRing/Styles.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\n\ninterface IStyledProgressRing {\n $color?: string;\n $strokeDashOffset?: number;\n $fontSize?: number;\n $roundStroke?: boolean;\n}\n\nexport const StyledWrapper = styled.div`\n position: relative;\n display: inline-flex;\n`;\n\nStyledWrapper.displayName = \"StyledWrapper\";\n\nexport const StyledChildrenWrapper = styled.div`\n position: absolute;\n left: 50%;\n top: 50%;\n transform: translate(-50%, -50%);\n display: inline-flex;\n`;\n\nStyledChildrenWrapper.displayName = \"StyledChildrenWrapper\";\n\nexport const StyledSvg = styled.svg`\n transform: rotate(-90deg);\n`;\n\nStyledSvg.displayName = \"StyledSvg\";\n\nexport const StyledBackgroundCircle = styled.circle<IStyledProgressRing>`\n fill: transparent;\n transition: stroke-dashoffset 0.5s linear;\n\n ${(props) =>\n props.$color\n ? css`\n stroke: ${props.$color};\n `\n : css`\n stroke: var(--color-theme-transparent-300);\n `}\n\n ${(props) =>\n props.$strokeDashOffset &&\n css`\n stroke-dashoffset: ${props.$strokeDashOffset};\n `}\n`;\n\nStyledBackgroundCircle.displayName = \"StyledBackgroundCircle\";\n\nexport const StyledForegroundCircle = styled.circle<IStyledProgressRing>`\n fill: transparent;\n transition: stroke-dashoffset 0.5s linear;\n\n ${(props) =>\n props.$roundStroke &&\n css`\n stroke-linecap: round;\n `}\n\n ${(props) =>\n props.$color\n ? css`\n stroke: ${props.$color};\n `\n : css`\n stroke: var(--color-secondary);\n `}\n\n ${(props) =>\n props.$strokeDashOffset &&\n css`\n stroke-dashoffset: ${props.$strokeDashOffset};\n `}\n`;\n\nStyledForegroundCircle.displayName = \"StyledForegroundCircle\";\n\nexport const StyledProgressRingPercentage = styled.text<IStyledProgressRing>`\n transform: rotate(90deg);\n\n ${(props) =>\n props.$color\n ? css`\n fill: ${props.$color};\n `\n : css`\n fill: var(--color-secondary);\n `}\n\n ${(props) =>\n props.$fontSize\n ? css`\n font-size: ${props.$fontSize}px;\n `\n : css`\n font-size: 10px;\n `}\n`;\n\nStyledProgressRingPercentage.displayName = \"StyledProgressRingPercentage\";\n"],"mappings":"AAAA,OAAOA,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAS/C,OAAO,MAAMC,aAAa,GAAGF,MAAM,CAACG,GAAG,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,8CAGtC;AAEDJ,aAAa,CAACG,WAAW,GAAG,eAAe;AAE3C,OAAO,MAAME,qBAAqB,GAAGP,MAAM,CAACG,GAAG,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,8FAM9C;AAEDC,qBAAqB,CAACF,WAAW,GAAG,uBAAuB;AAE3D,OAAO,MAAMG,SAAS,GAAGR,MAAM,CAACS,GAAG,CAAAL,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,iCAElC;AAEDE,SAAS,CAACH,WAAW,GAAG,WAAW;AAEnC,OAAO,MAAMK,sBAAsB,GAAGV,MAAM,CAACW,MAAM,CAAAP,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,
|
|
1
|
+
{"version":3,"file":"Styles.js","names":["styled","css","StyledWrapper","div","withConfig","displayName","componentId","StyledChildrenWrapper","StyledSvg","svg","StyledBackgroundCircle","circle","props","$color","$strokeDashOffset","StyledForegroundCircle","$roundStroke","StyledProgressRingPercentage","text","$fontSize"],"sources":["../../../../src/components/ProgressRing/Styles.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\n\ninterface IStyledProgressRing {\n $color?: string;\n $strokeDashOffset?: number;\n $fontSize?: number;\n $roundStroke?: boolean;\n}\n\nexport const StyledWrapper = styled.div`\n position: relative;\n display: inline-flex;\n`;\n\nStyledWrapper.displayName = \"StyledWrapper\";\n\nexport const StyledChildrenWrapper = styled.div`\n position: absolute;\n left: 50%;\n top: 50%;\n transform: translate(-50%, -50%);\n display: inline-flex;\n`;\n\nStyledChildrenWrapper.displayName = \"StyledChildrenWrapper\";\n\nexport const StyledSvg = styled.svg`\n transform: rotate(-90deg);\n`;\n\nStyledSvg.displayName = \"StyledSvg\";\n\nexport const StyledBackgroundCircle = styled.circle<IStyledProgressRing>`\n fill: transparent;\n transition: stroke-dashoffset 0.5s linear, stroke 300ms ease-out;\n\n ${(props) =>\n props.$color\n ? css`\n stroke: ${props.$color};\n `\n : css`\n stroke: var(--color-theme-transparent-300);\n `}\n\n ${(props) =>\n props.$strokeDashOffset &&\n css`\n stroke-dashoffset: ${props.$strokeDashOffset};\n `}\n`;\n\nStyledBackgroundCircle.displayName = \"StyledBackgroundCircle\";\n\nexport const StyledForegroundCircle = styled.circle<IStyledProgressRing>`\n fill: transparent;\n transition: stroke-dashoffset 0.5s linear, stroke 300ms ease-out;\n\n ${(props) =>\n props.$roundStroke &&\n css`\n stroke-linecap: round;\n `}\n\n ${(props) =>\n props.$color\n ? css`\n stroke: ${props.$color};\n `\n : css`\n stroke: var(--color-secondary);\n `}\n\n ${(props) =>\n props.$strokeDashOffset &&\n css`\n stroke-dashoffset: ${props.$strokeDashOffset};\n `}\n`;\n\nStyledForegroundCircle.displayName = \"StyledForegroundCircle\";\n\nexport const StyledProgressRingPercentage = styled.text<IStyledProgressRing>`\n transform: rotate(90deg);\n\n ${(props) =>\n props.$color\n ? css`\n fill: ${props.$color};\n `\n : css`\n fill: var(--color-secondary);\n `}\n\n ${(props) =>\n props.$fontSize\n ? css`\n font-size: ${props.$fontSize}px;\n `\n : css`\n font-size: 10px;\n `}\n`;\n\nStyledProgressRingPercentage.displayName = \"StyledProgressRingPercentage\";\n"],"mappings":"AAAA,OAAOA,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAS/C,OAAO,MAAMC,aAAa,GAAGF,MAAM,CAACG,GAAG,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,8CAGtC;AAEDJ,aAAa,CAACG,WAAW,GAAG,eAAe;AAE3C,OAAO,MAAME,qBAAqB,GAAGP,MAAM,CAACG,GAAG,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,8FAM9C;AAEDC,qBAAqB,CAACF,WAAW,GAAG,uBAAuB;AAE3D,OAAO,MAAMG,SAAS,GAAGR,MAAM,CAACS,GAAG,CAAAL,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,iCAElC;AAEDE,SAAS,CAACH,WAAW,GAAG,WAAW;AAEnC,OAAO,MAAMK,sBAAsB,GAAGV,MAAM,CAACW,MAAM,CAAAP,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,kGAI9CM,KAAK,IACNA,KAAK,CAACC,MAAM,GACRZ,GAAG,mBACSW,KAAK,CAACC,MAAM,IAExBZ,GAAG,gDAEF,EAEJW,KAAK,IACNA,KAAK,CAACE,iBAAiB,IACvBb,GAAG,8BACoBW,KAAK,CAACE,iBAAiB,CAC7C,CACJ;AAEDJ,sBAAsB,CAACL,WAAW,GAAG,wBAAwB;AAE7D,OAAO,MAAMU,sBAAsB,GAAGf,MAAM,CAACW,MAAM,CAAAP,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,uGAI9CM,KAAK,IACNA,KAAK,CAACI,YAAY,IAClBf,GAAG,2BAEF,EAEAW,KAAK,IACNA,KAAK,CAACC,MAAM,GACRZ,GAAG,mBACSW,KAAK,CAACC,MAAM,IAExBZ,GAAG,oCAEF,EAEJW,KAAK,IACNA,KAAK,CAACE,iBAAiB,IACvBb,GAAG,8BACoBW,KAAK,CAACE,iBAAiB,CAC7C,CACJ;AAEDC,sBAAsB,CAACV,WAAW,GAAG,wBAAwB;AAE7D,OAAO,MAAMY,4BAA4B,GAAGjB,MAAM,CAACkB,IAAI,CAAAd,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,0CAGlDM,KAAK,IACNA,KAAK,CAACC,MAAM,GACRZ,GAAG,iBACOW,KAAK,CAACC,MAAM,IAEtBZ,GAAG,kCAEF,EAEJW,KAAK,IACNA,KAAK,CAACO,SAAS,GACXlB,GAAG,wBACYW,KAAK,CAACO,SAAS,IAE9BlB,GAAG,qBAEF,CACR;AAEDgB,4BAA4B,CAACZ,WAAW,GAAG,8BAA8B"}
|
package/dist/index.js
CHANGED
|
@@ -17404,7 +17404,7 @@
|
|
|
17404
17404
|
var StyledBackgroundCircle = styled__default["default"].circle.withConfig({
|
|
17405
17405
|
displayName: "Styles__StyledBackgroundCircle",
|
|
17406
17406
|
componentId: "sc-o6dcyu-3"
|
|
17407
|
-
})(["fill:transparent;transition:stroke-dashoffset 0.5s linear;", " ", ""], function (props) {
|
|
17407
|
+
})(["fill:transparent;transition:stroke-dashoffset 0.5s linear,stroke 300ms ease-out;", " ", ""], function (props) {
|
|
17408
17408
|
return props.$color ? styled.css(["stroke:", ";"], props.$color) : styled.css(["stroke:var(--color-theme-transparent-300);"]);
|
|
17409
17409
|
}, function (props) {
|
|
17410
17410
|
return props.$strokeDashOffset && styled.css(["stroke-dashoffset:", ";"], props.$strokeDashOffset);
|
|
@@ -17413,7 +17413,7 @@
|
|
|
17413
17413
|
var StyledForegroundCircle = styled__default["default"].circle.withConfig({
|
|
17414
17414
|
displayName: "Styles__StyledForegroundCircle",
|
|
17415
17415
|
componentId: "sc-o6dcyu-4"
|
|
17416
|
-
})(["fill:transparent;transition:stroke-dashoffset 0.5s linear;", " ", " ", ""], function (props) {
|
|
17416
|
+
})(["fill:transparent;transition:stroke-dashoffset 0.5s linear,stroke 300ms ease-out;", " ", " ", ""], function (props) {
|
|
17417
17417
|
return props.$roundStroke && styled.css(["stroke-linecap:round;"]);
|
|
17418
17418
|
}, function (props) {
|
|
17419
17419
|
return props.$color ? styled.css(["stroke:", ";"], props.$color) : styled.css(["stroke:var(--color-secondary);"]);
|