Initial commit

Author: Sertaç Karahoda

.babelrc

@@ -0,0 +1,16 @@
+{
+    "presets": [
+        "@babel/preset-typescript",
+        [
+            "@babel/preset-env",
+            {
+                "useBuiltIns": "usage",
+                "corejs": 3
+            }
+        ]
+    ],
+    "plugins": [
+        "@babel/plugin-transform-typescript",
+        "@babel/proposal-class-properties"
+    ]
+}

.github/workflows/publish.yaml

@@ -0,0 +1,44 @@
+on:
+  release:
+    types:
+      - published
+
+name: Publish
+
+env:
+  VERSION: ${{ github.event.release.tag_name }}
+  NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}
+
+jobs:
+  publish:
+    name: Publish
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: SubscriptionCheckout
+        uses: actions/checkout@v2
+
+      - name: Use Node.js 16
+        uses: actions/setup-node@v2
+        with:
+          node-version: '16.0.0'
+          registry-url: 'https://registry.npmjs.org'
+
+      - uses: actions/cache@v2
+        with:
+          path: ~/.npm
+          key: ${{ runner.os }}-node-${{ hashFiles('**/package-lock.json') }}
+          restore-keys: |
+            ${{ runner.os }}-node-
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: Build package
+        run: npm run build
+
+      - name: Set version
+        run: npm version $VERSION --no-git-tag-version
+
+      - name: Publish
+        run: npm publish --access public

.gitignore

@@ -0,0 +1,6 @@
+.idea/
+
+dist/
+node_modules/
+
+.DS_Store

.npmignore

@@ -0,0 +1,2 @@
+*
+!dist/**

.nvmrc

@@ -0,0 +1 @@
+v16.0.0

LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2021 Zeplin
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

README.md

@@ -0,0 +1,80 @@
+# Zeplin JavaScript SDK
+[![@latest](https://img.shields.io/npm/v/@zeplin/sdk.svg)](https://www.npmjs.com/package/@zeplin/sdk)
+[![@latest](https://img.shields.io/npm/l/@zeplin/sdk.svg)](https://www.npmjs.com/package/@zeplin/sdk)
+
+Official JavaScript interface to the [Zeplin API](https://docs.zeplin.dev). It works in both Node.js and web browser environments.
+
+## Installation
+
+```
+npm install @zeplin/sdk
+```
+
+or
+
+```
+yarn add @zeplin/sdk
+```
+
+## Getting started
+
+To get started with the SDK, you can create a personal access token from the web app under [Developer](https://app.zeplin.io/profile/developer) tab in your profile page.
+
+You can use this token to make API calls for your own Zeplin account.
+
+```js
+import { ZeplinApi, Configuration } "@zeplin/sdk";
+
+const zeplinClient = new ZeplinApi(new Configuration({ accessToken: "ACCESS_TOKEN" }));
+
+const me = await zeplinClient.getCurrentUser();
+
+```
+
+### OAuth
+If you want to build an application for other Zeplin users, you can also create a Zeplin app the [profile page](https://app.zeplin.io/profile/developer).
+
+
+Check out this [example](./examples/oauth-app) to see how you can implement an OAuth flow using the SDK.
+
+## Usage
+
+The SDK exposes Zeplin API endpoints as methods. These methods are grouped into namespace objects by the type of object they interact with.
+
+For example:
+```js
+import { ZeplinApi, Configuration, ScreenNoteColorNameEnum } "@zeplin/sdk";
+
+const zeplinClient = new ZeplinApi(new Configuration({ accessToken: "ACCESS_TOKEN" }));
+
+// Get colors in the styleguide
+zeplinClient.colors.getStyleguideColors("STYLEGUIDE_ID");
+
+// Add a note on the screen
+zeplinClient.screens.createScreenNote("PROJECT_ID", "SCREEN_ID", {
+    content: "Çaylar filiz! :turkish_tea:",
+    position: { x: 0.1, y: 0.1 },
+    color: ScreenNoteColorNameEnum.DEEP_PURPLE
+});
+
+// Invite a member to the workspace
+zeplinClient.organizations.inviteOrganizationMember("ORGANIZATION_ID", {
+    handle: "rooolan",
+    role: "editor"
+});
+```
+
+Check out the [API documentation](https://docs.zeplin.dev/reference) for complete list of endpoints and groups.
+
+## Examples
+
+- [Command-line app using personal access token](./examples/cli-with-personal-access-token)
+- [Simple OAuth application](./examples/oauth-app)
+
+## License
+
+The project is available as open source under the terms of the [MIT License](LICENSE).
+
+## Need help?
+
+Ping us at [email protected] for any feedback or questions. You can also find us in the [Zeplin Developer Slack](https://zpl.io/zeplin-dev-slack) group!

examples/cli-with-personal-access-token/.gitignore

@@ -0,0 +1,10 @@
+# dependencies
+/node_modules
+
+# misc
+.DS_Store
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*

examples/cli-with-personal-access-token/index.js

@@ -0,0 +1,15 @@
+const { ZeplinApi, Configuration } = require("@zeplin/sdk");
+
+const accessToken = process.env.ZEPLIN_ACCESS_TOKEN;
+
+const configuration = new Configuration({ accessToken });
+
+const zeplinApi = new ZeplinApi(configuration);
+
+
+zeplinApi.users.getCurrentUser()
+    .then(({ data }) => console.log(JSON.stringify(data, null, 2)));
+
+zeplinApi.projects.getProjects({status: "active" })
+    .then(({ data }) => console.log(JSON.stringify(data, null, 2)));
+

examples/cli-with-personal-access-token/package-lock.json

@@ -0,0 +1,14 @@
+{
+  "name": "personal-access-token-example",
+  "private": true,
+  "version": "0.0.0",
+  "description": "Example for personal access token",
+  "main": "index.js",
+  "scripts": {
+    "start": "node index.js"
+  },
+  "license": "MIT",
+  "dependencies": {
+    "@zeplin/sdk": "../.."
+  }
+}

examples/cli-with-personal-access-token/package.json

@@ -0,0 +1,69 @@
+const express = require("express");
+const { ZeplinApi, Configuration } = require("@zeplin/sdk");
+
+const PORT = 3000;
+const CLIENT_ID = "CLIENT_ID";
+const CLIENT_SECRET = "CLIENT_SECRET";
+const REDIRECT_URI = "http://localhost:3000/oauth/callback";
+
+const app = express();
+
+function htmlPage(content) {
+    return `<!DOCTYPE html>
+<html lang="en">
+    <head>
+    <meta charset="utf-8">
+    <title>Zeplin app</title>
+    </head>
+    <body>
+        ${content}
+    </body>
+</html>`
+}
+
+app.get("/", (req, res) => {
+    res.set("Content-Type", "text/html");
+    res.send(
+        htmlPage(`<p>
+            Heyo Zepliner! 🙋<br><br>
+            Click <a href="/oauth/authorize">here</a> to authorize this app.
+        </p>`)
+    );
+});
+
+app.get("/oauth/authorize", (req, res) => {
+    const zeplinClient = new ZeplinApi();
+
+    res.redirect(zeplinClient.authorization.getAuthorizationUrl({
+        clientId: CLIENT_ID,
+        redirectUri: REDIRECT_URI
+    }));
+});
+
+app.get("/oauth/callback", async (req, res) => {
+    const authCode = req.query.code;
+    let zeplinClient = new ZeplinApi();
+
+    // Create an access token using the authorization code
+    const { data: tokenData } = await zeplinClient.authorization.createToken({
+        code: authCode,
+        clientId: CLIENT_ID,
+        redirectUri: REDIRECT_URI,
+        clientSecret: CLIENT_SECRET
+    });
+
+    // Get current user's details
+    zeplinClient = new ZeplinApi(new Configuration({ accessToken: tokenData.accessToken }))
+    const { data: userData } = await zeplinClient.users.getCurrentUser();
+
+    res.set("Content-Type", "text/html");
+    res.send(
+        htmlPage(`<p>
+            Welcome back, <strong>${userData.username}</strong>! 🙋
+        </p>`)
+    );
+});
+
+app.listen(PORT, () => {
+    console.log(`App listening at http://localhost:${PORT}`);
+});