@elevasis/ui 1.1.0 → 1.2.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.
@@ -28,16 +28,6 @@ declare function WorkOSAuthBridge({ children }: {
28
28
  children: ReactNode;
29
29
  }): react_jsx_runtime.JSX.Element;
30
30
 
31
- /**
32
- * Bridge component that reads OAuth state and provides it
33
- * via the generic AuthContext. Place inside OAuthProvider.
34
- *
35
- * Mirrors WorkOSAuthBridge structure -- maps OAuthContextValue to AuthAdapter.
36
- */
37
- declare function OAuthAuthBridge({ children }: {
38
- children: ReactNode;
39
- }): react_jsx_runtime.JSX.Element;
40
-
41
31
  interface OAuthContextValue {
42
32
  user: {
43
33
  id: string;
@@ -93,5 +83,5 @@ declare function useStableAccessToken(): () => Promise<string>;
93
83
  */
94
84
  declare function useSessionCheck(): void;
95
85
 
96
- export { AuthProvider, OAuthAuthBridge, WorkOSAuthBridge, useAuthContext, useOAuthContext, useSessionCheck as useRefocusSessionCheck, useSessionCheck, useStableAccessToken };
86
+ export { AuthProvider, WorkOSAuthBridge, useAuthContext, useOAuthContext, useSessionCheck as useRefocusSessionCheck, useSessionCheck, useStableAccessToken };
97
87
  export type { AuthAdapter, OAuthContextValue };
@@ -1,4 +1,4 @@
1
- export { useSessionCheck as useRefocusSessionCheck, useSessionCheck, useStableAccessToken } from '../chunk-SH53DPUQ.js';
1
+ export { useSessionCheck as useRefocusSessionCheck, useSessionCheck, useStableAccessToken } from '../chunk-HBRMWW6V.js';
2
2
  export { WorkOSAuthBridge } from '../chunk-NIAVTSMB.js';
3
- export { OAuthAuthBridge, useOAuthContext } from '../chunk-V5PNQNFT.js';
3
+ export { useOAuthContext } from '../chunk-QSVZP2NU.js';
4
4
  export { AuthProvider, useAuthContext } from '../chunk-7PLEQFHO.js';
@@ -1,11 +1,266 @@
1
1
  import { ApiClientProvider, createUseApiClient } from './chunk-GDV44UWF.js';
2
2
  import { ElevasisServiceProvider } from './chunk-KA7LO7U5.js';
3
- import { OAuthProvider, OAuthAuthBridge } from './chunk-V5PNQNFT.js';
3
+ import { WorkOSAuthBridge } from './chunk-NIAVTSMB.js';
4
+ import { OAuthProvider } from './chunk-QSVZP2NU.js';
4
5
  import { useAuthContext } from './chunk-7PLEQFHO.js';
5
- import { lazy, useMemo, useEffect, useRef, Suspense, useState } from 'react';
6
+ import { useMemo, useEffect, useRef } from 'react';
7
+ import { Tooltip, Text, Tabs, Table, Stack, SimpleGrid, Select, Combobox, SegmentedControl, ScrollArea, Paper, Popover, Notification, Modal, Menu, Input, HoverCard, Group, Grid, Flex, Code, Divider, Card, Button, Accordion, createTheme, mergeThemeOverrides, MantineProvider } from '@mantine/core';
6
8
  import { QueryClientProvider, QueryClient } from '@tanstack/react-query';
9
+ import { AuthKitProvider } from '@workos-inc/authkit-react';
10
+ import '@mantine/core/styles.css';
11
+ import '@mantine/notifications/styles.css';
7
12
  import { jsx } from 'react/jsx-runtime';
8
13
 
14
+ var DEFAULT_SIZE = "sm";
15
+ var glassBase = {
16
+ backdropFilter: "var(--glass-blur)",
17
+ WebkitBackdropFilter: "var(--glass-blur)",
18
+ border: "1px solid var(--color-border)"
19
+ };
20
+ var componentThemes = {
21
+ Accordion: Accordion.extend({
22
+ styles: {
23
+ item: {
24
+ borderColor: "var(--color-border)"
25
+ },
26
+ content: {
27
+ backgroundColor: "var(--color-surface)"
28
+ }
29
+ }
30
+ }),
31
+ Button: Button.extend({
32
+ styles: {
33
+ root: {
34
+ transition: `all var(--duration-fast) var(--easing)`
35
+ }
36
+ }
37
+ }),
38
+ Card: Card.extend({
39
+ defaultProps: {
40
+ p: DEFAULT_SIZE
41
+ },
42
+ styles: {
43
+ root: {
44
+ backgroundColor: "var(--glass-background)",
45
+ ...glassBase,
46
+ boxShadow: "var(--card-shadow)"
47
+ }
48
+ }
49
+ }),
50
+ // Checkbox styles are in custom.css to support :checked pseudo-selector
51
+ Divider: Divider.extend({
52
+ styles: {
53
+ root: {
54
+ borderColor: "var(--color-border)"
55
+ }
56
+ }
57
+ }),
58
+ Code: Code.extend({
59
+ styles: {
60
+ root: {
61
+ backgroundColor: "var(--color-surface)",
62
+ border: "1px solid var(--color-border)"
63
+ }
64
+ }
65
+ }),
66
+ Flex: Flex.extend({
67
+ defaultProps: {
68
+ gap: DEFAULT_SIZE
69
+ }
70
+ }),
71
+ Grid: Grid.extend({
72
+ defaultProps: {
73
+ gutter: DEFAULT_SIZE
74
+ }
75
+ }),
76
+ Group: Group.extend({
77
+ defaultProps: {
78
+ gap: DEFAULT_SIZE
79
+ }
80
+ }),
81
+ HoverCard: HoverCard.extend({
82
+ styles: {
83
+ dropdown: {
84
+ backgroundColor: "var(--color-surface)",
85
+ border: "1px solid var(--color-border)",
86
+ boxShadow: "var(--standard-box-shadow)"
87
+ }
88
+ }
89
+ }),
90
+ Input: Input.extend({
91
+ styles: {
92
+ input: {
93
+ backgroundColor: "var(--color-surface)",
94
+ border: "none",
95
+ borderBottom: "1px solid var(--color-border)",
96
+ borderRadius: "0"
97
+ }
98
+ }
99
+ }),
100
+ Menu: Menu.extend({
101
+ styles: {
102
+ dropdown: {
103
+ background: "var(--color-surface)",
104
+ border: "1px solid var(--color-border)"
105
+ }
106
+ }
107
+ }),
108
+ Modal: Modal.extend({
109
+ styles: {
110
+ content: {
111
+ backgroundColor: "var(--color-surface)",
112
+ border: "1px solid var(--color-border)"
113
+ }
114
+ }
115
+ }),
116
+ Notification: Notification.extend({
117
+ styles: {
118
+ root: {
119
+ backgroundColor: "color-mix(in srgb, var(--color-surface) 90%, transparent)",
120
+ ...glassBase
121
+ }
122
+ }
123
+ }),
124
+ Popover: Popover.extend({
125
+ styles: {
126
+ dropdown: {
127
+ backgroundColor: "var(--color-surface)",
128
+ ...glassBase,
129
+ boxShadow: "var(--standard-box-shadow)"
130
+ }
131
+ }
132
+ }),
133
+ Paper: Paper.extend({
134
+ styles: {
135
+ root: {
136
+ backgroundColor: "var(--glass-background)",
137
+ ...glassBase,
138
+ boxShadow: "var(--card-shadow)",
139
+ padding: `var(--mantine-spacing-${DEFAULT_SIZE})`
140
+ }
141
+ }
142
+ }),
143
+ ScrollArea: ScrollArea.extend({
144
+ defaultProps: {
145
+ scrollbarSize: 8
146
+ },
147
+ styles: {
148
+ scrollbar: {
149
+ background: "transparent",
150
+ '&[data-orientation="vertical"]': {
151
+ width: "8px"
152
+ },
153
+ '&[data-orientation="horizontal"]': {
154
+ height: "8px"
155
+ }
156
+ },
157
+ thumb: {
158
+ borderRadius: "var(--mantine-radius-default)",
159
+ background: "color-mix(in srgb, var(--color-text-subtle) 50%, var(--color-border))",
160
+ "&:hover": {
161
+ background: "var(--color-text-subtle)"
162
+ }
163
+ }
164
+ }
165
+ }),
166
+ SegmentedControl: SegmentedControl.extend({
167
+ styles: {
168
+ root: {
169
+ backgroundColor: "var(--color-surface)"
170
+ },
171
+ indicator: {
172
+ backgroundColor: "var(--color-surface-hover)",
173
+ boxShadow: "var(--standard-box-shadow)"
174
+ }
175
+ }
176
+ }),
177
+ Combobox: Combobox.extend({
178
+ styles: {
179
+ dropdown: {
180
+ backgroundColor: "red"
181
+ }
182
+ }
183
+ }),
184
+ Select: Select.extend({
185
+ styles: {
186
+ dropdown: {
187
+ backgroundColor: "var(--color-surface)"
188
+ }
189
+ }
190
+ }),
191
+ // Switch styles are in custom.css to support [data-checked] attribute selector
192
+ SimpleGrid: SimpleGrid.extend({
193
+ defaultProps: {
194
+ spacing: DEFAULT_SIZE,
195
+ verticalSpacing: DEFAULT_SIZE
196
+ }
197
+ }),
198
+ Stack: Stack.extend({
199
+ defaultProps: {
200
+ gap: DEFAULT_SIZE
201
+ }
202
+ }),
203
+ Table: Table.extend({
204
+ defaultProps: {
205
+ highlightOnHover: true
206
+ },
207
+ styles: {
208
+ table: {
209
+ "--table-border-color": "var(--color-border)",
210
+ "--table-highlight-on-hover-color": "var(--color-surface-hover)"
211
+ }
212
+ }
213
+ }),
214
+ Tabs: Tabs.extend({}),
215
+ Text: Text.extend({
216
+ styles: {
217
+ root: {
218
+ fontFamily: 'Roboto, Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif'
219
+ }
220
+ }
221
+ }),
222
+ // Timeline styles are in custom.css to override color-scheme-specific selectors
223
+ Tooltip: Tooltip.extend({
224
+ styles: {
225
+ tooltip: {
226
+ backgroundColor: "var(--color-surface)",
227
+ color: "var(--color-text)",
228
+ border: "1px solid var(--color-border)"
229
+ }
230
+ }
231
+ })
232
+ // Pagination styles are in custom.css to support :not([data-active]) selector
233
+ };
234
+
235
+ // src/theme/MantineThemeOverride.ts
236
+ var mantineThemeOverride = createTheme({
237
+ defaultRadius: "xs",
238
+ fontFamily: 'Roboto, Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif',
239
+ cursorType: "pointer",
240
+ spacing: {
241
+ xs: "0.5rem",
242
+ sm: "0.75rem",
243
+ md: "1rem",
244
+ lg: "1.5rem",
245
+ xl: "2rem"
246
+ },
247
+ radius: {
248
+ xs: "0.25rem",
249
+ sm: "0.5rem",
250
+ md: "0.75rem",
251
+ lg: "1rem",
252
+ xl: "1.5rem"
253
+ },
254
+ fontSizes: {
255
+ xs: "0.75rem",
256
+ sm: "0.875rem",
257
+ md: "1rem",
258
+ lg: "1.125rem",
259
+ xl: "1.25rem"
260
+ },
261
+ components: componentThemes
262
+ });
263
+
9
264
  // src/theme/presets/utils.ts
10
265
  function hexToRgb(hex) {
11
266
  const h = hex.replace("#", "");
@@ -1111,7 +1366,6 @@ function createCssVariablesResolver(tokens, preset) {
1111
1366
  dark: { ...darkShades, ...darkDefaults, ...flat, ...dark }
1112
1367
  });
1113
1368
  }
1114
- var LazyCoreAuthKitInner = lazy(() => import('./CoreAuthKitInner-KM72EYJS.js').then((m) => ({ default: m.CoreAuthKitInner })));
1115
1369
  var defaultQueryClient = null;
1116
1370
  function getDefaultQueryClient() {
1117
1371
  if (!defaultQueryClient) {
@@ -1122,56 +1376,7 @@ function getDefaultQueryClient() {
1122
1376
  return defaultQueryClient;
1123
1377
  }
1124
1378
  var defaultUseOrganizations = () => ({ isInitializing: false, isOrgRefreshing: false });
1125
- function useResolvedColorScheme(scheme) {
1126
- const [resolved, setResolved] = useState(() => {
1127
- if (scheme && scheme !== "auto") return scheme;
1128
- if (typeof window === "undefined") return "dark";
1129
- return window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
1130
- });
1131
- useEffect(() => {
1132
- if (scheme && scheme !== "auto") {
1133
- setResolved(scheme);
1134
- return;
1135
- }
1136
- const mql = window.matchMedia("(prefers-color-scheme: dark)");
1137
- const handler = (e) => setResolved(e.matches ? "dark" : "light");
1138
- setResolved(mql.matches ? "dark" : "light");
1139
- mql.addEventListener("change", handler);
1140
- return () => mql.removeEventListener("change", handler);
1141
- }, [scheme]);
1142
- return resolved;
1143
- }
1144
- function buildCssVarStyles(theme) {
1145
- const preset = getPreset(theme?.preset ?? "default");
1146
- const tokens = theme?.tokens;
1147
- function toVarDeclarations(overrides) {
1148
- const lines = [];
1149
- for (const [key, varName] of Object.entries(TOKEN_VAR_MAP)) {
1150
- const value = overrides[key];
1151
- if (value) lines.push(` ${varName}: ${value};`);
1152
- }
1153
- return lines.join("\n");
1154
- }
1155
- const flatTokens = {};
1156
- if (tokens) {
1157
- for (const key of Object.keys(TOKEN_VAR_MAP)) {
1158
- if (tokens[key] !== void 0) flatTokens[key] = tokens[key];
1159
- }
1160
- }
1161
- const darkMerged = { ...preset.dark, ...flatTokens, ...tokens?.dark };
1162
- const lightMerged = { ...preset.light, ...flatTokens, ...tokens?.light };
1163
- const darkBlock = toVarDeclarations(darkMerged);
1164
- const lightBlock = toVarDeclarations(lightMerged);
1165
- return [
1166
- `:root[data-elevasis-scheme="dark"] {
1167
- ${darkBlock}
1168
- }`,
1169
- `:root[data-elevasis-scheme="light"] {
1170
- ${lightBlock}
1171
- }`
1172
- ].join("\n\n");
1173
- }
1174
- function ElevasisCoreProvider({
1379
+ function ElevasisUIProvider({
1175
1380
  auth,
1176
1381
  theme,
1177
1382
  organizationId = null,
@@ -1183,35 +1388,12 @@ function ElevasisCoreProvider({
1183
1388
  }) {
1184
1389
  if (auth.mode === "apiKey") {
1185
1390
  throw new Error(
1186
- `ElevasisCoreProvider: auth mode 'apiKey' is not yet implemented. Only 'authkit' and 'oauth' modes are supported.`
1391
+ `ElevasisUIProvider: auth mode 'apiKey' is not yet implemented. Only 'authkit' and 'oauth' modes are supported.`
1187
1392
  );
1188
1393
  }
1189
1394
  const resolvedQueryClient = queryClient ?? getDefaultQueryClient();
1190
- const resolvedScheme = useResolvedColorScheme(theme?.colorScheme);
1395
+ const resolvedColorScheme = theme?.colorScheme ?? "dark";
1191
1396
  const preset = useMemo(() => getPreset(theme?.preset ?? "default"), [theme?.preset]);
1192
- useEffect(() => {
1193
- document.documentElement.setAttribute("data-elevasis-scheme", resolvedScheme);
1194
- return () => {
1195
- document.documentElement.removeAttribute("data-elevasis-scheme");
1196
- };
1197
- }, [resolvedScheme]);
1198
- const styleRef = useRef(null);
1199
- useEffect(() => {
1200
- const css = buildCssVarStyles(theme);
1201
- if (!styleRef.current) {
1202
- const el = document.createElement("style");
1203
- el.setAttribute("data-elevasis-vars", "");
1204
- document.head.appendChild(el);
1205
- styleRef.current = el;
1206
- }
1207
- styleRef.current.textContent = css;
1208
- return () => {
1209
- if (styleRef.current) {
1210
- styleRef.current.remove();
1211
- styleRef.current = null;
1212
- }
1213
- };
1214
- }, [theme?.preset, theme?.tokens, resolvedScheme]);
1215
1397
  useEffect(() => {
1216
1398
  if (!preset.fontImports?.length) return;
1217
1399
  const links = [];
@@ -1230,8 +1412,22 @@ function ElevasisCoreProvider({
1230
1412
  document.documentElement.style.removeProperty("--elevasis-font-family-subtitle");
1231
1413
  };
1232
1414
  }, [preset.fontImports, preset.subtitleFontFamily, preset.mantine?.headings?.fontFamily, preset.mantine?.fontFamily]);
1415
+ const resolvedTheme = useMemo(() => {
1416
+ const primaryHex = theme?.tokens?.primary ?? preset.dark.primary;
1417
+ const primaryOverride = {
1418
+ primaryColor: "primary",
1419
+ colors: { primary: generateShades(primaryHex) }
1420
+ };
1421
+ let base = mergeThemeOverrides(mantineThemeOverride, primaryOverride);
1422
+ if (preset.mantine) base = mergeThemeOverrides(base, preset.mantine);
1423
+ return theme?.mantine ? mergeThemeOverrides(base, theme.mantine) : base;
1424
+ }, [theme?.mantine, preset, theme?.tokens?.primary]);
1425
+ const cssVariablesResolver = useMemo(
1426
+ () => createCssVariablesResolver(theme?.tokens, theme?.preset),
1427
+ [theme?.tokens, theme?.preset]
1428
+ );
1233
1429
  const content = apiUrl ? /* @__PURE__ */ jsx(
1234
- CoreServiceBridge,
1430
+ ServiceBridge,
1235
1431
  {
1236
1432
  apiUrl,
1237
1433
  organizationId,
@@ -1240,13 +1436,33 @@ function ElevasisCoreProvider({
1240
1436
  children
1241
1437
  }
1242
1438
  ) : children;
1243
- const AuthInner = auth.mode === "authkit" ? /* @__PURE__ */ jsx(Suspense, { fallback: null, children: /* @__PURE__ */ jsx(LazyCoreAuthKitInner, { auth, children: content }) }) : /* @__PURE__ */ jsx(CoreOAuthInner, { auth, children: content });
1244
- return /* @__PURE__ */ jsx(QueryClientProvider, { client: resolvedQueryClient, children: AuthInner });
1439
+ const AuthInner = auth.mode === "authkit" ? /* @__PURE__ */ jsx(AuthKitInner, { auth, children: content }) : /* @__PURE__ */ jsx(OAuthInner, { auth, children: content });
1440
+ return /* @__PURE__ */ jsx(
1441
+ MantineProvider,
1442
+ {
1443
+ theme: resolvedTheme,
1444
+ defaultColorScheme: resolvedColorScheme,
1445
+ cssVariablesResolver,
1446
+ children: /* @__PURE__ */ jsx(QueryClientProvider, { client: resolvedQueryClient, children: AuthInner })
1447
+ }
1448
+ );
1449
+ }
1450
+ function AuthKitInner({ auth, children }) {
1451
+ return /* @__PURE__ */ jsx(
1452
+ AuthKitProvider,
1453
+ {
1454
+ clientId: auth.clientId,
1455
+ apiHostname: auth.apiHostname ?? "api.workos.com",
1456
+ redirectUri: auth.redirectUri,
1457
+ devMode: auth.devMode ?? false,
1458
+ children: /* @__PURE__ */ jsx(WorkOSAuthBridge, { children })
1459
+ }
1460
+ );
1245
1461
  }
1246
- function CoreOAuthInner({ auth, children }) {
1247
- return /* @__PURE__ */ jsx(OAuthProvider, { config: auth, children: /* @__PURE__ */ jsx(OAuthAuthBridge, { children }) });
1462
+ function OAuthInner({ auth, children }) {
1463
+ return /* @__PURE__ */ jsx(OAuthProvider, { config: auth, children });
1248
1464
  }
1249
- function CoreServiceBridge({
1465
+ function ServiceBridge({
1250
1466
  apiUrl,
1251
1467
  organizationId,
1252
1468
  isOrganizationReady,
@@ -1261,11 +1477,11 @@ function CoreServiceBridge({
1261
1477
  organizationId,
1262
1478
  isOrganizationReady: isOrganizationReady ?? !!organizationId,
1263
1479
  onError,
1264
- children: /* @__PURE__ */ jsx(CoreServiceBridgeInner, { apiUrl, organizationId, isOrganizationReady, children })
1480
+ children: /* @__PURE__ */ jsx(ServiceBridgeInner, { apiUrl, organizationId, isOrganizationReady, children })
1265
1481
  }
1266
1482
  );
1267
1483
  }
1268
- function CoreServiceBridgeInner({
1484
+ function ServiceBridgeInner({
1269
1485
  apiUrl,
1270
1486
  organizationId,
1271
1487
  isOrganizationReady,
@@ -1283,5 +1499,6 @@ function CoreServiceBridgeInner({
1283
1499
  }
1284
1500
  );
1285
1501
  }
1502
+ var ElevasisProvider = ElevasisUIProvider;
1286
1503
 
1287
- export { ElevasisCoreProvider, createCssVariablesResolver, generateShades, getPreset };
1504
+ export { ElevasisProvider, ElevasisUIProvider, createCssVariablesResolver, generateShades, getPreset, mantineThemeOverride };
@@ -102,19 +102,16 @@ function OAuthProvider({ config, children }) {
102
102
  async (code, codeVerifier) => {
103
103
  setState((prev) => ({ ...prev, isLoading: true, error: null }));
104
104
  try {
105
- const response = await fetch(
106
- "https://api.workos.com/user_management/authenticate",
107
- {
108
- method: "POST",
109
- headers: { "Content-Type": "application/json" },
110
- body: JSON.stringify({
111
- client_id: config.clientId,
112
- code_verifier: codeVerifier,
113
- grant_type: "authorization_code",
114
- code
115
- })
116
- }
117
- );
105
+ const response = await fetch("https://api.workos.com/user_management/authenticate", {
106
+ method: "POST",
107
+ headers: { "Content-Type": "application/json" },
108
+ body: JSON.stringify({
109
+ client_id: config.clientId,
110
+ code_verifier: codeVerifier,
111
+ grant_type: "authorization_code",
112
+ code
113
+ })
114
+ });
118
115
  if (!response.ok) {
119
116
  const text = await response.text();
120
117
  throw new Error(`Token exchange failed (${response.status}): ${text}`);
@@ -128,7 +125,7 @@ function OAuthProvider({ config, children }) {
128
125
  setState({
129
126
  tokens,
130
127
  user: decodeUserFromJwt(tokens.accessToken),
131
- organizationId: decodeOrgIdFromJwt(tokens.accessToken) ?? (config.organizationId ?? null),
128
+ organizationId: decodeOrgIdFromJwt(tokens.accessToken) ?? config.organizationId ?? null,
132
129
  isLoading: false,
133
130
  error: null
134
131
  });
@@ -153,6 +150,7 @@ function OAuthProvider({ config, children }) {
153
150
  client_id: config.clientId,
154
151
  redirect_uri: config.redirectUri,
155
152
  response_type: "code",
153
+ provider: config.provider ?? "authkit",
156
154
  code_challenge: challenge,
157
155
  code_challenge_method: "S256",
158
156
  state: oauthState
@@ -163,7 +161,7 @@ function OAuthProvider({ config, children }) {
163
161
  window.location.href = `https://api.workos.com/user_management/authorize?${params.toString()}`;
164
162
  };
165
163
  void start();
166
- }, [config.clientId, config.redirectUri, config.organizationId]);
164
+ }, [config.clientId, config.redirectUri, config.organizationId, config.provider]);
167
165
  useEffect(() => {
168
166
  const url = new URL(window.location.href);
169
167
  const code = url.searchParams.get("code");
@@ -201,20 +199,16 @@ function OAuthProvider({ config, children }) {
201
199
  }),
202
200
  [state.user, state.isLoading, state.organizationId, state.error, getAccessToken, initiateOAuthFlow]
203
201
  );
204
- return /* @__PURE__ */ jsx(OAuthContext.Provider, { value, children });
205
- }
206
- function OAuthAuthBridge({ children }) {
207
- const { user, isLoading, getAccessToken, organizationId } = useOAuthContext();
208
- const value = useMemo(
202
+ const authValue = useMemo(
209
203
  () => ({
210
- user,
211
- isLoading,
204
+ user: state.user,
205
+ isLoading: state.isLoading,
212
206
  getAccessToken,
213
- organizationId
207
+ organizationId: state.organizationId
214
208
  }),
215
- [user, isLoading, getAccessToken, organizationId]
209
+ [state.user, state.isLoading, getAccessToken, state.organizationId]
216
210
  );
217
- return /* @__PURE__ */ jsx(AuthProvider, { value, children });
211
+ return /* @__PURE__ */ jsx(OAuthContext.Provider, { value, children: /* @__PURE__ */ jsx(AuthProvider, { value: authValue, children }) });
218
212
  }
219
213
 
220
- export { OAuthAuthBridge, OAuthProvider, useOAuthContext };
214
+ export { OAuthProvider, useOAuthContext };
@@ -0,0 +1,89 @@
1
+ import { ApiClientProvider, createUseApiClient } from './chunk-GDV44UWF.js';
2
+ import { ElevasisServiceProvider } from './chunk-KA7LO7U5.js';
3
+ import { OAuthProvider } from './chunk-QSVZP2NU.js';
4
+ import { useAuthContext } from './chunk-7PLEQFHO.js';
5
+ import { lazy, Suspense, useRef } from 'react';
6
+ import { QueryClientProvider, QueryClient } from '@tanstack/react-query';
7
+ import { jsx } from 'react/jsx-runtime';
8
+
9
+ var LazyCoreAuthKitInner = lazy(() => import('./CoreAuthKitInner-KM72EYJS.js').then((m) => ({ default: m.CoreAuthKitInner })));
10
+ var defaultQueryClient = null;
11
+ function getDefaultQueryClient() {
12
+ if (!defaultQueryClient) {
13
+ defaultQueryClient = new QueryClient({
14
+ defaultOptions: { queries: { retry: 1 } }
15
+ });
16
+ }
17
+ return defaultQueryClient;
18
+ }
19
+ var defaultUseOrganizations = () => ({ isInitializing: false, isOrgRefreshing: false });
20
+ function ElevasisCoreProvider({
21
+ auth,
22
+ organizationId = null,
23
+ queryClient,
24
+ apiUrl,
25
+ onError,
26
+ isOrganizationReady,
27
+ children
28
+ }) {
29
+ if (auth.mode === "apiKey") {
30
+ throw new Error(
31
+ `ElevasisCoreProvider: auth mode 'apiKey' is not yet implemented. Only 'authkit' and 'oauth' modes are supported.`
32
+ );
33
+ }
34
+ const resolvedQueryClient = queryClient ?? getDefaultQueryClient();
35
+ const content = apiUrl ? /* @__PURE__ */ jsx(
36
+ CoreServiceBridge,
37
+ {
38
+ apiUrl,
39
+ organizationId,
40
+ isOrganizationReady,
41
+ onError,
42
+ children
43
+ }
44
+ ) : children;
45
+ const AuthInner = auth.mode === "authkit" ? /* @__PURE__ */ jsx(Suspense, { fallback: null, children: /* @__PURE__ */ jsx(LazyCoreAuthKitInner, { auth, children: content }) }) : /* @__PURE__ */ jsx(CoreOAuthInner, { auth, children: content });
46
+ return /* @__PURE__ */ jsx(QueryClientProvider, { client: resolvedQueryClient, children: AuthInner });
47
+ }
48
+ function CoreOAuthInner({ auth, children }) {
49
+ return /* @__PURE__ */ jsx(OAuthProvider, { config: auth, children });
50
+ }
51
+ function CoreServiceBridge({
52
+ apiUrl,
53
+ organizationId,
54
+ isOrganizationReady,
55
+ onError,
56
+ children
57
+ }) {
58
+ const { getAccessToken } = useAuthContext();
59
+ return /* @__PURE__ */ jsx(
60
+ ApiClientProvider,
61
+ {
62
+ getAccessToken,
63
+ organizationId,
64
+ isOrganizationReady: isOrganizationReady ?? !!organizationId,
65
+ onError,
66
+ children: /* @__PURE__ */ jsx(CoreServiceBridgeInner, { apiUrl, organizationId, isOrganizationReady, children })
67
+ }
68
+ );
69
+ }
70
+ function CoreServiceBridgeInner({
71
+ apiUrl,
72
+ organizationId,
73
+ isOrganizationReady,
74
+ children
75
+ }) {
76
+ const useApiClient = useRef(createUseApiClient(defaultUseOrganizations, apiUrl)).current;
77
+ const { apiRequest } = useApiClient();
78
+ return /* @__PURE__ */ jsx(
79
+ ElevasisServiceProvider,
80
+ {
81
+ apiRequest,
82
+ organizationId,
83
+ isReady: isOrganizationReady ?? !!organizationId,
84
+ children
85
+ }
86
+ );
87
+ }
88
+
89
+ export { ElevasisCoreProvider };
package/dist/index.d.ts CHANGED
@@ -144,6 +144,8 @@ interface OAuthConfig {
144
144
  tokenStorage?: 'session';
145
145
  /** Pre-select organization in WorkOS flow. */
146
146
  organizationId?: string;
147
+ /** Auth provider for the authorize request. Defaults to 'authkit' (hosted login UI). */
148
+ provider?: 'authkit' | 'GoogleOAuth' | 'MicrosoftOAuth' | 'GitHubOAuth' | 'AppleOAuth';
147
149
  }
148
150
  /** Deferred -- will throw at runtime. */
149
151
  interface ApiKeyConfig {
@@ -184,6 +186,12 @@ interface ElevasisCoreProviderProps {
184
186
  * Command-center passes `!!currentMembership` for its stricter readiness requirement.
185
187
  */
186
188
  isOrganizationReady?: boolean;
189
+ /**
190
+ * Whether to inject CSS variables, `data-elevasis-scheme` attribute, and font links.
191
+ * Set to `false` when the consumer has its own complete design system and only
192
+ * needs auth + API from this provider. Defaults to `true`.
193
+ */
194
+ injectStyles?: boolean;
187
195
  children: ReactNode;
188
196
  }
189
197
  interface ElevasisProviderProps {
@@ -5802,9 +5810,9 @@ declare const ElevasisProvider: typeof ElevasisUIProvider;
5802
5810
  /**
5803
5811
  * Headless root provider for Elevasis-powered applications.
5804
5812
  *
5805
- * Same capabilities as ElevasisUIProvider but without any Mantine dependency.
5806
- * Injects CSS variables via a `<style>` tag and sets `data-elevasis-scheme`
5807
- * on the `<html>` element.
5813
+ * Pure auth + API provider with no style side-effects. Does not inject CSS
5814
+ * variables, set `data-elevasis-scheme`, or load fonts. Consumers that need
5815
+ * Elevasis theming should use `ElevasisProvider` (Mantine) instead.
5808
5816
  *
5809
5817
  * Composes: QueryClientProvider + auth provider + auth bridge.
5810
5818
  * When apiUrl is provided, also composes ApiClientProvider + ElevasisServiceProvider.
@@ -5820,7 +5828,7 @@ declare const ElevasisProvider: typeof ElevasisUIProvider;
5820
5828
  * </ElevasisCoreProvider>
5821
5829
  * ```
5822
5830
  */
5823
- declare function ElevasisCoreProvider({ auth, theme, organizationId, queryClient, apiUrl, onError, isOrganizationReady, children }: ElevasisCoreProviderProps): react_jsx_runtime.JSX.Element;
5831
+ declare function ElevasisCoreProvider({ auth, organizationId, queryClient, apiUrl, onError, isOrganizationReady, children }: ElevasisCoreProviderProps): react_jsx_runtime.JSX.Element;
5824
5832
 
5825
5833
  /**
5826
5834
  * Hook to access the ElevasisServiceProvider context.
@@ -6933,16 +6941,6 @@ declare function WorkOSAuthBridge({ children }: {
6933
6941
  children: ReactNode;
6934
6942
  }): react_jsx_runtime.JSX.Element;
6935
6943
 
6936
- /**
6937
- * Bridge component that reads OAuth state and provides it
6938
- * via the generic AuthContext. Place inside OAuthProvider.
6939
- *
6940
- * Mirrors WorkOSAuthBridge structure -- maps OAuthContextValue to AuthAdapter.
6941
- */
6942
- declare function OAuthAuthBridge({ children }: {
6943
- children: ReactNode;
6944
- }): react_jsx_runtime.JSX.Element;
6945
-
6946
6944
  interface OAuthContextValue {
6947
6945
  user: {
6948
6946
  id: string;
@@ -7292,5 +7290,5 @@ interface AppInitializationState {
7292
7290
  */
7293
7291
  declare function createUseAppInitialization(useOrgInitialization: () => UseOrgInitializationReturn): () => AppInitializationState;
7294
7292
 
7295
- export { AGENT_CONSTANTS, APIClientError, APIErrorAlert, ActionModal, AgentDefinitionDisplay, AgentExecutionTimeline, AgentExecutionVisualizer, AgentIterationEdge, AgentIterationNode, ApiClientProvider, AuthProvider, BaseEdge, BaseNode, CONTAINER_CONSTANTS, ChatHeader, ChatInputArea, ChatInterface, ChatSidebar, CollapsibleJsonSection, CollapsibleSection, ConfigCard, ConfirmationInputModal, ConfirmationModal, ContextViewer, ContractDisplay, CustomModal, CustomSelector, DetailCardSkeleton, ElevasisCoreProvider, ElevasisProvider, ElevasisServiceProvider, ElevasisUIProvider, EmptyState, EmptyVisualizer, ExecutionLogsTable, ExecutionStats, ExecutionStatusBadge, FormFieldRenderer, GRAPH_CONSTANTS, GlowingHandle, GraphBackground, GraphContainer, GraphFitViewButton, GraphFitViewHandler, GraphLegend, JsonViewer, ListSkeleton, MessageBubble, NavigationButton, NewKnowledgeMapEdge, NewKnowledgeMapGraph, NewKnowledgeMapNode, NotificationBell, NotificationItem, NotificationList, NotificationPanel, OAuthAuthBridge, OperationsService, OrganizationSwitcher, PageNotFound, PageTitleCaption, ResourceCard, ResourceDefinitionSection, ResourceHealthChart, RouterProvider, SHARED_VIZ_CONSTANTS, STATUS_COLORS, StatCard, StatCardSkeleton, StatsCardSkeleton, StyledMarkdown, TIMELINE_CONSTANTS, TabCountBadge, TanStackRouterBridge, TaskCard, TimeRangeSelector, TimelineAxis, TimelineBar, TimelineContainer, TimelineRow, ToolsListDisplay, TrendIndicator, UnifiedWorkflowEdge, UnifiedWorkflowGraph, UnifiedWorkflowNode, UserProfileService, VisualizerContainer, WORKFLOW_CONSTANTS, WorkOSAuthBridge, WorkflowDefinitionDisplay, WorkflowExecutionTimeline, calculateBarPosition, calculateGraphHeight, catalogItemToResourceDefinition, createCssVariablesResolver, createOrganizationsSlice, createUseApiClient, createUseAppInitialization, createUseOrgInitialization, createUseOrganizations, executionsKeys, formatDate, formatDuration, formatErrorMessage, generateShades, getEdgeColor, getEdgeOpacity, getErrorInfo, getErrorTitle, getGraphBackgroundStyles, getHealthColor, getIcon, getPreset, getResourceColor, getResourceIcon, getResourceStatusColor, getStatusColors, getStatusIcon, iconMap, isAPIClientError, mantineThemeOverride, observabilityKeys, scheduleKeys, shouldAnimateEdge, showApiErrorNotification, showErrorNotification, showInfoNotification, showSuccessNotification, showWarningNotification, useActivities, useActivityTrend, useAgentIterationData, useApiClientContext, useAuthContext, useBulkDeleteExecutions, useBusinessImpact, useCancelExecution, useCancelSchedule, useCommandQueue, useCommandQueueTotals, useConnectionHighlight, useCostBreakdown, useCostByModel, useCostSummary, useCostTrends, useCreateSchedule, useDashboardMetrics, useDeleteExecution, useDeleteSchedule, useDeleteTask, useDirectedChainHighlighting, useElevasisServices, useErrorAnalysis, useErrorDetail, useErrorDetails, useErrorDistribution, useErrorTrends, useExecuteAsync, useExecution, useExecutionHealth, useExecutionLogs, useExecutionPath, useExecutions, useFitViewTrigger, useGetExecutionHistory, useGetSchedule, useGraphBackgroundStyles, useGraphHighlighting, useGraphTheme, useListSchedules, useMarkAllAsRead, useMarkAsRead, useMergedExecution, useNewKnowledgeMapLayout, useNodeSelection, useNotificationCount, useNotifications, useOAuthContext, usePatchTask, usePauseSchedule, useReactFlowAgent, useSessionCheck as useRefocusSessionCheck, useResolveAllErrors, useResolveError, useResolveErrorsByExecution, useResourceDefinition, useResources, useResumeSchedule, useRetryExecution, useRouterContext, useSessionCheck, useStableAccessToken, useSubmitAction, useTimelineData, useTopFailingResources, useUnifiedWorkflowLayout, useUnresolveError, useUpdateAnchor, useUpdateSchedule, useUserProfile, useWorkflowStepsLayout, validateEmail };
7293
+ export { AGENT_CONSTANTS, APIClientError, APIErrorAlert, ActionModal, AgentDefinitionDisplay, AgentExecutionTimeline, AgentExecutionVisualizer, AgentIterationEdge, AgentIterationNode, ApiClientProvider, AuthProvider, BaseEdge, BaseNode, CONTAINER_CONSTANTS, ChatHeader, ChatInputArea, ChatInterface, ChatSidebar, CollapsibleJsonSection, CollapsibleSection, ConfigCard, ConfirmationInputModal, ConfirmationModal, ContextViewer, ContractDisplay, CustomModal, CustomSelector, DetailCardSkeleton, ElevasisCoreProvider, ElevasisProvider, ElevasisServiceProvider, ElevasisUIProvider, EmptyState, EmptyVisualizer, ExecutionLogsTable, ExecutionStats, ExecutionStatusBadge, FormFieldRenderer, GRAPH_CONSTANTS, GlowingHandle, GraphBackground, GraphContainer, GraphFitViewButton, GraphFitViewHandler, GraphLegend, JsonViewer, ListSkeleton, MessageBubble, NavigationButton, NewKnowledgeMapEdge, NewKnowledgeMapGraph, NewKnowledgeMapNode, NotificationBell, NotificationItem, NotificationList, NotificationPanel, OperationsService, OrganizationSwitcher, PageNotFound, PageTitleCaption, ResourceCard, ResourceDefinitionSection, ResourceHealthChart, RouterProvider, SHARED_VIZ_CONSTANTS, STATUS_COLORS, StatCard, StatCardSkeleton, StatsCardSkeleton, StyledMarkdown, TIMELINE_CONSTANTS, TabCountBadge, TanStackRouterBridge, TaskCard, TimeRangeSelector, TimelineAxis, TimelineBar, TimelineContainer, TimelineRow, ToolsListDisplay, TrendIndicator, UnifiedWorkflowEdge, UnifiedWorkflowGraph, UnifiedWorkflowNode, UserProfileService, VisualizerContainer, WORKFLOW_CONSTANTS, WorkOSAuthBridge, WorkflowDefinitionDisplay, WorkflowExecutionTimeline, calculateBarPosition, calculateGraphHeight, catalogItemToResourceDefinition, createCssVariablesResolver, createOrganizationsSlice, createUseApiClient, createUseAppInitialization, createUseOrgInitialization, createUseOrganizations, executionsKeys, formatDate, formatDuration, formatErrorMessage, generateShades, getEdgeColor, getEdgeOpacity, getErrorInfo, getErrorTitle, getGraphBackgroundStyles, getHealthColor, getIcon, getPreset, getResourceColor, getResourceIcon, getResourceStatusColor, getStatusColors, getStatusIcon, iconMap, isAPIClientError, mantineThemeOverride, observabilityKeys, scheduleKeys, shouldAnimateEdge, showApiErrorNotification, showErrorNotification, showInfoNotification, showSuccessNotification, showWarningNotification, useActivities, useActivityTrend, useAgentIterationData, useApiClientContext, useAuthContext, useBulkDeleteExecutions, useBusinessImpact, useCancelExecution, useCancelSchedule, useCommandQueue, useCommandQueueTotals, useConnectionHighlight, useCostBreakdown, useCostByModel, useCostSummary, useCostTrends, useCreateSchedule, useDashboardMetrics, useDeleteExecution, useDeleteSchedule, useDeleteTask, useDirectedChainHighlighting, useElevasisServices, useErrorAnalysis, useErrorDetail, useErrorDetails, useErrorDistribution, useErrorTrends, useExecuteAsync, useExecution, useExecutionHealth, useExecutionLogs, useExecutionPath, useExecutions, useFitViewTrigger, useGetExecutionHistory, useGetSchedule, useGraphBackgroundStyles, useGraphHighlighting, useGraphTheme, useListSchedules, useMarkAllAsRead, useMarkAsRead, useMergedExecution, useNewKnowledgeMapLayout, useNodeSelection, useNotificationCount, useNotifications, useOAuthContext, usePatchTask, usePauseSchedule, useReactFlowAgent, useSessionCheck as useRefocusSessionCheck, useResolveAllErrors, useResolveError, useResolveErrorsByExecution, useResourceDefinition, useResources, useResumeSchedule, useRetryExecution, useRouterContext, useSessionCheck, useStableAccessToken, useSubmitAction, useTimelineData, useTopFailingResources, useUnifiedWorkflowLayout, useUnresolveError, useUpdateAnchor, useUpdateSchedule, useUserProfile, useWorkflowStepsLayout, validateEmail };
7296
7294
  export type { ActivityTrendResponse, AgentIterationEdgeData, AgentIterationNodeData, AgentStatus, ApiClientContextValue, ApiClientProviderProps, ApiErrorDetails, ApiKeyConfig, AppInitializationState, AuthAdapter, AuthConfig, AuthKitConfig, BulkDeleteExecutionsParams, BulkDeleteExecutionsResult, BusinessImpactMetrics, CancelExecutionParams, CancelExecutionResult, ContextViewerProps, CostBreakdownItem, CreateScheduleInput, CreateSessionResponse, DeleteExecutionParams, DirectedChainHighlightingOptions, DirectedChainHighlightingResult, EdgeColorOptions, EdgeOpacityOptions, ElevasisCoreProviderProps, ElevasisCoreThemeConfig, ElevasisProviderProps, ElevasisServiceContextValue, ElevasisServiceProviderProps, ElevasisThemeConfig, ElevasisTokenOverrides, ErrorDistributionItem, ErrorDistributionParams, ErrorFilters, ErrorTrendsParams, ExecuteAsyncParams, ExecuteAsyncResult, ExecutionErrorDetails, ExecutionHistoryItem, ExecutionHistoryResponse, ExecutionLogEntry, ExecutionLogsPageResponse, ExecutionLogsTableProps, ExecutionPathState, ExecutionStatus$1 as ExecutionStatus, FailingResource, FitViewButtonVariant, GlowIntensity, GraphFitViewHandlerProps, GraphHeightOptions, GraphHighlightingResult, GraphMode, GraphThemeColors, InitializationError, JsonViewerProps, KnowledgeMapEdgeData, KnowledgeMapNodeData, LinkProps, ListActivitiesResponse, ListSchedulesFilters, ListSchedulesResponse, NavigationButtonProps, NodeColorType, OAuthConfig, OAuthContextValue, OrganizationsActions, OrganizationsSlice, OrganizationsState, PresetName, ResourcesResponse, RetryExecutionParams, RouterAdapter, SerializedKnowledgeMap, SerializedKnowledgeNode, SessionListItem, StatCardProps, StatusColorScheme, StatusIconColors, StepExecutionData, StyledMarkdownProps, SubmitActionRequest, SubmitActionResponse, TablerIcon, TaskSchedule, ThemePreset, TimelineBarProps, TimelineContainerProps, TimelineRowProps, TopFailingResourcesParams, TrendIndicatorProps, UnifiedWorkflowEdgeData, UnifiedWorkflowNodeData, UpdateScheduleInput, UseActivitiesParams, UseActivityTrendParams, UseApiClientReturn, UseExecutionHealthParams, UseExecutionLogsParams, UseOrgInitializationReturn, UseOrganizationsReturn$1 as UseOrganizationsReturn, UseUserProfileReturn, WithSchemes, WorkflowEdgeType, WorkflowStepEdgeData, WorkflowStepNodeData, WorkflowStepsLayoutInput };
package/dist/index.js CHANGED
@@ -20,13 +20,13 @@ export { BaseEdge, BaseNode, GRAPH_CONSTANTS, GlowingHandle, GraphBackground, Gr
20
20
  export { APIErrorAlert, CollapsibleSection, ContextViewer, CustomSelector, DetailCardSkeleton, EmptyState, JsonViewer, ListSkeleton, NavigationButton, PageNotFound, PageTitleCaption, ResourceCard, StatCard, StatCardSkeleton, StatsCardSkeleton, TabCountBadge, TimeRangeSelector, TrendIndicator, catalogItemToResourceDefinition } from './chunk-OUHGHTE7.js';
21
21
  export { StyledMarkdown } from './chunk-3KMDHCAR.js';
22
22
  import './chunk-YZ6GTZXL.js';
23
- export { ElevasisProvider, ElevasisUIProvider, mantineThemeOverride } from './chunk-HVHNHWJM.js';
24
- export { ElevasisCoreProvider, createCssVariablesResolver, generateShades, getPreset } from './chunk-3OQWAB3W.js';
23
+ export { ElevasisProvider, ElevasisUIProvider, createCssVariablesResolver, generateShades, getPreset, mantineThemeOverride } from './chunk-B64YDSAY.js';
24
+ export { ElevasisCoreProvider } from './chunk-ZQVPUAGR.js';
25
25
  export { ApiClientProvider, createUseApiClient, useApiClientContext } from './chunk-GDV44UWF.js';
26
26
  export { ElevasisServiceProvider, useElevasisServices } from './chunk-KA7LO7U5.js';
27
27
  export { APIClientError, formatDate, formatErrorMessage, getErrorInfo, getErrorTitle, getResourceColor, getResourceIcon, isAPIClientError, showApiErrorNotification, showErrorNotification, showInfoNotification, showSuccessNotification, showWarningNotification, validateEmail } from './chunk-7AI5ZYJ4.js';
28
- export { useSessionCheck as useRefocusSessionCheck, useSessionCheck, useStableAccessToken } from './chunk-SH53DPUQ.js';
28
+ export { useSessionCheck as useRefocusSessionCheck, useSessionCheck, useStableAccessToken } from './chunk-HBRMWW6V.js';
29
29
  export { WorkOSAuthBridge } from './chunk-NIAVTSMB.js';
30
- export { OAuthAuthBridge, useOAuthContext } from './chunk-V5PNQNFT.js';
30
+ export { useOAuthContext } from './chunk-QSVZP2NU.js';
31
31
  export { AuthProvider, useAuthContext } from './chunk-7PLEQFHO.js';
32
32
  export { RouterProvider, useRouterContext } from './chunk-Q7DJKLEN.js';
@@ -94,6 +94,8 @@ interface OAuthConfig {
94
94
  tokenStorage?: 'session';
95
95
  /** Pre-select organization in WorkOS flow. */
96
96
  organizationId?: string;
97
+ /** Auth provider for the authorize request. Defaults to 'authkit' (hosted login UI). */
98
+ provider?: 'authkit' | 'GoogleOAuth' | 'MicrosoftOAuth' | 'GitHubOAuth' | 'AppleOAuth';
97
99
  }
98
100
  /** Deferred -- will throw at runtime. */
99
101
  interface ApiKeyConfig {
@@ -134,6 +136,12 @@ interface ElevasisCoreProviderProps {
134
136
  * Command-center passes `!!currentMembership` for its stricter readiness requirement.
135
137
  */
136
138
  isOrganizationReady?: boolean;
139
+ /**
140
+ * Whether to inject CSS variables, `data-elevasis-scheme` attribute, and font links.
141
+ * Set to `false` when the consumer has its own complete design system and only
142
+ * needs auth + API from this provider. Defaults to `true`.
143
+ */
144
+ injectStyles?: boolean;
137
145
  children: ReactNode;
138
146
  }
139
147
  interface ElevasisProviderProps {
@@ -238,9 +246,9 @@ declare const ElevasisProvider: typeof ElevasisUIProvider;
238
246
  /**
239
247
  * Headless root provider for Elevasis-powered applications.
240
248
  *
241
- * Same capabilities as ElevasisUIProvider but without any Mantine dependency.
242
- * Injects CSS variables via a `<style>` tag and sets `data-elevasis-scheme`
243
- * on the `<html>` element.
249
+ * Pure auth + API provider with no style side-effects. Does not inject CSS
250
+ * variables, set `data-elevasis-scheme`, or load fonts. Consumers that need
251
+ * Elevasis theming should use `ElevasisProvider` (Mantine) instead.
244
252
  *
245
253
  * Composes: QueryClientProvider + auth provider + auth bridge.
246
254
  * When apiUrl is provided, also composes ApiClientProvider + ElevasisServiceProvider.
@@ -256,7 +264,7 @@ declare const ElevasisProvider: typeof ElevasisUIProvider;
256
264
  * </ElevasisCoreProvider>
257
265
  * ```
258
266
  */
259
- declare function ElevasisCoreProvider({ auth, theme, organizationId, queryClient, apiUrl, onError, isOrganizationReady, children }: ElevasisCoreProviderProps): react_jsx_runtime.JSX.Element;
267
+ declare function ElevasisCoreProvider({ auth, organizationId, queryClient, apiUrl, onError, isOrganizationReady, children }: ElevasisCoreProviderProps): react_jsx_runtime.JSX.Element;
260
268
 
261
269
  /**
262
270
  * Hook to access the ElevasisServiceProvider context.
@@ -1,8 +1,8 @@
1
- export { ElevasisProvider, ElevasisUIProvider } from '../chunk-HVHNHWJM.js';
2
- export { ElevasisCoreProvider } from '../chunk-3OQWAB3W.js';
1
+ export { ElevasisProvider, ElevasisUIProvider } from '../chunk-B64YDSAY.js';
2
+ export { ElevasisCoreProvider } from '../chunk-ZQVPUAGR.js';
3
3
  import '../chunk-GDV44UWF.js';
4
4
  export { ElevasisServiceProvider, useElevasisServices } from '../chunk-KA7LO7U5.js';
5
5
  import '../chunk-7AI5ZYJ4.js';
6
6
  import '../chunk-NIAVTSMB.js';
7
- import '../chunk-V5PNQNFT.js';
7
+ import '../chunk-QSVZP2NU.js';
8
8
  import '../chunk-7PLEQFHO.js';
@@ -81,6 +81,8 @@ interface OAuthConfig {
81
81
  tokenStorage?: 'session';
82
82
  /** Pre-select organization in WorkOS flow. */
83
83
  organizationId?: string;
84
+ /** Auth provider for the authorize request. Defaults to 'authkit' (hosted login UI). */
85
+ provider?: 'authkit' | 'GoogleOAuth' | 'MicrosoftOAuth' | 'GitHubOAuth' | 'AppleOAuth';
84
86
  }
85
87
  /** Deferred -- will throw at runtime. */
86
88
  interface ApiKeyConfig {
@@ -121,6 +123,12 @@ interface ElevasisCoreProviderProps {
121
123
  * Command-center passes `!!currentMembership` for its stricter readiness requirement.
122
124
  */
123
125
  isOrganizationReady?: boolean;
126
+ /**
127
+ * Whether to inject CSS variables, `data-elevasis-scheme` attribute, and font links.
128
+ * Set to `false` when the consumer has its own complete design system and only
129
+ * needs auth + API from this provider. Defaults to `true`.
130
+ */
131
+ injectStyles?: boolean;
124
132
  children: ReactNode;
125
133
  }
126
134
  /**
@@ -145,9 +153,9 @@ interface ElevasisServiceProviderProps {
145
153
  /**
146
154
  * Headless root provider for Elevasis-powered applications.
147
155
  *
148
- * Same capabilities as ElevasisUIProvider but without any Mantine dependency.
149
- * Injects CSS variables via a `<style>` tag and sets `data-elevasis-scheme`
150
- * on the `<html>` element.
156
+ * Pure auth + API provider with no style side-effects. Does not inject CSS
157
+ * variables, set `data-elevasis-scheme`, or load fonts. Consumers that need
158
+ * Elevasis theming should use `ElevasisProvider` (Mantine) instead.
151
159
  *
152
160
  * Composes: QueryClientProvider + auth provider + auth bridge.
153
161
  * When apiUrl is provided, also composes ApiClientProvider + ElevasisServiceProvider.
@@ -163,7 +171,7 @@ interface ElevasisServiceProviderProps {
163
171
  * </ElevasisCoreProvider>
164
172
  * ```
165
173
  */
166
- declare function ElevasisCoreProvider({ auth, theme, organizationId, queryClient, apiUrl, onError, isOrganizationReady, children }: ElevasisCoreProviderProps): react_jsx_runtime.JSX.Element;
174
+ declare function ElevasisCoreProvider({ auth, organizationId, queryClient, apiUrl, onError, isOrganizationReady, children }: ElevasisCoreProviderProps): react_jsx_runtime.JSX.Element;
167
175
 
168
176
  /**
169
177
  * Hook to access the ElevasisServiceProvider context.
@@ -1,6 +1,6 @@
1
- export { ElevasisCoreProvider } from '../chunk-3OQWAB3W.js';
1
+ export { ElevasisCoreProvider } from '../chunk-ZQVPUAGR.js';
2
2
  import '../chunk-GDV44UWF.js';
3
3
  export { ElevasisServiceProvider, useElevasisServices } from '../chunk-KA7LO7U5.js';
4
4
  import '../chunk-7AI5ZYJ4.js';
5
- import '../chunk-V5PNQNFT.js';
5
+ import '../chunk-QSVZP2NU.js';
6
6
  import '../chunk-7PLEQFHO.js';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@elevasis/ui",
3
- "version": "1.1.0",
3
+ "version": "1.2.1",
4
4
  "description": "UI components and platform-aware hooks for building custom frontends on the Elevasis platform",
5
5
  "type": "module",
6
6
  "license": "MIT",
@@ -1,399 +0,0 @@
1
- import { getPreset, generateShades, createCssVariablesResolver } from './chunk-3OQWAB3W.js';
2
- import { ApiClientProvider, createUseApiClient } from './chunk-GDV44UWF.js';
3
- import { ElevasisServiceProvider } from './chunk-KA7LO7U5.js';
4
- import { WorkOSAuthBridge } from './chunk-NIAVTSMB.js';
5
- import { OAuthProvider, OAuthAuthBridge } from './chunk-V5PNQNFT.js';
6
- import { useAuthContext } from './chunk-7PLEQFHO.js';
7
- import { useMemo, useEffect, useRef } from 'react';
8
- import { Tooltip, Text, Tabs, Table, Stack, SimpleGrid, Select, Combobox, SegmentedControl, ScrollArea, Paper, Popover, Notification, Modal, Menu, Input, HoverCard, Group, Grid, Flex, Code, Divider, Card, Button, Accordion, createTheme, mergeThemeOverrides, MantineProvider } from '@mantine/core';
9
- import { QueryClientProvider, QueryClient } from '@tanstack/react-query';
10
- import { AuthKitProvider } from '@workos-inc/authkit-react';
11
- import '@mantine/core/styles.css';
12
- import '@mantine/notifications/styles.css';
13
- import { jsx } from 'react/jsx-runtime';
14
-
15
- var DEFAULT_SIZE = "sm";
16
- var glassBase = {
17
- backdropFilter: "var(--glass-blur)",
18
- WebkitBackdropFilter: "var(--glass-blur)",
19
- border: "1px solid var(--color-border)"
20
- };
21
- var componentThemes = {
22
- Accordion: Accordion.extend({
23
- styles: {
24
- item: {
25
- borderColor: "var(--color-border)"
26
- },
27
- content: {
28
- backgroundColor: "var(--color-surface)"
29
- }
30
- }
31
- }),
32
- Button: Button.extend({
33
- styles: {
34
- root: {
35
- transition: `all var(--duration-fast) var(--easing)`
36
- }
37
- }
38
- }),
39
- Card: Card.extend({
40
- defaultProps: {
41
- p: DEFAULT_SIZE
42
- },
43
- styles: {
44
- root: {
45
- backgroundColor: "var(--glass-background)",
46
- ...glassBase,
47
- boxShadow: "var(--card-shadow)"
48
- }
49
- }
50
- }),
51
- // Checkbox styles are in custom.css to support :checked pseudo-selector
52
- Divider: Divider.extend({
53
- styles: {
54
- root: {
55
- borderColor: "var(--color-border)"
56
- }
57
- }
58
- }),
59
- Code: Code.extend({
60
- styles: {
61
- root: {
62
- backgroundColor: "var(--color-surface)",
63
- border: "1px solid var(--color-border)"
64
- }
65
- }
66
- }),
67
- Flex: Flex.extend({
68
- defaultProps: {
69
- gap: DEFAULT_SIZE
70
- }
71
- }),
72
- Grid: Grid.extend({
73
- defaultProps: {
74
- gutter: DEFAULT_SIZE
75
- }
76
- }),
77
- Group: Group.extend({
78
- defaultProps: {
79
- gap: DEFAULT_SIZE
80
- }
81
- }),
82
- HoverCard: HoverCard.extend({
83
- styles: {
84
- dropdown: {
85
- backgroundColor: "var(--color-surface)",
86
- border: "1px solid var(--color-border)",
87
- boxShadow: "var(--standard-box-shadow)"
88
- }
89
- }
90
- }),
91
- Input: Input.extend({
92
- styles: {
93
- input: {
94
- backgroundColor: "var(--color-surface)",
95
- border: "none",
96
- borderBottom: "1px solid var(--color-border)",
97
- borderRadius: "0"
98
- }
99
- }
100
- }),
101
- Menu: Menu.extend({
102
- styles: {
103
- dropdown: {
104
- background: "var(--color-surface)",
105
- border: "1px solid var(--color-border)"
106
- }
107
- }
108
- }),
109
- Modal: Modal.extend({
110
- styles: {
111
- content: {
112
- backgroundColor: "var(--color-surface)",
113
- border: "1px solid var(--color-border)"
114
- }
115
- }
116
- }),
117
- Notification: Notification.extend({
118
- styles: {
119
- root: {
120
- backgroundColor: "color-mix(in srgb, var(--color-surface) 90%, transparent)",
121
- ...glassBase
122
- }
123
- }
124
- }),
125
- Popover: Popover.extend({
126
- styles: {
127
- dropdown: {
128
- backgroundColor: "var(--color-surface)",
129
- ...glassBase,
130
- boxShadow: "var(--standard-box-shadow)"
131
- }
132
- }
133
- }),
134
- Paper: Paper.extend({
135
- styles: {
136
- root: {
137
- backgroundColor: "var(--glass-background)",
138
- ...glassBase,
139
- boxShadow: "var(--card-shadow)",
140
- padding: `var(--mantine-spacing-${DEFAULT_SIZE})`
141
- }
142
- }
143
- }),
144
- ScrollArea: ScrollArea.extend({
145
- defaultProps: {
146
- scrollbarSize: 8
147
- },
148
- styles: {
149
- scrollbar: {
150
- background: "transparent",
151
- '&[data-orientation="vertical"]': {
152
- width: "8px"
153
- },
154
- '&[data-orientation="horizontal"]': {
155
- height: "8px"
156
- }
157
- },
158
- thumb: {
159
- borderRadius: "var(--mantine-radius-default)",
160
- background: "color-mix(in srgb, var(--color-text-subtle) 50%, var(--color-border))",
161
- "&:hover": {
162
- background: "var(--color-text-subtle)"
163
- }
164
- }
165
- }
166
- }),
167
- SegmentedControl: SegmentedControl.extend({
168
- styles: {
169
- root: {
170
- backgroundColor: "var(--color-surface)"
171
- },
172
- indicator: {
173
- backgroundColor: "var(--color-surface-hover)",
174
- boxShadow: "var(--standard-box-shadow)"
175
- }
176
- }
177
- }),
178
- Combobox: Combobox.extend({
179
- styles: {
180
- dropdown: {
181
- backgroundColor: "red"
182
- }
183
- }
184
- }),
185
- Select: Select.extend({
186
- styles: {
187
- dropdown: {
188
- backgroundColor: "var(--color-surface)"
189
- }
190
- }
191
- }),
192
- // Switch styles are in custom.css to support [data-checked] attribute selector
193
- SimpleGrid: SimpleGrid.extend({
194
- defaultProps: {
195
- spacing: DEFAULT_SIZE,
196
- verticalSpacing: DEFAULT_SIZE
197
- }
198
- }),
199
- Stack: Stack.extend({
200
- defaultProps: {
201
- gap: DEFAULT_SIZE
202
- }
203
- }),
204
- Table: Table.extend({
205
- defaultProps: {
206
- highlightOnHover: true
207
- },
208
- styles: {
209
- table: {
210
- "--table-border-color": "var(--color-border)",
211
- "--table-highlight-on-hover-color": "var(--color-surface-hover)"
212
- }
213
- }
214
- }),
215
- Tabs: Tabs.extend({}),
216
- Text: Text.extend({
217
- styles: {
218
- root: {
219
- fontFamily: 'Roboto, Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif'
220
- }
221
- }
222
- }),
223
- // Timeline styles are in custom.css to override color-scheme-specific selectors
224
- Tooltip: Tooltip.extend({
225
- styles: {
226
- tooltip: {
227
- backgroundColor: "var(--color-surface)",
228
- color: "var(--color-text)",
229
- border: "1px solid var(--color-border)"
230
- }
231
- }
232
- })
233
- // Pagination styles are in custom.css to support :not([data-active]) selector
234
- };
235
-
236
- // src/theme/MantineThemeOverride.ts
237
- var mantineThemeOverride = createTheme({
238
- defaultRadius: "xs",
239
- fontFamily: 'Roboto, Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif',
240
- cursorType: "pointer",
241
- spacing: {
242
- xs: "0.5rem",
243
- sm: "0.75rem",
244
- md: "1rem",
245
- lg: "1.5rem",
246
- xl: "2rem"
247
- },
248
- radius: {
249
- xs: "0.25rem",
250
- sm: "0.5rem",
251
- md: "0.75rem",
252
- lg: "1rem",
253
- xl: "1.5rem"
254
- },
255
- fontSizes: {
256
- xs: "0.75rem",
257
- sm: "0.875rem",
258
- md: "1rem",
259
- lg: "1.125rem",
260
- xl: "1.25rem"
261
- },
262
- components: componentThemes
263
- });
264
- var defaultQueryClient = null;
265
- function getDefaultQueryClient() {
266
- if (!defaultQueryClient) {
267
- defaultQueryClient = new QueryClient({
268
- defaultOptions: { queries: { retry: 1 } }
269
- });
270
- }
271
- return defaultQueryClient;
272
- }
273
- var defaultUseOrganizations = () => ({ isInitializing: false, isOrgRefreshing: false });
274
- function ElevasisUIProvider({
275
- auth,
276
- theme,
277
- organizationId = null,
278
- queryClient,
279
- apiUrl,
280
- onError,
281
- isOrganizationReady,
282
- children
283
- }) {
284
- if (auth.mode === "apiKey") {
285
- throw new Error(
286
- `ElevasisUIProvider: auth mode 'apiKey' is not yet implemented. Only 'authkit' and 'oauth' modes are supported.`
287
- );
288
- }
289
- const resolvedQueryClient = queryClient ?? getDefaultQueryClient();
290
- const resolvedColorScheme = theme?.colorScheme ?? "dark";
291
- const preset = useMemo(() => getPreset(theme?.preset ?? "default"), [theme?.preset]);
292
- useEffect(() => {
293
- if (!preset.fontImports?.length) return;
294
- const links = [];
295
- for (const href of preset.fontImports) {
296
- if (document.querySelector(`link[href="${href}"]`)) continue;
297
- const link = document.createElement("link");
298
- link.rel = "stylesheet";
299
- link.href = href;
300
- document.head.appendChild(link);
301
- links.push(link);
302
- }
303
- const subtitleFont = preset.subtitleFontFamily ?? preset.mantine?.headings?.fontFamily ?? preset.mantine?.fontFamily ?? "";
304
- document.documentElement.style.setProperty("--elevasis-font-family-subtitle", subtitleFont);
305
- return () => {
306
- links.forEach((l) => l.remove());
307
- document.documentElement.style.removeProperty("--elevasis-font-family-subtitle");
308
- };
309
- }, [preset.fontImports, preset.subtitleFontFamily, preset.mantine?.headings?.fontFamily, preset.mantine?.fontFamily]);
310
- const resolvedTheme = useMemo(() => {
311
- const primaryHex = theme?.tokens?.primary ?? preset.dark.primary;
312
- const primaryOverride = {
313
- primaryColor: "primary",
314
- colors: { primary: generateShades(primaryHex) }
315
- };
316
- let base = mergeThemeOverrides(mantineThemeOverride, primaryOverride);
317
- if (preset.mantine) base = mergeThemeOverrides(base, preset.mantine);
318
- return theme?.mantine ? mergeThemeOverrides(base, theme.mantine) : base;
319
- }, [theme?.mantine, preset, theme?.tokens?.primary]);
320
- const cssVariablesResolver = useMemo(
321
- () => createCssVariablesResolver(theme?.tokens, theme?.preset),
322
- [theme?.tokens, theme?.preset]
323
- );
324
- const content = apiUrl ? /* @__PURE__ */ jsx(
325
- ServiceBridge,
326
- {
327
- apiUrl,
328
- organizationId,
329
- isOrganizationReady,
330
- onError,
331
- children
332
- }
333
- ) : children;
334
- const AuthInner = auth.mode === "authkit" ? /* @__PURE__ */ jsx(AuthKitInner, { auth, children: content }) : /* @__PURE__ */ jsx(OAuthInner, { auth, children: content });
335
- return /* @__PURE__ */ jsx(
336
- MantineProvider,
337
- {
338
- theme: resolvedTheme,
339
- defaultColorScheme: resolvedColorScheme,
340
- cssVariablesResolver,
341
- children: /* @__PURE__ */ jsx(QueryClientProvider, { client: resolvedQueryClient, children: AuthInner })
342
- }
343
- );
344
- }
345
- function AuthKitInner({ auth, children }) {
346
- return /* @__PURE__ */ jsx(
347
- AuthKitProvider,
348
- {
349
- clientId: auth.clientId,
350
- apiHostname: auth.apiHostname ?? "api.workos.com",
351
- redirectUri: auth.redirectUri,
352
- devMode: auth.devMode ?? false,
353
- children: /* @__PURE__ */ jsx(WorkOSAuthBridge, { children })
354
- }
355
- );
356
- }
357
- function OAuthInner({ auth, children }) {
358
- return /* @__PURE__ */ jsx(OAuthProvider, { config: auth, children: /* @__PURE__ */ jsx(OAuthAuthBridge, { children }) });
359
- }
360
- function ServiceBridge({
361
- apiUrl,
362
- organizationId,
363
- isOrganizationReady,
364
- onError,
365
- children
366
- }) {
367
- const { getAccessToken } = useAuthContext();
368
- return /* @__PURE__ */ jsx(
369
- ApiClientProvider,
370
- {
371
- getAccessToken,
372
- organizationId,
373
- isOrganizationReady: isOrganizationReady ?? !!organizationId,
374
- onError,
375
- children: /* @__PURE__ */ jsx(ServiceBridgeInner, { apiUrl, organizationId, isOrganizationReady, children })
376
- }
377
- );
378
- }
379
- function ServiceBridgeInner({
380
- apiUrl,
381
- organizationId,
382
- isOrganizationReady,
383
- children
384
- }) {
385
- const useApiClient = useRef(createUseApiClient(defaultUseOrganizations, apiUrl)).current;
386
- const { apiRequest } = useApiClient();
387
- return /* @__PURE__ */ jsx(
388
- ElevasisServiceProvider,
389
- {
390
- apiRequest,
391
- organizationId,
392
- isReady: isOrganizationReady ?? !!organizationId,
393
- children
394
- }
395
- );
396
- }
397
- var ElevasisProvider = ElevasisUIProvider;
398
-
399
- export { ElevasisProvider, ElevasisUIProvider, mantineThemeOverride };
File without changes