# @sky.ui.pro/core

Pro-tier Lit web components for Sky UI. Extends the free catalog with advanced inputs, navigation, and layout components.

Requires an active Sky UI Pro subscription. Install alongside `@sky.ui/core` when your app uses both tiers.

## Install

```bash
npx sky.ui.pro login
npx sky.ui.pro install
```

Or install manually, then hydrate:

```bash
npm install "@sky.ui.pro/core"
npx sky.ui.pro install --framework=core
```

> Quote scoped names (`"@sky.ui/…"`) — required in PowerShell. See [powershell-scoped-packages.md](https://gitlab.com/sky_ui/sky-ui/-/blob/main/docs/powershell-scoped-packages.md).

For CI/CD:

```bash
SKY_UI_AUTH_TOKEN=sk_ci_… npx sky.ui.pro install --yes --framework=core
```

Manage tokens on your [Sky UI account](https://sky-ui.com/account). No `.npmrc` file is required.

| Token | Use |
|-------|-----|
| Personal (`sk_pt_…`) | Local development and MCP |
| CI/CD (`sk_ci_…`) | Pipelines (`SKY_UI_AUTH_TOKEN`) |

After hydration, runtime peers match `@sky.ui/core` (`lit`, `@lit-labs/motion`, `@lit-labs/virtualizer`, `@lit/context`, `d3`, `three`). Stub `peerDependencies` list `@sky.ui/core` (and optional `lit`); install the full Core peer set so Vite does not stub empty modules.

## Quick start

```js
import { SkyKanban } from '@sky.ui.pro/core';
```

```html
<sky-kanban></sky-kanban>
```

Import only the Pro components you use for tree-shaken production bundles.

Per-component paths are also supported:

```js
import '@sky.ui.pro/core/sky-kanban';
```

## Auto-import resolvers

Use resolvers from `@sky.ui.pro/core/auto-import` with `unplugin-vue-components` or your bundler's component plugin, alongside the free-tier setup in [`@sky.ui/core`](https://www.npmjs.com/package/@sky.ui/core).

## Bundler plugins (Vite, Webpack, Rollup)

Pro packages mirror the free-tier plugin surface. Bundler plugins auto-import components and **validate your access token at build/dev time** (no runtime checks in shipped apps).

**Vite** (`@sky.ui.pro/core/vite`):

```js
import { SkyUIProMainVitePlugin } from '@sky.ui.pro/core/vite';

export default {
  plugins: [
    SkyUIProMainVitePlugin({
      mode: 'auto-import', // or 'vue' with unplugin-vue-components
    }),
  ],
};
```

**Webpack** (`@sky.ui.pro/core/webpack`): `SkyUIProMainWebpackPlugin()`

**Rollup** (`@sky.ui.pro/core/rollup`): `SkyUIProMainRollupPlugin({ mode: 'auto-import' })`

Vue / React Pro wrappers expose the same three bundlers at `@sky.ui.pro/vue/vite|webpack|rollup` and `@sky.ui.pro/react/vite|webpack|rollup`.

For resolver-only setup, use `@sky.ui.pro/core/auto-import` with `unplugin-vue-components`, alongside [`@sky.ui/core`](https://www.npmjs.com/package/@sky.ui/core) bundler plugins for free components.

## Framework wrappers

| Package | Description |
|---------|-------------|
| [`@sky.ui.pro/vue`](https://www.npmjs.com/package/@sky.ui.pro/vue) | Vue 3 SFC wrappers |
| [`@sky.ui.pro/react`](https://www.npmjs.com/package/@sky.ui.pro/react) | React wrappers |

Free-tier equivalents: [`@sky.ui/vue`](https://www.npmjs.com/package/@sky.ui/vue), [`@sky.ui/react`](https://www.npmjs.com/package/@sky.ui/react).

## Custom Elements Manifest

Component metadata is published at `@sky.ui.pro/core/custom-elements.json`.

## Updates window

Annual plans include one year of updates. You keep using versions released during your active window even after it ends; renew to receive newer releases.

## License

[Sky UI Pro Commercial License](https://unpkg.com/@sky.ui.pro/core/LICENSE.md) — requires an active Sky UI Pro subscription.

Documentation: [sky-ui.com](https://sky-ui.com)
