Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@chakra-ui/spinner

Package Overview
Dependencies
Maintainers
3
Versions
389
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@chakra-ui/spinner - npm Package Compare versions

Comparing version 2.0.6 to 2.0.7

11

package.json
{
"name": "@chakra-ui/spinner",
"version": "2.0.6",
"version": "2.0.7",
"description": "A React component for displaying spinners and loaders",

@@ -33,7 +33,7 @@ "keywords": [

"dependencies": {
"@chakra-ui/utils": "2.0.6",
"@chakra-ui/visually-hidden": "2.0.6"
"@chakra-ui/utils": "2.0.7",
"@chakra-ui/visually-hidden": "2.0.7"
},
"devDependencies": {
"@chakra-ui/system": "2.2.4",
"@chakra-ui/system": "2.2.5",
"react": "^18.0.0"

@@ -51,4 +51,3 @@ },

"build:fast": "JSX=1 tsup src/index.ts"
},
"readme": "# @chakra-ui/spinner\n\nSpinners provide a visual cue that an action is processing, awaiting a course of\nchange or a result.\n\n## Installation\n\n```sh\nyarn add @chakra-ui/spinner\n\n# or\n\nnpm i @chakra-ui/spinner\n```\n\n## Import component\n\n```jsx\nimport { Spinner } from \"@chakra-ui/spinner\"\n```\n\n## Usage\n\n```jsx\n<Spinner />\n```\n\n## Spinner with different sizes\n\nChange the size of the spinner by passing the `size` prop.\n\n```jsx\n<>\n <Spinner size=\"xs\" />\n <Spinner size=\"sm\" />\n <Spinner size=\"md\" />\n <Spinner size=\"lg\" />\n <Spinner size=\"xl\" />\n</>\n```\n\n## Spinner with color\n\nChange the background color of the moving section of the spinner by passing the\n`color` prop.\n\n```jsx\n<Spinner color=\"red.500\" />\n```\n\n## Spinner with empty area color\n\nChange the background color of the spinner by passing the `emptyColor` prop.\n\n```jsx\n<Spinner color=\"red.500\" emptyColor=\"gray.200\" />\n```\n\n## Spinner with different speed\n\nChange the spinner's animation speed area by passing the `speed` prop. The unit\nof the value matches the\n[`animation-duration` CSS property](https://developer.mozilla.org/en-US/docs/Web/CSS/animation-duration)\nproperty.\n\n```jsx\n<Spinner color=\"red.500\" emptyColor=\"gray.200\" speed=\"0.65s\" />\n```\n"
}
}
SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc