@cal.macconnachie/web-components 0.0.1
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/README.md +164 -0
- package/dist/components/cals-auth +2479 -0
- package/dist/components/index.d.ts +111 -0
- package/dist/index +2437 -0
- package/dist/index.d.ts +111 -0
- package/dist/stylesheets/main.css +1 -0
- package/package.json +73 -0
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,111 @@
|
|
|
1
|
+
import { CSSResult } from 'lit';
|
|
2
|
+
import { LitElement } from 'lit';
|
|
3
|
+
import { nothing } from 'lit';
|
|
4
|
+
import { PropertyValues } from 'lit';
|
|
5
|
+
import { TemplateResult } from 'lit-html';
|
|
6
|
+
|
|
7
|
+
declare type AuthMode = 'signin' | 'signup';
|
|
8
|
+
|
|
9
|
+
export declare class CalsAuth extends LitElement {
|
|
10
|
+
open: boolean;
|
|
11
|
+
initialMode: AuthMode;
|
|
12
|
+
logoUrl: string;
|
|
13
|
+
baseUrl: string;
|
|
14
|
+
oauthDomain: string;
|
|
15
|
+
oauthRegion: string;
|
|
16
|
+
oauthUserPoolId: string;
|
|
17
|
+
oauthClientId: string;
|
|
18
|
+
oauthRedirectUri: string;
|
|
19
|
+
size: 'sm' | 'md' | 'lg';
|
|
20
|
+
theme: 'light' | 'dark';
|
|
21
|
+
private mode;
|
|
22
|
+
private resetStep;
|
|
23
|
+
private signupStep;
|
|
24
|
+
private isLoading;
|
|
25
|
+
private isClosing;
|
|
26
|
+
private isVisible;
|
|
27
|
+
private isLoggedIn;
|
|
28
|
+
private email;
|
|
29
|
+
private password;
|
|
30
|
+
private givenName;
|
|
31
|
+
private familyName;
|
|
32
|
+
private newPassword;
|
|
33
|
+
private confirmPassword;
|
|
34
|
+
private notice;
|
|
35
|
+
private error;
|
|
36
|
+
private errors;
|
|
37
|
+
private otpDigits;
|
|
38
|
+
private signupOtpDigits;
|
|
39
|
+
private isDragging;
|
|
40
|
+
private dragStartY;
|
|
41
|
+
private dragCurrentY;
|
|
42
|
+
private dragStartTime;
|
|
43
|
+
private lastDragEndTime;
|
|
44
|
+
private cookies;
|
|
45
|
+
private apiService?;
|
|
46
|
+
private oauthService?;
|
|
47
|
+
private modalContainer?;
|
|
48
|
+
private emailInput?;
|
|
49
|
+
private modalBody?;
|
|
50
|
+
private scrollPosition;
|
|
51
|
+
private transitionDuration;
|
|
52
|
+
private hasHandledOAuthCallback;
|
|
53
|
+
private boundKeyHandler;
|
|
54
|
+
private readonly baseUrlErrorMessage;
|
|
55
|
+
private hasApiBaseUrl;
|
|
56
|
+
private getNormalizedBaseUrl;
|
|
57
|
+
private getApiService;
|
|
58
|
+
connectedCallback(): void;
|
|
59
|
+
disconnectedCallback(): void;
|
|
60
|
+
firstUpdated(): void;
|
|
61
|
+
updated(changed: PropertyValues): void;
|
|
62
|
+
private lockBodyScroll;
|
|
63
|
+
private unlockBodyScroll;
|
|
64
|
+
private cleanupInlineStyles;
|
|
65
|
+
private resetState;
|
|
66
|
+
private handleClose;
|
|
67
|
+
private handleOverlayClick;
|
|
68
|
+
private handleDragStart;
|
|
69
|
+
private handleDragMove;
|
|
70
|
+
private handleDragEnd;
|
|
71
|
+
private handleHandleClick;
|
|
72
|
+
private toggleMode;
|
|
73
|
+
private startReset;
|
|
74
|
+
private cancelReset;
|
|
75
|
+
private backToRequest;
|
|
76
|
+
private backToSignupForm;
|
|
77
|
+
private validate;
|
|
78
|
+
private handleSubmit;
|
|
79
|
+
private setAuthTokens;
|
|
80
|
+
private handleSignIn;
|
|
81
|
+
private isOAuthConfigured;
|
|
82
|
+
private getOAuthService;
|
|
83
|
+
private stripOAuthParamsFromUrl;
|
|
84
|
+
private handleOAuthCallbackIfPresent;
|
|
85
|
+
private handleRequestSignupOtp;
|
|
86
|
+
private handleSignupWithOtp;
|
|
87
|
+
private handleRequestReset;
|
|
88
|
+
private handleConfirmReset;
|
|
89
|
+
logout(): Promise<void>;
|
|
90
|
+
private handleGoogleSignIn;
|
|
91
|
+
private handleAppleSignIn;
|
|
92
|
+
private handleOtpInput;
|
|
93
|
+
private handleOtpKeydown;
|
|
94
|
+
private handleOtpPaste;
|
|
95
|
+
render(): typeof nothing | TemplateResult<1>;
|
|
96
|
+
private renderContent;
|
|
97
|
+
private renderFormContent;
|
|
98
|
+
private renderActions;
|
|
99
|
+
private renderAlerts;
|
|
100
|
+
private renderFooter;
|
|
101
|
+
private renderGoogleIcon;
|
|
102
|
+
private renderAppleIcon;
|
|
103
|
+
setError(message: string): void;
|
|
104
|
+
setNotice(message: string): void;
|
|
105
|
+
closeModal(): void;
|
|
106
|
+
openModal(): void;
|
|
107
|
+
refresh(): Promise<void>;
|
|
108
|
+
static styles: CSSResult;
|
|
109
|
+
}
|
|
110
|
+
|
|
111
|
+
export { }
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
:root{--color-primary:#2563eb;--color-primary-hover:#1d4ed8;--color-primary-light:#dbeafe;--color-secondary:#64748b;--color-secondary-hover:#475569;--color-success:#16a34a;--color-warning:#d97706;--color-error:#dc2626;--color-info:#0891b2;--color-success-bg:rgba(22,162,73,.1);--color-success-border:rgba(22,162,73,.2);--color-warning-bg:rgba(217,119,6,.1);--color-warning-border:rgba(217,119,6,.2);--color-error-bg:rgba(220,38,38,.1);--color-error-border:rgba(220,38,38,.2);--color-info-bg:rgba(8,145,178,.1);--color-info-border:rgba(8,145,178,.2);--color-subscription:#6366f1;--color-subscription-bg:rgba(99,102,241,.1);--color-subscription-border:rgba(99,102,241,.2);--color-subscription-bg-gradient-start:rgba(99,102,241,.02);--color-subscription-bg-gradient-end:rgba(99,102,241,.05);--color-onetime:#22c55e;--color-onetime-bg:rgba(34,197,94,.1);--color-onetime-border:rgba(34,197,94,.2);--color-onetime-bg-gradient-start:rgba(34,197,94,.02);--color-onetime-bg-gradient-end:rgba(34,197,94,.05);--color-metered:#a855f7;--color-metered-bg:rgba(168,85,247,.1);--color-metered-border:rgba(168,85,247,.2);--color-metered-bg-gradient-start:rgba(168,85,247,.02);--color-metered-bg-gradient-end:rgba(168,85,247,.05);--color-text-primary:#0f172a;--color-text-secondary:#64748b;--color-text-muted:#94a3b8;--color-text-inverse:#fff;--color-bg-primary:#fff;--color-bg-secondary:#f8fafc;--color-bg-muted:#f1f5f9;--color-bg-inverse-muted:#1e293b;--color-bg-overlay:rgba(15,23,42,.8);--color-border:#e2e8f0;--color-border-hover:#cbd5e1;--color-border-focus:#3b82f6;--font-family-sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;--font-family-mono:"SF Mono",Monaco,"Cascadia Code",monospace;--font-size-2xs:0.625rem;--font-size-xs:0.75rem;--font-size-sm:0.875rem;--font-size-base:1rem;--font-size-lg:1.125rem;--font-size-xl:1.25rem;--font-size-2xl:1.5rem;--font-size-3xl:1.875rem;--font-weight-normal:400;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--line-height-tight:1.25;--line-height-normal:1.5;--line-height-relaxed:1.625;--space-1:0.25rem;--space-2:0.5rem;--space-3:0.75rem;--space-4:1rem;--space-5:1.25rem;--space-6:1.5rem;--space-8:2rem;--space-10:2.5rem;--space-12:3rem;--space-16:4rem;--space-20:5rem;--space-24:6rem;--size-xs:20rem;--size-sm:24rem;--size-md:28rem;--size-lg:32rem;--size-xl:36rem;--size-2xl:42rem;--size-full:100%;--radius-sm:0.125rem;--radius-base:0.25rem;--radius-md:0.375rem;--radius-lg:0.5rem;--radius-xl:0.75rem;--radius-2xl:1rem;--radius-full:9999px;--shadow-xs:0 1px 2px 0 rgba(0,0,0,.05);--shadow-sm:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1);--shadow-base:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -2px rgba(0,0,0,.1);--shadow-md:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);--shadow-lg:0 20px 25px -5px rgba(0,0,0,.1),0 8px 10px -6px rgba(0,0,0,.1);--shadow-xl:0 25px 50px -12px rgba(0,0,0,.25);--z-dropdown:1000;--z-sticky:1020;--z-fixed:1030;--z-modal:1040;--z-popover:1050;--z-tooltip:1060;--transition-fast:150ms cubic-bezier(0.4,0,0.2,1);--transition-base:200ms cubic-bezier(0.4,0,0.2,1);--transition-slow:300ms cubic-bezier(0.4,0,0.2,1)}[data-theme=dark]{--color-primary:#3b82f6;--color-primary-hover:#2563eb;--color-primary-light:#1e3a8a;--color-secondary:#6b7280;--color-secondary-hover:#9ca3af;--color-success:#10b981;--color-warning:#f59e0b;--color-error:#ef4444;--color-info:#06b6d4;--color-text-primary:#f8fafc;--color-text-secondary:#cbd5e1;--color-text-muted:#94a3b8;--color-text-inverse:#0f172a;--color-bg-primary:#1e293b;--color-bg-secondary:#0f172a;--color-bg-muted:#334155;--color-bg-inverse-muted:#0f172a;--color-bg-overlay:rgba(0,0,0,.8);--color-border:#334155;--color-border-hover:#475569;--color-border-focus:#3b82f6;--shadow-xs:0 1px 2px 0 rgba(0,0,0,.3);--shadow-sm:0 1px 3px 0 rgba(0,0,0,.4),0 1px 2px -1px rgba(0,0,0,.4);--shadow-base:0 4px 6px -1px rgba(0,0,0,.4),0 2px 4px -2px rgba(0,0,0,.4);--shadow-md:0 10px 15px -3px rgba(0,0,0,.4),0 4px 6px -4px rgba(0,0,0,.4);--shadow-lg:0 20px 25px -5px rgba(0,0,0,.5),0 8px 10px -6px rgba(0,0,0,.5);--shadow-xl:0 25px 50px -12px rgba(0,0,0,.6)}*{box-sizing:border-box}body{background-color:var(--color-bg-secondary);color:var(--color-text-primary);font-family:var(--font-family-sans);font-size:var(--font-size-base);line-height:var(--line-height-normal);margin:0;padding:0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{scrollbar-width:none;-ms-overflow-style:none}::-webkit-scrollbar{display:none}:focus{outline:2px solid var(--color-border-focus);outline-offset:2px}:focus:not(:focus-visible){outline:none}.sr-only{height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;clip:rect(0,0,0,0);border:0;white-space:nowrap}.page{margin:0 auto;max-width:1200px;padding:var(--space-6)}.float-right{float:right}.onboarding-form{gap:var(--space-6);margin-top:var(--space-4)}.form-section,.onboarding-form{box-sizing:border-box;display:flex;flex-direction:column;max-width:100%;width:100%}.form-section{gap:var(--space-3)}.form-section h5,.section-title{color:var(--color-text-primary);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);margin:0 0 var(--space-3) 0}.form-grid{display:grid;gap:var(--space-4);grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr))}.form-field,.form-grid{box-sizing:border-box;max-width:100%;width:100%}.form-field{display:flex;flex-direction:column;gap:var(--space-1);min-width:0}.form-field.full-width{grid-column:1/-1}.form-field label{color:var(--color-text-secondary);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium)}.form-field select{background:var(--color-bg-primary);border:1px solid var(--color-border);border-radius:var(--radius-md);color:var(--color-text-primary);font-size:var(--font-size-sm);padding:var(--space-2) var(--space-3);transition:border-color .2s ease;width:100%}.form-field select:focus{border-color:var(--color-primary);outline:none}.form-field select:disabled{cursor:not-allowed;opacity:.5}.form-actions{align-items:flex-start;border-top:1px solid var(--color-border);display:flex;flex-direction:column;gap:var(--space-2);padding-top:var(--space-4)}.form-note{color:var(--color-text-secondary);font-size:var(--font-size-sm)}@media (max-width:640px){.form-grid{grid-template-columns:1fr}}input:-webkit-autofill,input:-webkit-autofill:active,input:-webkit-autofill:focus,input:-webkit-autofill:hover,select:-webkit-autofill,select:-webkit-autofill:active,select:-webkit-autofill:focus,select:-webkit-autofill:hover,textarea:-webkit-autofill,textarea:-webkit-autofill:active,textarea:-webkit-autofill:focus,textarea:-webkit-autofill:hover{-webkit-background-clip:text!important;-webkit-text-fill-color:var(--color-text-primary)!important;background-color:var(--color-bg-primary)!important;box-shadow:0 0 0 1000px var(--color-bg-primary) inset!important;transition:background-color 5000s ease-in-out 0s!important}.quantity-input-wrapper{align-items:center;display:flex;gap:0;opacity:1;transition:opacity .2s ease,visibility .2s ease;visibility:visible;width:fit-content}.quantity-input-wrapper--hidden{opacity:0;pointer-events:none;visibility:hidden}.quantity-btn{align-items:center;background:var(--color-bg-primary);border:2px solid var(--color-border);color:var(--color-text-primary);cursor:pointer;display:flex;font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);height:40px;justify-content:center;transition:all .2s ease;user-select:none;width:40px}.quantity-btn:hover:not(:disabled){background:var(--color-bg-secondary)}.quantity-btn:disabled{cursor:not-allowed}.quantity-btn--minus{border-radius:var(--radius-md) 0 0 var(--radius-md);border-right:none}.quantity-btn--plus{border-left:none;border-radius:0 var(--radius-md) var(--radius-md) 0}.quantity-input{background:var(--color-bg-primary);border:2px solid var(--color-border);border-left:none;border-right:none;color:var(--color-text-primary);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);height:40px;outline:none;text-align:center;width:60px}.quantity-input::-webkit-inner-spin-button,.quantity-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.quantity-input[type=number]{-moz-appearance:textfield;appearance:textfield}.quantity-btn--xs{font-size:var(--font-size-sm);height:24px;width:24px}.quantity-input--xs{font-size:calc(var(--font-size-sm)*3/4);height:24px;width:32px}.quantity-btn--sm{font-size:var(--font-size-base);height:32px;width:32px}.quantity-input--sm{font-size:var(--font-size-sm);height:32px;width:48px}.quantity-btn--md{font-size:var(--font-size-lg);height:40px;width:40px}.quantity-input--md{font-size:var(--font-size-base);height:40px;width:60px}.quantity-btn--lg{font-size:var(--font-size-xl);height:48px;width:48px}.quantity-input--lg{font-size:var(--font-size-lg);height:48px;width:72px}body.modal-open{height:100%!important;overflow:hidden!important;position:fixed!important;width:100%!important}.base-button{align-items:center;border:1px solid transparent;border-radius:var(--radius-md);cursor:pointer;display:inline-flex;font-family:var(--font-family-sans);font-weight:var(--font-weight-medium);gap:var(--space-2);justify-content:center;line-height:var(--line-height-tight);position:relative;text-decoration:none;transition:all var(--transition-fast);user-select:none;white-space:nowrap}.base-button:focus-visible{outline:2px solid var(--color-border-focus);outline-offset:2px}.base-button--primary{background-color:var(--color-primary);border-color:var(--color-primary);color:var(--color-text-inverse)}.base-button--primary:hover:not(:disabled):not(.base-button--confirming){background-color:var(--color-primary-hover);border-color:var(--color-primary-hover)}.base-button--secondary{background-color:var(--color-secondary);border-color:var(--color-secondary);color:var(--color-text-inverse)}.base-button--secondary:hover:not(:disabled):not(.base-button--confirming){background-color:var(--color-secondary-hover);border-color:var(--color-secondary-hover)}.base-button--outline{background-color:transparent;border-color:var(--color-border);color:var(--color-primary)}.base-button--outline:hover:not(:disabled):not(.base-button--confirming){background-color:var(--color-primary-light);border-color:var(--color-primary)}.base-button--ghost{background-color:transparent;border-color:transparent;color:var(--color-text-secondary)}.base-button--danger,.base-button--ghost:hover:not(:disabled):not(.base-button--confirming){color:var(--color-text-primary)}.base-button--danger{background-color:var(--color-primary-bg);border-color:var(--color-error)}.base-button--danger:hover:not(:disabled):not(.base-button--confirming){background-color:var(--color-error-bg);border-color:var(--color-error)}.base-button--xs{font-size:var(--font-size-xs);padding:var(--space-1) var(--space-2)}.base-button--sm{font-size:var(--font-size-sm);padding:var(--space-2) var(--space-3)}.base-button--md{font-size:var(--font-size-base);padding:var(--space-3) var(--space-4)}.base-button--lg{font-size:var(--font-size-lg);padding:var(--space-4) var(--space-6)}.base-button:disabled{cursor:not-allowed;opacity:.5}.base-button--full-width{width:100%}.base-button--loading{cursor:wait}.loading-text{opacity:.7}.loading-container{filter:brightness(400%)}.base-button--xs .confirm-button{padding:var(--space-1) var(--space-2)}.base-button--sm .confirm-button{padding:var(--space-2) var(--space-3)}.base-button--md .confirm-button{padding:var(--space-3) var(--space-4)}.base-button--lg .confirm-button{padding:var(--space-4) var(--space-6)}.cancel-button{align-items:center;background:transparent;border:none;cursor:pointer;display:flex;flex-shrink:0;justify-content:center;padding:0;transition:all var(--transition-fast);width:32px}.cancel-icon{height:16px;width:16px}.confirm-container{align-items:center;display:flex;gap:var(--space-2);justify-content:space-between;width:100%}.confirm-container span{flex:1;text-align:center}.base-card{background-color:var(--color-bg-primary);border-radius:var(--radius-lg);box-sizing:border-box;display:flex;flex-direction:column;max-width:100%;position:relative;transition:all var(--transition-fast)}.base-card--default{border:none}.base-card--elevated{border:1px solid var(--color-border);box-shadow:var(--shadow-sm)}.base-card--padding-auto{padding:auto}.base-card--padding-none{padding:0}.base-card--padding-sm{padding:var(--space-4)}.base-card--padding-md{padding:var(--space-6)}.base-card--padding-lg{padding:var(--space-8)}.base-card--hoverable{cursor:pointer}.base-card--hoverable:hover{box-shadow:var(--shadow-md);transform:translateY(0)}.base-card--expandable{position:relative}.expand-btn{align-items:center;background:none;border:1px solid var(--color-border);border-radius:var(--radius-md);color:var(--color-text-secondary);cursor:pointer;display:flex;justify-content:center;opacity:0;padding:var(--space-2);pointer-events:none;position:absolute;right:var(--space-3);top:var(--space-3);transform:scale(.8);transition:all var(--transition-fast);z-index:10}.base-card--expandable:hover .expand-btn{opacity:1;pointer-events:auto;transform:scale(1)}.expand-btn:hover{background:var(--color-bg-muted);box-shadow:var(--shadow-sm);color:var(--color-text-primary)}.expand-btn:focus{opacity:1;outline:2px solid var(--color-primary);outline-offset:2px;pointer-events:auto;transform:scale(1)}@media (max-width:768px){.expand-btn{opacity:1;pointer-events:auto;transform:scale(1)}}.card-header{margin-bottom:var(--space-4)}.card-title-wrapper{align-items:center;display:flex;gap:var(--space-2)}.card-title{color:var(--color-text-primary);font-size:var(--font-size-xl);font-weight:var(--font-weight-semibold);line-height:var(--line-height-tight);margin:0}.card-badge{position:relative;right:var(--space-1)}.card-badge,.card-badge-notitle{align-items:center;background:var(--color-error);border-radius:var(--radius-full);color:#fff;cursor:pointer;display:inline-flex;font-size:var(--font-size-2xs);font-weight:var(--font-weight-semibold);height:calc(12px + var(--space-1));justify-content:center;line-height:1;min-width:12px;padding:0 var(--space-2)}.card-badge-notitle{left:var(--space-1);position:absolute;top:var(--space-1);z-index:5}.card-badge-notitle:hover,.card-badge:hover{background:var(--color-error-bg)}.card-body{min-width:0}.card-footer{border-top:1px solid var(--color-border);margin-top:var(--space-4);padding-top:var(--space-4)}.base-card--padding-none .card-header{margin-bottom:0;padding:var(--space-6) var(--space-6) 0}.base-card--padding-none .card-body{padding:var(--space-4) var(--space-6)}.base-card--padding-none .card-footer{margin-top:0;padding:0 var(--space-6) var(--space-6)}.base-card:hover{opacity:1;visibility:visible}.desktop-only{display:block}@media (max-width:768px){.desktop-only{display:none}}.input-group{display:flex;flex-direction:column;gap:var(--space-2)}.input-label{align-items:center;color:var(--color-text-primary);display:flex;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);gap:var(--space-1);line-height:var(--line-height-tight)}.required-indicator{color:var(--color-error);font-weight:var(--font-weight-bold)}.input-wrapper{align-items:center;display:flex;position:relative}.base-input{background-color:var(--color-bg-primary);border:1px solid var(--color-border);border-radius:var(--radius-md);color:var(--color-text-primary);font-family:var(--font-family-sans);transition:all var(--transition-fast);width:100%}.base-input:hover:not(:disabled){border-color:var(--color-border-hover)}.base-input:focus{border-color:var(--color-border-focus);box-shadow:0 0 0 3px rgba(59,130,246,.1);outline:none}.base-input::placeholder{color:var(--color-text-muted)}.base-input--sm{font-size:var(--font-size-sm);padding:var(--space-2) var(--space-3)}.base-input--md{font-size:var(--font-size-base);padding:var(--space-3) var(--space-4)}.base-input--lg{font-size:var(--font-size-lg);padding:var(--space-4) var(--space-5)}.base-input--error,.base-input--error:focus{border-color:var(--color-error)}.base-input--error:focus{box-shadow:0 0 0 3px rgba(220,38,38,.1)}.base-input--disabled{background-color:var(--color-bg-muted);cursor:not-allowed;opacity:.5}.input-suffix{align-items:center;color:var(--color-text-muted);display:flex;position:absolute;right:var(--space-3)}.input-error{color:var(--color-error)}.input-error,.input-hint{font-size:var(--font-size-sm);line-height:var(--line-height-tight)}.input-hint{color:var(--color-text-muted)}.base-alert{align-items:flex-start;border:1px solid transparent;border-radius:var(--radius-md);display:flex;gap:var(--space-3);padding:var(--space-4)}.base-alert--info{background-color:rgba(59,130,246,.1);border-color:rgba(59,130,246,.2);color:var(--color-info)}.base-alert--success{background-color:rgba(16,185,129,.1);border-color:rgba(16,185,129,.2);color:var(--color-success)}.base-alert--warning{background-color:rgba(245,158,11,.1);border-color:rgba(245,158,11,.2);color:var(--color-warning)}.base-alert--error{background-color:rgba(239,68,68,.1);border-color:rgba(239,68,68,.2);color:var(--color-error)}.alert-icon{flex-shrink:0;height:1.25rem;margin-top:.125rem;width:1.25rem}.alert-content{flex:1;min-width:0}.alert-title{font-weight:var(--font-weight-semibold);line-height:var(--line-height-tight);margin:0 0 var(--space-1) 0}.alert-message,.alert-title{font-size:var(--font-size-sm)}.alert-message{line-height:var(--line-height-normal)}.alert-dismiss{background:none;border:none;color:currentColor;cursor:pointer;flex-shrink:0;height:1.25rem;opacity:.7;padding:0;transition:opacity var(--transition-fast);width:1.25rem}.alert-dismiss:hover{opacity:1}.alert-dismiss:focus{opacity:1;outline:2px solid currentColor;outline-offset:1px}.base-skeleton{animation:shimmer 1.5s ease-in-out infinite;background:linear-gradient(90deg,var(--color-bg-muted) 0,var(--color-bg-secondary) 50%,var(--color-bg-muted) 100%);background-size:200% 100%;overflow:hidden;position:relative}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.skeleton--text{border-radius:var(--radius-sm);height:1em}.skeleton--rectangle{border-radius:var(--radius-md)}.skeleton--rounded{border-radius:var(--radius-lg)}.skeleton--avatar,.skeleton--rounded-full{border-radius:var(--radius-full)}.skeleton--avatar{height:40px;width:40px}.skeleton--card{background:var(--color-bg-primary);border:1px solid var(--color-border);border-radius:var(--radius-lg);min-height:200px;padding:var(--space-6)}.skeleton-card{gap:var(--space-4);height:100%}.skeleton-card,.skeleton-header{display:flex;flex-direction:column}.skeleton-header{gap:var(--space-2)}.skeleton-title{animation:shimmer 1.5s ease-in-out infinite;background:linear-gradient(90deg,var(--color-bg-muted) 0,var(--color-bg-secondary) 50%,var(--color-bg-muted) 100%);background-size:200% 100%;border-radius:var(--radius-sm);height:24px;width:40%}.skeleton-body{display:flex;flex:1;flex-direction:column;gap:var(--space-3)}.skeleton-line{animation:shimmer 1.5s ease-in-out infinite;background:linear-gradient(90deg,var(--color-bg-muted) 0,var(--color-bg-secondary) 50%,var(--color-bg-muted) 100%);background-size:200% 100%;border-radius:var(--radius-sm);height:16px}@media (prefers-reduced-motion:reduce){.base-skeleton,.skeleton-line,.skeleton-title{animation:none;background:var(--color-bg-muted)}}.theme-toggle{align-items:center;display:inline-flex;justify-content:center;transition:all var(--transition-fast)}.theme-toggle:hover{transform:scale(1.05)}.theme-icon{height:1.25rem;transition:transform var(--transition-fast);width:1.25rem}.theme-toggle:active .theme-icon{transform:scale(.95)}@media (prefers-reduced-motion:no-preference){.theme-icon{animation:themeSwitch .3s ease-in-out}}@keyframes themeSwitch{0%{transform:rotate(0deg) scale(1)}50%{transform:rotate(180deg) scale(.8)}to{transform:rotate(1turn) scale(1)}}
|
package/package.json
ADDED
|
@@ -0,0 +1,73 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@cal.macconnachie/web-components",
|
|
3
|
+
"version": "0.0.1",
|
|
4
|
+
"description": "Web components hosted on a CDN",
|
|
5
|
+
"keywords": [
|
|
6
|
+
"lit",
|
|
7
|
+
"web-components",
|
|
8
|
+
"auth",
|
|
9
|
+
"lit"
|
|
10
|
+
],
|
|
11
|
+
"homepage": "https://github.com/cal-macconnachie/web-components#readme",
|
|
12
|
+
"bugs": {
|
|
13
|
+
"url": "https://github.com/cal-macconnachie/web-components/issues"
|
|
14
|
+
},
|
|
15
|
+
"repository": {
|
|
16
|
+
"type": "git",
|
|
17
|
+
"url": "git+https://github.com/cal-macconnachie/web-components.git"
|
|
18
|
+
},
|
|
19
|
+
"license": "MIT",
|
|
20
|
+
"author": "cal macconnachie",
|
|
21
|
+
"type": "module",
|
|
22
|
+
"exports": {
|
|
23
|
+
".": {
|
|
24
|
+
"types": "./dist/index.d.ts",
|
|
25
|
+
"import": "./dist/index.js"
|
|
26
|
+
},
|
|
27
|
+
"./components/*": {
|
|
28
|
+
"types": "./dist/components/*.d.ts",
|
|
29
|
+
"import": "./dist/components/*"
|
|
30
|
+
},
|
|
31
|
+
"./stylesheets/*": "./dist/stylesheets/*.css"
|
|
32
|
+
},
|
|
33
|
+
"main": "./dist/index.js",
|
|
34
|
+
"types": "./dist/index.d.ts",
|
|
35
|
+
"files": [
|
|
36
|
+
"dist"
|
|
37
|
+
],
|
|
38
|
+
"workspaces": [
|
|
39
|
+
".",
|
|
40
|
+
"cdn"
|
|
41
|
+
],
|
|
42
|
+
"scripts": {
|
|
43
|
+
"dev": "vite",
|
|
44
|
+
"build": "vite build",
|
|
45
|
+
"build:components": "node build-components.ts",
|
|
46
|
+
"minify:css": "node -e \"require('fs').mkdirSync('dist/stylesheets',{recursive:true})\" && postcss src/stylesheets/*.css --dir dist/stylesheets --no-map",
|
|
47
|
+
"preview": "vite preview",
|
|
48
|
+
"typecheck": "tsc --noEmit",
|
|
49
|
+
"prepublishOnly": "yarn build && yarn build:components && yarn typecheck && yarn minify:css",
|
|
50
|
+
"cdk": "yarn workspace cdn cdk",
|
|
51
|
+
"cdk:deploy": "yarn workspace cdn cdk deploy",
|
|
52
|
+
"cdk:synth": "yarn workspace cdn cdk synth",
|
|
53
|
+
"cdk:diff": "yarn workspace cdn cdk diff",
|
|
54
|
+
"cdk:destroy": "yarn workspace cdn cdk destroy"
|
|
55
|
+
},
|
|
56
|
+
"dependencies": {
|
|
57
|
+
"lit": "^3.3.1"
|
|
58
|
+
},
|
|
59
|
+
"devDependencies": {
|
|
60
|
+
"@types/node": "^24.10.1",
|
|
61
|
+
"cssnano": "^6.1.2",
|
|
62
|
+
"postcss": "^8.4.49",
|
|
63
|
+
"postcss-cli": "^11.0.0",
|
|
64
|
+
"typescript": "^5.9.3",
|
|
65
|
+
"vite": "^7.2.4",
|
|
66
|
+
"vite-plugin-dts": "^4.5.4"
|
|
67
|
+
},
|
|
68
|
+
"engines": {
|
|
69
|
+
"node": ">=18"
|
|
70
|
+
},
|
|
71
|
+
"module": "./dist/index.js",
|
|
72
|
+
"packageManager": "yarn@1.22.22+sha512.a6b2f7906b721bba3d67d4aff083df04dad64c399707841b7acf00f6b133b7ac24255f2652fa22ae3534329dc6180534e98d17432037ff6fd140556e2bb3137e"
|
|
73
|
+
}
|