@ory/elements-react 1.0.0-next.19 → 1.0.0-next.20

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/index.mjs CHANGED
@@ -103,6 +103,101 @@ function getFinalNodes(uniqueGroups, selectedGroup) {
103
103
  (node) => "type" in node.attributes && node.attributes.type === "hidden"
104
104
  ).concat(selectedNodes);
105
105
  }
106
+ function triggerToWindowCall(trigger) {
107
+ if (!trigger) {
108
+ return;
109
+ }
110
+ const fn = triggerToFunction(trigger);
111
+ if (fn) {
112
+ fn();
113
+ return;
114
+ }
115
+ let i = 0;
116
+ const ms = 100;
117
+ const interval = setInterval(() => {
118
+ i++;
119
+ if (i > 100) {
120
+ clearInterval(interval);
121
+ throw new Error(
122
+ "Unable to load Ory's WebAuthn script. Is it being blocked or otherwise failing to load? If you are running an old version of Ory Elements, please upgrade. For more information, please check your browser's developer console."
123
+ );
124
+ }
125
+ const fn2 = triggerToFunction(trigger);
126
+ if (fn2) {
127
+ clearInterval(interval);
128
+ return fn2();
129
+ }
130
+ }, ms);
131
+ return;
132
+ }
133
+ function triggerToFunction(trigger) {
134
+ if (typeof window === "undefined") {
135
+ console.debug(
136
+ "The Ory SDK is missing a required function: window is undefined."
137
+ );
138
+ return void 0;
139
+ }
140
+ const typedWindow = window;
141
+ if (!(trigger in typedWindow) || !typedWindow[trigger]) {
142
+ console.debug(`The Ory SDK is missing a required function: ${trigger}.`);
143
+ return void 0;
144
+ }
145
+ const triggerFn = typedWindow[trigger];
146
+ if (typeof triggerFn !== "function") {
147
+ console.debug(
148
+ `The Ory SDK is missing a required function: ${trigger}. It is not a function.`
149
+ );
150
+ return void 0;
151
+ }
152
+ return triggerFn;
153
+ }
154
+ function nodesToAuthMethodGroups(nodes, excludeAuthMethods = [UiNodeGroupEnum.Oidc]) {
155
+ var _a;
156
+ const groups = {};
157
+ for (const node of nodes) {
158
+ if (node.type === "script") {
159
+ continue;
160
+ }
161
+ const groupNodes = (_a = groups[node.group]) != null ? _a : [];
162
+ groupNodes.push(node);
163
+ groups[node.group] = groupNodes;
164
+ }
165
+ return Object.values(UiNodeGroupEnum).filter((group) => {
166
+ var _a2;
167
+ return (_a2 = groups[group]) == null ? void 0 : _a2.length;
168
+ }).filter(
169
+ (group) => ![
170
+ UiNodeGroupEnum.Default,
171
+ UiNodeGroupEnum.IdentifierFirst,
172
+ UiNodeGroupEnum.Profile,
173
+ ...excludeAuthMethods
174
+ ].includes(group)
175
+ );
176
+ }
177
+ function useNodesGroups(nodes) {
178
+ const groupSorter = useGroupSorter();
179
+ const groups = useMemo(() => {
180
+ var _a;
181
+ const groups2 = {};
182
+ for (const node of nodes) {
183
+ if (node.type === "script") {
184
+ continue;
185
+ }
186
+ const groupNodes = (_a = groups2[node.group]) != null ? _a : [];
187
+ groupNodes.push(node);
188
+ groups2[node.group] = groupNodes;
189
+ }
190
+ return groups2;
191
+ }, [nodes]);
192
+ const entries = useMemo(
193
+ () => Object.entries(groups).sort(([a], [b]) => groupSorter(a, b)),
194
+ [groups, groupSorter]
195
+ );
196
+ return {
197
+ groups,
198
+ entries
199
+ };
200
+ }
106
201
 
107
202
  // src/context/form-state.ts
