open-index/open-npm huggingface dataset:
npm package: @stigg/eslint-config-stigg
Description: ---
Latest version: 0.0.8

# Stigg shared eslint configuration

---

## How to install?

`yarn add -D @stigg/eslint-config-stigg`

### React project:

Install peer dependencies:

```json
{
  "devDependencies": {
    "@typescript-eslint/eslint-plugin": "^5.0.0",
    "@typescript-eslint/parser": "^5.0.0",
    "eslint-config-airbnb": "^18.0.4",
    "eslint-config-airbnb-typescript": "^16.1.0",
    "eslint-config-prettier": "^8.3.0",
    "eslint-plugin-jest": "^25.3.2",
    "eslint-plugin-prettier": "^4.0.0",
    "eslint-plugin-react": "^7.28.0",
    "eslint-plugin-react-hooks": "^4.2.0",
    "eslint-plugin-unused-imports": "^2.0.0"
  }
}
```

Example `.eslintrc.js`:

```js
module.exports = {
  extends: ["@stigg/eslint-config-stigg"],
  parserOptions: {
    project: "tsconfig.json",
  },
  root: true,
  ignorePatterns: ["**/scripts/*", ".eslintrc.js", "craco.config.js"],
  rules: {},
  overrides: [
    {
      files: ["src/types/apiTypes.ts"],
      rules: {
        "no-use-before-define": "off",
      },
    },
  ],
};
```

### Node project:

Install peer dependencies:

```json
{
  "devDependencies": {
    "@typescript-eslint/eslint-plugin": "^5.0.0",
    "@typescript-eslint/parser": "^5.0.0",
    "eslint-config-airbnb-base": "^15.0.0",
    "eslint-config-airbnb-typescript": "^16.1.0",
    "eslint-config-prettier": "^8.3.0",
    "eslint-plugin-jest": "^25.3.2"
  }
}
```

Example `.eslintrc.js`:

```js
module.exports = {
  extends: ["@stigg/eslint-config-stigg/node"],
  parserOptions: {
    project: "tsconfig.json",
  },
  root: true,
  ignorePatterns: [".eslintrc.js"],
  rules: {},
};
```
npm package: @stigg/vue-2-sdk
Description: Stigg SDK for Vue 2 applications.
Latest version: 0.0.6

# @stigg/vue-2-sdk

Stigg SDK for Vue 2 applications.

## Table of contents

- [Installation](#installation)
- [Paywall](#Paywall)
- [Customization](#Customization)

## Installation

Using [npm](https://npmjs.org/)

```bash
npm install @stigg/vue-2-sdk
```

Using [yarn](https://yarnpkg.com/)

```bash
yarn add @stigg/vue-2-sdk
```

## Getting Started

Configure the SDK by wrapping your application in `StiggProvider`:

```vue
<script setup lang="ts">
import {StiggProvider} from '@stigg/vue-2-sdk';

const apiKey = "<STIGG_CLIENT_API_KEY>";
</script>

<template>
   <StiggProvider :apiKey="apiKey">
      <NestedComponents />
   </StiggProvider>
</template>
```

## Paywall

Use Paywall component to render the public pricing page or customer paywall:

```vue
<script setup lang="ts">
import {StiggProvider, PaywallProps} from '@stigg/vue-2-sdk';

const apiKey = "<STIGG_CLIENT_API_KEY>";

const paywall: PaywallProps = {
   onPlanSelected: ({plan}) => {
      console.log(`Selected plan: ${plan.displayName}`);
   }
}
</script>

<template>
   <StiggProvider :apiKey="apiKey">
      <Paywall v-bind="paywall" />
   </StiggProvider>
</template>
```

## Customer Portal

Use the Customer Portal component to provide customers with visibility to their current subscription details:

```vue
<script setup lang="ts">
import {StiggProvider, CustomerPortal, CustomerPortalProps} from '@stigg/vue-2-sdk';

const apiKey = "<STIGG_CLIENT_API_KEY>";

const customerId = "<CUSTOMER-ID>";

const customerPortal: CustomerPortalProps = {
   onManageSubscription: () => {
     console.log('Manage subscription');
   }
}
</script>

<template>
   <StiggProvider :apiKey="apiKey" :customer-id="customerId">
      <CustomerPortal v-bind="customerPortal"/>
   </StiggProvider>
</template>
```
npm package: @stigg/vue-sdk
Description: Stigg SDK for Vue 3 applications.
Latest version: 7.0.0

# @stigg/vue-sdk

Stigg SDK for Vue 3 applications.

## Table of contents

- [Installation](#installation)
- [Paywall](#Paywall)
- [Customization](#Customization)

## Installation

Using [npm](https://npmjs.org/)

```bash
npm install @stigg/vue-sdk
```

Using [yarn](https://yarnpkg.com/)

```bash
yarn add @stigg/vue-sdk
```

## Getting Started

Configure the SDK by wrapping your application in `StiggProvider`:

```vue
<script setup lang="ts">
import { StiggProvider, StiggProviderProps } from '@stigg/vue-sdk';

const stiggProvider: StiggProviderProps = {
   apiKey: "<STIGG_CLIENT_API_KEY>",
};

</script>

<template>
   <StiggProvider v-bind="stiggProvider">
      <NestedComponents />
   </StiggProvider>
</template>
```

Or in a context of a specific customer:

```vue
<script setup lang="ts">
import { StiggProvider, StiggProviderProps } from '@stigg/vue-sdk';

const stiggProvider: StiggProviderProps = {
  apiKey: "<STIGG_CLIENT_API_KEY>",
  customerId: "<CUSTOMER_ID>",
};

</script>

<template>
   <StiggProvider v-bind="stiggProvider">
      <NestedComponents />
   </StiggProvider>
</template>
```

## Paywall

Use Paywall component to render the public pricing page or customer paywall:

```vue
<script setup lang="ts">
import { Paywall, PaywallProps } from '@stigg/vue-sdk';

const paywall: PaywallProps = {
   onPlanSelected: ({plan}) => {
      console.log(`Selected plan: ${plan.displayName}`);
   }
};

</script>

<template>
  <Paywall v-bind="paywall" />
</template>
```

## Customer Portal

Use the Customer Portal component to provide customers with visibility to their current subscription details:

```vue
<script setup lang="ts">
import { CustomerPortal, CustomerPortalProps, Paywall, PaywallProps } from '@stigg/vue-sdk';

const customerPortal: CustomerPortalProps = {
   onManageSubscription: () => {
     console.log('Manage subscription');
   }
};

const paywall: PaywallProps = {
  onPlanSelected: ({plan}) => {
    console.log(`Selected plan: ${plan.displayName}`);
  }
};

</script>

<template>
  <CustomerPortal v-bind="customerPortal">
    <template v-slot:paywall-component>
      <Paywall v-bind="paywall" />
    </template>
  </CustomerPortal>
</template>
```