@microsoft/atlas-js - npm Package Compare versions

Comparing version 0.0.1 to 1.0.1

dist/index.js

@@ -1,1 +0,1 @@
-(()=>{function d(e=document.body){e.addEventListener("toggle",n=>{let r=n.target instanceof Element&&n.target.closest("details.popover")||n.target instanceof Element&&n.target.shadowRoot?.activeElement?.closest("details.popover");if(!r||!r.open)return;let i=o=>{o.key==="Escape"&&s()},t=o=>{o.target instanceof Element&&(r?.contains(o.target)||s(),o.type==="click"&&o.target.closest("[data-popover-close]")&&s())},a=()=>{document.activeElement?.nodeName?.toLowerCase()==="iframe"&&s()},s=()=>{e.removeEventListener("focus",t,!0),e.removeEventListener("click",t),e.removeEventListener("touchstart",t),e.removeEventListener("keydown",i),window.removeEventListener("blur",a),r?.open&&r.removeAttribute("open")};e.addEventListener("focus",t,!0),e.addEventListener("click",t),e.addEventListener("touchstart",t),e.addEventListener("keydown",i),window.addEventListener("blur",a)},!0)}d();})();
+export * from './behaviors/popover';

package.json

 {
 	"name": "@microsoft/atlas-js",
-	"version": "0.0.1",
+	"version": "1.0.1",
 	"public": true,
 	"description": "Scripts backing the Atlas Design System used by Microsoft's Developer Relations.",
 	"scripts": {
-		"browserstack-test": "karma start --single-run --no-auto-watch --browsers \"Edge on Windows 10\",\"Chrome on Windows 10\",\"Safari on Mac Catalina\"",
-		"build": "node \"./esbuild.js\"",
-		"bundlesize": "bundlesize",
-		"compile": "tsc --project . --noEmit",
+		"build": "tsc --project \"./tsconfig.json\" --outDir \"./dist\" --declaration true --declarationMap true",
 		"lint": "eslint . --ext .ts",
 		"prebuild": "rimraf dist",
-		"start": "node \"./esbuild.js\" --watch",
 		"test": "echo \"Error: no test specified\" && exit 1",
-		"build:scripts": "parcel build src/index.ts --no-cache --no-autoinstall",
-		"tokens": "node ./tokens/index.js",
-		"prepublishOnly": "npm run build"
+		"prepublishOnly": "npm run lint && npm run build"
 	},
@@ -41,4 +35,2 @@ "homepage": "https://github.com/microsoft/atlas-design",
 	"devDependencies": {
-		"bundlesize": "^0.18.1",
-		"esbuild": "^0.14.18",
 		"eslint": "^8.8.0",
@@ -45,0 +37,0 @@ "eslint-plugin-import": "^2.25.4",

README.md

 # Atlas JS
 
-[TBD]
+Welcome to TypeScript/JavaScript code backing the Atlas Design system. While Atlas endeavors to find CSS-only strategies for creating modern UI patterns, there are times when writing behavior code is necessary. These cases tend to fall into a one of several categories.
+
+- A component's markup / attributes require changing upon interaction for compatibility with screen readers or other assistive technology.
+- A particular pattern is a good candidate for a re-usable web component. That is, its behavior is relatively straightforward and lightweight.
+
+## Installing this package
+
+Install the `@microsoft/atlas-js` package in your project's dependencies.
+
+```
+npm i @microsoft/atlas-js;
+```
+
+## Accesssing its Typescript through the `src` folder
+
+Include the index file directly to add behaviors to your scripts.
+
+```ts
+import '@microsoft/atlas-js/src/index';
+```
+
+## Accessing the built JS through the `dist` folder
+
+```js
+import '@microsoft/atlas-js/dist/index';
+```
+
+Or include a script tag to pull the built JavaScript from UNPKG.
+
+```html
+<script src="https://unpkg.com/@microsoft/atlas-js@0.0.1/dist/index.js" type="module" defer>
+```

src/index.ts

@@ -1,3 +0,1 @@
-import { initPopover } from './components/popover';
-
-initPopover();
+export * from './behaviors/popover';

Fixed alerts

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

6648

increased by54.03%

Dev dependency count

8

decreased by-20%

Number of package files

10

increased by100%

Lines of code

107

increased by78.33%

Number of low quality alerts

1

decreased by-50%

Number of lines in readme file

35

increased by775%

No dependency changes