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

@atoms-studio/nuxt-components

Package Overview
Dependencies
Maintainers
6
Versions
46
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@atoms-studio/nuxt-components - npm Package Compare versions

Comparing version 0.0.0-55830e3 to 0.0.0-bcf42fb

dist/module.cjs

55

package.json

@@ -7,46 +7,35 @@ {

},
"version": "0.0.0-55830e3",
"version": "0.0.0-bcf42fb",
"license": "MIT",
"files": [
"dist"
],
"main": "./dist/components.umd.js",
"module": "./dist/components.es.js",
"type": "module",
"exports": {
".": {
"import": "./dist/components.es.js",
"require": "./dist/components.umd.js"
},
"./dist/style.css": {
"import": "./dist/style.css",
"require": "./dist/style.css"
"import": "./dist/module.mjs",
"require": "./dist/module.cjs"
}
},
"style": "./dist/style.css",
"engines": {
"node": ">=16.0.0"
},
"types": "./dist/index.d.ts",
"main": "./dist/module.cjs",
"types": "./dist/types.d.ts",
"files": [
"dist"
],
"scripts": {
"dev": "vite",
"build": "vue-tsc --noEmit && vite build && yarn build:declarations",
"build:declarations": "vue-tsc src/index.ts --declaration --emitDeclarationOnly --outDir ./dist",
"prepack": "nuxt-module-build",
"dev": "nuxi dev playground",
"dev:build": "nuxi build playground",
"dev:prepare": "nuxt-module-build --stub && nuxi prepare playground",
"test": "vitest --environment jsdom",
"test:ci": "vitest run --environment jsdom",
"coverage": "vitest run --coverage --environment jsdom",
"typecheck": "vue-tsc --noEmit -p tsconfig.vitest.json --composite false",
"lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix --ignore-path .gitignore"
"devGitHubAction": "nuxi dev playground --port=5050",
"build": "yarn dev:prepare && yarn prepack"
},
"peerDependencies": {
"vue": "^3.2.31",
"vue-router": "^4.0.12"
"dependencies": {
"@nuxt/kit": "^3.0.0-rc.1",
"@nuxt/schema": "^3.0.0-rc.3"
},
"devDependencies": {
"vite-dts": "^1.0.4",
"vue": "^3.2.31",
"vue-router": "^4.0.13"
},
"dependencies": {
"@atoms-studio/composables": "0.0.0-55830e3"
"@nuxt/module-builder": "latest",
"@nuxtjs/eslint-config-typescript": "^10.0.0",
"eslint": "latest",
"nuxt": "npm:nuxt3@latest"
}
}

64

README.md

@@ -1,64 +0,6 @@

# Atoms UI Kit / 🎨 Components
# Nuxt Module
Unstyled components that cover most common UI patterns.<br>
Uses Vite in lib mode to build for production.<br>
Uses Vitest to run unit tests.
## Installation
```bash
yarn add @atoms-studio/nuxt-components
```
Then in your Nuxt 3 project you should import your Nuxt component like this:
```ts
<template>
<div class="wrapper-image-component">
<AppPicture
:image="image"
:focal-point="focalPoint"
:base64="base"
sizes="md:500px xl:100vw"
/>
</div>
</template>
<script>
import '@atoms-studio/nuxt-components/dist/style.css'
import { AppPicture } from '@atoms-studio/nuxt-components'
export default {
components: {
AppPicture,
},
data() {
return {
image: {
url: 'https://images.ctfassets.net/w2dr5qwt1rrm/2QTfowm3D2kbkTdoUTtTv2/57fc815c23c0be887f44675413372580/LAxBR_2020.11.12_Final_Product_KV_RVB.jpg',
width: 2500,
height: 1236,
},
focalPoint: {
x: 1264,
y: 677,
},
base: 'data:image/jpeg;base64,/9j/2wBDABQODxIPDRQSEBIXFRQYHjIhHhwcHj0sLiQySUBMS0dARkVQWnNiUFVtVkVGZIhlbXd7gYKBTmCNl4x9lnN+gXz/2wBDARUXFx4aHjshITt8U0ZTfHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHz/wAARCAAIABADASIAAhEBAxEB/8QAFgABAQEAAAAAAAAAAAAAAAAAAAIE/8QAGxAAAgEFAAAAAAAAAAAAAAAAAAEDAhETMTP/xAAUAQEAAAAAAAAAAAAAAAAAAAAD/8QAFREBAQAAAAAAAAAAAAAAAAAAABH/2gAMAwEAAhEDEQA/AN80aeqyMDt0QAEM/9k=',
}
},
}
</script>
```
## Development
- Components must be written in Typescript
- You can use templates or render functions as you please.
- You can use composables from the [📦 Composables](https://github.com/atoms-studio/ui-kit/tree/next/packages/composables) package.
- You can use Options API, Composition API, `<script setup>` as you see fit.
- Every component must have a unit test suite in the `tests` folder named after it, ie: `test/<componentName>.test.ts`.<br>
- Every component must have an example app in the [ℹ️ Examples](https://github.com/atoms-studio/ui-kit/tree/next/packages/examples) package.
- Every component must have an E2E test that consumes the example app.
To execute unit tests, run `yarn test` in the `packages/nuxt-components` folder.<br>
- Run `npm run dev:prepare` to generate type stubs.
- Use `npm run dev` to start [playground](./playground) in development mode.
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