@kya-os/consent 0.1.13 → 0.1.15
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.
- package/dist/bundle/inline.d.ts.map +1 -1
- package/dist/bundle/inline.js +2 -2
- package/dist/bundle/inline.js.map +1 -1
- package/dist/bundle/shell.d.ts +5 -0
- package/dist/bundle/shell.d.ts.map +1 -1
- package/dist/bundle/shell.js +3 -1
- package/dist/bundle/shell.js.map +1 -1
- package/dist/cjs/bundle/index.js +57 -0
- package/dist/cjs/bundle/index.js.map +1 -0
- package/dist/cjs/bundle/inline.js +22 -0
- package/dist/cjs/bundle/inline.js.map +1 -0
- package/dist/cjs/bundle/shell.js +291 -0
- package/dist/cjs/bundle/shell.js.map +1 -0
- package/dist/cjs/components/consent-button.js +180 -0
- package/dist/cjs/components/consent-button.js.map +1 -0
- package/dist/cjs/components/consent-checkbox.js +223 -0
- package/dist/cjs/components/consent-checkbox.js.map +1 -0
- package/dist/cjs/components/consent-input.js +335 -0
- package/dist/cjs/components/consent-input.js.map +1 -0
- package/dist/cjs/components/consent-oauth-button.js +392 -0
- package/dist/cjs/components/consent-oauth-button.js.map +1 -0
- package/dist/cjs/components/consent-otp-input.js +388 -0
- package/dist/cjs/components/consent-otp-input.js.map +1 -0
- package/dist/cjs/components/consent-permissions.js +433 -0
- package/dist/cjs/components/consent-permissions.js.map +1 -0
- package/dist/cjs/components/consent-shell.js +234 -0
- package/dist/cjs/components/consent-shell.js.map +1 -0
- package/dist/cjs/components/consent-terms.js +287 -0
- package/dist/cjs/components/consent-terms.js.map +1 -0
- package/dist/cjs/components/index.js +37 -0
- package/dist/cjs/components/index.js.map +1 -0
- package/dist/cjs/components/mcp-consent.js +1034 -0
- package/dist/cjs/components/mcp-consent.js.map +1 -0
- package/dist/cjs/constants/auth-modes.js +128 -0
- package/dist/cjs/constants/auth-modes.js.map +1 -0
- package/dist/cjs/constants/colors.js +40 -0
- package/dist/cjs/constants/colors.js.map +1 -0
- package/dist/cjs/constants/defaults.js +146 -0
- package/dist/cjs/constants/defaults.js.map +1 -0
- package/dist/cjs/constants/index.js +40 -0
- package/dist/cjs/constants/index.js.map +1 -0
- package/dist/cjs/index.js +49 -0
- package/dist/cjs/index.js.map +1 -0
- package/dist/cjs/package.json +1 -0
- package/dist/cjs/react/index.js +190 -0
- package/dist/cjs/react/index.js.map +1 -0
- package/dist/cjs/resolution/index.js +28 -0
- package/dist/cjs/resolution/index.js.map +1 -0
- package/dist/cjs/resolution/resolve-branding.js +159 -0
- package/dist/cjs/resolution/resolve-branding.js.map +1 -0
- package/dist/cjs/resolution/resolve-config.js +270 -0
- package/dist/cjs/resolution/resolve-config.js.map +1 -0
- package/dist/cjs/resolution/resolve-copy.js +136 -0
- package/dist/cjs/resolution/resolve-copy.js.map +1 -0
- package/dist/cjs/schemas/api.schemas.js +162 -0
- package/dist/cjs/schemas/api.schemas.js.map +1 -0
- package/dist/cjs/schemas/branding.schemas.js +57 -0
- package/dist/cjs/schemas/branding.schemas.js.map +1 -0
- package/dist/cjs/schemas/config.schemas.js +147 -0
- package/dist/cjs/schemas/config.schemas.js.map +1 -0
- package/dist/cjs/schemas/index.js +29 -0
- package/dist/cjs/schemas/index.js.map +1 -0
- package/dist/cjs/schemas/modes.schemas.js +107 -0
- package/dist/cjs/schemas/modes.schemas.js.map +1 -0
- package/dist/cjs/security/escape.js +206 -0
- package/dist/cjs/security/escape.js.map +1 -0
- package/dist/cjs/security/index.js +26 -0
- package/dist/cjs/security/index.js.map +1 -0
- package/dist/cjs/security/validators.js +210 -0
- package/dist/cjs/security/validators.js.map +1 -0
- package/dist/cjs/styles/css-variables.js +129 -0
- package/dist/cjs/styles/css-variables.js.map +1 -0
- package/dist/cjs/styles/index.js +28 -0
- package/dist/cjs/styles/index.js.map +1 -0
- package/dist/cjs/styles/stylesheet.js +204 -0
- package/dist/cjs/styles/stylesheet.js.map +1 -0
- package/dist/cjs/styles/tokens.js +183 -0
- package/dist/cjs/styles/tokens.js.map +1 -0
- package/dist/cjs/templates/base/base-template.js +282 -0
- package/dist/cjs/templates/base/base-template.js.map +1 -0
- package/dist/cjs/templates/base/components.js +295 -0
- package/dist/cjs/templates/base/components.js.map +1 -0
- package/dist/cjs/templates/base/index.js +26 -0
- package/dist/cjs/templates/base/index.js.map +1 -0
- package/dist/cjs/templates/index.js +34 -0
- package/dist/cjs/templates/index.js.map +1 -0
- package/dist/cjs/templates/modes/consent-only.template.js +74 -0
- package/dist/cjs/templates/modes/consent-only.template.js.map +1 -0
- package/dist/cjs/templates/modes/credentials.template.js +414 -0
- package/dist/cjs/templates/modes/credentials.template.js.map +1 -0
- package/dist/cjs/templates/modes/index.js +24 -0
- package/dist/cjs/templates/modes/index.js.map +1 -0
- package/dist/cjs/templates/modes/magic-link.template.js +196 -0
- package/dist/cjs/templates/modes/magic-link.template.js.map +1 -0
- package/dist/cjs/templates/modes/oauth.template.js +153 -0
- package/dist/cjs/templates/modes/oauth.template.js.map +1 -0
- package/dist/cjs/templates/modes/otp.template.js +316 -0
- package/dist/cjs/templates/modes/otp.template.js.map +1 -0
- package/dist/cjs/templates/modes/success.template.js +140 -0
- package/dist/cjs/templates/modes/success.template.js.map +1 -0
- package/dist/cjs/templates/registry.js +133 -0
- package/dist/cjs/templates/registry.js.map +1 -0
- package/dist/cjs/types/api.types.js +10 -0
- package/dist/cjs/types/api.types.js.map +1 -0
- package/dist/cjs/types/branding.types.js +10 -0
- package/dist/cjs/types/branding.types.js.map +1 -0
- package/dist/cjs/types/config.types.js +10 -0
- package/dist/cjs/types/config.types.js.map +1 -0
- package/dist/cjs/types/copy.types.js +10 -0
- package/dist/cjs/types/copy.types.js.map +1 -0
- package/dist/cjs/types/index.js +31 -0
- package/dist/cjs/types/index.js.map +1 -0
- package/dist/cjs/types/modes.types.js +140 -0
- package/dist/cjs/types/modes.types.js.map +1 -0
- package/dist/cjs/types/page.types.js +10 -0
- package/dist/cjs/types/page.types.js.map +1 -0
- package/dist/components/mcp-consent.d.ts +6 -0
- package/dist/components/mcp-consent.d.ts.map +1 -1
- package/dist/components/mcp-consent.js +14 -0
- package/dist/components/mcp-consent.js.map +1 -1
- package/dist/consent.js +7 -0
- package/dist/consent.min.js +2 -2
- package/dist/schemas/api.schemas.d.ts +177 -169
- package/dist/schemas/api.schemas.d.ts.map +1 -1
- package/dist/schemas/api.schemas.js +6 -0
- package/dist/schemas/api.schemas.js.map +1 -1
- package/dist/schemas/config.schemas.d.ts +116 -116
- package/dist/schemas/modes.schemas.d.ts +28 -28
- package/dist/types/api.types.d.ts +6 -0
- package/dist/types/api.types.d.ts.map +1 -1
- package/package.json +29 -15
|
@@ -0,0 +1,392 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
/**
|
|
3
|
+
* Consent OAuth Button Web Component
|
|
4
|
+
*
|
|
5
|
+
* A styled button for OAuth provider authentication with provider branding.
|
|
6
|
+
* Supports common OAuth providers with built-in icons.
|
|
7
|
+
*
|
|
8
|
+
* @module components/consent-oauth-button
|
|
9
|
+
*/
|
|
10
|
+
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
|
|
11
|
+
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
12
|
+
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
|
13
|
+
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;
|
|
14
|
+
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
15
|
+
};
|
|
16
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
17
|
+
exports.ConsentOAuthButton = void 0;
|
|
18
|
+
const lit_1 = require("lit");
|
|
19
|
+
const decorators_js_1 = require("lit/decorators.js");
|
|
20
|
+
const unsafe_svg_js_1 = require("lit/directives/unsafe-svg.js");
|
|
21
|
+
/**
|
|
22
|
+
* Sanitize SVG content to prevent XSS attacks.
|
|
23
|
+
* Removes script tags, event handlers, and dangerous attributes.
|
|
24
|
+
*
|
|
25
|
+
* @param svg - Raw SVG string
|
|
26
|
+
* @returns Sanitized SVG safe for rendering
|
|
27
|
+
*/
|
|
28
|
+
function sanitizeSvg(svg) {
|
|
29
|
+
if (!svg || typeof svg !== 'string')
|
|
30
|
+
return '';
|
|
31
|
+
// Remove script tags and their content
|
|
32
|
+
let sanitized = svg.replace(/<script\b[^<]*(?:(?!<\/script>)<[^<]*)*<\/script>/gi, '');
|
|
33
|
+
// Remove event handlers (onclick, onerror, onload, etc.)
|
|
34
|
+
sanitized = sanitized.replace(/\s*on\w+\s*=\s*["'][^"']*["']/gi, '');
|
|
35
|
+
sanitized = sanitized.replace(/\s*on\w+\s*=\s*[^\s>]*/gi, '');
|
|
36
|
+
// Remove javascript: and data: URLs from href, src, xlink:href
|
|
37
|
+
sanitized = sanitized.replace(/(href|src|xlink:href)\s*=\s*["']?\s*javascript:[^"'>\s]*/gi, '$1=""');
|
|
38
|
+
sanitized = sanitized.replace(/(href|src|xlink:href)\s*=\s*["']?\s*data:[^"'>\s]*/gi, '$1=""');
|
|
39
|
+
// Remove base64 embedded content that might be executable
|
|
40
|
+
sanitized = sanitized.replace(/data:text\/html[^"'>\s]*/gi, '');
|
|
41
|
+
return sanitized;
|
|
42
|
+
}
|
|
43
|
+
const PROVIDER_CONFIGS = {
|
|
44
|
+
google: {
|
|
45
|
+
name: 'Google',
|
|
46
|
+
bgColor: '#ffffff',
|
|
47
|
+
textColor: '#374151',
|
|
48
|
+
borderColor: '#d1d5db',
|
|
49
|
+
hoverBgColor: '#f9fafb',
|
|
50
|
+
},
|
|
51
|
+
microsoft: {
|
|
52
|
+
name: 'Microsoft',
|
|
53
|
+
bgColor: '#2f2f2f',
|
|
54
|
+
textColor: '#ffffff',
|
|
55
|
+
borderColor: '#2f2f2f',
|
|
56
|
+
hoverBgColor: '#1f1f1f',
|
|
57
|
+
},
|
|
58
|
+
apple: {
|
|
59
|
+
name: 'Apple',
|
|
60
|
+
bgColor: '#000000',
|
|
61
|
+
textColor: '#ffffff',
|
|
62
|
+
borderColor: '#000000',
|
|
63
|
+
hoverBgColor: '#1a1a1a',
|
|
64
|
+
},
|
|
65
|
+
github: {
|
|
66
|
+
name: 'GitHub',
|
|
67
|
+
bgColor: '#24292f',
|
|
68
|
+
textColor: '#ffffff',
|
|
69
|
+
borderColor: '#24292f',
|
|
70
|
+
hoverBgColor: '#1b1f23',
|
|
71
|
+
},
|
|
72
|
+
twitter: {
|
|
73
|
+
name: 'Twitter',
|
|
74
|
+
bgColor: '#1da1f2',
|
|
75
|
+
textColor: '#ffffff',
|
|
76
|
+
borderColor: '#1da1f2',
|
|
77
|
+
hoverBgColor: '#0c8de4',
|
|
78
|
+
},
|
|
79
|
+
facebook: {
|
|
80
|
+
name: 'Facebook',
|
|
81
|
+
bgColor: '#1877f2',
|
|
82
|
+
textColor: '#ffffff',
|
|
83
|
+
borderColor: '#1877f2',
|
|
84
|
+
hoverBgColor: '#0b5ed7',
|
|
85
|
+
},
|
|
86
|
+
custom: {
|
|
87
|
+
name: 'Sign in',
|
|
88
|
+
bgColor: '#ffffff',
|
|
89
|
+
textColor: '#374151',
|
|
90
|
+
borderColor: '#d1d5db',
|
|
91
|
+
hoverBgColor: '#f9fafb',
|
|
92
|
+
},
|
|
93
|
+
};
|
|
94
|
+
/**
|
|
95
|
+
* ConsentOAuthButton - OAuth provider sign-in button
|
|
96
|
+
*
|
|
97
|
+
* @example
|
|
98
|
+
* ```html
|
|
99
|
+
* <consent-oauth-button
|
|
100
|
+
* provider="google"
|
|
101
|
+
* url="/auth/google"
|
|
102
|
+
* ></consent-oauth-button>
|
|
103
|
+
*
|
|
104
|
+
* <consent-oauth-button
|
|
105
|
+
* provider="custom"
|
|
106
|
+
* provider-name="Acme Corp"
|
|
107
|
+
* url="/auth/acme"
|
|
108
|
+
* ></consent-oauth-button>
|
|
109
|
+
* ```
|
|
110
|
+
*
|
|
111
|
+
* @fires oauth-click - When button is clicked (includes provider and url in detail)
|
|
112
|
+
* @csspart button - The button element
|
|
113
|
+
* @csspart icon - The provider icon
|
|
114
|
+
* @csspart text - The button text
|
|
115
|
+
*/
|
|
116
|
+
let ConsentOAuthButton = class ConsentOAuthButton extends lit_1.LitElement {
|
|
117
|
+
constructor() {
|
|
118
|
+
super(...arguments);
|
|
119
|
+
/**
|
|
120
|
+
* OAuth provider type
|
|
121
|
+
*/
|
|
122
|
+
this.provider = 'custom';
|
|
123
|
+
/**
|
|
124
|
+
* OAuth authorization URL
|
|
125
|
+
*/
|
|
126
|
+
this.url = '';
|
|
127
|
+
/**
|
|
128
|
+
* Loading state
|
|
129
|
+
*/
|
|
130
|
+
this.loading = false;
|
|
131
|
+
/**
|
|
132
|
+
* Disabled state
|
|
133
|
+
*/
|
|
134
|
+
this.disabled = false;
|
|
135
|
+
/**
|
|
136
|
+
* Full width mode
|
|
137
|
+
*/
|
|
138
|
+
this.fullWidth = false;
|
|
139
|
+
/**
|
|
140
|
+
* Internal state for tracking redirect
|
|
141
|
+
*/
|
|
142
|
+
this.redirecting = false;
|
|
143
|
+
}
|
|
144
|
+
get config() {
|
|
145
|
+
return PROVIDER_CONFIGS[this.provider] || PROVIDER_CONFIGS.custom;
|
|
146
|
+
}
|
|
147
|
+
get displayName() {
|
|
148
|
+
if (this.providerName)
|
|
149
|
+
return this.providerName;
|
|
150
|
+
return this.config.name;
|
|
151
|
+
}
|
|
152
|
+
get displayText() {
|
|
153
|
+
if (this.buttonText)
|
|
154
|
+
return this.buttonText;
|
|
155
|
+
return `Continue with ${this.displayName}`;
|
|
156
|
+
}
|
|
157
|
+
handleClick() {
|
|
158
|
+
if (this.disabled || this.loading || this.redirecting)
|
|
159
|
+
return;
|
|
160
|
+
if (this.url) {
|
|
161
|
+
this.redirecting = true;
|
|
162
|
+
window.location.href = this.url;
|
|
163
|
+
}
|
|
164
|
+
// Dispatch custom event with provider details (named 'oauth-click' to avoid
|
|
165
|
+
// collision with native 'click' event which already bubbles through shadow DOM)
|
|
166
|
+
this.dispatchEvent(new CustomEvent('oauth-click', {
|
|
167
|
+
detail: { provider: this.provider, url: this.url },
|
|
168
|
+
bubbles: true,
|
|
169
|
+
composed: true,
|
|
170
|
+
}));
|
|
171
|
+
}
|
|
172
|
+
renderProviderIcon() {
|
|
173
|
+
if (this.customIcon) {
|
|
174
|
+
// Sanitize custom SVG to prevent XSS attacks
|
|
175
|
+
const sanitized = sanitizeSvg(this.customIcon);
|
|
176
|
+
return (0, lit_1.html) `<div class="icon">${(0, unsafe_svg_js_1.unsafeSVG)(sanitized)}</div>`;
|
|
177
|
+
}
|
|
178
|
+
switch (this.provider) {
|
|
179
|
+
case 'google':
|
|
180
|
+
return (0, lit_1.html) `
|
|
181
|
+
<div class="icon">
|
|
182
|
+
<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
|
183
|
+
<path
|
|
184
|
+
fill="#4285F4"
|
|
185
|
+
d="M22.56 12.25c0-.78-.07-1.53-.2-2.25H12v4.26h5.92c-.26 1.37-1.04 2.53-2.21 3.31v2.77h3.57c2.08-1.92 3.28-4.74 3.28-8.09z"
|
|
186
|
+
/>
|
|
187
|
+
<path
|
|
188
|
+
fill="#34A853"
|
|
189
|
+
d="M12 23c2.97 0 5.46-.98 7.28-2.66l-3.57-2.77c-.98.66-2.23 1.06-3.71 1.06-2.86 0-5.29-1.93-6.16-4.53H2.18v2.84C3.99 20.53 7.7 23 12 23z"
|
|
190
|
+
/>
|
|
191
|
+
<path
|
|
192
|
+
fill="#FBBC05"
|
|
193
|
+
d="M5.84 14.09c-.22-.66-.35-1.36-.35-2.09s.13-1.43.35-2.09V7.07H2.18C1.43 8.55 1 10.22 1 12s.43 3.45 1.18 4.93l2.85-2.22.81-.62z"
|
|
194
|
+
/>
|
|
195
|
+
<path
|
|
196
|
+
fill="#EA4335"
|
|
197
|
+
d="M12 5.38c1.62 0 3.06.56 4.21 1.64l3.15-3.15C17.45 2.09 14.97 1 12 1 7.7 1 3.99 3.47 2.18 7.07l3.66 2.84c.87-2.6 3.3-4.53 6.16-4.53z"
|
|
198
|
+
/>
|
|
199
|
+
</svg>
|
|
200
|
+
</div>
|
|
201
|
+
`;
|
|
202
|
+
case 'microsoft':
|
|
203
|
+
return (0, lit_1.html) `
|
|
204
|
+
<div class="icon">
|
|
205
|
+
<svg viewBox="0 0 21 21" xmlns="http://www.w3.org/2000/svg">
|
|
206
|
+
<rect x="1" y="1" width="9" height="9" fill="#f25022" />
|
|
207
|
+
<rect x="1" y="11" width="9" height="9" fill="#00a4ef" />
|
|
208
|
+
<rect x="11" y="1" width="9" height="9" fill="#7fba00" />
|
|
209
|
+
<rect x="11" y="11" width="9" height="9" fill="#ffb900" />
|
|
210
|
+
</svg>
|
|
211
|
+
</div>
|
|
212
|
+
`;
|
|
213
|
+
case 'apple':
|
|
214
|
+
return (0, lit_1.html) `
|
|
215
|
+
<div class="icon">
|
|
216
|
+
<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
|
217
|
+
<path
|
|
218
|
+
fill="currentColor"
|
|
219
|
+
d="M17.05 20.28c-.98.95-2.05.8-3.08.35-1.09-.46-2.09-.48-3.24 0-1.44.62-2.2.44-3.06-.35C2.79 15.25 3.51 7.59 9.05 7.31c1.35.07 2.29.74 3.08.8 1.18-.24 2.31-.93 3.57-.84 1.51.12 2.65.72 3.4 1.8-3.12 1.87-2.38 5.98.48 7.13-.57 1.5-1.31 2.99-2.54 4.09l.01-.01zM12.03 7.25c-.15-2.23 1.66-4.07 3.74-4.25.29 2.58-2.34 4.5-3.74 4.25z"
|
|
220
|
+
/>
|
|
221
|
+
</svg>
|
|
222
|
+
</div>
|
|
223
|
+
`;
|
|
224
|
+
case 'github':
|
|
225
|
+
return (0, lit_1.html) `
|
|
226
|
+
<div class="icon">
|
|
227
|
+
<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
|
228
|
+
<path
|
|
229
|
+
fill="currentColor"
|
|
230
|
+
d="M12 2C6.477 2 2 6.477 2 12c0 4.42 2.865 8.17 6.839 9.49.5.092.682-.217.682-.482 0-.237-.008-.866-.013-1.7-2.782.604-3.369-1.34-3.369-1.34-.454-1.156-1.11-1.464-1.11-1.464-.908-.62.069-.608.069-.608 1.003.07 1.531 1.03 1.531 1.03.892 1.529 2.341 1.087 2.91.831.092-.646.35-1.086.636-1.336-2.22-.253-4.555-1.11-4.555-4.943 0-1.091.39-1.984 1.029-2.683-.103-.253-.446-1.27.098-2.647 0 0 .84-.269 2.75 1.025A9.578 9.578 0 0112 6.836c.85.004 1.705.114 2.504.336 1.909-1.294 2.747-1.025 2.747-1.025.546 1.377.203 2.394.1 2.647.64.699 1.028 1.592 1.028 2.683 0 3.842-2.339 4.687-4.566 4.935.359.309.678.919.678 1.852 0 1.336-.012 2.415-.012 2.743 0 .267.18.578.688.48C19.138 20.167 22 16.418 22 12c0-5.523-4.477-10-10-10z"
|
|
231
|
+
/>
|
|
232
|
+
</svg>
|
|
233
|
+
</div>
|
|
234
|
+
`;
|
|
235
|
+
case 'twitter':
|
|
236
|
+
return (0, lit_1.html) `
|
|
237
|
+
<div class="icon">
|
|
238
|
+
<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
|
239
|
+
<path
|
|
240
|
+
fill="currentColor"
|
|
241
|
+
d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z"
|
|
242
|
+
/>
|
|
243
|
+
</svg>
|
|
244
|
+
</div>
|
|
245
|
+
`;
|
|
246
|
+
case 'facebook':
|
|
247
|
+
return (0, lit_1.html) `
|
|
248
|
+
<div class="icon">
|
|
249
|
+
<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
|
250
|
+
<path
|
|
251
|
+
fill="currentColor"
|
|
252
|
+
d="M24 12.073c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.99 4.388 10.954 10.125 11.854v-8.385H7.078v-3.47h3.047V9.43c0-3.007 1.792-4.669 4.533-4.669 1.312 0 2.686.235 2.686.235v2.953H15.83c-1.491 0-1.956.925-1.956 1.874v2.25h3.328l-.532 3.47h-2.796v8.385C19.612 23.027 24 18.062 24 12.073z"
|
|
253
|
+
/>
|
|
254
|
+
</svg>
|
|
255
|
+
</div>
|
|
256
|
+
`;
|
|
257
|
+
default:
|
|
258
|
+
return lit_1.nothing;
|
|
259
|
+
}
|
|
260
|
+
}
|
|
261
|
+
updated(changedProperties) {
|
|
262
|
+
if (changedProperties.has('provider')) {
|
|
263
|
+
const config = this.config;
|
|
264
|
+
this.style.setProperty('--button-bg', config.bgColor);
|
|
265
|
+
this.style.setProperty('--button-text', config.textColor);
|
|
266
|
+
this.style.setProperty('--button-border', config.borderColor);
|
|
267
|
+
this.style.setProperty('--button-hover-bg', config.hoverBgColor);
|
|
268
|
+
}
|
|
269
|
+
}
|
|
270
|
+
render() {
|
|
271
|
+
const isLoading = this.loading || this.redirecting;
|
|
272
|
+
return (0, lit_1.html) `
|
|
273
|
+
<button
|
|
274
|
+
part="button"
|
|
275
|
+
type="button"
|
|
276
|
+
?disabled=${this.disabled || isLoading}
|
|
277
|
+
@click=${this.handleClick}
|
|
278
|
+
style="
|
|
279
|
+
background-color: var(--button-bg, ${this.config.bgColor});
|
|
280
|
+
color: var(--button-text, ${this.config.textColor});
|
|
281
|
+
border: 1px solid var(--button-border, ${this.config.borderColor});
|
|
282
|
+
"
|
|
283
|
+
aria-busy=${isLoading}
|
|
284
|
+
>
|
|
285
|
+
${isLoading
|
|
286
|
+
? (0, lit_1.html) `<span class="spinner"></span>`
|
|
287
|
+
: this.renderProviderIcon()}
|
|
288
|
+
<span class="text" part="text">${this.displayText}</span>
|
|
289
|
+
</button>
|
|
290
|
+
`;
|
|
291
|
+
}
|
|
292
|
+
};
|
|
293
|
+
exports.ConsentOAuthButton = ConsentOAuthButton;
|
|
294
|
+
ConsentOAuthButton.styles = (0, lit_1.css) `
|
|
295
|
+
:host {
|
|
296
|
+
display: inline-block;
|
|
297
|
+
}
|
|
298
|
+
|
|
299
|
+
:host([full-width]) {
|
|
300
|
+
display: block;
|
|
301
|
+
width: 100%;
|
|
302
|
+
}
|
|
303
|
+
|
|
304
|
+
button {
|
|
305
|
+
width: 100%;
|
|
306
|
+
padding: 0.75rem 1rem;
|
|
307
|
+
height: 2.75rem;
|
|
308
|
+
border-radius: 0.5rem;
|
|
309
|
+
font-size: 0.875rem;
|
|
310
|
+
font-weight: 500;
|
|
311
|
+
font-family: inherit;
|
|
312
|
+
cursor: pointer;
|
|
313
|
+
transition: background-color 0.15s ease, opacity 0.15s ease;
|
|
314
|
+
display: inline-flex;
|
|
315
|
+
align-items: center;
|
|
316
|
+
justify-content: center;
|
|
317
|
+
gap: 0.75rem;
|
|
318
|
+
}
|
|
319
|
+
|
|
320
|
+
button:disabled {
|
|
321
|
+
opacity: 0.5;
|
|
322
|
+
cursor: not-allowed;
|
|
323
|
+
}
|
|
324
|
+
|
|
325
|
+
button:focus-visible {
|
|
326
|
+
outline: 2px solid #2563eb;
|
|
327
|
+
outline-offset: 2px;
|
|
328
|
+
}
|
|
329
|
+
|
|
330
|
+
.icon {
|
|
331
|
+
width: 1.125rem;
|
|
332
|
+
height: 1.125rem;
|
|
333
|
+
flex-shrink: 0;
|
|
334
|
+
}
|
|
335
|
+
|
|
336
|
+
.icon svg {
|
|
337
|
+
width: 100%;
|
|
338
|
+
height: 100%;
|
|
339
|
+
}
|
|
340
|
+
|
|
341
|
+
/* Loading spinner */
|
|
342
|
+
.spinner {
|
|
343
|
+
width: 1rem;
|
|
344
|
+
height: 1rem;
|
|
345
|
+
border: 2px solid currentColor;
|
|
346
|
+
border-top-color: transparent;
|
|
347
|
+
border-radius: 50%;
|
|
348
|
+
animation: spin 0.8s linear infinite;
|
|
349
|
+
}
|
|
350
|
+
|
|
351
|
+
@keyframes spin {
|
|
352
|
+
to {
|
|
353
|
+
transform: rotate(360deg);
|
|
354
|
+
}
|
|
355
|
+
}
|
|
356
|
+
|
|
357
|
+
.text {
|
|
358
|
+
flex: 1;
|
|
359
|
+
text-align: center;
|
|
360
|
+
}
|
|
361
|
+
`;
|
|
362
|
+
__decorate([
|
|
363
|
+
(0, decorators_js_1.property)({ type: String })
|
|
364
|
+
], ConsentOAuthButton.prototype, "provider", void 0);
|
|
365
|
+
__decorate([
|
|
366
|
+
(0, decorators_js_1.property)({ type: String, attribute: 'provider-name' })
|
|
367
|
+
], ConsentOAuthButton.prototype, "providerName", void 0);
|
|
368
|
+
__decorate([
|
|
369
|
+
(0, decorators_js_1.property)({ type: String })
|
|
370
|
+
], ConsentOAuthButton.prototype, "url", void 0);
|
|
371
|
+
__decorate([
|
|
372
|
+
(0, decorators_js_1.property)({ type: String, attribute: 'button-text' })
|
|
373
|
+
], ConsentOAuthButton.prototype, "buttonText", void 0);
|
|
374
|
+
__decorate([
|
|
375
|
+
(0, decorators_js_1.property)({ type: Boolean, reflect: true })
|
|
376
|
+
], ConsentOAuthButton.prototype, "loading", void 0);
|
|
377
|
+
__decorate([
|
|
378
|
+
(0, decorators_js_1.property)({ type: Boolean, reflect: true })
|
|
379
|
+
], ConsentOAuthButton.prototype, "disabled", void 0);
|
|
380
|
+
__decorate([
|
|
381
|
+
(0, decorators_js_1.property)({ type: Boolean, attribute: 'full-width' })
|
|
382
|
+
], ConsentOAuthButton.prototype, "fullWidth", void 0);
|
|
383
|
+
__decorate([
|
|
384
|
+
(0, decorators_js_1.property)({ type: String, attribute: 'custom-icon' })
|
|
385
|
+
], ConsentOAuthButton.prototype, "customIcon", void 0);
|
|
386
|
+
__decorate([
|
|
387
|
+
(0, decorators_js_1.state)()
|
|
388
|
+
], ConsentOAuthButton.prototype, "redirecting", void 0);
|
|
389
|
+
exports.ConsentOAuthButton = ConsentOAuthButton = __decorate([
|
|
390
|
+
(0, decorators_js_1.customElement)('consent-oauth-button')
|
|
391
|
+
], ConsentOAuthButton);
|
|
392
|
+
//# sourceMappingURL=consent-oauth-button.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"consent-oauth-button.js","sourceRoot":"","sources":["../../../src/components/consent-oauth-button.ts"],"names":[],"mappings":";AAAA;;;;;;;GAOG;;;;;;;;;AAEH,6BAAqE;AACrE,qDAAmE;AACnE,gEAAyD;AAyBzD;;;;;;GAMG;AACH,SAAS,WAAW,CAAC,GAAW;IAC9B,IAAI,CAAC,GAAG,IAAI,OAAO,GAAG,KAAK,QAAQ;QAAE,OAAO,EAAE,CAAC;IAE/C,uCAAuC;IACvC,IAAI,SAAS,GAAG,GAAG,CAAC,OAAO,CAAC,qDAAqD,EAAE,EAAE,CAAC,CAAC;IAEvF,yDAAyD;IACzD,SAAS,GAAG,SAAS,CAAC,OAAO,CAAC,iCAAiC,EAAE,EAAE,CAAC,CAAC;IACrE,SAAS,GAAG,SAAS,CAAC,OAAO,CAAC,0BAA0B,EAAE,EAAE,CAAC,CAAC;IAE9D,+DAA+D;IAC/D,SAAS,GAAG,SAAS,CAAC,OAAO,CAAC,4DAA4D,EAAE,OAAO,CAAC,CAAC;IACrG,SAAS,GAAG,SAAS,CAAC,OAAO,CAAC,sDAAsD,EAAE,OAAO,CAAC,CAAC;IAE/F,0DAA0D;IAC1D,SAAS,GAAG,SAAS,CAAC,OAAO,CAAC,4BAA4B,EAAE,EAAE,CAAC,CAAC;IAEhE,OAAO,SAAS,CAAC;AACnB,CAAC;AAED,MAAM,gBAAgB,GAA0C;IAC9D,MAAM,EAAE;QACN,IAAI,EAAE,QAAQ;QACd,OAAO,EAAE,SAAS;QAClB,SAAS,EAAE,SAAS;QACpB,WAAW,EAAE,SAAS;QACtB,YAAY,EAAE,SAAS;KACxB;IACD,SAAS,EAAE;QACT,IAAI,EAAE,WAAW;QACjB,OAAO,EAAE,SAAS;QAClB,SAAS,EAAE,SAAS;QACpB,WAAW,EAAE,SAAS;QACtB,YAAY,EAAE,SAAS;KACxB;IACD,KAAK,EAAE;QACL,IAAI,EAAE,OAAO;QACb,OAAO,EAAE,SAAS;QAClB,SAAS,EAAE,SAAS;QACpB,WAAW,EAAE,SAAS;QACtB,YAAY,EAAE,SAAS;KACxB;IACD,MAAM,EAAE;QACN,IAAI,EAAE,QAAQ;QACd,OAAO,EAAE,SAAS;QAClB,SAAS,EAAE,SAAS;QACpB,WAAW,EAAE,SAAS;QACtB,YAAY,EAAE,SAAS;KACxB;IACD,OAAO,EAAE;QACP,IAAI,EAAE,SAAS;QACf,OAAO,EAAE,SAAS;QAClB,SAAS,EAAE,SAAS;QACpB,WAAW,EAAE,SAAS;QACtB,YAAY,EAAE,SAAS;KACxB;IACD,QAAQ,EAAE;QACR,IAAI,EAAE,UAAU;QAChB,OAAO,EAAE,SAAS;QAClB,SAAS,EAAE,SAAS;QACpB,WAAW,EAAE,SAAS;QACtB,YAAY,EAAE,SAAS;KACxB;IACD,MAAM,EAAE;QACN,IAAI,EAAE,SAAS;QACf,OAAO,EAAE,SAAS;QAClB,SAAS,EAAE,SAAS;QACpB,WAAW,EAAE,SAAS;QACtB,YAAY,EAAE,SAAS;KACxB;CACF,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;GAqBG;AAEI,IAAM,kBAAkB,GAAxB,MAAM,kBAAmB,SAAQ,gBAAU;IAA3C;;QACL;;WAEG;QAEH,aAAQ,GAAkB,QAAQ,CAAC;QAQnC;;WAEG;QAEH,QAAG,GAAG,EAAE,CAAC;QAQT;;WAEG;QAEH,YAAO,GAAG,KAAK,CAAC;QAEhB;;WAEG;QAEH,aAAQ,GAAG,KAAK,CAAC;QAEjB;;WAEG;QAEH,cAAS,GAAG,KAAK,CAAC;QAQlB;;WAEG;QAEK,gBAAW,GAAG,KAAK,CAAC;IA0O9B,CAAC;IAnKC,IAAY,MAAM;QAChB,OAAO,gBAAgB,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAI,gBAAgB,CAAC,MAAM,CAAC;IACpE,CAAC;IAED,IAAY,WAAW;QACrB,IAAI,IAAI,CAAC,YAAY;YAAE,OAAO,IAAI,CAAC,YAAY,CAAC;QAChD,OAAO,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC;IAC1B,CAAC;IAED,IAAY,WAAW;QACrB,IAAI,IAAI,CAAC,UAAU;YAAE,OAAO,IAAI,CAAC,UAAU,CAAC;QAC5C,OAAO,iBAAiB,IAAI,CAAC,WAAW,EAAE,CAAC;IAC7C,CAAC;IAEO,WAAW;QACjB,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,WAAW;YAAE,OAAO;QAE9D,IAAI,IAAI,CAAC,GAAG,EAAE,CAAC;YACb,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC;YACxB,MAAM,CAAC,QAAQ,CAAC,IAAI,GAAG,IAAI,CAAC,GAAG,CAAC;QAClC,CAAC;QAED,4EAA4E;QAC5E,gFAAgF;QAChF,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,aAAa,EAAE;YAC7B,MAAM,EAAE,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,GAAG,EAAE,IAAI,CAAC,GAAG,EAAE;YAClD,OAAO,EAAE,IAAI;YACb,QAAQ,EAAE,IAAI;SACf,CAAC,CACH,CAAC;IACJ,CAAC;IAEO,kBAAkB;QACxB,IAAI,IAAI,CAAC,UAAU,EAAE,CAAC;YACpB,6CAA6C;YAC7C,MAAM,SAAS,GAAG,WAAW,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;YAC/C,OAAO,IAAA,UAAI,EAAA,qBAAqB,IAAA,yBAAS,EAAC,SAAS,CAAC,QAAQ,CAAC;QAC/D,CAAC;QAED,QAAQ,IAAI,CAAC,QAAQ,EAAE,CAAC;YACtB,KAAK,QAAQ;gBACX,OAAO,IAAA,UAAI,EAAA;;;;;;;;;;;;;;;;;;;;;SAqBV,CAAC;YAEJ,KAAK,WAAW;gBACd,OAAO,IAAA,UAAI,EAAA;;;;;;;;;SASV,CAAC;YAEJ,KAAK,OAAO;gBACV,OAAO,IAAA,UAAI,EAAA;;;;;;;;;SASV,CAAC;YAEJ,KAAK,QAAQ;gBACX,OAAO,IAAA,UAAI,EAAA;;;;;;;;;SASV,CAAC;YAEJ,KAAK,SAAS;gBACZ,OAAO,IAAA,UAAI,EAAA;;;;;;;;;SASV,CAAC;YAEJ,KAAK,UAAU;gBACb,OAAO,IAAA,UAAI,EAAA;;;;;;;;;SASV,CAAC;YAEJ;gBACE,OAAO,aAAO,CAAC;QACnB,CAAC;IACH,CAAC;IAEkB,OAAO,CAAC,iBAAuC;QAChE,IAAI,iBAAiB,CAAC,GAAG,CAAC,UAAU,CAAC,EAAE,CAAC;YACtC,MAAM,MAAM,GAAG,IAAI,CAAC,MAAM,CAAC;YAC3B,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,aAAa,EAAE,MAAM,CAAC,OAAO,CAAC,CAAC;YACtD,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,eAAe,EAAE,MAAM,CAAC,SAAS,CAAC,CAAC;YAC1D,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,iBAAiB,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC;YAC9D,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,mBAAmB,EAAE,MAAM,CAAC,YAAY,CAAC,CAAC;QACnE,CAAC;IACH,CAAC;IAEQ,MAAM;QACb,MAAM,SAAS,GAAG,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,WAAW,CAAC;QAEnD,OAAO,IAAA,UAAI,EAAA;;;;oBAIK,IAAI,CAAC,QAAQ,IAAI,SAAS;iBAC7B,IAAI,CAAC,WAAW;;+CAEc,IAAI,CAAC,MAAM,CAAC,OAAO;sCAC5B,IAAI,CAAC,MAAM,CAAC,SAAS;mDACR,IAAI,CAAC,MAAM,CAAC,WAAW;;oBAEtD,SAAS;;UAEnB,SAAS;YACT,CAAC,CAAC,IAAA,UAAI,EAAA,+BAA+B;YACrC,CAAC,CAAC,IAAI,CAAC,kBAAkB,EAAE;yCACI,IAAI,CAAC,WAAW;;KAEpD,CAAC;IACJ,CAAC;;AA9RU,gDAAkB;AAuDb,yBAAM,GAAG,IAAA,SAAG,EAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmE3B,AAnEqB,CAmEpB;AArHF;IADC,IAAA,wBAAQ,EAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;oDACQ;AAMnC;IADC,IAAA,wBAAQ,EAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,eAAe,EAAE,CAAC;wDACjC;AAMtB;IADC,IAAA,wBAAQ,EAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;+CAClB;AAMT;IADC,IAAA,wBAAQ,EAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,aAAa,EAAE,CAAC;sDACjC;AAMpB;IADC,IAAA,wBAAQ,EAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;mDAC3B;AAMhB;IADC,IAAA,wBAAQ,EAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;oDAC1B;AAMjB;IADC,IAAA,wBAAQ,EAAC,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,CAAC;qDACnC;AAMlB;IADC,IAAA,wBAAQ,EAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,aAAa,EAAE,CAAC;sDACjC;AAMZ;IADP,IAAA,qBAAK,GAAE;uDACoB;6BArDjB,kBAAkB;IAD9B,IAAA,6BAAa,EAAC,sBAAsB,CAAC;GACzB,kBAAkB,CA+R9B"}
|