@quikturn/logos 0.5.0 → 0.7.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/README.md +130 -4
  2. package/package.json +2 -2
package/README.md CHANGED
@@ -4,10 +4,14 @@ TypeScript SDK for the [Quikturn Logos API](https://getquikturn.io) -- fetch any
4
4
 
5
5
  **[Get your API key](https://getquikturn.io)** -- free tier available, no credit card required.
6
6
 
7
- | Package | Description | |
8
- |---------|-------------|-|
7
+ | Package | Description | Install |
8
+ |---------|-------------|---------|
9
9
  | [`@quikturn/logos`](https://www.npmjs.com/package/@quikturn/logos) | Core SDK -- URL builder, browser client, server client, web component | `pnpm add @quikturn/logos` |
10
10
  | [`@quikturn/logos-react`](https://www.npmjs.com/package/@quikturn/logos-react) | React components -- logo, carousel, grid | `pnpm add @quikturn/logos-react` |
11
+ | [`@quikturn/logos-next`](https://www.npmjs.com/package/@quikturn/logos-next) | Next.js -- `next/image` wrapper, loaders, server helpers | `pnpm add @quikturn/logos-next` |
12
+ | [`@quikturn/logos-vue`](https://www.npmjs.com/package/@quikturn/logos-vue) | Vue 3 components -- logo, carousel, grid, plugin | `pnpm add @quikturn/logos-vue` |
13
+ | [`@quikturn/logos-svelte`](https://www.npmjs.com/package/@quikturn/logos-svelte) | Svelte 5 components -- logo, carousel, grid, runes | `pnpm add @quikturn/logos-svelte` |
14
+ | [`@quikturn/logos-angular`](https://www.npmjs.com/package/@quikturn/logos-angular) | Angular 17+ -- standalone components, signals, pipe | `pnpm add @quikturn/logos-angular` |
11
15
 
12
16
  ---
13
17
 
@@ -29,7 +33,16 @@ pnpm add @quikturn/logos
29
33
  | **Browser** | `@quikturn/logos/client` | Blob URLs, retry/backoff, scrape polling, events |
30
34
  | **Server** | `@quikturn/logos/server` | Buffer output, streaming, batch operations |
31
35
  | **Element** | `@quikturn/logos/element` | `<quikturn-logo>` web component with built-in attribution |
32
- | **React** | `@quikturn/logos-react` | `<QuikturnLogo>`, `<QuikturnLogoCarousel>`, `<QuikturnLogoGrid>` |
36
+
37
+ ### Framework Packages
38
+
39
+ | Package | Import | Framework |
40
+ |---------|--------|-----------|
41
+ | **React** | `@quikturn/logos-react` | React 18+ -- components, hooks, context |
42
+ | **Next.js** | `@quikturn/logos-next` | Next.js 14+ -- `next/image` wrapper, server helpers |
43
+ | **Vue** | `@quikturn/logos-vue` | Vue 3.3+ -- SFCs, composables, plugin |
44
+ | **Svelte** | `@quikturn/logos-svelte` | Svelte 5 -- runes, snippets, context |
45
+ | **Angular** | `@quikturn/logos-angular` | Angular 17+ -- standalone components, signals, pipe |
33
46
 
34
47
  ---
35
48
 
@@ -134,7 +147,116 @@ function App() {
134
147
  }
135
148
  ```
136
149
 
137
- Full React API reference: [`@quikturn/logos-react` docs](./packages/react/README.md)
150
+ Full API reference: [`@quikturn/logos-react` docs](./packages/react/README.md)
151
+
152
+ ### Next.js
153
+
154
+ ```bash
155
+ pnpm add @quikturn/logos-next
156
+ ```
157
+
158
+ ```tsx
159
+ import { QuikturnProvider, QuikturnImage } from "@quikturn/logos-next";
160
+
161
+ export default function Page() {
162
+ return (
163
+ <QuikturnProvider token="qt_your_key">
164
+ <QuikturnImage domain="github.com" width={128} height={128} alt="GitHub" />
165
+ </QuikturnProvider>
166
+ );
167
+ }
168
+ ```
169
+
170
+ Full API reference: [`@quikturn/logos-next` docs](./packages/next/README.md)
171
+
172
+ ### Vue
173
+
174
+ ```bash
175
+ pnpm add @quikturn/logos-vue
176
+ ```
177
+
178
+ ```vue
179
+ <script setup lang="ts">
180
+ import { QuikturnLogo, QuikturnLogoCarousel } from "@quikturn/logos-vue";
181
+ </script>
182
+
183
+ <template>
184
+ <QuikturnLogo domain="github.com" :size="64" />
185
+
186
+ <QuikturnLogoCarousel
187
+ :domains="['github.com', 'stripe.com', 'vercel.com', 'figma.com']"
188
+ :speed="120"
189
+ fade-out
190
+ pause-on-hover
191
+ />
192
+ </template>
193
+ ```
194
+
195
+ Full API reference: [`@quikturn/logos-vue` docs](./packages/vue/README.md)
196
+
197
+ ### Svelte
198
+
199
+ ```bash
200
+ pnpm add @quikturn/logos-svelte
201
+ ```
202
+
203
+ ```svelte
204
+ <script>
205
+ import { QuikturnProvider, QuikturnLogo, QuikturnLogoCarousel } from "@quikturn/logos-svelte";
206
+ </script>
207
+
208
+ <QuikturnProvider token="qt_your_key">
209
+ <QuikturnLogo domain="github.com" size={64} />
210
+
211
+ <QuikturnLogoCarousel
212
+ domains={["github.com", "stripe.com", "vercel.com", "figma.com"]}
213
+ speed={120}
214
+ fadeOut
215
+ pauseOnHover
216
+ />
217
+ </QuikturnProvider>
218
+ ```
219
+
220
+ Full API reference: [`@quikturn/logos-svelte` docs](./packages/svelte/README.md)
221
+
222
+ ### Angular
223
+
224
+ ```bash
225
+ pnpm add @quikturn/logos-angular
226
+ ```
227
+
228
+ ```typescript
229
+ // app.config.ts
230
+ import { provideQuikturnLogos } from "@quikturn/logos-angular";
231
+
232
+ export const appConfig = {
233
+ providers: [provideQuikturnLogos({ token: "qt_your_key" })],
234
+ };
235
+ ```
236
+
237
+ ```typescript
238
+ import { Component } from "@angular/core";
239
+ import { QuikturnLogoComponent, QuikturnLogoCarouselComponent } from "@quikturn/logos-angular";
240
+
241
+ @Component({
242
+ selector: "app-example",
243
+ standalone: true,
244
+ imports: [QuikturnLogoComponent, QuikturnLogoCarouselComponent],
245
+ template: `
246
+ <quikturn-logo domain="github.com" [size]="64" />
247
+
248
+ <quikturn-logo-carousel
249
+ [domains]="['github.com', 'stripe.com', 'vercel.com', 'figma.com']"
250
+ [speed]="120"
251
+ [fadeOut]="true"
252
+ [pauseOnHover]="true"
253
+ />
254
+ `,
255
+ })
256
+ export class ExampleComponent {}
257
+ ```
258
+
259
+ Full API reference: [`@quikturn/logos-angular` docs](./packages/angular/README.md)
138
260
 
139
261
  ---
140
262
 
@@ -372,6 +494,10 @@ Rate limits and monthly quotas are enforced server-side and vary by plan. The SD
372
494
  - **[Dashboard](https://getquikturn.io/dashboard)** -- usage analytics, key management, plan upgrades
373
495
  - **[Pricing](https://getquikturn.io/pricing)** -- free tier, pro, and enterprise plans
374
496
  - **[React components](./packages/react/README.md)** -- `@quikturn/logos-react` docs
497
+ - **[Next.js components](./packages/next/README.md)** -- `@quikturn/logos-next` docs
498
+ - **[Vue components](./packages/vue/README.md)** -- `@quikturn/logos-vue` docs
499
+ - **[Svelte components](./packages/svelte/README.md)** -- `@quikturn/logos-svelte` docs
500
+ - **[Angular components](./packages/angular/README.md)** -- `@quikturn/logos-angular` docs
375
501
  - **[GitHub](https://github.com/Quikturn-PowerPoint-Add-In/Logo-SDK)** -- source, issues, contributions
376
502
 
377
503
  ## License
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@quikturn/logos",
3
- "version": "0.5.0",
3
+ "version": "0.7.0",
4
4
  "description": "Quikturn Logo SDK — URL builder, browser client, and server client for the Quikturn Logos API",
5
5
  "license": "MIT",
6
6
  "author": "Quikturn",
@@ -26,7 +26,7 @@
26
26
  ],
27
27
  "packageManager": "pnpm@10.28.1",
28
28
  "engines": {
29
- "node": ">=18"
29
+ "node": ">=20"
30
30
  },
31
31
  "files": [
32
32
  "dist",