@ory/elements-react 1.0.0-next.6 → 1.0.0-next.7

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.
@@ -3,29 +3,33 @@
3
3
  // src/theme/default/assets/ory-badge-horizontal.svg
4
4
  import * as React from "react";
5
5
  import { jsx, jsxs } from "react/jsx-runtime";
6
- var SvgOryBadgeHorizontal = (props) => /* @__PURE__ */ jsxs("svg", { width: 22, height: 8, viewBox: "0 0 22 8", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: [
7
- /* @__PURE__ */ jsx("path", { d: "M18.0074 8L16.2963 8L18.304 4.00381L16.2963 1.14411e-06L18.0074 1.26424e-06L19.152 2.30095L20.3269 1.42709e-06L22 1.54455e-06L18.0074 8Z", fill: "white" }),
8
- /* @__PURE__ */ jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M12.9015 4.86095C13.9317 4.57524 14.6903 3.62286 14.6978 2.49524L14.6978 2.47619L14.6978 2.45714C14.6865 1.09714 13.5921 9.54257e-07 12.2448 8.59669e-07L9.03705 6.34462e-07L9.03705 1.44L10.2447 3.42476L9.04082 3.42476L9.04082 8L10.5504 8L10.5504 4.94857L11.1844 4.94857L13.04 8L14.8148 8L12.9015 4.86095ZM12.0259 3.42857L12.2486 3.42857C12.7694 3.42857 13.1921 3.00191 13.1921 2.47619C13.1921 1.95048 12.7694 1.52381 12.2486 1.52381L10.8598 1.52381L12.0259 3.42857Z", fill: "white" }),
9
- /* @__PURE__ */ jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M4 2.80827e-07C1.79048 1.25704e-07 -8.00493e-08 1.79048 -1.78834e-07 4C-2.77618e-07 6.20952 1.79048 8 4 8C6.20952 8 8 6.20952 8 4C8 1.79048 6.20953 4.3595e-07 4 2.80827e-07ZM1.52381 4C1.52381 5.36762 2.63238 6.47619 4 6.47619C5.36762 6.47619 6.47619 5.36762 6.47619 4C6.47619 2.63238 5.36762 1.52381 4 1.52381C2.63238 1.52381 1.52381 2.63238 1.52381 4Z", fill: "white" })
10
- ] });
6
+ var SvgOryBadgeHorizontal = (props) => {
7
+ var _a, _b;
8
+ return /* @__PURE__ */ jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, fill: "none", ...props, children: [
9
+ /* @__PURE__ */ jsx("path", { fill: "#fff", d: "M18.007 8h-1.71l2.007-3.996L16.296 0h1.711l1.145 2.301L20.327 0H22z" }),
10
+ /* @__PURE__ */ jsx("path", { fill: "#fff", fillRule: "evenodd", d: "M12.902 4.86a2.47 2.47 0 0 0 1.796-2.365v-.038C14.687 1.097 13.592 0 12.245 0H9.037v1.44l1.208 1.985H9.04V8h1.51V4.949h.633L13.04 8h1.775zm-.876-1.431h.223c.52 0 .943-.427.943-.953a.95.95 0 0 0-.943-.952h-1.39zM4 0a4 4 0 1 0-.001 7.999A4 4 0 0 0 4 0M1.524 4a2.476 2.476 0 1 0 4.952 0 2.476 2.476 0 0 0-4.952 0", clipRule: "evenodd" })
11
+ ] });
12
+ };
11
13
  var ory_badge_horizontal_default = SvgOryBadgeHorizontal;
12
14
 
13
15
  // src/theme/default/assets/ory-badge-vertical.svg
14
16
  import * as React2 from "react";
15
17
  import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
16
- var SvgOryBadgeVertical = (props) => /* @__PURE__ */ jsxs2("svg", { width: 8, height: 22, viewBox: "0 0 8 22", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: [
17
- /* @__PURE__ */ jsx2("path", { d: "M8 3.99259L8 5.7037L4.00381 3.696L1.94331e-07 5.7037L2.14736e-07 3.99259L2.30095 2.84805L2.42396e-07 1.67309L2.62347e-07 0L8 3.99259Z", fill: "white" }),
18
- /* @__PURE__ */ jsx2("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M4.86095 9.09852C4.57524 8.06826 3.62286 7.30971 2.49524 7.30216L2.47619 7.30216L2.45714 7.30216C1.09714 7.31348 1.62084e-07 8.4079 1.46018e-07 9.75517L1.07766e-07 12.963L1.44 12.963L3.42476 11.7553L3.42476 12.9592L8 12.9592L8 11.4496L4.94857 11.4496L4.94857 10.8156L8 8.96005L8 7.18517L4.86095 9.09852ZM3.42857 9.97406L3.42857 9.7514C3.42857 9.23061 3.0019 8.80793 2.47619 8.80793C1.95048 8.80793 1.52381 9.23061 1.52381 9.7514L1.52381 11.1402L3.42857 9.97406Z", fill: "white" }),
19
- /* @__PURE__ */ jsx2("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M4.76995e-08 18C2.13512e-08 20.2095 1.79048 22 4 22C6.20952 22 8 20.2095 8 18C8 15.7905 6.20952 14 4 14C1.79048 14 7.40478e-08 15.7905 4.76995e-08 18ZM4 20.4762C5.36762 20.4762 6.47619 19.3676 6.47619 18C6.47619 16.6324 5.36762 15.5238 4 15.5238C2.63238 15.5238 1.52381 16.6324 1.52381 18C1.52381 19.3676 2.63238 20.4762 4 20.4762Z", fill: "white" })
20
- ] });
18
+ var SvgOryBadgeVertical = (props) => {
19
+ var _a, _b;
20
+ return /* @__PURE__ */ jsxs2("svg", { xmlns: "http://www.w3.org/2000/svg", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, fill: "none", ...props, children: [
21
+ /* @__PURE__ */ jsx2("path", { fill: "#fff", d: "M8 3.993v1.71L4.004 3.697 0 5.704V3.993l2.301-1.145L0 1.673V0z" }),
22
+ /* @__PURE__ */ jsx2("path", { fill: "#fff", fillRule: "evenodd", d: "M4.86 9.099a2.47 2.47 0 0 0-2.365-1.797h-.038C1.097 7.313 0 8.408 0 9.755v3.208h1.44l1.985-1.208v1.204H8v-1.51H4.949v-.633L8 8.96V7.185zm-1.431.875v-.223a.95.95 0 0 0-.953-.943.95.95 0 0 0-.952.943v1.39zM0 18a4 4 0 1 0 8 0 4 4 0 0 0-8 0m4 2.476a2.476 2.476 0 1 0 0-4.952 2.476 2.476 0 0 0 0 4.952", clipRule: "evenodd" })
23
+ ] });
24
+ };
21
25
  var ory_badge_vertical_default = SvgOryBadgeVertical;
22
26
 
23
27
  // src/theme/default/components/card/badge.tsx
24
28
  import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
25
29
  function Badge() {
26
30
  return /* @__PURE__ */ jsxs3("div", { className: "font-bold bg-branding-bg-default absolute max-md:rounded-b-md p-2 max-md:bottom-0 max-md:translate-y-full max-md:left-8 md:right-0 md:translate-x-full md:top-8 md:rounded-r-md", children: [
27
- /* @__PURE__ */ jsx3(ory_badge_horizontal_default, { className: "md:hidden" }),
28
- /* @__PURE__ */ jsx3(ory_badge_vertical_default, { className: "max-md:hidden" })
31
+ /* @__PURE__ */ jsx3(ory_badge_horizontal_default, { width: 22, height: 8, className: "md:hidden" }),
32
+ /* @__PURE__ */ jsx3(ory_badge_vertical_default, { width: 8, height: 22, className: "max-md:hidden" })
29
33
  ] });
30
34
  }
31
35
 
@@ -125,9 +129,10 @@ function VerificationCardFooter() {
125
129
  }
126
130
 
127
131
  // src/theme/default/components/card/header.tsx
128
- import { FlowType as FlowType2, isUiNodeInputAttributes } from "@ory/client-fetch";
129
132
  import { useComponents, useOryFlow as useOryFlow2 } from "@ory/elements-react";
