@mirohq/design-system-spinner 1.1.15-themes.2 → 1.1.16
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/main.js.map +1 -1
- package/dist/module.js.map +1 -1
- package/dist/types.d.ts +4 -5
- package/package.json +3 -3
package/dist/main.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"main.js","sources":["../src/spinner.styled.tsx","../src/spinner.tsx"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"main.js","sources":["../src/spinner.styled.tsx","../src/spinner.tsx"],"sourcesContent":["import type { ComponentPropsWithRef } from 'react'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport { styled, keyframes } from '@mirohq/design-system-stitches'\n\nconst rotateAnimation = keyframes({\n '100%': { transform: 'rotate(360deg)' },\n})\n\nconst strokeAnimation = keyframes({\n '0%': {\n strokeDasharray: '1, 200',\n strokeDashoffset: 0,\n },\n '50%': {\n strokeDasharray: '89, 200',\n strokeDashoffset: '-35px',\n },\n '100%': {\n strokeDasharray: '89, 200',\n strokeDashoffset: '-124px',\n },\n})\n\nexport const StyledSpinner = styled(Primitive.svg, {\n display: 'block',\n animation: 'rotate 2s linear infinite',\n transformOrigin: 'center center',\n stroke: 'currentColor',\n '@media (prefers-reduced-motion: no-preference)': {\n animationName: rotateAnimation,\n },\n '& [id=circle]': {\n fill: 'none',\n strokeMiterlimit: '10',\n strokeDasharray: '1, 200',\n strokeDashoffset: 0,\n animation: 'animate 1.5s ease-in-out infinite',\n strokeLinecap: 'round',\n '@media (prefers-reduced-motion: no-preference)': {\n animationName: strokeAnimation,\n },\n },\n variants: {\n size: {\n small: {\n width: '$4',\n height: '$4',\n '& [id=circle]': {\n strokeWidth: '6px',\n },\n },\n medium: {\n width: '$6',\n height: '$6',\n '& [id=circle]': {\n strokeWidth: '4px',\n },\n },\n },\n },\n})\n\nexport type StyledSpinnerProps = ComponentPropsWithRef<typeof StyledSpinner>\n","import React from 'react'\nimport type { ElementRef } from 'react'\n\nimport { StyledSpinner } from './spinner.styled'\nimport type { StyledSpinnerProps } from './spinner.styled'\n\nexport interface SpinnerProps extends StyledSpinnerProps {\n /**\n * The size of the spinner.\n */\n size?: StyledSpinnerProps['size']\n}\n\nexport const Spinner = React.forwardRef<\n ElementRef<typeof StyledSpinner>,\n SpinnerProps\n>(({ size = 'medium', ...restProps }, forwardRef) => (\n <StyledSpinner\n {...restProps}\n viewBox='25 25 50 50'\n size={size}\n ref={forwardRef}\n >\n <circle id='circle' cx='50' cy='50' r='20' />\n </StyledSpinner>\n))\n"],"names":["keyframes","styled","Primitive","React","jsx"],"mappings":";;;;;;;;;;;;;AAIA,MAAM,kBAAkBA,8BAAU,CAAA;AAAA,EAChC,MAAA,EAAQ,EAAE,SAAA,EAAW,gBAAiB,EAAA;AACxC,CAAC,CAAA,CAAA;AAED,MAAM,kBAAkBA,8BAAU,CAAA;AAAA,EAChC,IAAM,EAAA;AAAA,IACJ,eAAiB,EAAA,QAAA;AAAA,IACjB,gBAAkB,EAAA,CAAA;AAAA,GACpB;AAAA,EACA,KAAO,EAAA;AAAA,IACL,eAAiB,EAAA,SAAA;AAAA,IACjB,gBAAkB,EAAA,OAAA;AAAA,GACpB;AAAA,EACA,MAAQ,EAAA;AAAA,IACN,eAAiB,EAAA,SAAA;AAAA,IACjB,gBAAkB,EAAA,QAAA;AAAA,GACpB;AACF,CAAC,CAAA,CAAA;AAEY,MAAA,aAAA,GAAgBC,2BAAO,CAAAC,+BAAA,CAAU,GAAK,EAAA;AAAA,EACjD,OAAS,EAAA,OAAA;AAAA,EACT,SAAW,EAAA,2BAAA;AAAA,EACX,eAAiB,EAAA,eAAA;AAAA,EACjB,MAAQ,EAAA,cAAA;AAAA,EACR,gDAAkD,EAAA;AAAA,IAChD,aAAe,EAAA,eAAA;AAAA,GACjB;AAAA,EACA,eAAiB,EAAA;AAAA,IACf,IAAM,EAAA,MAAA;AAAA,IACN,gBAAkB,EAAA,IAAA;AAAA,IAClB,eAAiB,EAAA,QAAA;AAAA,IACjB,gBAAkB,EAAA,CAAA;AAAA,IAClB,SAAW,EAAA,mCAAA;AAAA,IACX,aAAe,EAAA,OAAA;AAAA,IACf,gDAAkD,EAAA;AAAA,MAChD,aAAe,EAAA,eAAA;AAAA,KACjB;AAAA,GACF;AAAA,EACA,QAAU,EAAA;AAAA,IACR,IAAM,EAAA;AAAA,MACJ,KAAO,EAAA;AAAA,QACL,KAAO,EAAA,IAAA;AAAA,QACP,MAAQ,EAAA,IAAA;AAAA,QACR,eAAiB,EAAA;AAAA,UACf,WAAa,EAAA,KAAA;AAAA,SACf;AAAA,OACF;AAAA,MACA,MAAQ,EAAA;AAAA,QACN,KAAO,EAAA,IAAA;AAAA,QACP,MAAQ,EAAA,IAAA;AAAA,QACR,eAAiB,EAAA;AAAA,UACf,WAAa,EAAA,KAAA;AAAA,SACf;AAAA,OACF;AAAA,KACF;AAAA,GACF;AACF,CAAC,CAAA;;AC/CY,MAAA,OAAA,GAAUC,yBAAM,CAAA,UAAA,CAG3B,CAAC,EAAE,OAAO,QAAU,EAAA,GAAG,SAAU,EAAA,EAAG,UACpC,qBAAAC,cAAA;AAAA,EAAC,aAAA;AAAA,EAAA;AAAA,IACE,GAAG,SAAA;AAAA,IACJ,OAAQ,EAAA,aAAA;AAAA,IACR,IAAA;AAAA,IACA,GAAK,EAAA,UAAA;AAAA,IAEL,QAAA,kBAAAA,cAAA,CAAC,YAAO,EAAG,EAAA,QAAA,EAAS,IAAG,IAAK,EAAA,EAAA,EAAG,IAAK,EAAA,CAAA,EAAE,IAAK,EAAA,CAAA;AAAA,GAAA;AAC7C,CACD;;;;"}
|
package/dist/module.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"module.js","sources":["../src/spinner.styled.tsx","../src/spinner.tsx"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"module.js","sources":["../src/spinner.styled.tsx","../src/spinner.tsx"],"sourcesContent":["import type { ComponentPropsWithRef } from 'react'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport { styled, keyframes } from '@mirohq/design-system-stitches'\n\nconst rotateAnimation = keyframes({\n '100%': { transform: 'rotate(360deg)' },\n})\n\nconst strokeAnimation = keyframes({\n '0%': {\n strokeDasharray: '1, 200',\n strokeDashoffset: 0,\n },\n '50%': {\n strokeDasharray: '89, 200',\n strokeDashoffset: '-35px',\n },\n '100%': {\n strokeDasharray: '89, 200',\n strokeDashoffset: '-124px',\n },\n})\n\nexport const StyledSpinner = styled(Primitive.svg, {\n display: 'block',\n animation: 'rotate 2s linear infinite',\n transformOrigin: 'center center',\n stroke: 'currentColor',\n '@media (prefers-reduced-motion: no-preference)': {\n animationName: rotateAnimation,\n },\n '& [id=circle]': {\n fill: 'none',\n strokeMiterlimit: '10',\n strokeDasharray: '1, 200',\n strokeDashoffset: 0,\n animation: 'animate 1.5s ease-in-out infinite',\n strokeLinecap: 'round',\n '@media (prefers-reduced-motion: no-preference)': {\n animationName: strokeAnimation,\n },\n },\n variants: {\n size: {\n small: {\n width: '$4',\n height: '$4',\n '& [id=circle]': {\n strokeWidth: '6px',\n },\n },\n medium: {\n width: '$6',\n height: '$6',\n '& [id=circle]': {\n strokeWidth: '4px',\n },\n },\n },\n },\n})\n\nexport type StyledSpinnerProps = ComponentPropsWithRef<typeof StyledSpinner>\n","import React from 'react'\nimport type { ElementRef } from 'react'\n\nimport { StyledSpinner } from './spinner.styled'\nimport type { StyledSpinnerProps } from './spinner.styled'\n\nexport interface SpinnerProps extends StyledSpinnerProps {\n /**\n * The size of the spinner.\n */\n size?: StyledSpinnerProps['size']\n}\n\nexport const Spinner = React.forwardRef<\n ElementRef<typeof StyledSpinner>,\n SpinnerProps\n>(({ size = 'medium', ...restProps }, forwardRef) => (\n <StyledSpinner\n {...restProps}\n viewBox='25 25 50 50'\n size={size}\n ref={forwardRef}\n >\n <circle id='circle' cx='50' cy='50' r='20' />\n </StyledSpinner>\n))\n"],"names":[],"mappings":";;;;;AAIA,MAAM,kBAAkB,SAAU,CAAA;AAAA,EAChC,MAAA,EAAQ,EAAE,SAAA,EAAW,gBAAiB,EAAA;AACxC,CAAC,CAAA,CAAA;AAED,MAAM,kBAAkB,SAAU,CAAA;AAAA,EAChC,IAAM,EAAA;AAAA,IACJ,eAAiB,EAAA,QAAA;AAAA,IACjB,gBAAkB,EAAA,CAAA;AAAA,GACpB;AAAA,EACA,KAAO,EAAA;AAAA,IACL,eAAiB,EAAA,SAAA;AAAA,IACjB,gBAAkB,EAAA,OAAA;AAAA,GACpB;AAAA,EACA,MAAQ,EAAA;AAAA,IACN,eAAiB,EAAA,SAAA;AAAA,IACjB,gBAAkB,EAAA,QAAA;AAAA,GACpB;AACF,CAAC,CAAA,CAAA;AAEY,MAAA,aAAA,GAAgB,MAAO,CAAA,SAAA,CAAU,GAAK,EAAA;AAAA,EACjD,OAAS,EAAA,OAAA;AAAA,EACT,SAAW,EAAA,2BAAA;AAAA,EACX,eAAiB,EAAA,eAAA;AAAA,EACjB,MAAQ,EAAA,cAAA;AAAA,EACR,gDAAkD,EAAA;AAAA,IAChD,aAAe,EAAA,eAAA;AAAA,GACjB;AAAA,EACA,eAAiB,EAAA;AAAA,IACf,IAAM,EAAA,MAAA;AAAA,IACN,gBAAkB,EAAA,IAAA;AAAA,IAClB,eAAiB,EAAA,QAAA;AAAA,IACjB,gBAAkB,EAAA,CAAA;AAAA,IAClB,SAAW,EAAA,mCAAA;AAAA,IACX,aAAe,EAAA,OAAA;AAAA,IACf,gDAAkD,EAAA;AAAA,MAChD,aAAe,EAAA,eAAA;AAAA,KACjB;AAAA,GACF;AAAA,EACA,QAAU,EAAA;AAAA,IACR,IAAM,EAAA;AAAA,MACJ,KAAO,EAAA;AAAA,QACL,KAAO,EAAA,IAAA;AAAA,QACP,MAAQ,EAAA,IAAA;AAAA,QACR,eAAiB,EAAA;AAAA,UACf,WAAa,EAAA,KAAA;AAAA,SACf;AAAA,OACF;AAAA,MACA,MAAQ,EAAA;AAAA,QACN,KAAO,EAAA,IAAA;AAAA,QACP,MAAQ,EAAA,IAAA;AAAA,QACR,eAAiB,EAAA;AAAA,UACf,WAAa,EAAA,KAAA;AAAA,SACf;AAAA,OACF;AAAA,KACF;AAAA,GACF;AACF,CAAC,CAAA;;AC/CY,MAAA,OAAA,GAAU,KAAM,CAAA,UAAA,CAG3B,CAAC,EAAE,OAAO,QAAU,EAAA,GAAG,SAAU,EAAA,EAAG,UACpC,qBAAA,GAAA;AAAA,EAAC,aAAA;AAAA,EAAA;AAAA,IACE,GAAG,SAAA;AAAA,IACJ,OAAQ,EAAA,aAAA;AAAA,IACR,IAAA;AAAA,IACA,GAAK,EAAA,UAAA;AAAA,IAEL,QAAA,kBAAA,GAAA,CAAC,YAAO,EAAG,EAAA,QAAA,EAAS,IAAG,IAAK,EAAA,EAAA,EAAG,IAAK,EAAA,CAAA,EAAE,IAAK,EAAA,CAAA;AAAA,GAAA;AAC7C,CACD;;;;"}
|
package/dist/types.d.ts
CHANGED
|
@@ -1,8 +1,7 @@
|
|
|
1
1
|
import * as react from 'react';
|
|
2
|
-
import react__default from 'react';
|
|
2
|
+
import react__default, { ComponentPropsWithRef } from 'react';
|
|
3
3
|
import * as _mirohq_design_system_primitive from '@mirohq/design-system-primitive';
|
|
4
4
|
import * as _mirohq_design_system_stitches from '@mirohq/design-system-stitches';
|
|
5
|
-
import { StrictComponentProps } from '@mirohq/design-system-stitches';
|
|
6
5
|
import * as _stitches_react_types_css_util from '@stitches/react/types/css-util';
|
|
7
6
|
import * as _stitches_react_types_styled_component from '@stitches/react/types/styled-component';
|
|
8
7
|
|
|
@@ -475,14 +474,14 @@ declare const StyledSpinner: react.ForwardRefExoticComponent<Omit<Omit<{
|
|
|
475
474
|
} & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<SVGSVGElement>> & _mirohq_design_system_stitches.StitchesInternals<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"svg">>, {
|
|
476
475
|
size?: "small" | "medium" | undefined;
|
|
477
476
|
}, {}>;
|
|
478
|
-
declare type StyledSpinnerProps =
|
|
477
|
+
declare type StyledSpinnerProps = ComponentPropsWithRef<typeof StyledSpinner>;
|
|
479
478
|
|
|
480
|
-
interface SpinnerProps extends
|
|
479
|
+
interface SpinnerProps extends StyledSpinnerProps {
|
|
481
480
|
/**
|
|
482
481
|
* The size of the spinner.
|
|
483
482
|
*/
|
|
484
483
|
size?: StyledSpinnerProps['size'];
|
|
485
484
|
}
|
|
486
|
-
declare const Spinner: react__default.ForwardRefExoticComponent<SpinnerProps & react__default.RefAttributes<SVGSVGElement>>;
|
|
485
|
+
declare const Spinner: react__default.ForwardRefExoticComponent<Omit<SpinnerProps, "ref"> & react__default.RefAttributes<SVGSVGElement>>;
|
|
487
486
|
|
|
488
487
|
export { Spinner, SpinnerProps };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@mirohq/design-system-spinner",
|
|
3
|
-
"version": "1.1.
|
|
3
|
+
"version": "1.1.16",
|
|
4
4
|
"description": "",
|
|
5
5
|
"author": "Miro",
|
|
6
6
|
"source": "src/index.ts",
|
|
@@ -27,8 +27,8 @@
|
|
|
27
27
|
},
|
|
28
28
|
"dependencies": {
|
|
29
29
|
"@mirohq/design-system-primitive": "^1.1.0",
|
|
30
|
-
"@mirohq/design-system-stitches": "^2.3.5
|
|
31
|
-
"@mirohq/design-tokens": "^3.0.0
|
|
30
|
+
"@mirohq/design-system-stitches": "^2.3.5",
|
|
31
|
+
"@mirohq/design-tokens": "^3.0.0"
|
|
32
32
|
},
|
|
33
33
|
"scripts": {
|
|
34
34
|
"build": "rollup -c ../../../rollup.config.js",
|