react-api-samples 0.1.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 (5) hide show
  1. package/README.md +264 -0
  2. package/dist/index.cjs +106 -0
  3. package/dist/index.d.ts +87 -0
  4. package/dist/index.mjs +829 -0
  5. package/package.json +42 -0
package/README.md ADDED
@@ -0,0 +1,264 @@
1
+ # react-api-samples
2
+
3
+ Render multi-language API request code samples from a simple config object. No OpenAPI required.
4
+
5
+ Drop in a single component and get syntax-highlighted, copy-able code snippets for **JavaScript**, **Python**, **cURL**, **Java**, and **PHP** — all generated from one config.
6
+
7
+ ## Install
8
+
9
+ ```bash
10
+ npm install react-api-samples
11
+ ```
12
+
13
+ Peer dependencies: `react >=18`, `react-dom >=18`, and `prismjs >=1.29`.
14
+
15
+ ## Quick Start
16
+
17
+ ```tsx
18
+ import { ApiSamples } from 'react-api-samples';
19
+
20
+ function Docs() {
21
+ return (
22
+ <ApiSamples
23
+ config={{
24
+ method: 'POST',
25
+ url: 'https://api.example.com/v1/items',
26
+ headers: {
27
+ Authorization: 'Bearer YOUR_API_KEY',
28
+ 'Content-Type': 'application/json',
29
+ },
30
+ body: {
31
+ title: 'Example item',
32
+ quantity: 1,
33
+ },
34
+ }}
35
+ />
36
+ );
37
+ }
38
+ ```
39
+
40
+ That's it. You get a tabbed code viewer with syntax highlighting, a copy button, and a dark theme — zero config.
41
+
42
+ ## Props
43
+
44
+ ### `<ApiSamples />`
45
+
46
+ | Prop | Type | Default | Description |
47
+ |------|------|---------|-------------|
48
+ | `config` | `ApiSampleConfig` | *required* | The API request to generate samples for. |
49
+ | `languages` | `SupportedLanguage[]` | `['javascript','python','curl']` | Which languages to show. |
50
+ | `defaultLanguage` | `SupportedLanguage` | `'javascript'` | Tab selected on first render. |
51
+ | `theme` | `'light' \| 'dark'` | `'dark'` | Color theme. |
52
+ | `environment` | `'dev' \| 'prod'` | `'prod'` | Initial environment when using environment URLs. |
53
+ | `variant` | `'classic' \| 'minimal' \| 'terminal' \| VariantComponent` | `'classic'` | Layout variant. |
54
+ | `className` | `string` | — | CSS class applied to the outer container. |
55
+
56
+ ### `ApiSampleConfig`
57
+
58
+ ```ts
59
+ {
60
+ method: 'GET' | 'POST' | 'PUT' | 'PATCH' | 'DELETE';
61
+ url: string | { dev: string; prod: string };
62
+
63
+ headers?: Record<string, string>;
64
+ query?: Record<string, string | number>;
65
+ body?: unknown;
66
+
67
+ title?: string;
68
+ description?: string;
69
+ variables?: Record<string, string>;
70
+ }
71
+ ```
72
+
73
+ ## Layout Variants
74
+
75
+ Three built-in layouts with completely different visual designs. Each supports both `dark` and `light` themes.
76
+
77
+ ### Classic (default)
78
+
79
+ Bordered card with tab bar and header section.
80
+
81
+ ```tsx
82
+ <ApiSamples config={config} variant="classic" />
83
+ ```
84
+
85
+ ### Minimal
86
+
87
+ Borderless, compact layout with pill-shaped language selectors.
88
+
89
+ ```tsx
90
+ <ApiSamples config={config} variant="minimal" />
91
+ ```
92
+
93
+ ### Terminal
94
+
95
+ macOS-style window chrome with traffic light dots, method badge, URL bar, and dropdown language selector.
96
+
97
+ ```tsx
98
+ <ApiSamples config={config} variant="terminal" />
99
+ ```
100
+
101
+ ### Custom Variant
102
+
103
+ Pass any React component that accepts `VariantRenderProps`:
104
+
105
+ ```tsx
106
+ import type { VariantRenderProps } from 'react-api-samples';
107
+
108
+ function MyLayout(props: VariantRenderProps) {
109
+ return (
110
+ <div>
111
+ <h4>{props.config.title}</h4>
112
+ {props.languages.map((lang) => (
113
+ <button key={lang} onClick={() => props.onLanguageChange(lang)}>
114
+ {lang}
115
+ </button>
116
+ ))}
117
+ <pre>
118
+ <code
119
+ className={`language-${props.syntaxLanguage}`}
120
+ dangerouslySetInnerHTML={{ __html: props.codeHtml }}
121
+ />
122
+ </pre>
123
+ <button onClick={props.onCopy}>
124
+ {props.copied ? 'Copied!' : 'Copy'}
125
+ </button>
126
+ </div>
127
+ );
128
+ }
129
+
130
+ <ApiSamples config={config} variant={MyLayout} />
131
+ ```
132
+
133
+ All logic (code generation, Prism highlighting, copy, environment switching) is handled for you. The variant only controls layout and styling.
134
+
135
+ ## Features
136
+
137
+ ### Language Tabs
138
+
139
+ Choose any combination of the five supported languages:
140
+
141
+ ```tsx
142
+ <ApiSamples
143
+ config={config}
144
+ languages={['curl', 'python', 'java', 'php', 'javascript']}
145
+ />
146
+ ```
147
+
148
+ Each language generates idiomatic code:
149
+
150
+ | Language | Library |
151
+ |----------|---------|
152
+ | JavaScript | axios |
153
+ | Python | requests |
154
+ | cURL | native |
155
+ | Java | OkHttp |
156
+ | PHP | Guzzle |
157
+
158
+ ### Variable Injection
159
+
160
+ Use `{{PLACEHOLDER}}` in headers, URL, or body — then supply values via `variables`:
161
+
162
+ ```tsx
163
+ <ApiSamples
164
+ config={{
165
+ method: 'GET',
166
+ url: 'https://api.example.com/v1/items',
167
+ headers: {
168
+ Authorization: 'Bearer {{API_TOKEN}}',
169
+ },
170
+ variables: {
171
+ API_TOKEN: 'example_token',
172
+ },
173
+ }}
174
+ />
175
+ ```
176
+
177
+ The placeholders are replaced in the generated code. Any unmatched placeholder is left as-is.
178
+
179
+ ### Environment Switching
180
+
181
+ Pass an object as `url` and the component renders a Dev / Prod toggle:
182
+
183
+ ```tsx
184
+ <ApiSamples
185
+ config={{
186
+ method: 'POST',
187
+ url: {
188
+ dev: 'http://localhost:3000/v1/items',
189
+ prod: 'https://api.example.com/v1/items',
190
+ },
191
+ body: { sku: 'SKU-001', quantity: 2 },
192
+ }}
193
+ />
194
+ ```
195
+
196
+ ### Theming
197
+
198
+ ```tsx
199
+ <ApiSamples config={config} theme="light" />
200
+ <ApiSamples config={config} theme="dark" />
201
+ ```
202
+
203
+ All styles are inline — no CSS files to import. Override with `className` or a wrapping element.
204
+
205
+ ### Title & Description
206
+
207
+ ```tsx
208
+ <ApiSamples
209
+ config={{
210
+ ...config,
211
+ title: 'Example request',
212
+ description: 'Optional heading and helper text above the samples.',
213
+ }}
214
+ />
215
+ ```
216
+
217
+ Renders a header above the language tabs.
218
+
219
+ ## Headless Usage
220
+
221
+ Don't need the UI? Use the core engine directly:
222
+
223
+ ```ts
224
+ import { generateSamples } from 'react-api-samples';
225
+
226
+ const samples = generateSamples(
227
+ {
228
+ method: 'POST',
229
+ url: 'https://api.example.com/v1/items',
230
+ headers: { 'Content-Type': 'application/json' },
231
+ body: { title: 'Example', quantity: 1 },
232
+ },
233
+ { languages: ['curl', 'python'] }
234
+ );
235
+
236
+ console.log(samples.curl);
237
+ console.log(samples.python);
238
+ ```
239
+
240
+ Returns `Partial<Record<SupportedLanguage, string>>` — one key per requested language.
241
+
242
+ ## TypeScript
243
+
244
+ Every type is exported:
245
+
246
+ ```ts
247
+ import type {
248
+ ApiSampleConfig,
249
+ ApiSamplesProps,
250
+ SupportedLanguage,
251
+ HttpMethod,
252
+ Theme,
253
+ Environment,
254
+ GenerateOptions,
255
+ ResolvedConfig,
256
+ BuiltInVariant,
257
+ VariantComponent,
258
+ VariantRenderProps,
259
+ } from 'react-api-samples';
260
+ ```
261
+
262
+ ## License
263
+
264
+ MIT
package/dist/index.cjs ADDED
@@ -0,0 +1,106 @@
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),b=require("react"),B=require("prismjs");require("prismjs/components/prism-markup");require("prismjs/components/prism-markup-templating");require("prismjs/components/prism-python");require("prismjs/components/prism-bash");require("prismjs/components/prism-java");require("prismjs/components/prism-php");function x(o,e=2){return JSON.stringify(o,null,e)}function k(o){if(!o||Object.keys(o).length===0)return"";const e=new URLSearchParams(Object.entries(o).map(([s,t])=>[s,String(t)])).toString();return e?`?${e}`:""}function S(o,e){return e?o.replace(/\{\{(.*?)\}\}/g,(s,t)=>e[t.trim()]??`{{${t}}}`):o}function $(o,e){return typeof o=="string"?S(o,e):Array.isArray(o)?o.map(s=>$(s,e)):o!==null&&typeof o=="object"?Object.fromEntries(Object.entries(o).map(([s,t])=>[s,$(t,e)])):o}function M(o,e="prod"){const s=typeof o.url=="string"?o.url:o.url[e],t=o.variables;return{...o,url:S(s,t),headers:o.headers?Object.fromEntries(Object.entries(o.headers).map(([d,a])=>[d,S(a,t)])):void 0,body:o.body?$(o.body,t):void 0}}function I(o){const e=o.url+k(o.query),s=o.method.toLowerCase(),t=o.body&&o.method!=="GET",d=o.headers&&Object.keys(o.headers).length>0,a=["import axios from 'axios';",""];return t&&d?a.push(`const response = await axios.${s}(`,` '${e}',`,` ${x(o.body)},`," {",` headers: ${x(o.headers).split(`
2
+ `).join(`
3
+ `)}`," }",");"):t?a.push(`const response = await axios.${s}(`,` '${e}',`,` ${x(o.body)}`,");"):d?a.push(`const response = await axios.${s}(`,` '${e}',`," {",` headers: ${x(o.headers).split(`
4
+ `).join(`
5
+ `)}`," }",");"):a.push(`const response = await axios.${s}('${e}');`),a.push("","console.log(response.data);"),a.join(`
6
+ `)}function j(o,e=0){return x(o).replace(/: true/g,": True").replace(/: false/g,": False").replace(/: null/g,": None").split(`
7
+ `).map((t,d)=>d===0?t:" ".repeat(e)+t).join(`
8
+ `)}function H(o){const e=o.method.toLowerCase(),s=o.body&&o.method!=="GET",t=o.headers&&Object.keys(o.headers).length>0,d=o.query&&Object.keys(o.query).length>0,a=["import requests",""];a.push(`url = "${o.url}"`),t&&a.push(`headers = ${j(o.headers)}`),d&&a.push(`params = ${j(o.query)}`),s&&a.push(`payload = ${j(o.body)}`),a.push("");const c=["url"];s&&c.push("json=payload"),d&&c.push("params=params"),t&&c.push("headers=headers");const l=c.join(`,
9
+ `);return a.push(`response = requests.${e}(`,` ${l}`,")"),a.push("","print(response.text)"),a.join(`
10
+ `)}function G(o){const e=o.url+k(o.query),s=[`curl -X ${o.method} "${e}"`];if(o.headers)for(const[t,d]of Object.entries(o.headers))s.push(` -H "${t}: ${d}"`);return o.body&&o.method!=="GET"&&s.push(` -d '${JSON.stringify(o.body)}'`),s.join(` \\
11
+ `)}function N(o){const e=o.url+k(o.query),s=o.body&&o.method!=="GET",t=["import okhttp3.*;","","OkHttpClient client = new OkHttpClient();",""];if(s&&t.push('MediaType mediaType = MediaType.parse("application/json");',`RequestBody body = RequestBody.create(mediaType, "${JSON.stringify(o.body).replace(/"/g,'\\"')}");`,""),t.push("Request request = new Request.Builder()"),t.push(` .url("${e}")`),o.headers)for(const[d,a]of Object.entries(o.headers))t.push(` .addHeader("${d}", "${a}")`);return s?t.push(` .${o.method.toLowerCase()}(body)`):o.method==="GET"?t.push(" .get()"):t.push(` .${o.method.toLowerCase()}(RequestBody.create(null, new byte[0]))`),t.push(" .build();"),t.push(""),t.push("Response response = client.newCall(request).execute();"),t.push("System.out.println(response.body().string());"),t.join(`
12
+ `)}function C(o,e=0){if(o==null)return"[]";if(Array.isArray(o)){if(o.length===0)return"[]";const s=" ".repeat(e+4);return`[
13
+ ${o.map(d=>`${s}${A(d,e+4)}`).join(`,
14
+ `)}
15
+ ${" ".repeat(e)}]`}if(typeof o=="object"){const s=Object.entries(o);if(s.length===0)return"[]";const t=" ".repeat(e+4);return`[
16
+ ${s.map(([a,c])=>`${t}'${a}' => ${A(c,e+4)}`).join(`,
17
+ `)}
18
+ ${" ".repeat(e)}]`}return x(o)}function A(o,e=0){return typeof o=="string"?`'${o}'`:typeof o=="boolean"?o?"true":"false":typeof o=="number"?String(o):o==null?"null":C(o,e)}function _(o){const e=o.url+k(o.query),s=o.body&&o.method!=="GET",t=o.headers&&Object.keys(o.headers).length>0,d=["<?php","require 'vendor/autoload.php';","","use GuzzleHttp\\Client;","","$client = new Client();",""],a=[];return t&&a.push(` 'headers' => ${C(o.headers,4)}`),s&&a.push(` 'json' => ${C(o.body,4)}`),a.length>0?d.push(`$response = $client->request('${o.method}', '${e}', [`,...a.map((c,l)=>c+(l<a.length-1?",":"")),"]);"):d.push(`$response = $client->request('${o.method}', '${e}');`),d.push("","echo $response->getBody();"),d.join(`
19
+ `)}const w={javascript:"JavaScript",python:"Python",curl:"cURL",java:"Java",php:"PHP"},V={javascript:"javascript",python:"python",curl:"bash",java:"java",php:"php"},U=["javascript","python","curl","java","php"];function W(o,e){switch(o){case"javascript":return I(e);case"python":return H(e);case"curl":return G(e);case"java":return N(e);case"php":return _(e);default:return""}}function z(o,e){const s=(e==null?void 0:e.languages)??U,t=M(o,e==null?void 0:e.environment);return Object.fromEntries(s.map(d=>[d,W(d,t)]))}const D=`
20
+ /* Base text color for any code block (fallback if language-* class is missing) */
21
+ .ras-code pre code {
22
+ color: #d4d4d4;
23
+ }
24
+ .ras-code code[class*="language-"],
25
+ .ras-code pre[class*="language-"] {
26
+ color: #d4d4d4;
27
+ font-family: 'Fira Code', 'Fira Mono', Menlo, Consolas, 'DejaVu Sans Mono', monospace;
28
+ font-size: 13px;
29
+ line-height: 1.6;
30
+ white-space: pre;
31
+ word-spacing: normal;
32
+ word-break: normal;
33
+ tab-size: 2;
34
+ }
35
+ .ras-code .token.comment,
36
+ .ras-code .token.prolog,
37
+ .ras-code .token.doctype,
38
+ .ras-code .token.cdata { color: #6a9955; }
39
+ .ras-code .token.punctuation { color: #d4d4d4; }
40
+ .ras-code .token.property,
41
+ .ras-code .token.tag,
42
+ .ras-code .token.boolean,
43
+ .ras-code .token.number,
44
+ .ras-code .token.constant,
45
+ .ras-code .token.symbol { color: #b5cea8; }
46
+ .ras-code .token.selector,
47
+ .ras-code .token.attr-name,
48
+ .ras-code .token.string,
49
+ .ras-code .token.char,
50
+ .ras-code .token.builtin { color: #ce9178; }
51
+ .ras-code .token.operator,
52
+ .ras-code .token.entity,
53
+ .ras-code .token.url { color: #d4d4d4; }
54
+ .ras-code .token.atrule,
55
+ .ras-code .token.attr-value,
56
+ .ras-code .token.keyword { color: #569cd6; }
57
+ .ras-code .token.function,
58
+ .ras-code .token.class-name,
59
+ .ras-code .token.maybe-class-name { color: #dcdcaa; }
60
+ .ras-code .token.regex,
61
+ .ras-code .token.important,
62
+ .ras-code .token.variable { color: #d16969; }
63
+ `,J=`
64
+ .ras-code pre code {
65
+ color: #24292e;
66
+ }
67
+ .ras-code code[class*="language-"],
68
+ .ras-code pre[class*="language-"] {
69
+ color: #24292e;
70
+ font-family: 'Fira Code', 'Fira Mono', Menlo, Consolas, 'DejaVu Sans Mono', monospace;
71
+ font-size: 13px;
72
+ line-height: 1.6;
73
+ white-space: pre;
74
+ word-spacing: normal;
75
+ word-break: normal;
76
+ tab-size: 2;
77
+ }
78
+ .ras-code .token.comment,
79
+ .ras-code .token.prolog,
80
+ .ras-code .token.doctype,
81
+ .ras-code .token.cdata { color: #6a737d; }
82
+ .ras-code .token.punctuation { color: #24292e; }
83
+ .ras-code .token.property,
84
+ .ras-code .token.tag,
85
+ .ras-code .token.boolean,
86
+ .ras-code .token.number,
87
+ .ras-code .token.constant,
88
+ .ras-code .token.symbol { color: #005cc5; }
89
+ .ras-code .token.selector,
90
+ .ras-code .token.attr-name,
91
+ .ras-code .token.string,
92
+ .ras-code .token.char,
93
+ .ras-code .token.builtin { color: #032f62; }
94
+ .ras-code .token.operator,
95
+ .ras-code .token.entity,
96
+ .ras-code .token.url { color: #d73a49; }
97
+ .ras-code .token.atrule,
98
+ .ras-code .token.attr-value,
99
+ .ras-code .token.keyword { color: #d73a49; }
100
+ .ras-code .token.function,
101
+ .ras-code .token.class-name,
102
+ .ras-code .token.maybe-class-name { color: #6f42c1; }
103
+ .ras-code .token.regex,
104
+ .ras-code .token.important,
105
+ .ras-code .token.variable { color: #e36209; }
106
+ `;function Q(o){return o==="dark"?D:J}function Y(o){const e=o==="dark";return{container:{fontFamily:"'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif",borderRadius:8,overflow:"hidden",border:"1px solid",fontSize:14,lineHeight:1.5,borderColor:e?"#2d2d2d":"#e0e0e0",background:e?"#1e1e1e":"#ffffff",color:e?"#d4d4d4":"#24292e"},header:{padding:"12px 16px",borderBottom:`1px solid ${e?"#2d2d2d":"#e0e0e0"}`},title:{margin:0,fontSize:15,fontWeight:600,color:e?"#e1e1e1":"#24292e"},description:{margin:"4px 0 0",fontSize:13,opacity:.75,color:e?"#a0a0a0":"#586069"},tabs:{display:"flex",gap:0,overflow:"auto",borderBottom:`1px solid ${e?"#2d2d2d":"#e0e0e0"}`,background:e?"#252526":"#f6f8fa"},tab:{padding:"8px 16px",border:"none",cursor:"pointer",fontSize:13,fontWeight:500,fontFamily:"inherit",transition:"background 0.15s, color 0.15s",whiteSpace:"nowrap",background:"transparent",color:e?"#858585":"#586069"},tabActive:{padding:"8px 16px",border:"none",cursor:"pointer",fontSize:13,fontWeight:500,fontFamily:"inherit",transition:"background 0.15s, color 0.15s",whiteSpace:"nowrap",background:e?"#1e1e1e":"#ffffff",color:e?"#ffffff":"#24292e",borderBottom:`2px solid ${e?"#569cd6":"#0366d6"}`},codeWrap:{position:"relative",overflow:"auto",background:e?"#1e1e1e":"#f6f8fa"},copyBtn:{position:"absolute",top:8,right:8,padding:"4px 10px",border:"1px solid",borderRadius:4,cursor:"pointer",fontSize:12,fontFamily:"inherit",transition:"background 0.15s",zIndex:2,background:e?"#2d2d2d":"#ffffff",borderColor:e?"#404040":"#d1d5da",color:e?"#d4d4d4":"#24292e"},copied:{background:e?"#2ea04370":"#dcffe4",borderColor:e?"#2ea043":"#34d058",color:e?"#7ee787":"#22863a"},envBtn:{padding:"4px 12px",border:"1px solid",cursor:"pointer",fontSize:12,fontFamily:"inherit",transition:"background 0.15s",background:e?"#2d2d2d":"#f6f8fa",borderColor:e?"#404040":"#d1d5da",color:e?"#a0a0a0":"#586069"},envBtnActive:{padding:"4px 12px",border:"1px solid",cursor:"pointer",fontSize:12,fontFamily:"inherit",transition:"background 0.15s",background:e?"#569cd6":"#0366d6",borderColor:e?"#569cd6":"#0366d6",color:"#fff"}}}function E(o){const{config:e,languages:s,activeLanguage:t,onLanguageChange:d,theme:a,codeHtml:c,copied:l,onCopy:m,syntaxLanguage:y,environment:p,onEnvironmentChange:u,className:g}=o,r=Y(a),f=typeof e.url=="object";return n.jsxs("div",{style:r.container,className:g,children:[(e.title||e.description||f)&&n.jsx("div",{style:r.header,children:n.jsxs("div",{style:{display:"flex",justifyContent:"space-between",alignItems:"center"},children:[n.jsxs("div",{children:[e.title&&n.jsx("h3",{style:r.title,children:e.title}),e.description&&n.jsx("p",{style:r.description,children:e.description})]}),f&&u&&n.jsxs("div",{style:{display:"flex",gap:0},children:[n.jsx("button",{type:"button",style:p==="dev"?r.envBtnActive:r.envBtn,onClick:()=>u("dev"),children:"Dev"}),n.jsx("button",{type:"button",style:p==="prod"?r.envBtnActive:r.envBtn,onClick:()=>u("prod"),children:"Prod"})]})]})}),n.jsx("div",{style:r.tabs,children:s.map(i=>n.jsx("button",{type:"button",onClick:()=>d(i),style:t===i?r.tabActive:r.tab,children:w[i]??i},i))}),n.jsxs("div",{style:r.codeWrap,className:"ras-code",children:[n.jsx("button",{type:"button",onClick:m,style:{...r.copyBtn,...l?r.copied:{}},"aria-label":"Copy code",children:l?"Copied!":"Copy"}),n.jsx("pre",{style:{margin:0,padding:16,background:"transparent",overflow:"auto"},children:n.jsx("code",{className:`language-${y}`,dangerouslySetInnerHTML:{__html:c}})})]})]})}function K(o){const e=o==="dark";return{container:{fontFamily:"'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif",fontSize:14,lineHeight:1.5,color:e?"#d4d4d4":"#24292e"},header:{marginBottom:8},title:{margin:0,fontSize:14,fontWeight:600,color:e?"#e1e1e1":"#24292e"},description:{margin:"2px 0 0",fontSize:12,color:e?"#808080":"#6a737d"},toolbar:{display:"flex",alignItems:"center",justifyContent:"space-between",marginBottom:6},pills:{display:"flex",gap:4},pill:{padding:"3px 10px",border:"none",borderRadius:999,cursor:"pointer",fontSize:12,fontWeight:500,fontFamily:"inherit",transition:"background 0.15s, color 0.15s",background:"transparent",color:e?"#707070":"#8b949e"},pillActive:{padding:"3px 10px",border:"none",borderRadius:999,cursor:"pointer",fontSize:12,fontWeight:500,fontFamily:"inherit",transition:"background 0.15s, color 0.15s",background:e?"#ffffff14":"#0366d60d",color:e?"#e1e1e1":"#0366d6"},envGroup:{display:"flex",gap:2},envPill:{padding:"2px 8px",border:"none",borderRadius:999,cursor:"pointer",fontSize:11,fontFamily:"inherit",background:"transparent",color:e?"#707070":"#8b949e"},envPillActive:{padding:"2px 8px",border:"none",borderRadius:999,cursor:"pointer",fontSize:11,fontFamily:"inherit",background:e?"#ffffff14":"#0366d60d",color:e?"#e1e1e1":"#0366d6"},codeWrap:{position:"relative",overflow:"auto",borderRadius:8,background:e?"#161616":"#f6f8fa"},copyBtn:{position:"absolute",top:10,right:10,padding:"3px 8px",border:"none",borderRadius:4,cursor:"pointer",fontSize:11,fontFamily:"inherit",transition:"opacity 0.15s",zIndex:2,opacity:.6,background:e?"#333":"#e1e4e8",color:e?"#ccc":"#24292e"},copied:{opacity:1,background:e?"#2ea04370":"#dcffe4",color:e?"#7ee787":"#22863a"}}}function L(o){const{config:e,languages:s,activeLanguage:t,onLanguageChange:d,theme:a,codeHtml:c,copied:l,onCopy:m,syntaxLanguage:y,environment:p,onEnvironmentChange:u,className:g}=o,r=K(a),f=typeof e.url=="object";return n.jsxs("div",{style:r.container,className:g,children:[(e.title||e.description)&&n.jsxs("div",{style:r.header,children:[e.title&&n.jsx("h3",{style:r.title,children:e.title}),e.description&&n.jsx("p",{style:r.description,children:e.description})]}),n.jsxs("div",{style:r.toolbar,children:[n.jsx("div",{style:r.pills,children:s.map(i=>n.jsx("button",{type:"button",onClick:()=>d(i),style:t===i?r.pillActive:r.pill,children:w[i]??i},i))}),f&&u&&n.jsxs("div",{style:r.envGroup,children:[n.jsx("button",{type:"button",style:p==="dev"?r.envPillActive:r.envPill,onClick:()=>u("dev"),children:"dev"}),n.jsx("button",{type:"button",style:p==="prod"?r.envPillActive:r.envPill,onClick:()=>u("prod"),children:"prod"})]})]}),n.jsxs("div",{style:r.codeWrap,className:"ras-code",children:[n.jsx("button",{type:"button",onClick:m,style:{...r.copyBtn,...l?r.copied:{}},"aria-label":"Copy code",children:l?"Copied!":"Copy"}),n.jsx("pre",{style:{margin:0,padding:"14px 16px",background:"transparent",overflow:"auto"},children:n.jsx("code",{className:`language-${y}`,dangerouslySetInnerHTML:{__html:c}})})]})]})}function X(o){const e=o==="dark";return{container:{fontFamily:"'SF Mono', 'Fira Code', Menlo, Consolas, monospace",fontSize:13,lineHeight:1.5,borderRadius:10,overflow:"hidden",boxShadow:e?"0 8px 32px rgba(0,0,0,0.45)":"0 4px 24px rgba(0,0,0,0.1)",border:`1px solid ${e?"#333":"#d1d5da"}`},titleBar:{display:"flex",alignItems:"center",gap:10,padding:"10px 14px",background:e?"#2d2d2d":"#e8e8e8",borderBottom:`1px solid ${e?"#404040":"#c8c8c8"}`,userSelect:"none"},dots:{display:"flex",gap:6,flexShrink:0},dot:s=>({width:12,height:12,borderRadius:"50%",background:s}),titleText:{flex:1,textAlign:"center",fontSize:12,fontWeight:500,color:e?"#999":"#666",overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},toolbar:{display:"flex",alignItems:"center",gap:8,padding:"8px 14px",background:e?"#252526":"#f0f0f0",borderBottom:`1px solid ${e?"#333":"#d1d5da"}`},methodBadge:s=>{const t={GET:"#61affe",POST:"#49cc90",PUT:"#fca130",PATCH:"#50e3c2",DELETE:"#f93e3e"};return{padding:"2px 8px",borderRadius:4,fontSize:11,fontWeight:700,fontFamily:"inherit",background:(t[s]??"#888")+"22",color:t[s]??"#888",letterSpacing:.5}},urlBar:{flex:1,padding:"4px 10px",borderRadius:4,border:`1px solid ${e?"#404040":"#c8c8c8"}`,background:e?"#1e1e1e":"#fff",color:e?"#d4d4d4":"#24292e",fontSize:12,fontFamily:"inherit",overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},select:{padding:"4px 8px",borderRadius:4,border:`1px solid ${e?"#404040":"#c8c8c8"}`,background:e?"#1e1e1e":"#fff",color:e?"#d4d4d4":"#24292e",fontSize:12,fontFamily:"inherit",cursor:"pointer",outline:"none"},envBtn:{padding:"3px 8px",borderRadius:4,border:`1px solid ${e?"#404040":"#c8c8c8"}`,background:e?"#1e1e1e":"#fff",color:e?"#808080":"#666",fontSize:11,fontFamily:"inherit",cursor:"pointer"},envBtnActive:{padding:"3px 8px",borderRadius:4,border:"1px solid",fontSize:11,fontFamily:"inherit",cursor:"pointer",background:e?"#569cd633":"#0366d611",borderColor:e?"#569cd6":"#0366d6",color:e?"#569cd6":"#0366d6"},body:{position:"relative",overflow:"auto",background:e?"#1a1a1a":"#fafafa",color:e?"#d4d4d4":"#24292e"},copyBtn:{position:"absolute",top:8,right:12,padding:"3px 8px",border:`1px solid ${e?"#404040":"#c8c8c8"}`,borderRadius:4,cursor:"pointer",fontSize:11,fontFamily:"inherit",transition:"background 0.15s",zIndex:2,background:e?"#2d2d2d":"#f0f0f0",color:e?"#d4d4d4":"#24292e"},copied:{background:e?"#2ea04370":"#dcffe4",borderColor:e?"#2ea043":"#34d058",color:e?"#7ee787":"#22863a"}}}function F(o){const{config:e,languages:s,activeLanguage:t,onLanguageChange:d,theme:a,codeHtml:c,copied:l,onCopy:m,syntaxLanguage:y,environment:p,onEnvironmentChange:u,className:g}=o,r=X(a),f=typeof e.url=="object",i=typeof e.url=="string"?e.url:p==="dev"?e.url.dev:e.url.prod;return n.jsxs("div",{style:r.container,className:g,children:[n.jsxs("div",{style:r.titleBar,children:[n.jsxs("div",{style:r.dots,children:[n.jsx("span",{style:r.dot("#ff5f57")}),n.jsx("span",{style:r.dot("#febc2e")}),n.jsx("span",{style:r.dot("#28c840")})]}),n.jsx("div",{style:r.titleText,children:e.title||"API Request"}),n.jsx("div",{style:{width:52,flexShrink:0}})]}),n.jsxs("div",{style:r.toolbar,children:[n.jsx("span",{style:r.methodBadge(e.method),children:e.method}),n.jsx("div",{style:r.urlBar,children:i}),n.jsx("select",{style:r.select,value:t,onChange:h=>d(h.target.value),children:s.map(h=>n.jsx("option",{value:h,children:w[h]??h},h))}),f&&u&&n.jsxs(n.Fragment,{children:[n.jsx("button",{type:"button",style:p==="dev"?r.envBtnActive:r.envBtn,onClick:()=>u("dev"),children:"DEV"}),n.jsx("button",{type:"button",style:p==="prod"?r.envBtnActive:r.envBtn,onClick:()=>u("prod"),children:"PROD"})]})]}),n.jsxs("div",{style:r.body,className:"ras-code",children:[n.jsx("button",{type:"button",onClick:m,style:{...r.copyBtn,...l?r.copied:{}},"aria-label":"Copy code",children:l?"Copied!":"Copy"}),n.jsx("pre",{style:{margin:0,padding:"14px 16px",background:"transparent",overflow:"auto"},children:n.jsx("code",{className:`language-${y}`,dangerouslySetInnerHTML:{__html:c}})})]})]})}const T={classic:E,minimal:L,terminal:F};function Z(o){return typeof o=="function"?o:T[o]??T.classic}const ee=["javascript","python","curl"],R="ras-prism-theme";function oe(o){let e=document.getElementById(R);e||(e=document.createElement("style"),e.id=R,document.head.appendChild(e)),e.textContent=o}function te(o){return o.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;")}function re({config:o,languages:e=ee,defaultLanguage:s="javascript",theme:t="dark",environment:d,className:a,variant:c="classic"}){const[l,m]=b.useState(s),y=typeof o.url=="object",[p,u]=b.useState(d??"prod"),[g,r]=b.useState(!1);b.useEffect(()=>{oe(Q(t))},[t]);const f=b.useMemo(()=>z(o,{languages:e,environment:p}),[o,e,p]),i=f[l]??"",h=V[l]??l,v=B.languages[h],q=b.useMemo(()=>v?B.highlight(i,v,h):te(i),[i,h,v]),P=b.useCallback(()=>{navigator.clipboard.writeText(i).then(()=>{r(!0),setTimeout(()=>r(!1),2e3)})},[i]),O=b.useMemo(()=>Z(c),[c]);return n.jsx(O,{config:o,languages:e,activeLanguage:l,onLanguageChange:m,samples:f,theme:t,codeHtml:q,codePlain:i,syntaxLanguage:h,copied:g,onCopy:P,environment:y?p:void 0,onEnvironmentChange:y?u:void 0,className:a})}exports.ApiSamples=re;exports.ClassicVariant=E;exports.MinimalVariant=L;exports.TerminalVariant=F;exports.generateSamples=z;
package/dist/index.d.ts ADDED
@@ -0,0 +1,87 @@
1
+ import { JSX as JSX_2 } from 'react/jsx-runtime';
2
+ import { ReactNode } from 'react';
3
+
4
+ export declare type ApiSampleConfig = {
5
+ method: HttpMethod;
6
+ url: string | {
7
+ dev: string;
8
+ prod: string;
9
+ };
10
+ headers?: Record<string, string>;
11
+ query?: Record<string, string | number>;
12
+ body?: unknown;
13
+ title?: string;
14
+ description?: string;
15
+ variables?: Record<string, string>;
16
+ };
17
+
18
+ export declare function ApiSamples({ config, languages, defaultLanguage, theme, environment: envProp, className, variant, }: ApiSamplesProps): JSX_2.Element;
19
+
20
+ export declare type ApiSamplesProps = {
21
+ config: ApiSampleConfig;
22
+ languages?: SupportedLanguage[];
23
+ defaultLanguage?: SupportedLanguage;
24
+ theme?: Theme;
25
+ environment?: Environment;
26
+ className?: string;
27
+ /** Pick a built-in layout or pass a custom component. */
28
+ variant?: BuiltInVariant | VariantComponent;
29
+ };
30
+
31
+ export declare type BuiltInVariant = 'classic' | 'minimal' | 'terminal';
32
+
33
+ export declare function ClassicVariant(props: VariantRenderProps): JSX_2.Element;
34
+
35
+ export declare type Environment = 'dev' | 'prod';
36
+
37
+ export declare type GenerateOptions = {
38
+ languages?: SupportedLanguage[];
39
+ indent?: number;
40
+ };
41
+
42
+ export declare function generateSamples(config: ApiSampleConfig, options?: GenerateOptions & {
43
+ environment?: Environment;
44
+ }): Partial<Record<SupportedLanguage, string>>;
45
+
46
+ export declare type HttpMethod = 'GET' | 'POST' | 'PUT' | 'PATCH' | 'DELETE';
47
+
48
+ export declare function MinimalVariant(props: VariantRenderProps): JSX_2.Element;
49
+
50
+ /** Resolved config with a plain string URL (after environment selection). */
51
+ export declare type ResolvedConfig = Omit<ApiSampleConfig, 'url'> & {
52
+ url: string;
53
+ };
54
+
55
+ export declare type SupportedLanguage = 'javascript' | 'python' | 'curl' | 'java' | 'php';
56
+
57
+ export declare function TerminalVariant(props: VariantRenderProps): JSX_2.Element;
58
+
59
+ export declare type Theme = 'light' | 'dark';
60
+
61
+ /** A variant is just a React component that receives VariantRenderProps. */
62
+ export declare type VariantComponent = (props: VariantRenderProps) => ReactNode;
63
+
64
+ /**
65
+ * Data passed to every variant layout component.
66
+ * Variants only control presentation — all logic is handled upstream.
67
+ */
68
+ export declare interface VariantRenderProps {
69
+ config: ApiSampleConfig;
70
+ languages: SupportedLanguage[];
71
+ activeLanguage: SupportedLanguage;
72
+ onLanguageChange: (lang: SupportedLanguage) => void;
73
+ samples: Partial<Record<SupportedLanguage, string>>;
74
+ theme: Theme;
75
+ codeHtml: string;
76
+ codePlain: string;
77
+ /** Prism grammar id (e.g. `bash` for curl) — set `className="language-*"` on `<code>` for theme CSS. */
78
+ syntaxLanguage: string;
79
+ copied: boolean;
80
+ onCopy: () => void;
81
+ /** Only present when config.url is an object */
82
+ environment?: Environment;
83
+ onEnvironmentChange?: (env: Environment) => void;
84
+ className?: string;
85
+ }
86
+
87
+ export { }
package/dist/index.mjs ADDED
@@ -0,0 +1,829 @@
1
+ import { jsxs as p, jsx as s, Fragment as O } from "react/jsx-runtime";
2
+ import { useState as S, useEffect as I, useMemo as $, useCallback as H } from "react";
3
+ import R from "prismjs";
4
+ import "prismjs/components/prism-markup";
5
+ import "prismjs/components/prism-markup-templating";
6
+ import "prismjs/components/prism-python";
7
+ import "prismjs/components/prism-bash";
8
+ import "prismjs/components/prism-java";
9
+ import "prismjs/components/prism-php";
10
+ function k(o, e = 2) {
11
+ return JSON.stringify(o, null, e);
12
+ }
13
+ function v(o) {
14
+ if (!o || Object.keys(o).length === 0) return "";
15
+ const e = new URLSearchParams(
16
+ Object.entries(o).map(([n, t]) => [n, String(t)])
17
+ ).toString();
18
+ return e ? `?${e}` : "";
19
+ }
20
+ function j(o, e) {
21
+ return e ? o.replace(/\{\{(.*?)\}\}/g, (n, t) => e[t.trim()] ?? `{{${t}}}`) : o;
22
+ }
23
+ function w(o, e) {
24
+ return typeof o == "string" ? j(o, e) : Array.isArray(o) ? o.map((n) => w(n, e)) : o !== null && typeof o == "object" ? Object.fromEntries(
25
+ Object.entries(o).map(([n, t]) => [n, w(t, e)])
26
+ ) : o;
27
+ }
28
+ function G(o, e = "prod") {
29
+ const n = typeof o.url == "string" ? o.url : o.url[e], t = o.variables;
30
+ return {
31
+ ...o,
32
+ url: j(n, t),
33
+ headers: o.headers ? Object.fromEntries(
34
+ Object.entries(o.headers).map(([d, a]) => [d, j(a, t)])
35
+ ) : void 0,
36
+ body: o.body ? w(o.body, t) : void 0
37
+ };
38
+ }
39
+ function M(o) {
40
+ const e = o.url + v(o.query), n = o.method.toLowerCase(), t = o.body && o.method !== "GET", d = o.headers && Object.keys(o.headers).length > 0, a = ["import axios from 'axios';", ""];
41
+ return t && d ? a.push(
42
+ `const response = await axios.${n}(`,
43
+ ` '${e}',`,
44
+ ` ${k(o.body)},`,
45
+ " {",
46
+ ` headers: ${k(o.headers).split(`
47
+ `).join(`
48
+ `)}`,
49
+ " }",
50
+ ");"
51
+ ) : t ? a.push(
52
+ `const response = await axios.${n}(`,
53
+ ` '${e}',`,
54
+ ` ${k(o.body)}`,
55
+ ");"
56
+ ) : d ? a.push(
57
+ `const response = await axios.${n}(`,
58
+ ` '${e}',`,
59
+ " {",
60
+ ` headers: ${k(o.headers).split(`
61
+ `).join(`
62
+ `)}`,
63
+ " }",
64
+ ");"
65
+ ) : a.push(`const response = await axios.${n}('${e}');`), a.push("", "console.log(response.data);"), a.join(`
66
+ `);
67
+ }
68
+ function C(o, e = 0) {
69
+ return k(o).replace(/: true/g, ": True").replace(/: false/g, ": False").replace(/: null/g, ": None").split(`
70
+ `).map((t, d) => d === 0 ? t : " ".repeat(e) + t).join(`
71
+ `);
72
+ }
73
+ function q(o) {
74
+ const e = o.method.toLowerCase(), n = o.body && o.method !== "GET", t = o.headers && Object.keys(o.headers).length > 0, d = o.query && Object.keys(o.query).length > 0, a = ["import requests", ""];
75
+ a.push(`url = "${o.url}"`), t && a.push(`headers = ${C(o.headers)}`), d && a.push(`params = ${C(o.query)}`), n && a.push(`payload = ${C(o.body)}`), a.push("");
76
+ const c = ["url"];
77
+ n && c.push("json=payload"), d && c.push("params=params"), t && c.push("headers=headers");
78
+ const l = c.join(`,
79
+ `);
80
+ return a.push(
81
+ `response = requests.${e}(`,
82
+ ` ${l}`,
83
+ ")"
84
+ ), a.push("", "print(response.text)"), a.join(`
85
+ `);
86
+ }
87
+ function N(o) {
88
+ const e = o.url + v(o.query), n = [`curl -X ${o.method} "${e}"`];
89
+ if (o.headers)
90
+ for (const [t, d] of Object.entries(o.headers))
91
+ n.push(` -H "${t}: ${d}"`);
92
+ return o.body && o.method !== "GET" && n.push(` -d '${JSON.stringify(o.body)}'`), n.join(` \\
93
+ `);
94
+ }
95
+ function _(o) {
96
+ const e = o.url + v(o.query), n = o.body && o.method !== "GET", t = [
97
+ "import okhttp3.*;",
98
+ "",
99
+ "OkHttpClient client = new OkHttpClient();",
100
+ ""
101
+ ];
102
+ if (n && t.push(
103
+ 'MediaType mediaType = MediaType.parse("application/json");',
104
+ `RequestBody body = RequestBody.create(mediaType, "${JSON.stringify(o.body).replace(/"/g, '\\"')}");`,
105
+ ""
106
+ ), t.push("Request request = new Request.Builder()"), t.push(` .url("${e}")`), o.headers)
107
+ for (const [d, a] of Object.entries(o.headers))
108
+ t.push(` .addHeader("${d}", "${a}")`);
109
+ return n ? t.push(` .${o.method.toLowerCase()}(body)`) : o.method === "GET" ? t.push(" .get()") : t.push(` .${o.method.toLowerCase()}(RequestBody.create(null, new byte[0]))`), t.push(" .build();"), t.push(""), t.push("Response response = client.newCall(request).execute();"), t.push("System.out.println(response.body().string());"), t.join(`
110
+ `);
111
+ }
112
+ function B(o, e = 0) {
113
+ if (o == null) return "[]";
114
+ if (Array.isArray(o)) {
115
+ if (o.length === 0) return "[]";
116
+ const n = " ".repeat(e + 4);
117
+ return `[
118
+ ${o.map((d) => `${n}${T(d, e + 4)}`).join(`,
119
+ `)}
120
+ ${" ".repeat(e)}]`;
121
+ }
122
+ if (typeof o == "object") {
123
+ const n = Object.entries(o);
124
+ if (n.length === 0) return "[]";
125
+ const t = " ".repeat(e + 4);
126
+ return `[
127
+ ${n.map(([a, c]) => `${t}'${a}' => ${T(c, e + 4)}`).join(`,
128
+ `)}
129
+ ${" ".repeat(e)}]`;
130
+ }
131
+ return k(o);
132
+ }
133
+ function T(o, e = 0) {
134
+ return typeof o == "string" ? `'${o}'` : typeof o == "boolean" ? o ? "true" : "false" : typeof o == "number" ? String(o) : o == null ? "null" : B(o, e);
135
+ }
136
+ function U(o) {
137
+ const e = o.url + v(o.query), n = o.body && o.method !== "GET", t = o.headers && Object.keys(o.headers).length > 0, d = [
138
+ "<?php",
139
+ "require 'vendor/autoload.php';",
140
+ "",
141
+ "use GuzzleHttp\\Client;",
142
+ "",
143
+ "$client = new Client();",
144
+ ""
145
+ ], a = [];
146
+ return t && a.push(` 'headers' => ${B(o.headers, 4)}`), n && a.push(` 'json' => ${B(o.body, 4)}`), a.length > 0 ? d.push(
147
+ `$response = $client->request('${o.method}', '${e}', [`,
148
+ ...a.map((c, l) => c + (l < a.length - 1 ? "," : "")),
149
+ "]);"
150
+ ) : d.push(`$response = $client->request('${o.method}', '${e}');`), d.push("", "echo $response->getBody();"), d.join(`
151
+ `);
152
+ }
153
+ const A = {
154
+ javascript: "JavaScript",
155
+ python: "Python",
156
+ curl: "cURL",
157
+ java: "Java",
158
+ php: "PHP"
159
+ }, W = {
160
+ javascript: "javascript",
161
+ python: "python",
162
+ curl: "bash",
163
+ java: "java",
164
+ php: "php"
165
+ }, D = [
166
+ "javascript",
167
+ "python",
168
+ "curl",
169
+ "java",
170
+ "php"
171
+ ];
172
+ function V(o, e) {
173
+ switch (o) {
174
+ case "javascript":
175
+ return M(e);
176
+ case "python":
177
+ return q(e);
178
+ case "curl":
179
+ return N(e);
180
+ case "java":
181
+ return _(e);
182
+ case "php":
183
+ return U(e);
184
+ default:
185
+ return "";
186
+ }
187
+ }
188
+ function J(o, e) {
189
+ const n = (e == null ? void 0 : e.languages) ?? D, t = G(o, e == null ? void 0 : e.environment);
190
+ return Object.fromEntries(
191
+ n.map((d) => [d, V(d, t)])
192
+ );
193
+ }
194
+ const Q = `
195
+ /* Base text color for any code block (fallback if language-* class is missing) */
196
+ .ras-code pre code {
197
+ color: #d4d4d4;
198
+ }
199
+ .ras-code code[class*="language-"],
200
+ .ras-code pre[class*="language-"] {
201
+ color: #d4d4d4;
202
+ font-family: 'Fira Code', 'Fira Mono', Menlo, Consolas, 'DejaVu Sans Mono', monospace;
203
+ font-size: 13px;
204
+ line-height: 1.6;
205
+ white-space: pre;
206
+ word-spacing: normal;
207
+ word-break: normal;
208
+ tab-size: 2;
209
+ }
210
+ .ras-code .token.comment,
211
+ .ras-code .token.prolog,
212
+ .ras-code .token.doctype,
213
+ .ras-code .token.cdata { color: #6a9955; }
214
+ .ras-code .token.punctuation { color: #d4d4d4; }
215
+ .ras-code .token.property,
216
+ .ras-code .token.tag,
217
+ .ras-code .token.boolean,
218
+ .ras-code .token.number,
219
+ .ras-code .token.constant,
220
+ .ras-code .token.symbol { color: #b5cea8; }
221
+ .ras-code .token.selector,
222
+ .ras-code .token.attr-name,
223
+ .ras-code .token.string,
224
+ .ras-code .token.char,
225
+ .ras-code .token.builtin { color: #ce9178; }
226
+ .ras-code .token.operator,
227
+ .ras-code .token.entity,
228
+ .ras-code .token.url { color: #d4d4d4; }
229
+ .ras-code .token.atrule,
230
+ .ras-code .token.attr-value,
231
+ .ras-code .token.keyword { color: #569cd6; }
232
+ .ras-code .token.function,
233
+ .ras-code .token.class-name,
234
+ .ras-code .token.maybe-class-name { color: #dcdcaa; }
235
+ .ras-code .token.regex,
236
+ .ras-code .token.important,
237
+ .ras-code .token.variable { color: #d16969; }
238
+ `, Y = `
239
+ .ras-code pre code {
240
+ color: #24292e;
241
+ }
242
+ .ras-code code[class*="language-"],
243
+ .ras-code pre[class*="language-"] {
244
+ color: #24292e;
245
+ font-family: 'Fira Code', 'Fira Mono', Menlo, Consolas, 'DejaVu Sans Mono', monospace;
246
+ font-size: 13px;
247
+ line-height: 1.6;
248
+ white-space: pre;
249
+ word-spacing: normal;
250
+ word-break: normal;
251
+ tab-size: 2;
252
+ }
253
+ .ras-code .token.comment,
254
+ .ras-code .token.prolog,
255
+ .ras-code .token.doctype,
256
+ .ras-code .token.cdata { color: #6a737d; }
257
+ .ras-code .token.punctuation { color: #24292e; }
258
+ .ras-code .token.property,
259
+ .ras-code .token.tag,
260
+ .ras-code .token.boolean,
261
+ .ras-code .token.number,
262
+ .ras-code .token.constant,
263
+ .ras-code .token.symbol { color: #005cc5; }
264
+ .ras-code .token.selector,
265
+ .ras-code .token.attr-name,
266
+ .ras-code .token.string,
267
+ .ras-code .token.char,
268
+ .ras-code .token.builtin { color: #032f62; }
269
+ .ras-code .token.operator,
270
+ .ras-code .token.entity,
271
+ .ras-code .token.url { color: #d73a49; }
272
+ .ras-code .token.atrule,
273
+ .ras-code .token.attr-value,
274
+ .ras-code .token.keyword { color: #d73a49; }
275
+ .ras-code .token.function,
276
+ .ras-code .token.class-name,
277
+ .ras-code .token.maybe-class-name { color: #6f42c1; }
278
+ .ras-code .token.regex,
279
+ .ras-code .token.important,
280
+ .ras-code .token.variable { color: #e36209; }
281
+ `;
282
+ function K(o) {
283
+ return o === "dark" ? Q : Y;
284
+ }
285
+ function X(o) {
286
+ const e = o === "dark";
287
+ return {
288
+ container: {
289
+ fontFamily: "'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif",
290
+ borderRadius: 8,
291
+ overflow: "hidden",
292
+ border: "1px solid",
293
+ fontSize: 14,
294
+ lineHeight: 1.5,
295
+ borderColor: e ? "#2d2d2d" : "#e0e0e0",
296
+ background: e ? "#1e1e1e" : "#ffffff",
297
+ color: e ? "#d4d4d4" : "#24292e"
298
+ },
299
+ header: {
300
+ padding: "12px 16px",
301
+ borderBottom: `1px solid ${e ? "#2d2d2d" : "#e0e0e0"}`
302
+ },
303
+ title: {
304
+ margin: 0,
305
+ fontSize: 15,
306
+ fontWeight: 600,
307
+ color: e ? "#e1e1e1" : "#24292e"
308
+ },
309
+ description: {
310
+ margin: "4px 0 0",
311
+ fontSize: 13,
312
+ opacity: 0.75,
313
+ color: e ? "#a0a0a0" : "#586069"
314
+ },
315
+ tabs: {
316
+ display: "flex",
317
+ gap: 0,
318
+ overflow: "auto",
319
+ borderBottom: `1px solid ${e ? "#2d2d2d" : "#e0e0e0"}`,
320
+ background: e ? "#252526" : "#f6f8fa"
321
+ },
322
+ tab: {
323
+ padding: "8px 16px",
324
+ border: "none",
325
+ cursor: "pointer",
326
+ fontSize: 13,
327
+ fontWeight: 500,
328
+ fontFamily: "inherit",
329
+ transition: "background 0.15s, color 0.15s",
330
+ whiteSpace: "nowrap",
331
+ background: "transparent",
332
+ color: e ? "#858585" : "#586069"
333
+ },
334
+ tabActive: {
335
+ padding: "8px 16px",
336
+ border: "none",
337
+ cursor: "pointer",
338
+ fontSize: 13,
339
+ fontWeight: 500,
340
+ fontFamily: "inherit",
341
+ transition: "background 0.15s, color 0.15s",
342
+ whiteSpace: "nowrap",
343
+ background: e ? "#1e1e1e" : "#ffffff",
344
+ color: e ? "#ffffff" : "#24292e",
345
+ borderBottom: `2px solid ${e ? "#569cd6" : "#0366d6"}`
346
+ },
347
+ codeWrap: {
348
+ position: "relative",
349
+ overflow: "auto",
350
+ background: e ? "#1e1e1e" : "#f6f8fa"
351
+ },
352
+ copyBtn: {
353
+ position: "absolute",
354
+ top: 8,
355
+ right: 8,
356
+ padding: "4px 10px",
357
+ border: "1px solid",
358
+ borderRadius: 4,
359
+ cursor: "pointer",
360
+ fontSize: 12,
361
+ fontFamily: "inherit",
362
+ transition: "background 0.15s",
363
+ zIndex: 2,
364
+ background: e ? "#2d2d2d" : "#ffffff",
365
+ borderColor: e ? "#404040" : "#d1d5da",
366
+ color: e ? "#d4d4d4" : "#24292e"
367
+ },
368
+ copied: {
369
+ background: e ? "#2ea04370" : "#dcffe4",
370
+ borderColor: e ? "#2ea043" : "#34d058",
371
+ color: e ? "#7ee787" : "#22863a"
372
+ },
373
+ envBtn: {
374
+ padding: "4px 12px",
375
+ border: "1px solid",
376
+ cursor: "pointer",
377
+ fontSize: 12,
378
+ fontFamily: "inherit",
379
+ transition: "background 0.15s",
380
+ background: e ? "#2d2d2d" : "#f6f8fa",
381
+ borderColor: e ? "#404040" : "#d1d5da",
382
+ color: e ? "#a0a0a0" : "#586069"
383
+ },
384
+ envBtnActive: {
385
+ padding: "4px 12px",
386
+ border: "1px solid",
387
+ cursor: "pointer",
388
+ fontSize: 12,
389
+ fontFamily: "inherit",
390
+ transition: "background 0.15s",
391
+ background: e ? "#569cd6" : "#0366d6",
392
+ borderColor: e ? "#569cd6" : "#0366d6",
393
+ color: "#fff"
394
+ }
395
+ };
396
+ }
397
+ function Z(o) {
398
+ const {
399
+ config: e,
400
+ languages: n,
401
+ activeLanguage: t,
402
+ onLanguageChange: d,
403
+ theme: a,
404
+ codeHtml: c,
405
+ copied: l,
406
+ onCopy: b,
407
+ syntaxLanguage: m,
408
+ environment: u,
409
+ onEnvironmentChange: h,
410
+ className: g
411
+ } = o, r = X(a), y = typeof e.url == "object";
412
+ return /* @__PURE__ */ p("div", { style: r.container, className: g, children: [
413
+ (e.title || e.description || y) && /* @__PURE__ */ s("div", { style: r.header, children: /* @__PURE__ */ p("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center" }, children: [
414
+ /* @__PURE__ */ p("div", { children: [
415
+ e.title && /* @__PURE__ */ s("h3", { style: r.title, children: e.title }),
416
+ e.description && /* @__PURE__ */ s("p", { style: r.description, children: e.description })
417
+ ] }),
418
+ y && h && /* @__PURE__ */ p("div", { style: { display: "flex", gap: 0 }, children: [
419
+ /* @__PURE__ */ s("button", { type: "button", style: u === "dev" ? r.envBtnActive : r.envBtn, onClick: () => h("dev"), children: "Dev" }),
420
+ /* @__PURE__ */ s("button", { type: "button", style: u === "prod" ? r.envBtnActive : r.envBtn, onClick: () => h("prod"), children: "Prod" })
421
+ ] })
422
+ ] }) }),
423
+ /* @__PURE__ */ s("div", { style: r.tabs, children: n.map((i) => /* @__PURE__ */ s("button", { type: "button", onClick: () => d(i), style: t === i ? r.tabActive : r.tab, children: A[i] ?? i }, i)) }),
424
+ /* @__PURE__ */ p("div", { style: r.codeWrap, className: "ras-code", children: [
425
+ /* @__PURE__ */ s("button", { type: "button", onClick: b, style: { ...r.copyBtn, ...l ? r.copied : {} }, "aria-label": "Copy code", children: l ? "Copied!" : "Copy" }),
426
+ /* @__PURE__ */ s("pre", { style: { margin: 0, padding: 16, background: "transparent", overflow: "auto" }, children: /* @__PURE__ */ s("code", { className: `language-${m}`, dangerouslySetInnerHTML: { __html: c } }) })
427
+ ] })
428
+ ] });
429
+ }
430
+ function ee(o) {
431
+ const e = o === "dark";
432
+ return {
433
+ container: {
434
+ fontFamily: "'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif",
435
+ fontSize: 14,
436
+ lineHeight: 1.5,
437
+ color: e ? "#d4d4d4" : "#24292e"
438
+ },
439
+ header: {
440
+ marginBottom: 8
441
+ },
442
+ title: {
443
+ margin: 0,
444
+ fontSize: 14,
445
+ fontWeight: 600,
446
+ color: e ? "#e1e1e1" : "#24292e"
447
+ },
448
+ description: {
449
+ margin: "2px 0 0",
450
+ fontSize: 12,
451
+ color: e ? "#808080" : "#6a737d"
452
+ },
453
+ toolbar: {
454
+ display: "flex",
455
+ alignItems: "center",
456
+ justifyContent: "space-between",
457
+ marginBottom: 6
458
+ },
459
+ pills: {
460
+ display: "flex",
461
+ gap: 4
462
+ },
463
+ pill: {
464
+ padding: "3px 10px",
465
+ border: "none",
466
+ borderRadius: 999,
467
+ cursor: "pointer",
468
+ fontSize: 12,
469
+ fontWeight: 500,
470
+ fontFamily: "inherit",
471
+ transition: "background 0.15s, color 0.15s",
472
+ background: "transparent",
473
+ color: e ? "#707070" : "#8b949e"
474
+ },
475
+ pillActive: {
476
+ padding: "3px 10px",
477
+ border: "none",
478
+ borderRadius: 999,
479
+ cursor: "pointer",
480
+ fontSize: 12,
481
+ fontWeight: 500,
482
+ fontFamily: "inherit",
483
+ transition: "background 0.15s, color 0.15s",
484
+ background: e ? "#ffffff14" : "#0366d60d",
485
+ color: e ? "#e1e1e1" : "#0366d6"
486
+ },
487
+ envGroup: {
488
+ display: "flex",
489
+ gap: 2
490
+ },
491
+ envPill: {
492
+ padding: "2px 8px",
493
+ border: "none",
494
+ borderRadius: 999,
495
+ cursor: "pointer",
496
+ fontSize: 11,
497
+ fontFamily: "inherit",
498
+ background: "transparent",
499
+ color: e ? "#707070" : "#8b949e"
500
+ },
501
+ envPillActive: {
502
+ padding: "2px 8px",
503
+ border: "none",
504
+ borderRadius: 999,
505
+ cursor: "pointer",
506
+ fontSize: 11,
507
+ fontFamily: "inherit",
508
+ background: e ? "#ffffff14" : "#0366d60d",
509
+ color: e ? "#e1e1e1" : "#0366d6"
510
+ },
511
+ codeWrap: {
512
+ position: "relative",
513
+ overflow: "auto",
514
+ borderRadius: 8,
515
+ background: e ? "#161616" : "#f6f8fa"
516
+ },
517
+ copyBtn: {
518
+ position: "absolute",
519
+ top: 10,
520
+ right: 10,
521
+ padding: "3px 8px",
522
+ border: "none",
523
+ borderRadius: 4,
524
+ cursor: "pointer",
525
+ fontSize: 11,
526
+ fontFamily: "inherit",
527
+ transition: "opacity 0.15s",
528
+ zIndex: 2,
529
+ opacity: 0.6,
530
+ background: e ? "#333" : "#e1e4e8",
531
+ color: e ? "#ccc" : "#24292e"
532
+ },
533
+ copied: {
534
+ opacity: 1,
535
+ background: e ? "#2ea04370" : "#dcffe4",
536
+ color: e ? "#7ee787" : "#22863a"
537
+ }
538
+ };
539
+ }
540
+ function oe(o) {
541
+ const {
542
+ config: e,
543
+ languages: n,
544
+ activeLanguage: t,
545
+ onLanguageChange: d,
546
+ theme: a,
547
+ codeHtml: c,
548
+ copied: l,
549
+ onCopy: b,
550
+ syntaxLanguage: m,
551
+ environment: u,
552
+ onEnvironmentChange: h,
553
+ className: g
554
+ } = o, r = ee(a), y = typeof e.url == "object";
555
+ return /* @__PURE__ */ p("div", { style: r.container, className: g, children: [
556
+ (e.title || e.description) && /* @__PURE__ */ p("div", { style: r.header, children: [
557
+ e.title && /* @__PURE__ */ s("h3", { style: r.title, children: e.title }),
558
+ e.description && /* @__PURE__ */ s("p", { style: r.description, children: e.description })
559
+ ] }),
560
+ /* @__PURE__ */ p("div", { style: r.toolbar, children: [
561
+ /* @__PURE__ */ s("div", { style: r.pills, children: n.map((i) => /* @__PURE__ */ s("button", { type: "button", onClick: () => d(i), style: t === i ? r.pillActive : r.pill, children: A[i] ?? i }, i)) }),
562
+ y && h && /* @__PURE__ */ p("div", { style: r.envGroup, children: [
563
+ /* @__PURE__ */ s("button", { type: "button", style: u === "dev" ? r.envPillActive : r.envPill, onClick: () => h("dev"), children: "dev" }),
564
+ /* @__PURE__ */ s("button", { type: "button", style: u === "prod" ? r.envPillActive : r.envPill, onClick: () => h("prod"), children: "prod" })
565
+ ] })
566
+ ] }),
567
+ /* @__PURE__ */ p("div", { style: r.codeWrap, className: "ras-code", children: [
568
+ /* @__PURE__ */ s("button", { type: "button", onClick: b, style: { ...r.copyBtn, ...l ? r.copied : {} }, "aria-label": "Copy code", children: l ? "Copied!" : "Copy" }),
569
+ /* @__PURE__ */ s("pre", { style: { margin: 0, padding: "14px 16px", background: "transparent", overflow: "auto" }, children: /* @__PURE__ */ s("code", { className: `language-${m}`, dangerouslySetInnerHTML: { __html: c } }) })
570
+ ] })
571
+ ] });
572
+ }
573
+ function te(o) {
574
+ const e = o === "dark";
575
+ return {
576
+ container: {
577
+ fontFamily: "'SF Mono', 'Fira Code', Menlo, Consolas, monospace",
578
+ fontSize: 13,
579
+ lineHeight: 1.5,
580
+ borderRadius: 10,
581
+ overflow: "hidden",
582
+ boxShadow: e ? "0 8px 32px rgba(0,0,0,0.45)" : "0 4px 24px rgba(0,0,0,0.1)",
583
+ border: `1px solid ${e ? "#333" : "#d1d5da"}`
584
+ },
585
+ titleBar: {
586
+ display: "flex",
587
+ alignItems: "center",
588
+ gap: 10,
589
+ padding: "10px 14px",
590
+ background: e ? "#2d2d2d" : "#e8e8e8",
591
+ borderBottom: `1px solid ${e ? "#404040" : "#c8c8c8"}`,
592
+ userSelect: "none"
593
+ },
594
+ dots: {
595
+ display: "flex",
596
+ gap: 6,
597
+ flexShrink: 0
598
+ },
599
+ dot: (n) => ({
600
+ width: 12,
601
+ height: 12,
602
+ borderRadius: "50%",
603
+ background: n
604
+ }),
605
+ titleText: {
606
+ flex: 1,
607
+ textAlign: "center",
608
+ fontSize: 12,
609
+ fontWeight: 500,
610
+ color: e ? "#999" : "#666",
611
+ overflow: "hidden",
612
+ textOverflow: "ellipsis",
613
+ whiteSpace: "nowrap"
614
+ },
615
+ toolbar: {
616
+ display: "flex",
617
+ alignItems: "center",
618
+ gap: 8,
619
+ padding: "8px 14px",
620
+ background: e ? "#252526" : "#f0f0f0",
621
+ borderBottom: `1px solid ${e ? "#333" : "#d1d5da"}`
622
+ },
623
+ methodBadge: (n) => {
624
+ const t = {
625
+ GET: "#61affe",
626
+ POST: "#49cc90",
627
+ PUT: "#fca130",
628
+ PATCH: "#50e3c2",
629
+ DELETE: "#f93e3e"
630
+ };
631
+ return {
632
+ padding: "2px 8px",
633
+ borderRadius: 4,
634
+ fontSize: 11,
635
+ fontWeight: 700,
636
+ fontFamily: "inherit",
637
+ background: (t[n] ?? "#888") + "22",
638
+ color: t[n] ?? "#888",
639
+ letterSpacing: 0.5
640
+ };
641
+ },
642
+ urlBar: {
643
+ flex: 1,
644
+ padding: "4px 10px",
645
+ borderRadius: 4,
646
+ border: `1px solid ${e ? "#404040" : "#c8c8c8"}`,
647
+ background: e ? "#1e1e1e" : "#fff",
648
+ color: e ? "#d4d4d4" : "#24292e",
649
+ fontSize: 12,
650
+ fontFamily: "inherit",
651
+ overflow: "hidden",
652
+ textOverflow: "ellipsis",
653
+ whiteSpace: "nowrap"
654
+ },
655
+ select: {
656
+ padding: "4px 8px",
657
+ borderRadius: 4,
658
+ border: `1px solid ${e ? "#404040" : "#c8c8c8"}`,
659
+ background: e ? "#1e1e1e" : "#fff",
660
+ color: e ? "#d4d4d4" : "#24292e",
661
+ fontSize: 12,
662
+ fontFamily: "inherit",
663
+ cursor: "pointer",
664
+ outline: "none"
665
+ },
666
+ envBtn: {
667
+ padding: "3px 8px",
668
+ borderRadius: 4,
669
+ border: `1px solid ${e ? "#404040" : "#c8c8c8"}`,
670
+ background: e ? "#1e1e1e" : "#fff",
671
+ color: e ? "#808080" : "#666",
672
+ fontSize: 11,
673
+ fontFamily: "inherit",
674
+ cursor: "pointer"
675
+ },
676
+ envBtnActive: {
677
+ padding: "3px 8px",
678
+ borderRadius: 4,
679
+ border: "1px solid",
680
+ fontSize: 11,
681
+ fontFamily: "inherit",
682
+ cursor: "pointer",
683
+ background: e ? "#569cd633" : "#0366d611",
684
+ borderColor: e ? "#569cd6" : "#0366d6",
685
+ color: e ? "#569cd6" : "#0366d6"
686
+ },
687
+ body: {
688
+ position: "relative",
689
+ overflow: "auto",
690
+ background: e ? "#1a1a1a" : "#fafafa",
691
+ color: e ? "#d4d4d4" : "#24292e"
692
+ },
693
+ copyBtn: {
694
+ position: "absolute",
695
+ top: 8,
696
+ right: 12,
697
+ padding: "3px 8px",
698
+ border: `1px solid ${e ? "#404040" : "#c8c8c8"}`,
699
+ borderRadius: 4,
700
+ cursor: "pointer",
701
+ fontSize: 11,
702
+ fontFamily: "inherit",
703
+ transition: "background 0.15s",
704
+ zIndex: 2,
705
+ background: e ? "#2d2d2d" : "#f0f0f0",
706
+ color: e ? "#d4d4d4" : "#24292e"
707
+ },
708
+ copied: {
709
+ background: e ? "#2ea04370" : "#dcffe4",
710
+ borderColor: e ? "#2ea043" : "#34d058",
711
+ color: e ? "#7ee787" : "#22863a"
712
+ }
713
+ };
714
+ }
715
+ function re(o) {
716
+ const {
717
+ config: e,
718
+ languages: n,
719
+ activeLanguage: t,
720
+ onLanguageChange: d,
721
+ theme: a,
722
+ codeHtml: c,
723
+ copied: l,
724
+ onCopy: b,
725
+ syntaxLanguage: m,
726
+ environment: u,
727
+ onEnvironmentChange: h,
728
+ className: g
729
+ } = o, r = te(a), y = typeof e.url == "object", i = typeof e.url == "string" ? e.url : u === "dev" ? e.url.dev : e.url.prod;
730
+ return /* @__PURE__ */ p("div", { style: r.container, className: g, children: [
731
+ /* @__PURE__ */ p("div", { style: r.titleBar, children: [
732
+ /* @__PURE__ */ p("div", { style: r.dots, children: [
733
+ /* @__PURE__ */ s("span", { style: r.dot("#ff5f57") }),
734
+ /* @__PURE__ */ s("span", { style: r.dot("#febc2e") }),
735
+ /* @__PURE__ */ s("span", { style: r.dot("#28c840") })
736
+ ] }),
737
+ /* @__PURE__ */ s("div", { style: r.titleText, children: e.title || "API Request" }),
738
+ /* @__PURE__ */ s("div", { style: { width: 52, flexShrink: 0 } })
739
+ ] }),
740
+ /* @__PURE__ */ p("div", { style: r.toolbar, children: [
741
+ /* @__PURE__ */ s("span", { style: r.methodBadge(e.method), children: e.method }),
742
+ /* @__PURE__ */ s("div", { style: r.urlBar, children: i }),
743
+ /* @__PURE__ */ s(
744
+ "select",
745
+ {
746
+ style: r.select,
747
+ value: t,
748
+ onChange: (f) => d(f.target.value),
749
+ children: n.map((f) => /* @__PURE__ */ s("option", { value: f, children: A[f] ?? f }, f))
750
+ }
751
+ ),
752
+ y && h && /* @__PURE__ */ p(O, { children: [
753
+ /* @__PURE__ */ s("button", { type: "button", style: u === "dev" ? r.envBtnActive : r.envBtn, onClick: () => h("dev"), children: "DEV" }),
754
+ /* @__PURE__ */ s("button", { type: "button", style: u === "prod" ? r.envBtnActive : r.envBtn, onClick: () => h("prod"), children: "PROD" })
755
+ ] })
756
+ ] }),
757
+ /* @__PURE__ */ p("div", { style: r.body, className: "ras-code", children: [
758
+ /* @__PURE__ */ s("button", { type: "button", onClick: b, style: { ...r.copyBtn, ...l ? r.copied : {} }, "aria-label": "Copy code", children: l ? "Copied!" : "Copy" }),
759
+ /* @__PURE__ */ s("pre", { style: { margin: 0, padding: "14px 16px", background: "transparent", overflow: "auto" }, children: /* @__PURE__ */ s("code", { className: `language-${m}`, dangerouslySetInnerHTML: { __html: c } }) })
760
+ ] })
761
+ ] });
762
+ }
763
+ const z = {
764
+ classic: Z,
765
+ minimal: oe,
766
+ terminal: re
767
+ };
768
+ function ne(o) {
769
+ return typeof o == "function" ? o : z[o] ?? z.classic;
770
+ }
771
+ const ae = ["javascript", "python", "curl"], E = "ras-prism-theme";
772
+ function se(o) {
773
+ let e = document.getElementById(E);
774
+ e || (e = document.createElement("style"), e.id = E, document.head.appendChild(e)), e.textContent = o;
775
+ }
776
+ function de(o) {
777
+ return o.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
778
+ }
779
+ function be({
780
+ config: o,
781
+ languages: e = ae,
782
+ defaultLanguage: n = "javascript",
783
+ theme: t = "dark",
784
+ environment: d,
785
+ className: a,
786
+ variant: c = "classic"
787
+ }) {
788
+ const [l, b] = S(n), m = typeof o.url == "object", [u, h] = S(d ?? "prod"), [g, r] = S(!1);
789
+ I(() => {
790
+ se(K(t));
791
+ }, [t]);
792
+ const y = $(
793
+ () => J(o, { languages: e, environment: u }),
794
+ [o, e, u]
795
+ ), i = y[l] ?? "", f = W[l] ?? l, x = R.languages[f], L = $(
796
+ () => x ? R.highlight(i, x, f) : de(i),
797
+ [i, f, x]
798
+ ), F = H(() => {
799
+ navigator.clipboard.writeText(i).then(() => {
800
+ r(!0), setTimeout(() => r(!1), 2e3);
801
+ });
802
+ }, [i]), P = $(() => ne(c), [c]);
803
+ return /* @__PURE__ */ s(
804
+ P,
805
+ {
806
+ config: o,
807
+ languages: e,
808
+ activeLanguage: l,
809
+ onLanguageChange: b,
810
+ samples: y,
811
+ theme: t,
812
+ codeHtml: L,
813
+ codePlain: i,
814
+ syntaxLanguage: f,
815
+ copied: g,
816
+ onCopy: F,
817
+ environment: m ? u : void 0,
818
+ onEnvironmentChange: m ? h : void 0,
819
+ className: a
820
+ }
821
+ );
822
+ }
823
+ export {
824
+ be as ApiSamples,
825
+ Z as ClassicVariant,
826
+ oe as MinimalVariant,
827
+ re as TerminalVariant,
828
+ J as generateSamples
829
+ };
package/package.json ADDED
@@ -0,0 +1,42 @@
1
+ {
2
+ "name": "react-api-samples",
3
+ "version": "0.1.0",
4
+ "description": "Render multi-language API request code samples from a simple config object",
5
+ "type": "module",
6
+ "main": "dist/index.cjs",
7
+ "module": "dist/index.mjs",
8
+ "types": "dist/index.d.ts",
9
+ "exports": {
10
+ ".": {
11
+ "import": "./dist/index.mjs",
12
+ "require": "./dist/index.cjs",
13
+ "types": "./dist/index.d.ts"
14
+ }
15
+ },
16
+ "files": [
17
+ "dist"
18
+ ],
19
+ "scripts": {
20
+ "dev": "vite --config vite.demo.config.ts",
21
+ "build": "vite build",
22
+ "preview": "vite preview"
23
+ },
24
+ "peerDependencies": {
25
+ "react": "^18 || ^19",
26
+ "react-dom": "^18 || ^19",
27
+ "prismjs": "^1.29.0"
28
+ },
29
+ "devDependencies": {
30
+ "@types/prismjs": "^1.26.6",
31
+ "prismjs": "^1.29.0",
32
+ "@types/react": "^18.2.0",
33
+ "@types/react-dom": "^18.2.0",
34
+ "@vitejs/plugin-react": "^4.3.0",
35
+ "react": "^18.2.0",
36
+ "react-dom": "^18.2.0",
37
+ "typescript": "^5.4.0",
38
+ "vite": "^5.4.0",
39
+ "vite-plugin-dts": "^3.9.0"
40
+ },
41
+ "license": "MIT"
42
+ }