108
203
  function findMethodWithMessage(nodes) {
@@ -127,6 +222,10 @@ function parseStateFromFlow(flow) {
127
222
  } else if (flow.flow.active && !["default", "identifier_first", "oidc"].includes(flow.flow.active)) {
128
223
  return { current: "method_active", method: flow.flow.active };
129
224
  } else if (isChoosingMethod(flow.flow.ui.nodes)) {
225
+ const authMethods = nodesToAuthMethodGroups(flow.flow.ui.nodes);
226
+ if (authMethods.length === 1) {
227
+ return { current: "method_active", method: authMethods[0] };
228
+ }
130
229
  return { current: "select_method" };
131
230
  } else if ((_a = flow.flow.ui.messages) == null ? void 0 : _a.some((m) => m.id === 1010016)) {
132
231
  return { current: "select_method" };
@@ -2228,78 +2327,6 @@ function OryCardHeader() {
2228
2327
  const { Card } = useComponents();
2229
2328
  return /* @__PURE__ */ jsx(Card.Header, {});
2230
2329
  }
2231
- function triggerToWindowCall(trigger) {
2232
- if (!trigger) {
2233
- return;
2234
- }
2235
- const fn = triggerToFunction(trigger);
2236
- if (fn) {
2237
- fn();
2238
- return;
2239
- }
2240
- let i = 0;
2241
- const ms = 100;
2242
- const interval = setInterval(() => {
2243
- i++;
2244
- if (i > 100) {
2245
- clearInterval(interval);
2246
- throw new Error(
2247
- "Unable to load Ory's WebAuthn script. Is it being blocked or otherwise failing to load? If you are running an old version of Ory Elements, please upgrade. For more information, please check your browser's developer console."
2248
- );
2249
- }
2250
- const fn2 = triggerToFunction(trigger);
2251
- if (fn2) {
2252
- clearInterval(interval);
2253
- return fn2();
2254
- }
2255
- }, ms);
2256
- return;
2257
- }
2258
- function triggerToFunction(trigger) {
2259
- if (typeof window === "undefined") {
2260
- console.debug(
2261
- "The Ory SDK is missing a required function: window is undefined."
2262
- );
2263
- return void 0;
2264
- }
2265
- const typedWindow = window;
2266
- if (!(trigger in typedWindow) || !typedWindow[trigger]) {
2267
- console.debug(`The Ory SDK is missing a required function: ${trigger}.`);
2268
- return void 0;
2269
- }
2270
- const triggerFn = typedWindow[trigger];
2271
- if (typeof triggerFn !== "function") {
2272
- console.debug(
2273
- `The Ory SDK is missing a required function: ${trigger}. It is not a function.`
2274
- );
2275
- return void 0;
2276
- }
2277
- return triggerFn;
2278
- }
2279
- function useNodesGroups(nodes) {
2280
- const groupSorter = useGroupSorter();
2281
- const groups = useMemo(() => {
2282
- var _a;
2283
- const groups2 = {};
2284
- for (const node of nodes) {
2285
- if (node.type === "script") {
2286
- continue;
2287
- }
2288
- const groupNodes = (_a = groups2[node.group]) != null ? _a : [];
2289
- groupNodes.push(node);
2290
- groups2[node.group] = groupNodes;
2291
- }
2292
- return groups2;
2293
- }, [nodes]);
2294
- const entries = useMemo(
2295
- () => Object.entries(groups).sort(([a], [b]) => groupSorter(a, b)),
2296
- [groups, groupSorter]
2297
- );
2298
- return {
2299
- groups,
2300
- entries
2301
- };
2302
- }
2303
2330
  var NodeInput = ({
2304
2331
  node,
2305
2332
  attributes
@@ -2353,11 +2380,25 @@ var NodeInput = ({
2353
2380
  if (isResendNode || isScreenSelectionNode) {
2354
2381
  return null;
2355
2382
  }
2356
- return /* @__PURE__ */ jsx(Node2.Button, { attributes: attrs, node, onClick: handleClick });
2383
+ return /* @__PURE__ */ jsx(
2384
+ Node2.Label,
2385
+ {
2386
+ attributes: { ...attrs, label: void 0 },
2387
+ node: { ...node, meta: { ...node.meta, label: void 0 } },
2388
+ children: /* @__PURE__ */ jsx(Node2.Button, { attributes: attrs, node, onClick: handleClick })
2389
+ }
2390
+ );
2357
2391
  case UiNodeInputAttributesTypeEnum.DatetimeLocal:
2358
2392
  throw new Error("Not implemented");
2359
2393
  case UiNodeInputAttributesTypeEnum.Checkbox:
2360
- return /* @__PURE__ */ jsx(Node2.Checkbox, { attributes: attrs, node, onClick: handleClick });
2394
+ return /* @__PURE__ */ jsx(
2395
+ Node2.Label,
2396
+ {
2397
+ attributes: { ...attrs, label: void 0 },
2398
+ node: { ...node, meta: { ...node.meta, label: void 0 } },
2399
+ children: /* @__PURE__ */ jsx(Node2.Checkbox, { attributes: attrs, node, onClick: handleClick })
2400
+ }
2401
+ );
2361
2402
  case UiNodeInputAttributesTypeEnum.Hidden:
2362
2403
  return /* @__PURE__ */ jsx(Node2.Input, { attributes: attrs, node, onClick: handleClick });
2363
2404
  default:
@@ -2445,8 +2486,6 @@ function unrollTrait(input, output = {}) {
2445
2486
  });
2446
2487
  return output;
2447
2488
  }
2448
-
2449
- // src/components/form/form-resolver.ts
2450
2489
  function isCodeResendRequest(data) {
2451
2490
  var _a;
2452
2491
  return (_a = data.email) != null ? _a : data.resend;
@@ -2455,10 +2494,22 @@ function useOryFormResolver() {
2455
2494
  const flowContainer = useOryFlow();
2456
2495
  return (data) => {
2457
2496
  if (flowContainer.formState.current === "method_active") {
2458
- if (data.method === "code" && !data.code && !isCodeResendRequest(data)) {
2497
+ if (
2498
+ // When we submit a code
2499
+ data.method === "code" && // And the code is not present
2500
+ !data.code && // And the flow is not a code resend request
2501
+ !isCodeResendRequest(data) && // And the flow has a code input node
2502
+ flowContainer.flow.ui.nodes.find(({ attributes, group }) => {
2503
+ if (!isUiNodeInputAttributes(attributes)) {
2504
+ return false;
2505
+ }
2506
+ return group === "code" && attributes.name === "code" && attributes.type !== "hidden";
2507
+ })
2508
+ ) {
2459
2509
  return {
2460
2510
  values: data,
2461
2511
  errors: {
2512
+ // We know the code node exists, so we can safely hardcode the ID.
2462
2513
  code: {
2463
2514
  id: 4000002,
2464
2515
  context: {
@@ -2549,6 +2600,13 @@ function frontendClient(sdkUrl, opts = {}) {
2549
2600
  return new FrontendApi(config);
2550
2601
  }
2551
2602
 
2603
+ // src/util/internal.ts
2604
+ function replaceWindowFlowId(flow) {
2605
+ const url = new URL(window.location.href);
2606
+ url.searchParams.set("flow", flow);
2607
+ window.location.href = url.toString();
2608
+ }
2609
+
2552
2610
  // src/util/onSubmitLogin.ts
2553
2611
  async function onSubmitLogin({ config, flow }, {
2554
2612
  setFlowContainer,
@@ -2570,8 +2628,12 @@ async function onSubmitLogin({ config, flow }, {
2570
2628
  (_a2 = flow.return_to) != null ? _a2 : config.sdk.url + "/self-service/login/browser";
2571
2629
  }).catch(
2572
2630
  handleFlowError({
2573
- onRestartFlow: () => {
2574
- onRedirect(loginUrl(config), true);
2631
+ onRestartFlow: (useFlowId) => {
2632
+ if (useFlowId) {
2633
+ replaceWindowFlowId(useFlowId);
2634
+ } else {
2635
+ onRedirect(loginUrl(config), true);
2636
+ }
2575
2637
  },
2576
2638
  onValidationError: (body2) => {
2577
2639
  setFlowContainer({
@@ -2613,8 +2675,12 @@ async function onSubmitRecovery({ config, flow }, {
2613
2675
  });
2614
2676
  }).catch(
2615
2677
  handleFlowError({
2616
- onRestartFlow: () => {
2617
- onRedirect(recoveryUrl(config), true);
2678
+ onRestartFlow: (useFlowId) => {
2679
+ if (useFlowId) {
2680
+ replaceWindowFlowId(useFlowId);
2681
+ } else {
2682
+ onRedirect(recoveryUrl(config), true);
2683
+ }
2618
2684
  },
2619
2685
  onValidationError: (body2) => {
2620
2686
  if ("error" in body2) {
@@ -2671,8 +2737,12 @@ async function onSubmitRegistration({ config, flow }, {
2671
2737
  onRedirect(registrationUrl(config), true);
2672
2738
  }).catch(
2673
2739
  handleFlowError({
2674
- onRestartFlow: () => {
2675
- onRedirect(registrationUrl(config), true);
2740
+ onRestartFlow: (useFlowId) => {
2741
+ if (useFlowId) {
2742
+ replaceWindowFlowId(useFlowId);
2743
+ } else {
2744
+ onRedirect(registrationUrl(config), true);
2745
+ }
2676
2746
  },
2677
2747
  onValidationError: (body2) => {
2678
2748
  setFlowContainer({
@@ -2715,8 +2785,12 @@ async function onSubmitSettings({ config, flow }, {
2715
2785
  });
2716
2786
  }).catch(
2717
2787
  handleFlowError({
2718
- onRestartFlow: () => {
2719
- onRedirect(settingsUrl(config), true);
2788
+ onRestartFlow: (useFlowId) => {
2789
+ if (useFlowId) {
2790
+ replaceWindowFlowId(useFlowId);
2791
+ } else {
2792
+ onRedirect(settingsUrl(config), true);
2793
+ }
2720
2794
  },
2721
2795
  onValidationError: (body2) => {
2722
2796
  setFlowContainer({
@@ -2761,8 +2835,12 @@ async function onSubmitVerification({ config, flow }, {
2761
2835
  })
2762
2836
  ).catch(
2763
2837
  handleFlowError({
2764
- onRestartFlow: () => {
2765
- onRedirect(verificationUrl(config), true);
2838
+ onRestartFlow: (useFlowId) => {
2839
+ if (useFlowId) {
2840
+ replaceWindowFlowId(useFlowId);
2841
+ } else {
2842
+ onRedirect(verificationUrl(config), true);
2843
+ }
2766
2844
  },
2767
2845
  onValidationError: (body2) => {
2768
2846
  setFlowContainer({
@@ -3587,16 +3665,16 @@ var uiTextToFormattedMessage = ({ id, context = {}, text }, intl) => {
3587
3665
  new Date(value),
3588
3666
  /* @__PURE__ */ new Date()
3589
3667
  ),
3590
- [key + "_since_minutes"]: Math.abs(
3668
+ [key + "_since_minutes"]: Math.ceil(
3591
3669
  (value - (/* @__PURE__ */ new Date()).getTime() / 1e3) / 60
3592
- ).toFixed(2),
3670
+ ).toFixed(0),
3593
3671
  [key + "_until"]: intl.formatDateTimeRange(
3594
3672
  /* @__PURE__ */ new Date(),
3595
3673
  new Date(value)
3596
3674
  ),
3597
- [key + "_until_minutes"]: Math.abs(
3675
+ [key + "_until_minutes"]: Math.ceil(
3598
3676
  ((/* @__PURE__ */ new Date()).getTime() / 1e3 - value) / 60
3599
- ).toFixed(2)
3677
+ ).toFixed(0)
3600
3678
  };
3601
3679
  }
3602
3680
  }
@@ -3619,7 +3697,7 @@ var uiTextToFormattedMessage = ({ id, context = {}, text }, intl) => {
3619
3697
  // src/util/test-id.ts
3620
3698
  function messageTestId(message) {
3621
3699
  return {
3622
- "data-testid": `ory-message-${message.id}`
3700
+ "data-testid": `ory/ui/message/${message.id}`
3623
3701
  };
3624
3702
  }
3625
3703