@kya-os/consent 0.1.0 → 0.1.2

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 (200) hide show
  1. package/dist/bundle/index.d.ts +44 -0
  2. package/dist/bundle/index.d.ts.map +1 -0
  3. package/dist/bundle/index.js +45 -0
  4. package/dist/bundle/index.js.map +1 -0
  5. package/dist/bundle/inline.d.ts +18 -0
  6. package/dist/bundle/inline.d.ts.map +1 -0
  7. package/dist/bundle/inline.js +18 -0
  8. package/dist/bundle/inline.js.map +1 -0
  9. package/dist/bundle/shell.d.ts +91 -0
  10. package/dist/bundle/shell.d.ts.map +1 -0
  11. package/dist/bundle/shell.js +282 -0
  12. package/dist/bundle/shell.js.map +1 -0
  13. package/dist/components/consent-button.d.ts +61 -0
  14. package/dist/components/consent-button.d.ts.map +1 -0
  15. package/dist/components/consent-button.js +177 -0
  16. package/dist/components/consent-button.js.map +1 -0
  17. package/dist/components/consent-checkbox.d.ts +61 -0
  18. package/dist/components/consent-checkbox.d.ts.map +1 -0
  19. package/dist/components/consent-checkbox.js +220 -0
  20. package/dist/components/consent-checkbox.js.map +1 -0
  21. package/dist/components/consent-input.d.ts +91 -0
  22. package/dist/components/consent-input.d.ts.map +1 -0
  23. package/dist/components/consent-input.js +332 -0
  24. package/dist/components/consent-input.js.map +1 -0
  25. package/dist/components/consent-oauth-button.d.ts +87 -0
  26. package/dist/components/consent-oauth-button.d.ts.map +1 -0
  27. package/dist/components/consent-oauth-button.js +389 -0
  28. package/dist/components/consent-oauth-button.js.map +1 -0
  29. package/dist/components/consent-otp-input.d.ts +92 -0
  30. package/dist/components/consent-otp-input.d.ts.map +1 -0
  31. package/dist/components/consent-otp-input.js +385 -0
  32. package/dist/components/consent-otp-input.js.map +1 -0
  33. package/dist/components/consent-permissions.d.ts +104 -0
  34. package/dist/components/consent-permissions.d.ts.map +1 -0
  35. package/dist/components/consent-permissions.js +430 -0
  36. package/dist/components/consent-permissions.js.map +1 -0
  37. package/dist/components/consent-shell.d.ts +72 -0
  38. package/dist/components/consent-shell.d.ts.map +1 -0
  39. package/dist/components/consent-shell.js +231 -0
  40. package/dist/components/consent-shell.js.map +1 -0
  41. package/dist/components/consent-terms.d.ts +89 -0
  42. package/dist/components/consent-terms.d.ts.map +1 -0
  43. package/dist/components/consent-terms.js +284 -0
  44. package/dist/components/consent-terms.js.map +1 -0
  45. package/dist/components/index.d.ts +19 -0
  46. package/dist/components/index.d.ts.map +1 -0
  47. package/dist/components/index.js +23 -0
  48. package/dist/components/index.js.map +1 -0
  49. package/dist/components/mcp-consent.d.ts +152 -0
  50. package/dist/components/mcp-consent.d.ts.map +1 -0
  51. package/dist/components/mcp-consent.js +874 -0
  52. package/dist/components/mcp-consent.js.map +1 -0
  53. package/dist/consent.js +3744 -0
  54. package/dist/consent.min.js +1564 -0
  55. package/dist/constants/auth-modes.d.ts +7 -2
  56. package/dist/constants/auth-modes.d.ts.map +1 -1
  57. package/dist/constants/auth-modes.js +28 -36
  58. package/dist/constants/auth-modes.js.map +1 -1
  59. package/dist/constants/colors.js +1 -4
  60. package/dist/constants/colors.js.map +1 -1
  61. package/dist/constants/defaults.d.ts +1 -1
  62. package/dist/constants/defaults.d.ts.map +1 -1
  63. package/dist/constants/defaults.js +16 -19
  64. package/dist/constants/defaults.js.map +1 -1
  65. package/dist/constants/index.d.ts +3 -3
  66. package/dist/constants/index.d.ts.map +1 -1
  67. package/dist/constants/index.js +3 -26
  68. package/dist/constants/index.js.map +1 -1
  69. package/dist/index.d.ts +10 -7
  70. package/dist/index.d.ts.map +1 -1
  71. package/dist/index.js +12 -23
  72. package/dist/index.js.map +1 -1
  73. package/dist/react/index.d.ts +123 -0
  74. package/dist/react/index.d.ts.map +1 -0
  75. package/dist/react/index.js +154 -0
  76. package/dist/react/index.js.map +1 -0
  77. package/dist/resolution/index.d.ts +3 -3
  78. package/dist/resolution/index.d.ts.map +1 -1
  79. package/dist/resolution/index.js +3 -19
  80. package/dist/resolution/index.js.map +1 -1
  81. package/dist/resolution/resolve-branding.d.ts +1 -1
  82. package/dist/resolution/resolve-branding.d.ts.map +1 -1
  83. package/dist/resolution/resolve-branding.js +14 -24
  84. package/dist/resolution/resolve-branding.js.map +1 -1
  85. package/dist/resolution/resolve-config.d.ts +2 -2
  86. package/dist/resolution/resolve-config.d.ts.map +1 -1
  87. package/dist/resolution/resolve-config.js +57 -53
  88. package/dist/resolution/resolve-config.js.map +1 -1
  89. package/dist/resolution/resolve-copy.d.ts +2 -2
  90. package/dist/resolution/resolve-copy.d.ts.map +1 -1
  91. package/dist/resolution/resolve-copy.js +35 -43
  92. package/dist/resolution/resolve-copy.js.map +1 -1
  93. package/dist/schemas/api.schemas.d.ts +7 -4
  94. package/dist/schemas/api.schemas.d.ts.map +1 -1
  95. package/dist/schemas/api.schemas.js +70 -74
  96. package/dist/schemas/api.schemas.js.map +1 -1
  97. package/dist/schemas/branding.schemas.js +17 -20
  98. package/dist/schemas/branding.schemas.js.map +1 -1
  99. package/dist/schemas/config.schemas.d.ts +1 -1
  100. package/dist/schemas/config.schemas.d.ts.map +1 -1
  101. package/dist/schemas/config.schemas.js +64 -70
  102. package/dist/schemas/config.schemas.js.map +1 -1
  103. package/dist/schemas/index.d.ts +4 -4
  104. package/dist/schemas/index.d.ts.map +1 -1
  105. package/dist/schemas/index.js +4 -20
  106. package/dist/schemas/index.js.map +1 -1
  107. package/dist/schemas/modes.schemas.js +60 -63
  108. package/dist/schemas/modes.schemas.js.map +1 -1
  109. package/dist/security/escape.d.ts.map +1 -1
  110. package/dist/security/escape.js +12 -17
  111. package/dist/security/escape.js.map +1 -1
  112. package/dist/security/index.d.ts +2 -2
  113. package/dist/security/index.d.ts.map +1 -1
  114. package/dist/security/index.js +2 -18
  115. package/dist/security/index.js.map +1 -1
  116. package/dist/security/validators.js +9 -20
  117. package/dist/security/validators.js.map +1 -1
  118. package/dist/styles/css-variables.d.ts +1 -1
  119. package/dist/styles/css-variables.d.ts.map +1 -1
  120. package/dist/styles/css-variables.js +18 -27
  121. package/dist/styles/css-variables.js.map +1 -1
  122. package/dist/styles/index.d.ts +3 -3
  123. package/dist/styles/index.d.ts.map +1 -1
  124. package/dist/styles/index.js +3 -19
  125. package/dist/styles/index.js.map +1 -1
  126. package/dist/styles/stylesheet.d.ts +1 -1
  127. package/dist/styles/stylesheet.d.ts.map +1 -1
  128. package/dist/styles/stylesheet.js +20 -27
  129. package/dist/styles/stylesheet.js.map +1 -1
  130. package/dist/styles/tokens.js +1 -4
  131. package/dist/styles/tokens.js.map +1 -1
  132. package/dist/templates/base/base-template.d.ts +3 -3
  133. package/dist/templates/base/base-template.d.ts.map +1 -1
  134. package/dist/templates/base/base-template.js +31 -35
  135. package/dist/templates/base/base-template.js.map +1 -1
  136. package/dist/templates/base/components.js +49 -65
  137. package/dist/templates/base/components.js.map +1 -1
  138. package/dist/templates/base/index.d.ts +2 -2
  139. package/dist/templates/base/index.d.ts.map +1 -1
  140. package/dist/templates/base/index.js +2 -20
  141. package/dist/templates/base/index.js.map +1 -1
  142. package/dist/templates/index.d.ts +9 -9
  143. package/dist/templates/index.d.ts.map +1 -1
  144. package/dist/templates/index.js +9 -25
  145. package/dist/templates/index.js.map +1 -1
  146. package/dist/templates/modes/consent-only.template.d.ts +2 -2
  147. package/dist/templates/modes/consent-only.template.d.ts.map +1 -1
  148. package/dist/templates/modes/consent-only.template.js +11 -15
  149. package/dist/templates/modes/consent-only.template.js.map +1 -1
  150. package/dist/templates/modes/credentials.template.d.ts +4 -4
  151. package/dist/templates/modes/credentials.template.d.ts.map +1 -1
  152. package/dist/templates/modes/credentials.template.js +20 -24
  153. package/dist/templates/modes/credentials.template.js.map +1 -1
  154. package/dist/templates/modes/index.d.ts +6 -6
  155. package/dist/templates/modes/index.d.ts.map +1 -1
  156. package/dist/templates/modes/index.js +6 -16
  157. package/dist/templates/modes/index.js.map +1 -1
  158. package/dist/templates/modes/magic-link.template.d.ts +2 -2
  159. package/dist/templates/modes/magic-link.template.d.ts.map +1 -1
  160. package/dist/templates/modes/magic-link.template.js +14 -18
  161. package/dist/templates/modes/magic-link.template.js.map +1 -1
  162. package/dist/templates/modes/oauth.template.d.ts +2 -2
  163. package/dist/templates/modes/oauth.template.d.ts.map +1 -1
  164. package/dist/templates/modes/oauth.template.js +21 -25
  165. package/dist/templates/modes/oauth.template.js.map +1 -1
  166. package/dist/templates/modes/otp.template.d.ts +2 -2
  167. package/dist/templates/modes/otp.template.d.ts.map +1 -1
  168. package/dist/templates/modes/otp.template.js +17 -21
  169. package/dist/templates/modes/otp.template.js.map +1 -1
  170. package/dist/templates/modes/success.template.d.ts +2 -2
  171. package/dist/templates/modes/success.template.d.ts.map +1 -1
  172. package/dist/templates/modes/success.template.js +24 -29
  173. package/dist/templates/modes/success.template.js.map +1 -1
  174. package/dist/templates/registry.d.ts +4 -4
  175. package/dist/templates/registry.d.ts.map +1 -1
  176. package/dist/templates/registry.js +30 -38
  177. package/dist/templates/registry.js.map +1 -1
  178. package/dist/types/api.types.d.ts +6 -5
  179. package/dist/types/api.types.d.ts.map +1 -1
  180. package/dist/types/api.types.js +1 -2
  181. package/dist/types/api.types.js.map +1 -1
  182. package/dist/types/branding.types.js +1 -2
  183. package/dist/types/branding.types.js.map +1 -1
  184. package/dist/types/config.types.d.ts +5 -5
  185. package/dist/types/config.types.d.ts.map +1 -1
  186. package/dist/types/config.types.js +1 -2
  187. package/dist/types/config.types.js.map +1 -1
  188. package/dist/types/copy.types.js +1 -2
  189. package/dist/types/copy.types.js.map +1 -1
  190. package/dist/types/index.d.ts +6 -6
  191. package/dist/types/index.d.ts.map +1 -1
  192. package/dist/types/index.js +6 -22
  193. package/dist/types/index.js.map +1 -1
  194. package/dist/types/modes.types.js +1 -4
  195. package/dist/types/modes.types.js.map +1 -1
  196. package/dist/types/page.types.d.ts +6 -6
  197. package/dist/types/page.types.d.ts.map +1 -1
  198. package/dist/types/page.types.js +1 -2
  199. package/dist/types/page.types.js.map +1 -1
  200. package/package.json +41 -4