130
- import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
133
+
134
+ // src/theme/default/utils/constructCardHeader.ts
135
+ import { FlowType as FlowType2, isUiNodeInputAttributes } from "@ory/client-fetch";
131
136
  function joinWithCommaOr(list) {
132
137
  if (list.length === 0) {
133
138
  return ".";
@@ -138,11 +143,28 @@ function joinWithCommaOr(list) {
138
143
  return `${list.join(", ")} or ${last}.`;
139
144
  }
140
145
  }
141
- function constructCardHeaderText(container) {
146
+ function constructCardHeaderText(nodes, opts) {
147
+ var _a;
148
+ switch (opts.flowType) {
149
+ case FlowType2.Recovery:
150
+ return {
151
+ title: "Recover your account",
152
+ description: "Enter the email address associated with your account to receive a one-time access code"
153
+ };
154
+ case FlowType2.Settings:
155
+ return {
156
+ title: "Update your account",
157
+ description: "Update your account settings"
158
+ };
159
+ case FlowType2.Verification:
160
+ return {
161
+ title: "Verify your account",
162
+ description: "Enter the email address associated with your account to verify it"
163
+ };
164
+ }
142
165
  const parts = [];
143
- const ui = container.flow.ui;
144
- if (ui.nodes.find((node) => node.group === "password")) {
145
- switch (container.flowType) {
166
+ if (nodes.find((node) => node.group === "password")) {
167
+ switch (opts.flowType) {
146
168
  case FlowType2.Registration:
147
169
  parts.push(`your email and a password`);
148
170
  break;
@@ -150,32 +172,29 @@ function constructCardHeaderText(container) {
150
172
  parts.push(`your email and password`);
151
173
  }
152
174
  }
153
- if (ui.nodes.find((node) => node.group === "oidc")) {
175
+ if (nodes.find((node) => node.group === "oidc")) {
154
176
  parts.push(`a social provider`);
155
177
  }
156
- if (ui.nodes.find((node) => node.group === "code")) {
178
+ if (nodes.find((node) => node.group === "code")) {
157
179
  parts.push(`a code sent to your email`);
158
180
  }
159
- if (ui.nodes.find((node) => node.group === "passkey")) {
160
- parts.push(`a PassKey`);
181
+ if (nodes.find((node) => node.group === "passkey")) {
182
+ parts.push(`a Passkey`);
161
183
  }
162
- if (ui.nodes.find((node) => node.group === "webauthn")) {
184
+ if (nodes.find((node) => node.group === "webauthn")) {
163
185
  parts.push(`a security key`);
164
186
  }
165
- if (ui.nodes.find((node) => node.group === "default")) {
166
- const primaryIdentifier = ui.nodes.filter(
167
- (node) => isUiNodeInputAttributes(node.attributes) && node.attributes.name.startsWith("traits")
187
+ if (nodes.find((node) => node.group === "identifier_first")) {
188
+ const identifier = nodes.find(
189
+ (node) => isUiNodeInputAttributes(node.attributes) && node.attributes.name.startsWith("identifier") && node.attributes.type !== "hidden"
168
190
  );
169
- if (primaryIdentifier.length == 1) {
170
- const label = primaryIdentifier[0].meta.label;
171
- if (label) {
172
- parts.push(`your ${label.text}`);
173
- }
191
+ if (identifier) {
192
+ parts.push(`your ${(_a = identifier.meta.label) == null ? void 0 : _a.text}`);
174
193
  }
175
194
  }
176
- switch (container.flowType) {
195
+ switch (opts.flowType) {
177
196
  case FlowType2.Login:
178
- if (container.flow.refresh) {
197
+ if (opts.flow.refresh) {
179
198
  return {
180
199
  title: "Reauthenticate",
181
200
  description: "Confirm your identity with " + joinWithCommaOr(parts)
@@ -190,22 +209,15 @@ function constructCardHeaderText(container) {
190
209
  title: "Sign up",
191
210
  description: parts.length > 0 ? "Sign up with " + joinWithCommaOr(parts) : ""
192
211
  };
193
- case FlowType2.Recovery:
194
- return {
195
- title: "Recover your account",
196
- description: "Enter the email address associated with your account to receive a one-time access code"
197
- };
198
- case FlowType2.Settings:
199
- return {
200
- title: "Update your account"
201
- };
202
- case FlowType2.Verification:
203
- return {
204
- title: "Verify your account",
205
- description: "Enter the email address associated with your account to verify it"
206
- };
207
212
  }
213
+ return {
214
+ title: "Error",
215
+ description: "An error occurred"
216
+ };
208
217
  }
218
+
219
+ // src/theme/default/components/card/header.tsx
220
+ import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
209
221
  function InnerCardHeader({ title, text }) {
210
222
  const { CardLogo } = useComponents();
211
223
  return /* @__PURE__ */ jsxs5("header", { className: "flex flex-col gap-8 antialiased", children: [
@@ -218,7 +230,10 @@ function InnerCardHeader({ title, text }) {
218
230
  }
219
231
  function DefaultCardHeader() {
220
232
  const context = useOryFlow2();
221
- const { title, description } = constructCardHeaderText(context);
233
+ const { title, description } = constructCardHeaderText(
234
+ context.flow.ui.nodes,
235
+ context
236
+ );
222
237
  return /* @__PURE__ */ jsx5(InnerCardHeader, { title, text: description });
223
238
  }
224
239
 
@@ -242,7 +257,7 @@ function DefaultCardLogo() {
242
257
  // src/theme/default/components/card/index.tsx
243
258
  import { jsx as jsx7, jsxs as jsxs6 } from "react/jsx-runtime";
244
259
  function DefaultCard({ children }) {
245
- return /* @__PURE__ */ jsx7("div", { className: "ory-default-theme", children: /* @__PURE__ */ jsxs6("div", { className: "grid grid-cols-1 max-w-sm md:max-w-[480px] md:w-[480px] gap-8 bg-dialog-bg-default px-8 md:px-12 py-12 md:py-14 relative rounded-border-radius-cards border border-dialog-border-default", children: [
260
+ return /* @__PURE__ */ jsx7("div", { className: "ory-default-theme font-sans", children: /* @__PURE__ */ jsxs6("div", { className: "grid grid-cols-1 max-w-sm md:max-w-[480px] md:w-[480px] gap-8 bg-dialog-bg-default px-8 md:px-12 py-12 md:py-14 relative rounded-border-radius-cards border border-dialog-border-default", children: [
246
261
  children,
247
262
  /* @__PURE__ */ jsx7(Badge, {})
248
263
  ] }) });
@@ -298,81 +313,73 @@ function DefaultMessage({ message }) {
298
313
  // src/theme/default/assets/icons/code.svg
299
314
  import * as React3 from "react";
300
315
  import { jsx as jsx9 } from "react/jsx-runtime";
301
- var SvgCode = (props) => /* @__PURE__ */ jsx9("svg", { width: 15, height: 13, viewBox: "0 0 15 13", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: /* @__PURE__ */ jsx9("path", { d: "M6.33333 10.6663H2.33333C1.97971 10.6663 1.64057 10.5259 1.39052 10.2758C1.14048 10.0258 1 9.68663 1 9.33301V2.66634M1 2.66634C1 2.31272 1.14048 1.97358 1.39052 1.72353C1.64057 1.47348 1.97971 1.33301 2.33333 1.33301H11.6667C12.0203 1.33301 12.3594 1.47348 12.6095 1.72353C12.8595 1.97358 13 2.31272 13 2.66634M1 2.66634L7 6.66634L13 2.66634M13 2.66634V6.66634M12.3333 11.9997L13.6667 10.6663L12.3333 9.33301M10.3333 9.33301L9 10.6663L10.3333 11.9997", stroke: "#0F172A", strokeLinecap: "round", strokeLinejoin: "round" }) });
316
+ var SvgCode = (props) => {
317
+ var _a, _b;
318
+ return /* @__PURE__ */ jsx9("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 15 13", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, ...props, children: /* @__PURE__ */ jsx9("path", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", d: "M6.333 10.666h-4A1.333 1.333 0 0 1 1 9.333V2.666m0 0a1.333 1.333 0 0 1 1.333-1.333h9.334A1.333 1.333 0 0 1 13 2.666m-12 0 6 4 6-4m0 0v4M12.333 12l1.334-1.334-1.334-1.333m-2 0L9 10.666 10.333 12" }) });
319
+ };
302
320
  var code_default = SvgCode;
303
321
 
304
322
  // src/theme/default/assets/icons/passkey.svg
305
323
  import * as React4 from "react";
306
324
  import { jsx as jsx10 } from "react/jsx-runtime";
307
- var SvgPasskey = (props) => /* @__PURE__ */ jsx10("svg", { width: 13, height: 14, viewBox: "0 0 13 14", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: /* @__PURE__ */ jsx10("path", { d: "M10.6016 3.66656C11.2046 4.66735 11.4622 5.83846 11.3349 6.9999V7.66656C11.3342 8.36848 11.5181 9.05824 11.8683 9.66656M3.33492 6.33323C3.33492 5.62599 3.61587 4.94771 4.11597 4.44761C4.61607 3.94752 5.29434 3.66656 6.00159 3.66656C6.70883 3.66656 7.38711 3.94752 7.88721 4.44761C8.3873 4.94771 8.66825 5.62599 8.66825 6.33323V6.9999C8.66825 8.44237 9.13611 9.84592 10.0016 10.9999M6.00159 6.33323V7.66656C5.99946 9.57283 6.58109 11.434 7.66826 12.9999M3.33492 8.9999C3.49806 10.3931 3.9042 11.7469 4.53492 12.9999M1.26825 11.6666C0.818417 10.1534 0.615811 8.5776 0.668252 6.99989V6.33323C0.665696 5.3958 0.910267 4.47426 1.37732 3.66146C1.84438 2.84867 2.51741 2.17334 3.32861 1.70352C4.13981 1.2337 5.06052 0.985989 5.99795 0.985353C6.93538 0.984717 7.85642 1.23118 8.66825 1.69989", stroke: "#0F172A", strokeLinecap: "round", strokeLinejoin: "round" }) });
325
+ var SvgPasskey = (props) => {
326
+ var _a, _b;
327
+ return /* @__PURE__ */ jsx10("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 13 14", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, ...props, children: /* @__PURE__ */ jsx10("path", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", d: "M10.602 3.667c.603 1 .86 2.171.733 3.333v.667a4 4 0 0 0 .533 2M3.335 6.333a2.667 2.667 0 0 1 5.333 0V7c0 1.442.468 2.846 1.334 4m-4-4.667v1.334A9.33 9.33 0 0 0 7.668 13M3.335 9a12 12 0 0 0 1.2 4m-3.267-1.333A14.7 14.7 0 0 1 .668 7v-.667a5.333 5.333 0 0 1 8-4.633" }) });
328
+ };
308
329
  var passkey_default = SvgPasskey;
309
330
 
310
331
  // src/theme/default/assets/icons/password.svg
311
332
  import * as React5 from "react";
312
333
  import { jsx as jsx11 } from "react/jsx-runtime";
313
- var SvgPassword = (props) => /* @__PURE__ */ jsx11("svg", { width: 14, height: 4, viewBox: "0 0 14 4", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: /* @__PURE__ */ jsx11("path", { d: "M7 0.666992V3.33366M5.66667 2.66699L8.33333 1.33366M5.66667 1.33366L8.33333 2.66699M2.33333 0.666992V3.33366M1 2.66699L3.66667 1.33366M1 1.33366L3.66667 2.66699M11.6667 0.666992V3.33366M10.3333 2.66699L13 1.33366M10.3333 1.33366L13 2.66699", stroke: "#0F172A", strokeLinecap: "round", strokeLinejoin: "round" }) });
334
+ var SvgPassword = (props) => {
335
+ var _a, _b;
336
+ return /* @__PURE__ */ jsx11("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 14 4", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, ...props, children: /* @__PURE__ */ jsx11("path", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", d: "M7 .667v2.667m-1.333-.667 2.666-1.333m-2.666 0 2.666 1.333m-6-2v2.667M1 2.667l2.667-1.333M1 1.334l2.667 1.333m8-2v2.667m-1.334-.667L13 1.334m-2.667 0L13 2.667" }) });
337
+ };
314
338
  var password_default = SvgPassword;
315
339
 
316
340
  // src/theme/default/assets/icons/webauthn.svg
317
341
  import * as React6 from "react";
318
342
  import { jsx as jsx12 } from "react/jsx-runtime";
319
- var SvgWebauthn = (props) => /* @__PURE__ */ jsx12("svg", { width: 14, height: 14, viewBox: "0 0 14 14", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: /* @__PURE__ */ jsx12("path", { d: "M9 4.99988H9.00667M10.0367 1.56187L12.438 3.96321C12.6161 4.14131 12.7574 4.35276 12.8538 4.58548C12.9503 4.81821 12.9999 5.06764 12.9999 5.31954C12.9999 5.57144 12.9503 5.82087 12.8538 6.05359C12.7574 6.28631 12.6161 6.49776 12.438 6.67587L10.676 8.43787C10.4979 8.616 10.2864 8.75731 10.0537 8.85372C9.821 8.95012 9.57157 8.99974 9.31967 8.99974C9.06777 8.99974 8.81833 8.95012 8.58561 8.85372C8.35289 8.75731 8.14144 8.616 7.96333 8.43787L7.76267 8.2372L3.39067 12.6092C3.16915 12.8307 2.87672 12.9671 2.56467 12.9945L2.448 12.9999H1.66667C1.50338 12.9998 1.34578 12.9399 1.22375 12.8314C1.10173 12.7229 1.02377 12.5734 1.00467 12.4112L1 12.3332V11.5519C1.00008 11.2388 1.11029 10.9358 1.31133 10.6959L1.39067 10.6092L1.66667 10.3332H3V8.99987H4.33333V7.66654L5.76267 6.2372L5.562 6.03654C5.38387 5.85843 5.24256 5.64698 5.14615 5.41426C5.04975 5.18154 5.00013 4.9321 5.00013 4.6802C5.00013 4.42831 5.04975 4.17887 5.14615 3.94615C5.24256 3.71343 5.38387 3.50198 5.562 3.32387L7.324 1.56187C7.50211 1.38374 7.71356 1.24243 7.94628 1.14603C8.179 1.04962 8.42843 1 8.68033 1C8.93223 1 9.18167 1.04962 9.41439 1.14603C9.64711 1.24243 9.85856 1.38374 10.0367 1.56187Z", stroke: "#0F172A", strokeLinecap: "round", strokeLinejoin: "round" }) });
343
+ var SvgWebauthn = (props) => {
344
+ var _a, _b;
345
+ return /* @__PURE__ */ jsx12("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 14 14", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, ...props, children: /* @__PURE__ */ jsx12("path", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", d: "M9 5h.007m1.03-3.438 2.401 2.401a1.92 1.92 0 0 1 0 2.713l-1.762 1.762a1.92 1.92 0 0 1-2.713 0l-.2-.2-4.372 4.371a1.33 1.33 0 0 1-.826.386L2.448 13h-.781a.667.667 0 0 1-.662-.589L1 12.333v-.781c0-.313.11-.616.311-.856l.08-.087.276-.276H3V9h1.333V7.667l1.43-1.43-.201-.2a1.92 1.92 0 0 1 0-2.713l1.762-1.762a1.92 1.92 0 0 1 2.713 0" }) });
346
+ };
320
347
  var webauthn_default = SvgWebauthn;
321
348
 
322
349
  // src/theme/default/components/card/auth-methods.tsx
350
+ import { useIntl as useIntl2 } from "react-intl";
323
351
  import { jsx as jsx13, jsxs as jsxs7 } from "react/jsx-runtime";
352
+ var iconsMap = {
353
+ code: code_default,
354
+ passkey: passkey_default,
355
+ password: password_default,
356
+ webauthn: webauthn_default
357
+ };
324
358
  function DefaultAuthMethodListItem({
325
- setGroups,
326
- setStep,
359
+ onClick,
327
360
  group
328
361
  }) {
329
- let Icon = null;
330
- let title = "";
331
- let description = "";
332
- switch (group) {
333
- case "passkey":
334
- Icon = passkey_default;
335
- title = "Passkey";
336
- description = "Use your fingerprint or face to sign in.";
337
- break;
338
- case "password":
339
- Icon = password_default;
340
- title = "Password";
341
- description = "Use your password to sign in.";
342
- break;
343
- case "webauthn":
344
- Icon = webauthn_default;
345
- title = "Security Key";
346
- description = "Use a security key to sign in.";
347
- break;
348
- case "code":
349
- Icon = code_default;
350
- title = "Email";
351
- description = "Enter a code sent to your email.";
352
- break;
353
- }
354
- return /* @__PURE__ */ jsxs7(
355
- "div",
362
+ const intl = useIntl2();
363
+ const Icon = iconsMap[group] || null;
364
+ return /* @__PURE__ */ jsx13("div", { className: "w-full hover:bg-forms-bg-hover px-2 py-1 rounded", children: /* @__PURE__ */ jsxs7(
365
+ "button",
356
366
  {
357
- className: "flex py-2 gap-3 cursor-pointer hover:bg-button-secondary-bg-hover",
358
- onClick: () => {
359
- setGroups([group]);
360
- setStep(2);
361
- },
367
+ className: "flex text-left py-2 gap-3 cursor-pointer ",
368
+ onClick,
362
369
  children: [
363
- /* @__PURE__ */ jsx13("div", { className: "flex-none w-4 h-4 mt-[2px]", children: Icon && /* @__PURE__ */ jsx13(Icon, { className: "w-5 h-5", width: 16, height: 16 }) }),
370
+ /* @__PURE__ */ jsx13("div", { className: "flex-none w-4 h-4 mt-[2px]", children: Icon && /* @__PURE__ */ jsx13(Icon, { size: 20, className: "text-forms-fg-default" }) }),
364
371
  /* @__PURE__ */ jsxs7("div", { className: "flex-1 text-sm leading-normal", children: [
365
- /* @__PURE__ */ jsx13("div", { className: "text-forms-fg-default", children: title }),
366
- /* @__PURE__ */ jsx13("div", { className: "text-forms-fg-subtle", children: description })
372
+ /* @__PURE__ */ jsx13("div", { className: "text-forms-fg-default text-sm", children: intl.formatMessage({ id: `two-step.${group}.title` }) }),
373
+ /* @__PURE__ */ jsx13("div", { className: "text-forms-fg-mute text-sm", children: intl.formatMessage({ id: `two-step.${group}.description` }) })
367
374
  ] })
368
375
  ]
369
376
  }
370
- );
377
+ ) });
371
378
  }
372
379
 
373
380
  // src/theme/default/components/form/button.tsx
374
381
  import { useFormContext } from "react-hook-form";
375
- import { useIntl as useIntl2 } from "react-intl";
382
+ import { useIntl as useIntl3 } from "react-intl";
376
383
 
377
384
  // src/theme/default/components/form/spinner.tsx
378
385
  import { jsx as jsx14, jsxs as jsxs8 } from "react/jsx-runtime";
@@ -433,7 +440,7 @@ var DefaultButton = ({
433
440
  // End of skipped attributes
434
441
  ...rest
435
442
  } = attributes;
436
- const intl = useIntl2();
443
+ const intl = useIntl3();
437
444
  const label = getNodeLabel(node);
438
445
  const {
439
446
  formState: { isSubmitting },
@@ -459,9 +466,7 @@ var DefaultButton = ({
459
466
  }
460
467
  },
461
468
  className: cn(
462
- // TODO: Difficult to resolve merge conflict here. Please ensure this is correct:
463
- // "relative antialiased rounded border gap-3 leading-none transition-colors ease-linear duration-100 px-4 py-4.5 text-sm font-medium",
464
- "antialiased rounded-border-radius-buttons border border-transparent gap-3 bg-button-primary-bg-default hover:bg-button-primary-bg-hover transition-colors text-button-primary-fg-default hover:text-button-primary-fg-hover px-4 py-4.5 text-sm leading-none font-medium",
469
+ "antialiased rounded-border-radius-buttons border border-transparent gap-3 bg-button-primary-bg-default hover:bg-button-primary-bg-hover transition-colors text-button-primary-fg-default hover:text-button-primary-fg-hover px-4 py-3 md:py-4.5 text-sm leading-none font-medium",
465
470
  {
466
471
  "cursor-not-allowed": isSubmitting,
467
472
  "bg-button-primary-bg-hover": isSubmitting,
@@ -494,7 +499,7 @@ DefaultButton.displayName = "DefaultButton";
494
499
  // src/theme/default/components/form/checkbox.tsx
495
500
  import { useState } from "react";
496
501
  import { useForm } from "react-hook-form";
497
- import { useIntl as useIntl3 } from "react-intl";
502
+ import { useIntl as useIntl4 } from "react-intl";
498
503
  import { formatMessage as formatMessage2, messageTestId } from "@ory/elements-react";
499
504
  import { getNodeLabel as getNodeLabel2 } from "@ory/client-fetch";
500
505
  import { jsx as jsx16, jsxs as jsxs10 } from "react/jsx-runtime";
@@ -542,7 +547,7 @@ var DefaultCheckbox = ({
542
547
  // End of skipped attributes
543
548
  ...attributes
544
549
  } = initialAttributes;
545
- const intl = useIntl3();
550
+ const intl = useIntl4();
546
551
  const label = getNodeLabel2(node);
547
552
  const [checked, setChecked] = useState(Boolean(value));
548
553
  const { register } = useForm();
@@ -559,7 +564,6 @@ var DefaultCheckbox = ({
559
564
  "input",
560
565
  {
561
566
  ...attributes,
562
- defaultChecked: checked,
563
567
  checked,
564
568
  value: 1,
565
569
  type: "checkbox",
@@ -621,13 +625,14 @@ var DefaultInput = ({
621
625
  }) => {
622
626
  const label = getNodeLabel3(node);
623
627
  const { register } = useFormContext2();
624
- const { value, autocomplete, name, ...rest } = attributes;
628
+ const { value, autocomplete, name, maxlength, ...rest } = attributes;
625
629
  return /* @__PURE__ */ jsx20(
626
630
  "input",
627
631
  {
628
632
  ...rest,
629
- autoComplete: autocomplete,
630
633
  onClick,
634
+ maxLength: maxlength,
635
+ autoComplete: autocomplete,
631
636
  placeholder: (label == null ? void 0 : label.text) ? "Enter your " + (label == null ? void 0 : label.text) : "",
632
637
  className: "antialiased bg-forms-bg-default rounded-border-radius-forms border px-3 py-2.5 md:px-4 md:py-4 border-forms-border-default leading-tight hover:border-forms-border-hover transition-colors text-sm",
633
638
  ...register(name, { value })
@@ -637,7 +642,7 @@ var DefaultInput = ({
637
642
 
638
643
  // src/theme/default/components/form/label.tsx
639
644
  import { FlowType as FlowType3, getNodeLabel as getNodeLabel4 } from "@ory/client-fetch";
640
- import { useIntl as useIntl4 } from "react-intl";
645
+ import { useIntl as useIntl5 } from "react-intl";
641
646
  import { useOryFlow as useOryFlow4 } from "@ory/elements-react";
642
647
  import { formatMessage as formatMessage3, messageTestId as messageTestId2 } from "@ory/elements-react";
643
648
  import { jsx as jsx21, jsxs as jsxs11 } from "react/jsx-runtime";
@@ -647,7 +652,7 @@ function DefaultLabel({
647
652
  attributes,
648
653
  ...rest
649
654
  }) {
650
- const intl = useIntl4();
655
+ const intl = useIntl5();
651
656
  const label = getNodeLabel4(node);
652
657
  const { config, flowType } = useOryFlow4();
653
658
  const isPassword = attributes.type === "password";
@@ -704,12 +709,12 @@ function DefaultLabel({
704
709
 
705
710
  // src/theme/default/components/form/link-button.tsx
706
711
  import { forwardRef } from "react";
707
- import { useIntl as useIntl5 } from "react-intl";
712
+ import { useIntl as useIntl6 } from "react-intl";
708
713
  import { formatMessage as formatMessage4 } from "@ory/elements-react";
709
714
  import { getNodeLabel as getNodeLabel5 } from "@ory/client-fetch";
710
715
  import { jsx as jsx22 } from "react/jsx-runtime";
711
716
  var DefaultLinkButton = forwardRef(({ attributes, node }, ref) => {
712
- const intl = useIntl5();
717
+ const intl = useIntl6();
713
718
  const label = getNodeLabel5(node);
714
719
  return /* @__PURE__ */ jsx22(
715
720
  "a",
@@ -813,126 +818,163 @@ import {
813
818
  // src/theme/default/provider-logos/apple.svg
814
819
  import * as React8 from "react";
815
820
  import { jsx as jsx25, jsxs as jsxs13 } from "react/jsx-runtime";
816
- var SvgApple = (props) => /* @__PURE__ */ jsxs13("svg", { width: 32, height: 32, viewBox: "0 0 32 32", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: [
817
- /* @__PURE__ */ jsx25("path", { d: "M30 16C30 23.728 23.735 30 16 30C8.265 30 2 23.728 2 16C2 8.26499 8.265 1.99999 16 1.99999C23.735 1.99999 30 8.26499 30 16Z", fill: "#283544" }),
818
- /* @__PURE__ */ jsx25("path", { d: "M22.5621 12.4574C22.4857 12.502 20.6671 13.4425 20.6671 15.5279C20.7528 17.9061 22.9621 18.7401 23 18.7401C22.9621 18.7847 22.6665 19.8763 21.7907 21.0205C21.0956 22.0062 20.3242 23 19.1528 23C18.0385 23 17.6385 22.3431 16.3528 22.3431C14.972 22.3431 14.5813 23 13.5242 23C12.3528 23 11.5242 21.953 10.7913 20.9766C9.8391 19.6986 9.02978 17.6931 9.00121 15.7675C8.98195 14.7471 9.19189 13.744 9.72481 12.8921C10.477 11.7026 11.8198 10.8952 13.2863 10.8686C14.4099 10.8333 15.4099 11.5875 16.0956 11.5875C16.7528 11.5875 17.9814 10.8686 19.3714 10.8686C19.9714 10.8692 21.5714 11.0376 22.5621 12.4574ZM16.0006 10.6649C15.8006 9.73303 16.3528 8.80119 16.8671 8.20677C17.5242 7.48792 18.5621 7 19.4571 7C19.5143 7.93185 19.1522 8.84575 18.505 9.51136C17.9242 10.2302 16.9242 10.7714 16.0006 10.6649Z", fill: "white" })
819
- ] });
821
+ var SvgApple = (props) => {
822
+ var _a, _b;
823
+ return /* @__PURE__ */ jsxs13("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 32 32", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, ...props, children: [
824
+ /* @__PURE__ */ jsx25("path", { fill: "#283544", d: "M30 16c0 7.728-6.265 14-14 14S2 23.728 2 16C2 8.265 8.265 2 16 2s14 6.265 14 14" }),
825
+ /* @__PURE__ */ jsx25("path", { fill: "#fff", d: "M22.562 12.457c-.076.045-1.895.986-1.895 3.07.086 2.38 2.295 3.213 2.333 3.213-.038.045-.334 1.136-1.21 2.28-.694.986-1.466 1.98-2.637 1.98-1.114 0-1.514-.657-2.8-.657-1.381 0-1.772.657-2.829.657-1.171 0-2-1.047-2.733-2.023-.952-1.278-1.761-3.284-1.79-5.21-.02-1.02.19-2.023.724-2.875.752-1.19 2.095-1.997 3.561-2.023 1.124-.036 2.124.719 2.81.719.657 0 1.885-.72 3.275-.72.6.001 2.2.17 3.191 1.59m-6.561-1.792c-.2-.932.352-1.864.866-2.458.657-.72 1.695-1.207 2.59-1.207a3.33 3.33 0 0 1-.952 2.511c-.58.72-1.58 1.26-2.504 1.154" })
826
+ ] });
827
+ };
820
828
  var apple_default = SvgApple;
821
829
 
822
830
  // src/theme/default/provider-logos/auth0.svg
823
831
  import * as React9 from "react";
824
832
  import { jsx as jsx26 } from "react/jsx-runtime";
825
- var SvgAuth0 = (props) => /* @__PURE__ */ jsx26("svg", { xmlns: "http://www.w3.org/2000/svg", width: 64, height: 64, viewBox: "0 0 64 64", ...props, children: /* @__PURE__ */ jsx26("path", { d: "M49.012 51.774L42.514 32l17.008-12.22h-21.02L32.005 0h21.032l6.506 19.78c3.767 11.468-.118 24.52-10.53 31.993zm-34.023 0L31.998 64l17.015-12.226-17.008-12.22zm-10.516-32c-3.976 12.1.64 24.917 10.5 32.007v-.007L21.482 32 4.474 19.774l21.025.007L31.998 0H10.972z", fill: "#eb5424" }) });
833
+ var SvgAuth0 = (props) => {
834
+ var _a, _b;
835
+ return /* @__PURE__ */ jsx26("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 64 64", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, ...props, children: /* @__PURE__ */ jsx26("path", { fill: "#eb5424", d: "M49.012 51.774 42.514 32l17.008-12.22h-21.02L32.005 0h21.032l6.506 19.78c3.767 11.468-.118 24.52-10.53 31.993zm-34.023 0L31.998 64l17.015-12.226-17.008-12.22zm-10.516-32c-3.976 12.1.64 24.917 10.5 32.007v-.007L21.482 32 4.474 19.774l21.025.007L31.998 0H10.972z" }) });
836
+ };
826
837
  var auth0_default = SvgAuth0;
827
838
 
828
839
  // src/theme/default/provider-logos/discord.svg
829
840
  import * as React10 from "react";
830
841
  import { jsx as jsx27, jsxs as jsxs14 } from "react/jsx-runtime";
831
- var SvgDiscord = (props) => /* @__PURE__ */ jsxs14("svg", { width: 32, height: 32, viewBox: "0 0 32 32", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: [
832
- /* @__PURE__ */ jsx27("path", { d: "M2 11.6C2 8.23969 2 6.55953 2.65396 5.27606C3.2292 4.14708 4.14708 3.2292 5.27606 2.65396C6.55953 2 8.23969 2 11.6 2H20.4C23.7603 2 25.4405 2 26.7239 2.65396C27.8529 3.2292 28.7708 4.14708 29.346 5.27606C30 6.55953 30 8.23969 30 11.6V20.4C30 23.7603 30 25.4405 29.346 26.7239C28.7708 27.8529 27.8529 28.7708 26.7239 29.346C25.4405 30 23.7603 30 20.4 30H11.6C8.23969 30 6.55953 30 5.27606 29.346C4.14708 28.7708 3.2292 27.8529 2.65396 26.7239C2 25.4405 2 23.7603 2 20.4V11.6Z", fill: "white" }),
833
- /* @__PURE__ */ jsx27("path", { d: "M23.6361 9.33998C22.212 8.71399 20.6892 8.25903 19.0973 8C18.9018 8.33209 18.6734 8.77875 18.5159 9.13408C16.8236 8.89498 15.1469 8.89498 13.4857 9.13408C13.3283 8.77875 13.0946 8.33209 12.8974 8C11.3037 8.25903 9.77927 8.71565 8.35518 9.3433C5.48276 13.4213 4.70409 17.3981 5.09342 21.3184C6.99856 22.6551 8.84487 23.467 10.66 23.9983C11.1082 23.4189 11.5079 22.8029 11.8523 22.1536C11.1964 21.9195 10.5683 21.6306 9.9748 21.2951C10.1323 21.1856 10.2863 21.071 10.4351 20.9531C14.0551 22.5438 17.9881 22.5438 21.5649 20.9531C21.7154 21.071 21.8694 21.1856 22.0251 21.2951C21.4299 21.6322 20.8 21.9211 20.1442 22.1553C20.4885 22.8029 20.8865 23.4205 21.3364 24C23.1533 23.4687 25.0013 22.6567 26.9065 21.3184C27.3633 16.7738 26.1261 12.8335 23.6361 9.33998ZM12.3454 18.9075C11.2587 18.9075 10.3676 17.9543 10.3676 16.7937C10.3676 15.6331 11.2397 14.6783 12.3454 14.6783C13.4511 14.6783 14.3422 15.6314 14.3232 16.7937C14.325 17.9543 13.4511 18.9075 12.3454 18.9075ZM19.6545 18.9075C18.5678 18.9075 17.6767 17.9543 17.6767 16.7937C17.6767 15.6331 18.5488 14.6783 19.6545 14.6783C20.7602 14.6783 21.6514 15.6314 21.6323 16.7937C21.6323 17.9543 20.7602 18.9075 19.6545 18.9075Z", fill: "#5865F2" })
834
- ] });
842
+ var SvgDiscord = (props) => {
843
+ var _a, _b;
844
+ return /* @__PURE__ */ jsxs14("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 32 32", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, ...props, children: [
845
+ /* @__PURE__ */ jsx27("path", { d: "M2 11.6c0-3.36 0-5.04.654-6.324a6 6 0 0 1 2.622-2.622C6.56 2 8.24 2 11.6 2h8.8c3.36 0 5.04 0 6.324.654a6 6 0 0 1 2.622 2.622C30 6.56 30 8.24 30 11.6v8.8c0 3.36 0 5.04-.654 6.324a6 6 0 0 1-2.622 2.622C25.44 30 23.76 30 20.4 30h-8.8c-3.36 0-5.04 0-6.324-.654a6 6 0 0 1-2.622-2.622C2 25.44 2 23.76 2 20.4z" }),
846
+ /* @__PURE__ */ jsx27("path", { fill: "#5865F2", d: "M23.636 9.34A18.8 18.8 0 0 0 19.097 8c-.195.332-.424.779-.581 1.134a17.7 17.7 0 0 0-5.03 0A12 12 0 0 0 12.897 8a18.7 18.7 0 0 0-4.542 1.343c-2.872 4.078-3.65 8.055-3.262 11.975a18.6 18.6 0 0 0 5.567 2.68c.448-.58.848-1.195 1.192-1.844a12 12 0 0 1-1.877-.859 9 9 0 0 0 .46-.342c3.62 1.59 7.553 1.59 11.13 0q.225.178.46.342c-.595.337-1.225.626-1.88.86q.516.974 1.191 1.845a18.6 18.6 0 0 0 5.57-2.682c.457-4.544-.78-8.484-3.27-11.978m-11.29 9.567c-1.087 0-1.978-.953-1.978-2.113s.872-2.116 1.977-2.116c1.106 0 1.997.953 1.978 2.116.002 1.16-.872 2.113-1.978 2.113m7.308 0c-1.086 0-1.977-.953-1.977-2.113s.872-2.116 1.977-2.116c1.106 0 1.997.953 1.978 2.116 0 1.16-.872 2.113-1.978 2.113" })
847
+ ] });
848
+ };
835
849
  var discord_default = SvgDiscord;
836
850
 
837
851
  // src/theme/default/provider-logos/facebook.svg
838
852
  import * as React11 from "react";
839
853
  import { jsx as jsx28, jsxs as jsxs15 } from "react/jsx-runtime";
840
- var SvgFacebook = (props) => /* @__PURE__ */ jsxs15("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: [
841
- /* @__PURE__ */ jsxs15("g", { clipPath: "url(#clip0_101_2)", children: [
842
- /* @__PURE__ */ jsx28("path", { d: "M23.9994 12.0003C23.9994 5.37306 18.627 0.000618863 11.9997 0.000618863C5.37245 0.000618863 0 5.37306 0 12.0003C0 17.9897 4.38812 22.954 10.1247 23.8542V15.469H7.07795V12.0003H10.1247V9.35664C10.1247 6.34921 11.9162 4.688 14.6572 4.688C15.9701 4.688 17.3433 4.92237 17.3433 4.92237V7.87542H15.8302C14.3395 7.87542 13.8747 8.80041 13.8747 9.74937V12.0003H17.2027L16.6707 15.469H13.8747V23.8542C19.6113 22.954 23.9994 17.9897 23.9994 12.0003Z", fill: "#1877F2" }),
843
- /* @__PURE__ */ jsx28("path", { d: "M16.6707 15.469L17.2028 12.0003H13.8747V9.74935C13.8747 8.80038 14.3396 7.8754 15.8302 7.8754H17.3434V4.92235C17.3434 4.92235 15.9701 4.68798 14.6573 4.68798C11.9163 4.68798 10.1248 6.34919 10.1248 9.35661V12.0003H7.078V15.469H10.1248V23.8542C10.7357 23.9501 11.3619 24 11.9998 24C12.6376 24 13.2638 23.9501 13.8747 23.8542V15.469H16.6707Z", fill: "white" })
844
- ] }),
845
- /* @__PURE__ */ jsx28("defs", { children: /* @__PURE__ */ jsx28("clipPath", { id: "clip0_101_2", children: /* @__PURE__ */ jsx28("rect", { width: 24, height: 24, fill: "white" }) }) })
846
- ] });
854
+ var SvgFacebook = (props) => {
855
+ var _a, _b;
856
+ return /* @__PURE__ */ jsxs15("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, ...props, children: [
857
+ /* @__PURE__ */ jsxs15("g", { clipPath: "url(#facebook_svg__a)", children: [
858
+ /* @__PURE__ */ jsx28("path", { fill: "#1877F2", d: "M24 12c0-6.627-5.373-12-12-12C5.372 0 0 5.374 0 12c0 5.99 4.388 10.954 10.125 11.854V15.47H7.078V12h3.047V9.357c0-3.008 1.791-4.669 4.532-4.669 1.313 0 2.686.234 2.686.234v2.953H15.83c-1.49 0-1.955.925-1.955 1.874V12h3.328l-.532 3.469h-2.796v8.385c5.736-.9 10.124-5.864 10.124-11.854" }),
859
+ /* @__PURE__ */ jsx28("path", { fill: "#fff", d: "M16.67 15.469 17.204 12h-3.328V9.75c0-.95.465-1.875 1.955-1.875h1.513V4.922s-1.373-.234-2.686-.234c-2.74 0-4.532 1.661-4.532 4.669V12H7.078v3.469h3.047v8.385a12.1 12.1 0 0 0 3.75 0V15.47z" })
860
+ ] }),
861
+ /* @__PURE__ */ jsx28("defs", { children: /* @__PURE__ */ jsx28("clipPath", { id: "facebook_svg__a", children: /* @__PURE__ */ jsx28("rect", { fill: "#fff" }) }) })
862
+ ] });
863
+ };
847
864
  var facebook_default = SvgFacebook;
848
865
 
849
866
  // src/theme/default/provider-logos/generic.svg
850
867
  import * as React12 from "react";
851
868
  import { jsx as jsx29, jsxs as jsxs16 } from "react/jsx-runtime";
852
- var SvgGeneric = (props) => /* @__PURE__ */ jsxs16("svg", { xmlns: "http://www.w3.org/2000/svg", className: "icon icon-tabler icon-tabler-brand-oauth", width: 24, height: 24, viewBox: "0 0 24 24", strokeWidth: 2, stroke: "currentColor", fill: "none", strokeLinecap: "round", strokeLinejoin: "round", ...props, children: [
853
- /* @__PURE__ */ jsx29("path", { stroke: "none", d: "M0 0h24v24H0z", fill: "none" }),
854
- /* @__PURE__ */ jsx29("path", { d: "M12 12m-10 0a10 10 0 1 0 20 0a10 10 0 1 0 -20 0" }),
855
- /* @__PURE__ */ jsx29("path", { d: "M12.556 6c.65 0 1.235 .373 1.508 .947l2.839 7.848a1.646 1.646 0 0 1 -1.01 2.108a1.673 1.673 0 0 1 -2.068 -.851l-.46 -1.052h-2.73l-.398 .905a1.67 1.67 0 0 1 -1.977 1.045l-.153 -.047a1.647 1.647 0 0 1 -1.056 -1.956l2.824 -7.852a1.664 1.664 0 0 1 1.409 -1.087l1.272 -.008z" })
856
- ] });
869
+ var SvgGeneric = (props) => {
870
+ var _a, _b;
871
+ return /* @__PURE__ */ jsxs16("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, className: "generic_svg__icon generic_svg__icon-tabler generic_svg__icon-tabler-brand-oauth", viewBox: "0 0 24 24", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, ...props, children: [
872
+ /* @__PURE__ */ jsx29("path", { stroke: "none", d: "M0 0h24v24H0z" }),
873
+ /* @__PURE__ */ jsx29("path", { d: "M2 12a10 10 0 1 0 20 0 10 10 0 1 0-20 0" }),
874
+ /* @__PURE__ */ jsx29("path", { d: "M12.556 6c.65 0 1.235.373 1.508.947l2.839 7.848a1.646 1.646 0 0 1-1.01 2.108 1.673 1.673 0 0 1-2.068-.851L13.365 15h-2.73l-.398.905A1.67 1.67 0 0 1 8.26 16.95l-.153-.047a1.647 1.647 0 0 1-1.056-1.956l2.824-7.852a1.66 1.66 0 0 1 1.409-1.087z" })
875
+ ] });
876
+ };
857
877
  var generic_default = SvgGeneric;
858
878
 
859
879
  // src/theme/default/provider-logos/github.svg
860
880
  import * as React13 from "react";
861
881
  import { jsx as jsx30 } from "react/jsx-runtime";
862
- var SvgGithub = (props) => /* @__PURE__ */ jsx30("svg", { xmlns: "http://www.w3.org/2000/svg", width: 24, height: 24, viewBox: "0 0 24 24", ...props, children: /* @__PURE__ */ jsx30("path", { d: "M12 0C5.374 0 0 5.373 0 12c0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23A11.509 11.509 0 0 1 12 5.803c1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576C20.566 21.797 24 17.3 24 12c0-6.627-5.373-12-12-12z" }) });
882
+ var SvgGithub = (props) => {
883
+ var _a, _b;
884
+ return /* @__PURE__ */ jsx30("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, ...props, children: /* @__PURE__ */ jsx30("path", { d: "M12 0C5.374 0 0 5.373 0 12c0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23A11.5 11.5 0 0 1 12 5.803c1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576C20.566 21.797 24 17.3 24 12c0-6.627-5.373-12-12-12" }) });
885
+ };
863
886
  var github_default = SvgGithub;
864
887
 
865
888
  // src/theme/default/provider-logos/gitlab.svg
866
889
  import * as React14 from "react";
867
890
  import { jsx as jsx31, jsxs as jsxs17 } from "react/jsx-runtime";
868
- var SvgGitlab = (props) => /* @__PURE__ */ jsxs17("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: [
869
- /* @__PURE__ */ jsx31("path", { d: "M22.7082 10.6913L22.677 10.6188L19.6617 3.45202C19.6004 3.31155 19.4917 3.1924 19.3514 3.11165C19.211 3.03227 19.0472 2.99403 18.8822 3.00211C18.7172 3.01019 18.5588 3.06419 18.4286 3.15682C18.2998 3.25211 18.2063 3.38123 18.161 3.52661L16.125 9.19952H7.88075L5.84478 3.52661C5.80063 3.38044 5.70698 3.25067 5.57717 3.15577C5.44691 3.06314 5.28858 3.00914 5.12355 3.00106C4.95853 2.99298 4.79475 3.03121 4.65434 3.11059C4.51434 3.19167 4.4058 3.31073 4.34405 3.45097L1.32297 10.6146L1.29297 10.6871C0.858905 11.72 0.805326 12.8534 1.14032 13.9164C1.4753 14.9795 2.1807 15.9145 3.15015 16.5806L3.16053 16.588L3.18821 16.6058L7.78155 19.7385L10.054 21.3049L11.4382 22.2567C11.6001 22.3686 11.7978 22.4292 12.0011 22.4292C12.2044 22.4292 12.4021 22.3686 12.5641 22.2567L13.9483 21.3049L16.2207 19.7385L20.8418 16.5869L20.8533 16.5785C21.8206 15.9123 22.5243 14.9782 22.8588 13.9166C23.1933 12.855 23.1404 11.7232 22.7082 10.6913Z", fill: "#E24329" }),
870
- /* @__PURE__ */ jsx31("path", { d: "M22.7081 10.6913L22.677 10.6188C21.2077 10.8935 19.8232 11.4603 18.6224 12.2787L12 16.8391C14.2551 18.3928 16.2184 19.7428 16.2184 19.7428L20.8394 16.5911L20.851 16.5827C21.8196 15.9166 22.5245 14.9819 22.8594 13.9194C23.1944 12.8568 23.1413 11.724 22.7081 10.6913Z", fill: "#FC6D26" }),
871
- /* @__PURE__ */ jsx31("path", { d: "M7.78149 19.7427L10.0539 21.3091L11.4382 22.2608C11.6001 22.3728 11.7978 22.4334 12.0011 22.4334C12.2044 22.4334 12.4021 22.3728 12.564 22.2608L13.9482 21.3091L16.2207 19.7427C16.2207 19.7427 14.2551 18.3886 11.9999 16.839C9.74479 18.3886 7.78149 19.7427 7.78149 19.7427Z", fill: "#FCA326" }),
872
- /* @__PURE__ */ jsx31("path", { d: "M5.37645 12.2786C4.17655 11.4585 2.79233 10.8903 1.32297 10.6146L1.29297 10.6871C0.858905 11.72 0.805326 12.8534 1.14032 13.9164C1.4753 14.9795 2.1807 15.9145 3.15015 16.5806L3.16053 16.588L3.18821 16.6058L7.78155 19.7385C7.78155 19.7385 9.74254 18.3886 12 16.8348L5.37645 12.2786Z", fill: "#FC6D26" })
873
- ] });
891
+ var SvgGitlab = (props) => {
892
+ var _a, _b;
893
+ return /* @__PURE__ */ jsxs17("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, ...props, children: [
894
+ /* @__PURE__ */ jsx31("path", { fill: "#E24329", d: "m22.708 10.691-.031-.072-3.015-7.167a.74.74 0 0 0-.31-.34.87.87 0 0 0-.923.045.73.73 0 0 0-.268.37L16.125 9.2H7.881L5.845 3.527a.72.72 0 0 0-.268-.371.87.87 0 0 0-.923-.045.74.74 0 0 0-.31.34l-3.021 7.164-.03.072a4.67 4.67 0 0 0-.153 3.23c.335 1.063 1.04 1.998 2.01 2.664l.01.007.028.018 4.594 3.132 2.272 1.567 1.384.952c.162.112.36.172.563.172s.401-.06.563-.172l1.384-.952 2.273-1.567 4.62-3.151.012-.009c.968-.666 1.671-1.6 2.006-2.661a4.67 4.67 0 0 0-.15-3.226" }),
895
+ /* @__PURE__ */ jsx31("path", { fill: "#FC6D26", d: "m22.708 10.691-.031-.072a10.7 10.7 0 0 0-4.055 1.66L12 16.839l4.218 2.904 4.621-3.152.012-.008c.969-.666 1.674-1.601 2.008-2.664a4.67 4.67 0 0 0-.15-3.228" }),
896
+ /* @__PURE__ */ jsx31("path", { fill: "#FCA326", d: "m7.781 19.743 2.273 1.566 1.384.952c.162.112.36.172.563.172s.401-.06.563-.172l1.384-.952 2.273-1.566S14.255 18.389 12 16.839c-2.255 1.55-4.219 2.904-4.219 2.904" }),
897
+ /* @__PURE__ */ jsx31("path", { fill: "#FC6D26", d: "M5.376 12.279a10.7 10.7 0 0 0-4.053-1.664l-.03.072a4.67 4.67 0 0 0-.153 3.23c.335 1.063 1.04 1.998 2.01 2.664l.01.007.028.018 4.594 3.132L12 16.836z" })
898
+ ] });
899
+ };
874
900
  var gitlab_default = SvgGitlab;
875
901
 
876
902
  // src/theme/default/provider-logos/google.svg
877
903
  import * as React15 from "react";
878
904
  import { jsx as jsx32, jsxs as jsxs18 } from "react/jsx-runtime";
879
- var SvgGoogle = (props) => /* @__PURE__ */ jsxs18("svg", { width: 24, height: 24, viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", ...props, children: [
880
- /* @__PURE__ */ jsx32("path", { fill: "#4285F4", d: "M23.745 12.27c0-.79-.07-1.54-.19-2.27h-11.3v4.51h6.47c-.29 1.48-1.14 2.73-2.4 3.58v3h3.86c2.26-2.09 3.56-5.17 3.56-8.82Z" }),
881
- /* @__PURE__ */ jsx32("path", { fill: "#34A853", d: "M12.255 24c3.24 0 5.95-1.08 7.93-2.91l-3.86-3c-1.08.72-2.45 1.16-4.07 1.16-3.13 0-5.78-2.11-6.73-4.96h-3.98v3.09C3.515 21.3 7.565 24 12.255 24Z" }),
882
- /* @__PURE__ */ jsx32("path", { fill: "#FBBC05", d: "M5.525 14.29c-.25-.72-.38-1.49-.38-2.29s.14-1.57.38-2.29V6.62h-3.98a11.86 11.86 0 0 0 0 10.76l3.98-3.09Z" }),
883
- /* @__PURE__ */ jsx32("path", { fill: "#EA4335", d: "M12.255 4.75c1.77 0 3.35.61 4.6 1.8l3.42-3.42C18.205 1.19 15.495 0 12.255 0c-4.69 0-8.74 2.7-10.71 6.62l3.98 3.09c.95-2.85 3.6-4.96 6.73-4.96Z" })
884
- ] });
905
+ var SvgGoogle = (props) => {
906
+ var _a, _b;
907
+ return /* @__PURE__ */ jsxs18("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, ...props, children: [
908
+ /* @__PURE__ */ jsx32("path", { fill: "#4285F4", d: "M23.745 12.27c0-.79-.07-1.54-.19-2.27h-11.3v4.51h6.47c-.29 1.48-1.14 2.73-2.4 3.58v3h3.86c2.26-2.09 3.56-5.17 3.56-8.82" }),
909
+ /* @__PURE__ */ jsx32("path", { fill: "#34A853", d: "M12.255 24c3.24 0 5.95-1.08 7.93-2.91l-3.86-3c-1.08.72-2.45 1.16-4.07 1.16-3.13 0-5.78-2.11-6.73-4.96h-3.98v3.09C3.515 21.3 7.565 24 12.255 24" }),
910
+ /* @__PURE__ */ jsx32("path", { fill: "#FBBC05", d: "M5.525 14.29c-.25-.72-.38-1.49-.38-2.29s.14-1.57.38-2.29V6.62h-3.98a11.86 11.86 0 0 0 0 10.76z" }),
911
+ /* @__PURE__ */ jsx32("path", { fill: "#EA4335", d: "M12.255 4.75c1.77 0 3.35.61 4.6 1.8l3.42-3.42C18.205 1.19 15.495 0 12.255 0c-4.69 0-8.74 2.7-10.71 6.62l3.98 3.09c.95-2.85 3.6-4.96 6.73-4.96" })
912
+ ] });
913
+ };
885
914
  var google_default = SvgGoogle;
886
915
 
887
916
  // src/theme/default/provider-logos/linkedin.svg
888
917
  import * as React16 from "react";
889
918
  import { jsx as jsx33, jsxs as jsxs19 } from "react/jsx-runtime";
890
- var SvgLinkedin = (props) => /* @__PURE__ */ jsxs19("svg", { width: 32, height: 32, viewBox: "0 0 32 32", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: [
891
- /* @__PURE__ */ jsx33("rect", { x: 2, y: 2, width: 28, height: 28, rx: 14, fill: "#1275B1" }),
892
- /* @__PURE__ */ jsx33("path", { d: "M12.6186 9.69215C12.6186 10.6267 11.8085 11.3843 10.8093 11.3843C9.81004 11.3843 9 10.6267 9 9.69215C9 8.7576 9.81004 8 10.8093 8C11.8085 8 12.6186 8.7576 12.6186 9.69215Z", fill: "white" }),
893
- /* @__PURE__ */ jsx33("path", { d: "M9.24742 12.6281H12.3402V22H9.24742V12.6281Z", fill: "white" }),
894
- /* @__PURE__ */ jsx33("path", { d: "M17.3196 12.6281H14.2268V22H17.3196C17.3196 22 17.3196 19.0496 17.3196 17.2049C17.3196 16.0976 17.6977 14.9855 19.2062 14.9855C20.911 14.9855 20.9008 16.4345 20.8928 17.5571C20.8824 19.0244 20.9072 20.5219 20.9072 22H24V17.0537C23.9738 13.8954 23.1508 12.4401 20.4433 12.4401C18.8354 12.4401 17.8387 13.1701 17.3196 13.8305V12.6281Z", fill: "white" })
895
- ] });
919
+ var SvgLinkedin = (props) => {
920
+ var _a, _b;
921
+ return /* @__PURE__ */ jsxs19("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 32 32", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, ...props, children: [
922
+ /* @__PURE__ */ jsx33("rect", { x: 2, y: 2, fill: "#1275B1", rx: 14 }),
923
+ /* @__PURE__ */ jsx33("path", { fill: "#fff", d: "M12.619 9.692c0 .935-.81 1.692-1.81 1.692C9.81 11.384 9 10.627 9 9.692S9.81 8 10.81 8c.999 0 1.809.758 1.809 1.692M9.247 12.628h3.093V22H9.247zM17.32 12.628h-3.093V22h3.093v-4.795c0-1.107.378-2.22 1.886-2.22 1.705 0 1.695 1.45 1.687 2.572-.01 1.467.014 2.965.014 4.443H24v-4.946c-.026-3.159-.85-4.614-3.557-4.614-1.608 0-2.604.73-3.123 1.39z" })
924
+ ] });
925
+ };
896
926
  var linkedin_default = SvgLinkedin;
897
927
 
898
928
  // src/theme/default/provider-logos/microsoft.svg
899
929
  import * as React17 from "react";
900
930
  import { jsx as jsx34, jsxs as jsxs20 } from "react/jsx-runtime";
901
- var SvgMicrosoft = (props) => /* @__PURE__ */ jsxs20("svg", { width: 23, height: 23, viewBox: "0 0 23 23", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: [
902
- /* @__PURE__ */ jsx34("path", { d: "M1 1h10v10H1V1Z", fill: "#F35325" }),
903
- /* @__PURE__ */ jsx34("path", { d: "M12 1h10v10H12V1Z", fill: "#81BC06" }),
904
- /* @__PURE__ */ jsx34("path", { d: "M1 12h10v10H1V12Z", fill: "#05A6F0" }),
905
- /* @__PURE__ */ jsx34("path", { d: "M12 12h10v10H12V12Z", fill: "#FFBA08" })
906
- ] });
931
+ var SvgMicrosoft = (props) => {
932
+ var _a, _b;
933
+ return /* @__PURE__ */ jsxs20("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 23 23", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, ...props, children: [
934
+ /* @__PURE__ */ jsx34("path", { fill: "#F35325", d: "M1 1h10v10H1z" }),
935
+ /* @__PURE__ */ jsx34("path", { fill: "#81BC06", d: "M12 1h10v10H12z" }),
936
+ /* @__PURE__ */ jsx34("path", { fill: "#05A6F0", d: "M1 12h10v10H1z" }),
937
+ /* @__PURE__ */ jsx34("path", { fill: "#FFBA08", d: "M12 12h10v10H12z" })
938
+ ] });
939
+ };
907
940
  var microsoft_default = SvgMicrosoft;
908
941
 
909
942
  // src/theme/default/provider-logos/slack.svg
910
943
  import * as React18 from "react";
911
944
  import { jsx as jsx35, jsxs as jsxs21 } from "react/jsx-runtime";
912
- var SvgSlack = (props) => /* @__PURE__ */ jsxs21("svg", { width: 32, height: 32, viewBox: "0 0 32 32", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: [
913
- /* @__PURE__ */ jsx35("path", { d: "M26.5002 14.9998C27.8808 14.9998 29 13.8806 29 12.5C29 11.1194 27.8807 10.0002 26.5001 10.0002C25.1194 10.0002 24 11.1195 24 12.5002V14.9998H26.5002ZM19.5 14.9998C20.8807 14.9998 22 13.8805 22 12.4998V5.50018C22 4.11947 20.8807 3.00018 19.5 3.00018C18.1193 3.00018 17 4.11947 17 5.50018V12.4998C17 13.8805 18.1193 14.9998 19.5 14.9998Z", fill: "#2EB67D" }),
914
- /* @__PURE__ */ jsx35("path", { d: "M5.49979 17.0002C4.11919 17.0002 3 18.1194 3 19.5C3 20.8806 4.1193 21.9998 5.49989 21.9998C6.8806 21.9998 8 20.8805 8 19.4998V17.0002H5.49979ZM12.5 17.0002C11.1193 17.0002 10 18.1195 10 19.5002V26.4998C10 27.8805 11.1193 28.9998 12.5 28.9998C13.8807 28.9998 15 27.8805 15 26.4998V19.5002C15 18.1195 13.8807 17.0002 12.5 17.0002Z", fill: "#E01E5A" }),
915
- /* @__PURE__ */ jsx35("path", { d: "M17.0002 26.5002C17.0002 27.8808 18.1194 29 19.5 29C20.8806 29 21.9998 27.8807 21.9998 26.5001C21.9998 25.1194 20.8805 24 19.4998 24L17.0002 24L17.0002 26.5002ZM17.0002 19.5C17.0002 20.8807 18.1195 22 19.5002 22L26.4998 22C27.8805 22 28.9998 20.8807 28.9998 19.5C28.9998 18.1193 27.8805 17 26.4998 17L19.5002 17C18.1195 17 17.0002 18.1193 17.0002 19.5Z", fill: "#ECB22E" }),
916
- /* @__PURE__ */ jsx35("path", { d: "M14.9998 5.49979C14.9998 4.11919 13.8806 3 12.5 3C11.1194 3 10.0002 4.1193 10.0002 5.49989C10.0002 6.88061 11.1195 8 12.5002 8L14.9998 8L14.9998 5.49979ZM14.9998 12.5C14.9998 11.1193 13.8805 10 12.4998 10L5.50018 10C4.11947 10 3.00018 11.1193 3.00018 12.5C3.00018 13.8807 4.11947 15 5.50018 15L12.4998 15C13.8805 15 14.9998 13.8807 14.9998 12.5Z", fill: "#36C5F0" })
917
- ] });
945
+ var SvgSlack = (props) => {
946
+ var _a, _b;
947
+ return /* @__PURE__ */ jsxs21("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 32 32", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, ...props, children: [
948
+ /* @__PURE__ */ jsx35("path", { fill: "#2EB67D", d: "M26.5 15a2.5 2.5 0 1 0-2.5-2.5V15zm-7 0a2.5 2.5 0 0 0 2.5-2.5v-7a2.5 2.5 0 0 0-5 0v7a2.5 2.5 0 0 0 2.5 2.5" }),
949
+ /* @__PURE__ */ jsx35("path", { fill: "#E01E5A", d: "M5.5 17A2.5 2.5 0 1 0 8 19.5V17zm7 0a2.5 2.5 0 0 0-2.5 2.5v7a2.5 2.5 0 0 0 5 0v-7a2.5 2.5 0 0 0-2.5-2.5" }),
950
+ /* @__PURE__ */ jsx35("path", { fill: "#ECB22E", d: "M17 26.5a2.5 2.5 0 1 0 2.5-2.5H17zm0-7a2.5 2.5 0 0 0 2.5 2.5h7a2.5 2.5 0 0 0 0-5h-7a2.5 2.5 0 0 0-2.5 2.5" }),
951
+ /* @__PURE__ */ jsx35("path", { fill: "#36C5F0", d: "M15 5.5A2.5 2.5 0 1 0 12.5 8H15zm0 7a2.5 2.5 0 0 0-2.5-2.5h-7a2.5 2.5 0 0 0 0 5h7a2.5 2.5 0 0 0 2.5-2.5" })
952
+ ] });
953
+ };
918
954
  var slack_default = SvgSlack;
919
955
 
920
956
  // src/theme/default/provider-logos/spotify.svg
921
957
  import * as React19 from "react";
922
958
  import { jsx as jsx36, jsxs as jsxs22 } from "react/jsx-runtime";
923
- var SvgSpotify = (props) => /* @__PURE__ */ jsxs22("svg", { width: 32, height: 32, viewBox: "0 0 32 32", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: [
924
- /* @__PURE__ */ jsx36("circle", { cx: 16, cy: 16, r: 14, fill: "#1ED760" }),
925
- /* @__PURE__ */ jsx36("path", { d: "M22.3643 21.623C22.1252 22.0025 21.6149 22.1087 21.2163 21.881C18.075 20.0593 14.1364 19.6494 9.48023 20.6514C9.03375 20.7425 8.58728 20.4844 8.4916 20.0593C8.39593 19.6343 8.667 19.2092 9.11348 19.1181C14.2002 18.0099 18.5693 18.4805 22.0773 20.5299C22.476 20.7576 22.6035 21.2434 22.3643 21.623ZM23.9908 18.1617C23.6878 18.6323 23.05 18.769 22.5557 18.4957C18.9679 16.3856 13.4985 15.7783 9.25699 17.008C8.6989 17.1598 8.12485 16.8714 7.96539 16.3552C7.80594 15.8239 8.1089 15.2774 8.667 15.1256C13.5145 13.7289 19.542 14.3969 23.6719 16.8106C24.1343 17.0839 24.2938 17.6911 23.9908 18.1617ZM24.1343 14.5487C19.829 12.1197 12.7332 11.892 8.61917 13.0761C7.96539 13.2735 7.26378 12.9243 7.05649 12.2867C6.8492 11.6643 7.23189 10.9964 7.88567 10.799C12.6056 9.43274 20.4509 9.70599 25.394 12.4993C25.984 12.8332 26.1754 13.5619 25.8246 14.1236C25.4897 14.7005 24.7243 14.8978 24.1343 14.5487Z", fill: "white" })
926
- ] });
959
+ var SvgSpotify = (props) => {
960
+ var _a, _b;
961
+ return /* @__PURE__ */ jsxs22("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 32 32", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, ...props, children: [
962
+ /* @__PURE__ */ jsx36("circle", { cx: 16, cy: 16, r: 14, fill: "#1ED760" }),
963
+ /* @__PURE__ */ jsx36("path", { fill: "#fff", d: "M22.364 21.623c-.239.38-.75.486-1.148.258-3.141-1.822-7.08-2.232-11.736-1.23-.446.091-.893-.167-.988-.592a.786.786 0 0 1 .621-.94c5.087-1.11 9.456-.639 12.964 1.41a.77.77 0 0 1 .287 1.094m1.627-3.461c-.303.47-.941.607-1.435.334-3.588-2.11-9.058-2.718-13.299-1.488-.558.152-1.132-.137-1.292-.653-.16-.531.144-1.078.702-1.23 4.848-1.396 10.875-.728 15.005 1.686.462.273.622.88.319 1.35m.143-3.613c-4.305-2.43-11.4-2.657-15.515-1.473-.654.197-1.355-.152-1.563-.79-.207-.622.176-1.29.83-1.487 4.72-1.366 12.565-1.093 17.508 1.7.59.334.781 1.063.43 1.625-.334.576-1.1.774-1.69.425" })
964
+ ] });
965
+ };
927
966
  var spotify_default = SvgSpotify;
928
967
 
929
968
  // src/theme/default/provider-logos/yandex.svg
930
969
  import * as React20 from "react";
931
970
  import { jsx as jsx37, jsxs as jsxs23 } from "react/jsx-runtime";
932
- var SvgYandex = (props) => /* @__PURE__ */ jsxs23("svg", { width: 32, height: 32, viewBox: "0 0 32 32", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: [
933
- /* @__PURE__ */ jsx37("circle", { cx: 16, cy: 16, r: 14, fill: "white" }),
934
- /* @__PURE__ */ jsx37("path", { d: "M21 25H17.8571V9.43465H16.4546C13.8834 9.43465 12.5327 10.7291 12.5327 12.646C12.5327 14.8211 13.4677 15.8315 15.3895 17.1266L16.9739 18.1887L12.4026 25H9L13.1038 18.9137C10.7405 17.2299 9.41569 15.5984 9.41569 12.8274C9.41569 9.35654 11.8315 7 16.4287 7H21V25Z", fill: "#FC3F1D" })
935
- ] });
971
+ var SvgYandex = (props) => {
972
+ var _a, _b;
973
+ return /* @__PURE__ */ jsxs23("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 32 32", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, ...props, children: [
974
+ /* @__PURE__ */ jsx37("circle", { cx: 16, cy: 16, r: 14, fill: "#fff" }),
975
+ /* @__PURE__ */ jsx37("path", { fill: "#FC3F1D", d: "M21 25h-3.143V9.435h-1.402c-2.572 0-3.922 1.294-3.922 3.211 0 2.175.935 3.185 2.857 4.48l1.584 1.063L12.403 25H9l4.104-6.086c-2.363-1.684-3.688-3.316-3.688-6.087C9.416 9.357 11.83 7 16.429 7H21z" })
976
+ ] });
977
+ };
936
978
  var yandex_default = SvgYandex;
937
979
 
938
980
  // src/theme/default/provider-logos/index.ts
@@ -963,9 +1005,16 @@ function extractProvider(context) {
963
1005
  }
964
1006
  function DefaultButtonSocial({
965
1007
  attributes,
966
- node
1008
+ node,
1009
+ onClick
967
1010
  }) {
968
1011
  var _a, _b, _c, _d;
1012
+ const {
1013
+ node_type: _ignoredNodeType,
1014
+ type: _ignoredType,
1015
+ name: _ignoredName,
1016
+ ...props
1017
+ } = attributes;
969
1018
  const {
970
1019
  flow: { ui }
971
1020
  } = useOryFlow5();
@@ -983,12 +1032,13 @@ function DefaultButtonSocial({
983
1032
  value: attributes.value,
984
1033
  type: "submit",
985
1034
  name: "provider",
1035
+ ...props,
1036
+ onClick,
986
1037
  children: [
987
1038
  /* @__PURE__ */ jsx38("span", { className: "w-5 h-5", children: Logo ? /* @__PURE__ */ jsx38(
988
1039
  Logo,
989
1040
  {
990
- width: 20,
991
- height: 20,
1041
+ size: 20,
992
1042
  className: "object-fill w-full h-full"
993
1043
  }
994
1044
  ) : /* @__PURE__ */ jsx38("span", { className: "rounded-full aspect-square border flex items-center justify-center text-xs", children: provider.slice(0, 2) }) }),
@@ -1016,28 +1066,50 @@ function DefaultSocialButtonContainer({
1016
1066
  }
1017
1067
 
1018
1068
  // src/theme/default/components/form/text.tsx
1019
- import { useIntl as useIntl6 } from "react-intl";
1069
+ import { useIntl as useIntl7 } from "react-intl";
1020
1070
  import { formatMessage as formatMessage5 } from "@ory/elements-react";
1021
1071
  import { Fragment, jsx as jsx39, jsxs as jsxs25 } from "react/jsx-runtime";
1022
1072
  function DefaultText({ node, attributes }) {
1023
1073
  var _a;
1024
- const intl = useIntl6();
1074
+ const intl = useIntl7();
1025
1075
  return /* @__PURE__ */ jsxs25(Fragment, { children: [
1026
1076
  /* @__PURE__ */ jsx39("p", { "data-testid": `node/text/${attributes.id}/label`, children: formatMessage5(node.meta.label, intl) }),
1027
1077
  (_a = attributes.text.context.secrets) == null ? void 0 : _a.map((text, index) => /* @__PURE__ */ jsx39("pre", { "data-testid": `node/text/lookup_secret_codes/text`, children: /* @__PURE__ */ jsx39("code", { children: formatMessage5(text, intl) }) }, index))
1028
1078
  ] });
1029
1079
  }
1030
1080
 
1081
+ // src/theme/default/assets/icons/arrow-left.svg
1082
+ import * as React21 from "react";
1083
+ import { jsx as jsx40 } from "react/jsx-runtime";
1084
+ var SvgArrowLeft = (props) => {
1085
+ var _a, _b;
1086
+ return /* @__PURE__ */ jsx40("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 25", width: (props == null ? void 0 : props.width) ? props.width : (_a = props == null ? void 0 : props.size) != null ? _a : 20, height: (props == null ? void 0 : props.height) ? props.height : (_b = props == null ? void 0 : props.size) != null ? _b : 20, ...props, children: /* @__PURE__ */ jsx40("path", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", d: "M5 12.325h14m-14 0 6 6m-6-6 6-6" }) });
1087
+ };
1088
+ var arrow_left_default = SvgArrowLeft;
1089
+
1031
1090
  // src/theme/default/components/card/current-identifier-button.tsx
1032
- import { jsx as jsx40, jsxs as jsxs26 } from "react/jsx-runtime";
1091
+ import { jsx as jsx41, jsxs as jsxs26 } from "react/jsx-runtime";
1033
1092
  function DefaultCurrentIdentifierButton({
1034
1093
  attributes,
1035
- node
1094
+ onClick,
1095
+ type,
1096
+ href
1036
1097
  }) {
1037
- return /* @__PURE__ */ jsxs26("div", { children: [
1038
- /* @__PURE__ */ jsx40("span", { className: "py-1 px-3 rounded-full border border-button-identifier-border-default bg-button-identifier-bg-default", children: /* @__PURE__ */ jsx40("span", { className: "text-sm font-medium leading-none", children: attributes.value }) }),
1039
- /* @__PURE__ */ jsx40(DefaultInput, { attributes, node })
1040
- ] });
1098
+ const Element = onClick ? "button" : "a";
1099
+ return /* @__PURE__ */ jsx41("div", { children: /* @__PURE__ */ jsxs26(
1100
+ Element,
1101
+ {
1102
+ className: "cursor-pointer py-1.5 px-3 rounded-full border border-button-identifier-border-default bg-button-identifier-bg-default hover:border-button-identifier-border-hover hover:bg-button-identifier-bg-hover transition-colors inline-flex gap-1 items-center",
1103
+ onClick,
1104
+ ...attributes,
1105
+ href,
1106
+ type,
1107
+ children: [
1108
+ /* @__PURE__ */ jsx41(arrow_left_default, { size: 16, className: "text-button-identifier-fg-subtle" }),
1109
+ /* @__PURE__ */ jsx41("span", { className: "text-sm font-medium leading-none text-button-identifier-fg-default", children: attributes.value })
1110
+ ]
1111
+ }
1112
+ ) });
1041
1113
  }
1042
1114
 
1043
1115
  // src/theme/default/components/default-components.tsx
@@ -1069,21 +1141,21 @@ var OryDefaultComponents = {
1069
1141
  };
1070
1142
 
1071
1143
  // src/theme/default/flows/error.tsx
1072
- import { jsx as jsx41 } from "react/jsx-runtime";
1144
+ import { jsx as jsx42 } from "react/jsx-runtime";
1073
1145
  function Error({
1074
1146
  error,
1075
1147
  children
1076
1148
  }) {
1077
- return /* @__PURE__ */ jsx41("div", { children: JSON.stringify(error) || children });
1149
+ return /* @__PURE__ */ jsx42("div", { children: JSON.stringify(error) || children });
1078
1150
  }
1079
1151
 
1080
1152
  // src/theme/default/flows/login.tsx
1081
1153
  import { FlowType as FlowType4 } from "@ory/client-fetch";
1082
1154
  import {
1083
- OryCard,
1084
- OryProvider
1155
+ OryProvider,
1156
+ OryTwoStepCard
1085
1157
  } from "@ory/elements-react";
1086
- import { jsx as jsx42 } from "react/jsx-runtime";
1158
+ import { jsx as jsx43 } from "react/jsx-runtime";
1087
1159
  function Login({
1088
1160
  flow,
1089
1161
  config,
@@ -1094,14 +1166,14 @@ function Login({
1094
1166
  ...OryDefaultComponents,
1095
1167
  ...flowOverrideComponents
1096
1168
  };
1097
- return /* @__PURE__ */ jsx42(
1169
+ return /* @__PURE__ */ jsx43(
1098
1170
  OryProvider,
1099
1171
  {
1100
1172
  config,
1101
1173
  flow,
1102
1174
  flowType: FlowType4.Login,
1103
1175
  components,
1104
- children: children != null ? children : /* @__PURE__ */ jsx42(OryCard, {})
1176
+ children: children != null ? children : /* @__PURE__ */ jsx43(OryTwoStepCard, {})
1105
1177
  }
1106
1178
  );
1107
1179
  }
@@ -1109,10 +1181,10 @@ function Login({
1109
1181
  // src/theme/default/flows/recovery.tsx
1110
1182
  import { FlowType as FlowType5 } from "@ory/client-fetch";
1111
1183
  import {
1112
- OryCard as OryCard2,
1113
- OryProvider as OryProvider2
1184
+ OryProvider as OryProvider2,
1185
+ OryTwoStepCard as OryTwoStepCard2
1114
1186
  } from "@ory/elements-react";
1115
- import { jsx as jsx43 } from "react/jsx-runtime";
1187
+ import { jsx as jsx44 } from "react/jsx-runtime";
1116
1188
  function Recovery({
1117
1189
  flow,
1118
1190
  config,
@@ -1123,14 +1195,14 @@ function Recovery({
1123
1195
  ...OryDefaultComponents,
1124
1196
  ...flowOverrideComponents
1125
1197
  };
1126
- return /* @__PURE__ */ jsx43(
1198
+ return /* @__PURE__ */ jsx44(
1127
1199
  OryProvider2,
1128
1200
  {
1129
1201
  config,
1130
1202
  flow,
1131
1203
  flowType: FlowType5.Recovery,
1132
1204
  components,
1133
- children: children != null ? children : /* @__PURE__ */ jsx43(OryCard2, {})
1205
+ children: children != null ? children : /* @__PURE__ */ jsx44(OryTwoStepCard2, {})
1134
1206
  }
1135
1207
  );
1136
1208
  }
@@ -1138,10 +1210,10 @@ function Recovery({
1138
1210
  // src/theme/default/flows/registration.tsx
1139
1211
  import { FlowType as FlowType6 } from "@ory/client-fetch";
1140
1212
  import {
1141
- OryCard as OryCard3,
1142
- OryProvider as OryProvider3
1213
+ OryProvider as OryProvider3,
1214
+ OryTwoStepCard as OryTwoStepCard3
1143
1215
  } from "@ory/elements-react";
1144
- import { jsx as jsx44 } from "react/jsx-runtime";
1216
+ import { jsx as jsx45 } from "react/jsx-runtime";
1145
1217
  function Registration({
1146
1218
  flow,
1147
1219
  children,
@@ -1152,14 +1224,14 @@ function Registration({
1152
1224
  ...OryDefaultComponents,
1153
1225
  ...flowOverrideComponents
1154
1226
  };
1155
- return /* @__PURE__ */ jsx44(
1227
+ return /* @__PURE__ */ jsx45(
1156
1228
  OryProvider3,
1157
1229
  {
1158
1230
  config,
1159
1231
  flow,
1160
1232
  flowType: FlowType6.Registration,
1161
1233
  components,
1162
- children: children != null ? children : /* @__PURE__ */ jsx44(OryCard3, {})
1234
+ children: children != null ? children : /* @__PURE__ */ jsx45(OryTwoStepCard3, {})
1163
1235
  }
1164
1236
  );
1165
1237
  }
@@ -1168,9 +1240,9 @@ function Registration({
1168
1240
  import { FlowType as FlowType7 } from "@ory/client-fetch";
1169
1241
  import {
1170
1242
  OryProvider as OryProvider4,
1171
- OryCard as OryCard4
1243
+ OryTwoStepCard as OryTwoStepCard4
1172
1244
  } from "@ory/elements-react";
1173
- import { jsx as jsx45 } from "react/jsx-runtime";
1245
+ import { jsx as jsx46 } from "react/jsx-runtime";
1174
1246
  function Settings({
1175
1247
  flow,
1176
1248
  config,
@@ -1181,14 +1253,14 @@ function Settings({
1181
1253
  ...OryDefaultComponents,
1182
1254
  ...flowOverrideComponents
1183
1255
  };
1184
- return /* @__PURE__ */ jsx45(
1256
+ return /* @__PURE__ */ jsx46(
1185
1257
  OryProvider4,
1186
1258
  {
1187
1259
  config,
1188
1260
  flow,
1189
1261
  flowType: FlowType7.Settings,
1190
1262
  components,
1191
- children: children != null ? children : /* @__PURE__ */ jsx45(OryCard4, {})
1263
+ children: children != null ? children : /* @__PURE__ */ jsx46(OryTwoStepCard4, {})
1192
1264
  }
1193
1265
  );
1194
1266
  }
@@ -1196,10 +1268,10 @@ function Settings({
1196
1268
  // src/theme/default/flows/verification.tsx
1197
1269
  import { FlowType as FlowType8 } from "@ory/client-fetch";
1198
1270
  import {
1199
- OryCard as OryCard5,
1200
- OryProvider as OryProvider5
1271
+ OryProvider as OryProvider5,
1272
+ OryTwoStepCard as OryTwoStepCard5
1201
1273
  } from "@ory/elements-react";
1202
- import { jsx as jsx46 } from "react/jsx-runtime";
1274
+ import { jsx as jsx47 } from "react/jsx-runtime";
1203
1275
  function Verification({
1204
1276
  flow,
1205
1277
  config,
@@ -1210,14 +1282,14 @@ function Verification({
1210
1282
  ...OryDefaultComponents,
1211
1283
  ...flowOverrideComponents
1212
1284
  };
1213
- return /* @__PURE__ */ jsx46(
1285
+ return /* @__PURE__ */ jsx47(
1214
1286
  OryProvider5,
1215
1287
  {
1216
1288
  config,
1217
1289
  flow,
1218
1290
  flowType: FlowType8.Verification,
1219
1291
  components,
1220
- children: children != null ? children : /* @__PURE__ */ jsx46(OryCard5, {})
1292
+ children: children != null ? children : /* @__PURE__ */ jsx47(OryTwoStepCard5, {})
1221
1293
  }
1222
1294
  );
1223
1295
  }