New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More →
Socket
Sign inDemoInstall
Socket
Sign inDemoInstall

@chakra-ui/visually-hidden

Package Overview
Dependencies
Maintainers
3
Versions
411
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@chakra-ui/visually-hidden - npm Package Compare versions

Comparing version

2.0.5
to
2.0.6

dist/index.cjs.js
dist/index.d.ts
dist/index.esm.js

17

package.json
{
"name": "@chakra-ui/visually-hidden",
"version": "2.0.5",
"version": "2.0.6",
"description": "A React component that visually hides its content",

@@ -23,4 +23,4 @@ "keywords": [

"license": "MIT",
"main": "dist/index.js",
"module": "dist/index.mjs",
"main": "dist/index.cjs.js",
"module": "dist/index.esm.js",
"types": "dist/index.d.ts",

@@ -42,7 +42,7 @@ "files": [

"devDependencies": {
"@chakra-ui/system": "2.2.3",
"@chakra-ui/system": "2.2.4",
"react": "^18.0.0"
},
"dependencies": {
"@chakra-ui/utils": "2.0.5"
"@chakra-ui/utils": "2.0.6"
},

@@ -54,8 +54,9 @@ "peerDependencies": {

"scripts": {
"build": "tsup src/index.ts --format=esm,cjs --dts",
"build": "JSX=1 tsup src/index.ts --dts",
"dev": "pnpm build -- --watch",
"clean": "rimraf dist .turbo",
"typecheck": "tsc --noEmit",
"build:fast": "tsup src/index.ts --format=esm,cjs"
}
"build:fast": "JSX=1 tsup src/index.ts"
},
"readme": "# @chakra-ui/visually-hidden\n\nThe visually hidden component styles itself so that it’s content is not visible,\nbut it is available to assistive technologies like screen readers and other text\nto speech programs.\n\n## Installation\n\n```sh\nyarn add @chakra-ui/visually-hidden\n\n# or\n\nnpm i @chakra-ui/visually-hidden\n```\n\n## Import component\n\n```jsx\nimport { VisuallyHidden } from \"@chakra-ui/visually-hidden\"\n```\n\n## Basic usage\n\n```jsx\n// it renders a `span` by default\n<VisuallyHidden>This content will be hidden on screen</VisuallyHidden>\n\n// for visually hidden input fields\n<VisuallyHiddenInput type=\"checkbox\" defaultChecked/>\n```\n\n## References\n\n- https://snook.ca/archives/html_and_css/hiding-content-for-accessibility\n- https://a11yproject.com/posts/how-to-hide-content/\n"
}