@@ -0,0 +1,282 @@
1
+ /**
2
+ * Consent HTML Shell Generator
3
+ *
4
+ * Generates the minimal HTML shell that Workers serve for consent pages.
5
+ * The shell loads the bundled consent.js and renders <mcp-consent>.
6
+ *
7
+ * Architecture:
8
+ * 1. Worker receives consent page request
9
+ * 2. Worker calls generateConsentShell() with config
10
+ * 3. Browser loads HTML, fetches consent.js
11
+ * 4. Lit components render the consent UI
12
+ * 5. Form submission posts back to Worker
13
+ *
14
+ * @module @kya-os/consent/bundle/shell
15
+ */
16
+ import { escapeHtml, escapeAttr } from '../security/escape.js';
17
+ /**
18
+ * Generate the consent page HTML shell
19
+ *
20
+ * This produces a minimal HTML document that:
21
+ * - Loads the bundled consent.js
22
+ * - Renders the <mcp-consent> web component
23
+ * - Includes a loading skeleton for perceived performance
24
+ * - Has a no-JS fallback form
25
+ *
26
+ * @example
27
+ * ```typescript
28
+ * const html = generateConsentShell({
29
+ * config: remoteConfig,
30
+ * tool: 'purchase',
31
+ * scopes: ['billing:read', 'orders:write'],
32
+ * agentDid: 'did:key:z6Mk...',
33
+ * sessionId: 'sess_abc123',
34
+ * projectId: 'proj_xyz',
35
+ * serverUrl: 'https://api.example.com',
36
+ * });
37
+ *
38
+ * return new Response(html, {
39
+ * headers: { 'Content-Type': 'text/html' }
40
+ * });
41
+ * ```
42
+ */
43
+ export function generateConsentShell(options) {
44
+ const { config, tool, scopes, agentDid, sessionId, projectId, serverUrl, oauthIdentity, bundlePath = '/consent.js', pageTitle = 'Permission Request', nonce, authMode, provider, } = options;
45
+ // Safely serialize config as JSON for attribute
46
+ const configJson = JSON.stringify(config);
47
+ const scopesJson = JSON.stringify(scopes);
48
+ const oauthJson = oauthIdentity ? JSON.stringify(oauthIdentity) : null;
49
+ // Build nonce attribute if provided
50
+ const nonceAttr = nonce ? ` nonce="${escapeAttr(nonce)}"` : '';
51
+ return `<!DOCTYPE html>
52
+ <html lang="en">
53
+ <head>
54
+ <meta charset="UTF-8">
55
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
56
+ <meta http-equiv="X-UA-Compatible" content="ie=edge">
57
+ <title>${escapeHtml(pageTitle)}</title>
58
+
59
+ <!-- Preload the bundle for faster loading -->
60
+ <link rel="preload" href="${escapeAttr(bundlePath)}" as="script" crossorigin>
61
+
62
+ <!-- Load consent components bundle -->
63
+ <script type="module" src="${escapeAttr(bundlePath)}"${nonceAttr}></script>
64
+
65
+ <style${nonceAttr}>
66
+ /* Base styles */
67
+ *, *::before, *::after {
68
+ box-sizing: border-box;
69
+ }
70
+
71
+ body {
72
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
73
+ background: #f3f4f6;
74
+ min-height: 100vh;
75
+ margin: 0;
76
+ display: flex;
77
+ align-items: center;
78
+ justify-content: center;
79
+ padding: 1rem;
80
+ }
81
+
82
+ /* Loading skeleton - shown while component loads */
83
+ .loading-skeleton {
84
+ max-width: 512px;
85
+ width: 100%;
86
+ background: white;
87
+ border-radius: 20px;
88
+ padding: 2rem;
89
+ box-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25);
90
+ }
91
+
92
+ .skeleton-header {
93
+ display: flex;
94
+ align-items: center;
95
+ gap: 1rem;
96
+ margin-bottom: 1.5rem;
97
+ }
98
+
99
+ .skeleton-avatar {
100
+ width: 48px;
101
+ height: 48px;
102
+ background: #e5e7eb;
103
+ border-radius: 12px;
104
+ animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
105
+ }
106
+
107
+ .skeleton-line {
108
+ height: 1rem;
109
+ background: #e5e7eb;
110
+ border-radius: 0.25rem;
111
+ margin-bottom: 0.75rem;
112
+ animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
113
+ }
114
+
115
+ .skeleton-line.short { width: 60%; }
116
+ .skeleton-line.medium { width: 80%; }
117
+ .skeleton-line.full { width: 100%; }
118
+
119
+ .skeleton-button {
120
+ height: 44px;
121
+ background: #e5e7eb;
122
+ border-radius: 8px;
123
+ margin-top: 1.5rem;
124
+ animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
125
+ }
126
+
127
+ @keyframes pulse {
128
+ 0%, 100% { opacity: 1; }
129
+ 50% { opacity: 0.5; }
130
+ }
131
+
132
+ /* Hide skeleton when component is defined */
133
+ mcp-consent:defined + .loading-skeleton {
134
+ display: none;
135
+ }
136
+
137
+ /* No-JS fallback styling */
138
+ noscript .fallback-form {
139
+ max-width: 512px;
140
+ width: 100%;
141
+ background: white;
142
+ border-radius: 20px;
143
+ padding: 2rem;
144
+ box-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25);
145
+ }
146
+
147
+ noscript h1 {
148
+ font-size: 1.25rem;
149
+ font-weight: 600;
150
+ color: #111827;
151
+ margin: 0 0 1rem;
152
+ }
153
+
154
+ noscript p {
155
+ color: #6b7280;
156
+ margin: 0 0 1.5rem;
157
+ }
158
+
159
+ noscript button {
160
+ width: 100%;
161
+ padding: 0.75rem 1rem;
162
+ background: #2563eb;
163
+ color: white;
164
+ border: none;
165
+ border-radius: 8px;
166
+ font-size: 0.875rem;
167
+ font-weight: 500;
168
+ cursor: pointer;
169
+ }
170
+
171
+ noscript button:hover {
172
+ background: #1d4ed8;
173
+ }
174
+ </style>
175
+ </head>
176
+ <body>
177
+ <!-- Main consent component -->
178
+ <mcp-consent
179
+ config='${escapeAttr(configJson)}'
180
+ tool="${escapeAttr(tool)}"
181
+ scopes='${escapeAttr(scopesJson)}'
182
+ agent-did="${escapeAttr(agentDid)}"
183
+ session-id="${escapeAttr(sessionId)}"
184
+ project-id="${escapeAttr(projectId)}"
185
+ server-url="${escapeAttr(serverUrl)}"
186
+ ${oauthJson ? `oauth-identity='${escapeAttr(oauthJson)}'` : ''}
187
+ ${authMode ? `auth-mode="${escapeAttr(authMode)}"` : ''}
188
+ ${provider ? `provider="${escapeAttr(provider)}"` : ''}
189
+ ></mcp-consent>
190
+
191
+ <!-- Loading skeleton (hidden once component is defined) -->
192
+ <div class="loading-skeleton" aria-hidden="true">
193
+ <div class="skeleton-header">
194
+ <div class="skeleton-avatar"></div>
195
+ <div style="flex: 1">
196
+ <div class="skeleton-line short"></div>
197
+ <div class="skeleton-line medium" style="margin-bottom: 0; height: 0.75rem;"></div>
198
+ </div>
199
+ </div>
200
+ <div class="skeleton-line full"></div>
201
+ <div class="skeleton-line medium"></div>
202
+ <div class="skeleton-line short"></div>
203
+ <div class="skeleton-button"></div>
204
+ </div>
205
+
206
+ <!-- No-JS fallback - basic form submission -->
207
+ <noscript>
208
+ <form class="fallback-form" method="POST" action="${escapeAttr(serverUrl)}/consent/approve">
209
+ <h1>Permission Request</h1>
210
+ <p>JavaScript is required for the full consent experience. You can still approve basic access below.</p>
211
+
212
+ <input type="hidden" name="tool" value="${escapeAttr(tool)}">
213
+ <input type="hidden" name="scopes" value="${escapeAttr(scopesJson)}">
214
+ <input type="hidden" name="agent_did" value="${escapeAttr(agentDid)}">
215
+ <input type="hidden" name="session_id" value="${escapeAttr(sessionId)}">
216
+ <input type="hidden" name="project_id" value="${escapeAttr(projectId)}">
217
+ <input type="hidden" name="auth_mode" value="consent-only">
218
+ <input type="hidden" name="provider_type" value="none">
219
+
220
+ <button type="submit">Allow Basic Access</button>
221
+ </form>
222
+ </noscript>
223
+ </body>
224
+ </html>`;
225
+ }
226
+ /**
227
+ * Generate inline consent component (no external bundle)
228
+ *
229
+ * For scenarios where you want to inline everything into a single HTML response.
230
+ * This is useful for:
231
+ * - Offline/embedded scenarios
232
+ * - Single-request consent pages
233
+ * - Testing/debugging
234
+ *
235
+ * Note: This requires the consent bundle to be inlined as a string.
236
+ *
237
+ * @param options - Shell options
238
+ * @param bundleSource - The bundled consent.js source code
239
+ */
240
+ export function generateInlineConsentShell(options, bundleSource) {
241
+ const { config, tool, scopes, agentDid, sessionId, projectId, serverUrl, oauthIdentity, pageTitle = 'Permission Request', nonce, } = options;
242
+ const configJson = JSON.stringify(config);
243
+ const scopesJson = JSON.stringify(scopes);
244
+ const oauthJson = oauthIdentity ? JSON.stringify(oauthIdentity) : null;
245
+ const nonceAttr = nonce ? ` nonce="${escapeAttr(nonce)}"` : '';
246
+ return `<!DOCTYPE html>
247
+ <html lang="en">
248
+ <head>
249
+ <meta charset="UTF-8">
250
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
251
+ <title>${escapeHtml(pageTitle)}</title>
252
+ <script type="module"${nonceAttr}>
253
+ ${bundleSource}
254
+ </script>
255
+ <style${nonceAttr}>
256
+ body {
257
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
258
+ background: #f3f4f6;
259
+ min-height: 100vh;
260
+ margin: 0;
261
+ display: flex;
262
+ align-items: center;
263
+ justify-content: center;
264
+ padding: 1rem;
265
+ }
266
+ </style>
267
+ </head>
268
+ <body>
269
+ <mcp-consent
270
+ config='${escapeAttr(configJson)}'
271
+ tool="${escapeAttr(tool)}"
272
+ scopes='${escapeAttr(scopesJson)}'
273
+ agent-did="${escapeAttr(agentDid)}"
274
+ session-id="${escapeAttr(sessionId)}"
275
+ project-id="${escapeAttr(projectId)}"
276
+ server-url="${escapeAttr(serverUrl)}"
277
+ ${oauthJson ? `oauth-identity='${escapeAttr(oauthJson)}'` : ''}
278
+ ></mcp-consent>
279
+ </body>
280
+ </html>`;
281
+ }
282
+ //# sourceMappingURL=shell.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"shell.js","sourceRoot":"","sources":["../../src/bundle/shell.ts"],"names":[],"mappings":"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"}
@@ -0,0 +1,61 @@
1
+ /**
2
+ * Consent Button Web Component
3
+ *
4
+ * A styled button for consent pages that works in:
5
+ * - Browser (vanilla HTML)
6
+ * - React (via @lit/react wrapper)
7
+ * - SSR (Declarative Shadow DOM)
8
+ *
9
+ * @module components/consent-button
10
+ */
11
+ import { LitElement } from 'lit';
12
+ /**
13
+ * Button variants matching AgentShield design system
14
+ */
15
+ export type ButtonVariant = 'primary' | 'secondary';
16
+ /**
17
+ * ConsentButton - A themed button component
18
+ *
19
+ * @example
20
+ * ```html
21
+ * <consent-button variant="primary">Allow Access</consent-button>
22
+ * <consent-button variant="secondary">Cancel</consent-button>
23
+ * ```
24
+ *
25
+ * @csspart button - The native button element
26
+ * @cssprop --consent-primary - Primary brand color (default: #2563EB)
27
+ */
28
+ export declare class ConsentButton extends LitElement {
29
+ static formAssociated: boolean;
30
+ private internals;
31
+ constructor();
32
+ /**
33
+ * Button variant - 'primary' (filled) or 'secondary' (outlined)
34
+ */
35
+ variant: ButtonVariant;
36
+ /**
37
+ * Button type attribute (button, submit, reset)
38
+ */
39
+ type: 'button' | 'submit' | 'reset';
40
+ /**
41
+ * Disabled state
42
+ */
43
+ disabled: boolean;
44
+ /**
45
+ * Full width mode
46
+ */
47
+ fullWidth: boolean;
48
+ /**
49
+ * Loading state - shows spinner and disables button
50
+ */
51
+ loading: boolean;
52
+ static styles: import("lit").CSSResult;
53
+ private handleClick;
54
+ render(): import("lit").TemplateResult<1>;
55
+ }
56
+ declare global {
57
+ interface HTMLElementTagNameMap {
58
+ 'consent-button': ConsentButton;
59
+ }
60
+ }
61
+ //# sourceMappingURL=consent-button.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"consent-button.d.ts","sourceRoot":"","sources":["../../src/components/consent-button.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AAEH,OAAO,EAAE,UAAU,EAAa,MAAM,KAAK,CAAC;AAG5C;;GAEG;AACH,MAAM,MAAM,aAAa,GAAG,SAAS,GAAG,WAAW,CAAC;AAEpD;;;;;;;;;;;GAWG;AACH,qBACa,aAAc,SAAQ,UAAU;IAE3C,MAAM,CAAC,cAAc,UAAQ;IAE7B,OAAO,CAAC,SAAS,CAAmB;;IAOpC;;OAEG;IAEH,OAAO,EAAE,aAAa,CAAa;IAEnC;;OAEG;IAEH,IAAI,EAAE,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAY;IAE/C;;OAEG;IAEH,QAAQ,UAAS;IAEjB;;OAEG;IAEH,SAAS,UAAS;IAElB;;OAEG;IAEH,OAAO,UAAS;IAEhB,OAAgB,MAAM,0BAsEpB;IAEF,OAAO,CAAC,WAAW;IAcV,MAAM;CAchB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,gBAAgB,EAAE,aAAa,CAAC;KACjC;CACF"}
@@ -0,0 +1,177 @@
1
+ /**
2
+ * Consent Button Web Component
3
+ *
4
+ * A styled button for consent pages that works in:
5
+ * - Browser (vanilla HTML)
6
+ * - React (via @lit/react wrapper)
7
+ * - SSR (Declarative Shadow DOM)
8
+ *
9
+ * @module components/consent-button
10
+ */
11
+ var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
12
+ var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
13
+ if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
14
+ else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
15
+ return c > 3 && r && Object.defineProperty(target, key, r), r;
16
+ };
17
+ import { LitElement, html, css } from 'lit';
18
+ import { customElement, property } from 'lit/decorators.js';
19
+ /**
20
+ * ConsentButton - A themed button component
21
+ *
22
+ * @example
23
+ * ```html
24
+ * <consent-button variant="primary">Allow Access</consent-button>
25
+ * <consent-button variant="secondary">Cancel</consent-button>
26
+ * ```
27
+ *
28
+ * @csspart button - The native button element
29
+ * @cssprop --consent-primary - Primary brand color (default: #2563EB)
30
+ */
31
+ let ConsentButton = class ConsentButton extends LitElement {
32
+ constructor() {
33
+ super();
34
+ /**
35
+ * Button variant - 'primary' (filled) or 'secondary' (outlined)
36
+ */
37
+ this.variant = 'primary';
38
+ /**
39
+ * Button type attribute (button, submit, reset)
40
+ */
41
+ this.type = 'button';
42
+ /**
43
+ * Disabled state
44
+ */
45
+ this.disabled = false;
46
+ /**
47
+ * Full width mode
48
+ */
49
+ this.fullWidth = false;
50
+ /**
51
+ * Loading state - shows spinner and disables button
52
+ */
53
+ this.loading = false;
54
+ this.internals = this.attachInternals();
55
+ }
56
+ handleClick() {
57
+ if (this.disabled || this.loading)
58
+ return;
59
+ const form = this.internals.form;
60
+ if (!form)
61
+ return;
62
+ if (this.type === 'submit') {
63
+ // Trigger form submission
64
+ form.requestSubmit();
65
+ }
66
+ else if (this.type === 'reset') {
67
+ form.reset();
68
+ }
69
+ }
70
+ render() {
71
+ return html `
72
+ <button
73
+ part="button"
74
+ type="button"
75
+ ?disabled=${this.disabled || this.loading}
76
+ aria-busy=${this.loading}
77
+ @click=${this.handleClick}
78
+ >
79
+ ${this.loading ? html `<span class="spinner"></span>` : null}
80
+ <slot></slot>
81
+ </button>
82
+ `;
83
+ }
84
+ };
85
+ // Enable form association
86
+ ConsentButton.formAssociated = true;
87
+ ConsentButton.styles = css `
88
+ :host {
89
+ display: inline-block;
90
+ }
91
+
92
+ :host([full-width]) {
93
+ display: block;
94
+ width: 100%;
95
+ }
96
+
97
+ button {
98
+ /* Base styles - matches AgentShield PreviewButton exactly */
99
+ padding: 0.75rem 1rem;
100
+ height: 2.75rem;
101
+ border-radius: 0.5rem;
102
+ font-size: 0.875rem;
103
+ font-weight: 500;
104
+ font-family: inherit;
105
+ cursor: pointer;
106
+ transition: opacity 0.15s ease, background-color 0.15s ease;
107
+ border: none;
108
+ width: 100%;
109
+ display: inline-flex;
110
+ align-items: center;
111
+ justify-content: center;
112
+ gap: 0.5rem;
113
+ }
114
+
115
+ /* Primary variant */
116
+ :host([variant='primary']) button {
117
+ background-color: var(--consent-primary, #2563eb);
118
+ color: white;
119
+ }
120
+
121
+ :host([variant='primary']) button:hover:not(:disabled) {
122
+ opacity: 0.9;
123
+ }
124
+
125
+ /* Secondary variant */
126
+ :host([variant='secondary']) button {
127
+ background-color: transparent;
128
+ color: #374151;
129
+ border: 1px solid #d1d5db;
130
+ }
131
+
132
+ :host([variant='secondary']) button:hover:not(:disabled) {
133
+ background-color: #f9fafb;
134
+ }
135
+
136
+ /* Disabled state */
137
+ button:disabled {
138
+ opacity: 0.5;
139
+ cursor: not-allowed;
140
+ }
141
+
142
+ /* Loading spinner */
143
+ .spinner {
144
+ width: 1rem;
145
+ height: 1rem;
146
+ border: 2px solid currentColor;
147
+ border-top-color: transparent;
148
+ border-radius: 50%;
149
+ animation: spin 0.8s linear infinite;
150
+ }
151
+
152
+ @keyframes spin {
153
+ to {
154
+ transform: rotate(360deg);
155
+ }
156
+ }
157
+ `;
158
+ __decorate([
159
+ property({ type: String, reflect: true })
160
+ ], ConsentButton.prototype, "variant", void 0);
161
+ __decorate([
162
+ property({ type: String })
163
+ ], ConsentButton.prototype, "type", void 0);
164
+ __decorate([
165
+ property({ type: Boolean, reflect: true })
166
+ ], ConsentButton.prototype, "disabled", void 0);
167
+ __decorate([
168
+ property({ type: Boolean, attribute: 'full-width' })
169
+ ], ConsentButton.prototype, "fullWidth", void 0);
170
+ __decorate([
171
+ property({ type: Boolean, reflect: true })
172
+ ], ConsentButton.prototype, "loading", void 0);
173
+ ConsentButton = __decorate([
174
+ customElement('consent-button')
175
+ ], ConsentButton);
176
+ export { ConsentButton };
177
+ //# sourceMappingURL=consent-button.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"consent-button.js","sourceRoot":"","sources":["../../src/components/consent-button.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;;;;;;;AAEH,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC5C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAO5D;;;;;;;;;;;GAWG;AAEI,IAAM,aAAa,GAAnB,MAAM,aAAc,SAAQ,UAAU;IAM3C;QACE,KAAK,EAAE,CAAC;QAIV;;WAEG;QAEH,YAAO,GAAkB,SAAS,CAAC;QAEnC;;WAEG;QAEH,SAAI,GAAkC,QAAQ,CAAC;QAE/C;;WAEG;QAEH,aAAQ,GAAG,KAAK,CAAC;QAEjB;;WAEG;QAEH,cAAS,GAAG,KAAK,CAAC;QAElB;;WAEG;QAEH,YAAO,GAAG,KAAK,CAAC;QA/Bd,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,eAAe,EAAE,CAAC;IAC1C,CAAC;IAwGO,WAAW;QACjB,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,OAAO;YAAE,OAAO;QAE1C,MAAM,IAAI,GAAG,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC;QACjC,IAAI,CAAC,IAAI;YAAE,OAAO;QAElB,IAAI,IAAI,CAAC,IAAI,KAAK,QAAQ,EAAE,CAAC;YAC3B,0BAA0B;YAC1B,IAAI,CAAC,aAAa,EAAE,CAAC;QACvB,CAAC;aAAM,IAAI,IAAI,CAAC,IAAI,KAAK,OAAO,EAAE,CAAC;YACjC,IAAI,CAAC,KAAK,EAAE,CAAC;QACf,CAAC;IACH,CAAC;IAEQ,MAAM;QACb,OAAO,IAAI,CAAA;;;;oBAIK,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,OAAO;oBAC7B,IAAI,CAAC,OAAO;iBACf,IAAI,CAAC,WAAW;;UAEvB,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAA,+BAA+B,CAAC,CAAC,CAAC,IAAI;;;KAG9D,CAAC;IACJ,CAAC;;AA3ID,0BAA0B;AACnB,4BAAc,GAAG,IAAI,AAAP,CAAQ;AAuCb,oBAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsE3B,AAtEqB,CAsEpB;AAhGF;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;8CACP;AAMnC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;2CACoB;AAM/C;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;+CAC1B;AAMjB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,CAAC;gDACnC;AAMlB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;8CAC3B;AAvCL,aAAa;IADzB,aAAa,CAAC,gBAAgB,CAAC;GACnB,aAAa,CA6IzB"}
@@ -0,0 +1,61 @@
1
+ /**
2
+ * Consent Checkbox Web Component
3
+ *
4
+ * A styled checkbox for consent pages with label support.
5
+ * Works in browser, React, and SSR environments.
6
+ * Implements Form Associated Custom Elements for proper form participation.
7
+ *
8
+ * @module components/consent-checkbox
9
+ */
10
+ import { LitElement } from 'lit';
11
+ /**
12
+ * ConsentCheckbox - A themed checkbox component with label
13
+ *
14
+ * @example
15
+ * ```html
16
+ * <consent-checkbox name="terms" required>
17
+ * I agree to the <a href="/terms">Terms</a>
18
+ * </consent-checkbox>
19
+ * ```
20
+ *
21
+ * @fires change - Fired when checkbox state changes
22
+ * @csspart checkbox - The checkbox input element
23
+ * @csspart label - The label text wrapper
24
+ * @cssprop --consent-primary - Primary brand color for checked state
25
+ */
26
+ export declare class ConsentCheckbox extends LitElement {
27
+ static formAssociated: boolean;
28
+ private internals;
29
+ constructor();
30
+ /**
31
+ * Form field name
32
+ */
33
+ name: string;
34
+ /**
35
+ * Checked state
36
+ */
37
+ checked: boolean;
38
+ /**
39
+ * Required for form validation
40
+ */
41
+ required: boolean;
42
+ /**
43
+ * Disabled state
44
+ */
45
+ disabled: boolean;
46
+ /**
47
+ * Value when checked
48
+ */
49
+ value: string;
50
+ static styles: import("lit").CSSResult;
51
+ protected updated(changedProperties: Map<string, unknown>): void;
52
+ private updateFormValue;
53
+ private handleChange;
54
+ render(): import("lit").TemplateResult<1>;
55
+ }
56
+ declare global {
57
+ interface HTMLElementTagNameMap {
58
+ 'consent-checkbox': ConsentCheckbox;
59
+ }
60
+ }
61
+ //# sourceMappingURL=consent-checkbox.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"consent-checkbox.d.ts","sourceRoot":"","sources":["../../src/components/consent-checkbox.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,OAAO,EAAE,UAAU,EAAa,MAAM,KAAK,CAAC;AAG5C;;;;;;;;;;;;;;GAcG;AACH,qBACa,eAAgB,SAAQ,UAAU;IAE7C,MAAM,CAAC,cAAc,UAAQ;IAE7B,OAAO,CAAC,SAAS,CAAmB;;IAOpC;;OAEG;IAEH,IAAI,SAAM;IAEV;;OAEG;IAEH,OAAO,UAAS;IAEhB;;OAEG;IAEH,QAAQ,UAAS;IAEjB;;OAEG;IAEH,QAAQ,UAAS;IAEjB;;OAEG;IAEH,KAAK,SAAQ;IAEb,OAAgB,MAAM,0BA8FpB;cAGiB,OAAO,CAAC,iBAAiB,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC;IAMlE,OAAO,CAAC,eAAe;IASvB,OAAO,CAAC,YAAY;IAeX,MAAM;CAmBhB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,kBAAkB,EAAE,eAAe,CAAC;KACrC;CACF"}