@ory/elements-react 1.0.0-next.37 → 1.0.0-next.39

package/dist/theme/default/index.js

@@ -217,7 +217,7 @@ function LoginCardFooter() {
     return null;
   }
   return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_jsx_runtime5.Fragment, { children: [
-    formState.current === "provide_identifier" && /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("span", { className: "font-normal leading-normal antialiased text-interface-foreground-default-primary", children: [
+    formState.current === "provide_identifier" && config.project.registration_enabled && /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("span", { className: "font-normal leading-normal antialiased text-interface-foreground-default-primary", children: [
       intl.formatMessage({
         id: "login.registration-label",
         defaultMessage: "No account?"
@@ -228,7 +228,7 @@ function LoginCardFooter() {
         {
           className: "text-button-link-brand-brand transition-colors hover:text-button-link-brand-brand-hover underline",
           href: initFlowUrl(config.sdk.url, "registration", flow),
-          "data-testid": "ory/screen/registration/action/login",
+          "data-testid": "ory/screen/login/action/register",
           children: intl.formatMessage({
             id: "login.registration-button",
             defaultMessage: "Sign up"
@@ -458,7 +458,7 @@ function useCardHeaderText(container, opts) {
         );
     }
   }
-  if (nodes.find((node) => node.group === "oidc")) {
+  if (nodes.find((node) => node.group === "oidc" || node.group === "saml")) {
     parts.push(
       intl.formatMessage({
         id: "card.header.parts.oidc"
@@ -711,7 +711,7 @@ function cn(...inputs) {
 // src/theme/default/components/form/index.tsx
 var import_react_intl4 = require("react-intl");
 var import_elements_react6 = require("@ory/elements-react");
-var import_client_fetch6 = require("@ory/client-fetch");
+var import_client_fetch7 = require("@ory/client-fetch");
 
 // src/theme/default/components/form/social.tsx
 var import_elements_react5 = require("@ory/elements-react");
@@ -948,6 +948,7 @@ function Spinner({ className }) {
 }
 
 // src/theme/default/components/form/social.tsx
+var import_client_fetch6 = require("@ory/client-fetch");
 var import_jsx_runtime27 = require("react/jsx-runtime");
 function extractProvider(context) {
   if (context && typeof context === "object" && "provider" in context && typeof context.provider === "string") {
@@ -978,7 +979,9 @@ function DefaultButtonSocial({
   const {
     formState: { isSubmitting }
   } = (0, import_react_hook_form2.useFormContext)();
-  const oidcNodeCount = (_a = ui.nodes.filter((node2) => node2.group === "oidc").length) != null ? _a : 0;
+  const oidcNodeCount = (_a = ui.nodes.filter(
+    (node2) => node2.group === import_client_fetch6.UiNodeGroupEnum.Oidc || node2.group === import_client_fetch6.UiNodeGroupEnum.Saml
+  ).length) != null ? _a : 0;
   const Logo = logos2[attributes.value.split("-")[0]];
   const showLabel = _showLabel != null ? _showLabel : oidcNodeCount % 3 !== 0 && oidcNodeCount % 4 !== 0;
   const provider = (_c = extractProvider((_b = node.meta.label) == null ? void 0 : _b.context)) != null ? _c : "";
@@ -1061,7 +1064,7 @@ function DefaultMessageContainer({ children }) {
     "section",
     {
       className: cn(
-        flowType === import_client_fetch6.FlowType.Settings ? "text-center" : "text-left"
+        flowType === import_client_fetch7.FlowType.Settings ? "text-center" : "text-left"
       ),
       children
     }
@@ -1193,7 +1196,7 @@ function DefaultAuthMethodListItem({
 }
 
 // src/theme/default/components/form/button.tsx
-var import_client_fetch7 = require("@ory/client-fetch");
+var import_client_fetch8 = require("@ory/client-fetch");
 var import_elements_react7 = require("@ory/elements-react");
 var import_class_variance_authority = require("class-variance-authority");
 var import_react_hook_form3 = require("react-hook-form");
@@ -1252,7 +1255,7 @@ var DefaultButton = ({
   } = attributes;
   const [clicked, setClicked] = (0, import_react4.useState)(false);
   const intl = (0, import_react_intl6.useIntl)();
-  const label = (0, import_client_fetch7.getNodeLabel)(node);
+  const label = (0, import_client_fetch8.getNodeLabel)(node);
   const {
     formState: { isSubmitting },
     setValue
@@ -1292,7 +1295,7 @@ var DefaultButton = ({
 DefaultButton.displayName = "DefaultButton";
 
 // src/theme/default/components/form/checkbox.tsx
-var import_client_fetch8 = require("@ory/client-fetch");
+var import_client_fetch9 = require("@ory/client-fetch");
 var import_elements_react8 = require("@ory/elements-react");
 var import_react_hook_form4 = require("react-hook-form");
 var import_react_intl8 = require("react-intl");
@@ -1439,7 +1442,7 @@ var DefaultCheckbox = ({
     ...attributes
   } = initialAttributes;
   const intl = (0, import_react_intl8.useIntl)();
-  const label = (0, import_client_fetch8.getNodeLabel)(node);
+  const label = (0, import_client_fetch9.getNodeLabel)(node);
   const { register } = (0, import_react_hook_form4.useForm)();
   const hasError = node.messages.some((m) => m.type === "error");
   return /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("label", { className: "flex items-start gap-3 self-stretch antialiased", children: [
@@ -1497,7 +1500,7 @@ function DefaultImage({ attributes }) {
 }
 
 // src/theme/default/components/form/input.tsx
-var import_client_fetch9 = require("@ory/client-fetch");
+var import_client_fetch10 = require("@ory/client-fetch");
 var import_elements_react9 = require("@ory/elements-react");
 var import_react5 = require("react");
 var import_react_hook_form5 = require("react-hook-form");
@@ -1531,7 +1534,7 @@ var DefaultInput = ({
   attributes,
   onClick
 }) => {
-  const label = (0, import_client_fetch9.getNodeLabel)(node);
+  const label = (0, import_client_fetch10.getNodeLabel)(node);
   const { register } = (0, import_react_hook_form5.useFormContext)();
   const {
     value,
@@ -1574,7 +1577,7 @@ var DefaultInput = ({
       className: cn(
         "relative flex justify-stretch",
         // The settings flow input fields are supposed to be dense, so we don't need the extra padding we want on the user flows.
-        flowType === import_client_fetch9.FlowType.Settings && "max-w-[488px]"
+        flowType === import_client_fetch10.FlowType.Settings && "max-w-[488px]"
       ),
       children: [
         /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
@@ -1628,7 +1631,7 @@ function PasswordToggle({
 }
 
 // src/theme/default/components/form/label.tsx
-var import_client_fetch10 = require("@ory/client-fetch");
+var import_client_fetch11 = require("@ory/client-fetch");
 var import_elements_react10 = require("@ory/elements-react");
 var import_react_hook_form6 = require("react-hook-form");
 var import_react_intl10 = require("react-intl");
@@ -1645,7 +1648,7 @@ function DefaultLabel({
   ...rest
 }) {
   const intl = (0, import_react_intl10.useIntl)();
-  const label = (0, import_client_fetch10.getNodeLabel)(node);
+  const label = (0, import_client_fetch11.getNodeLabel)(node);
   const { Message } = (0, import_elements_react10.useComponents)();
   const { config, flowType, flow } = (0, import_elements_react10.useOryFlow)();
   const { setValue, formState } = (0, import_react_hook_form6.useFormContext)();
@@ -1670,7 +1673,7 @@ function DefaultLabel({
           children: (0, import_elements_react10.uiTextToFormattedMessage)(label, intl)
         }
       ),
-      isPassword && config.project.recovery_enabled && flowType === import_client_fetch10.FlowType.Login && // TODO: make it possible to override with a custom component
+      isPassword && config.project.recovery_enabled && flowType === import_client_fetch11.FlowType.Login && // TODO: make it possible to override with a custom component
       /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
         "a",
         {
@@ -1696,19 +1699,19 @@ function DefaultLabel({
     ] }),
     children,
     node.messages.map((message) => /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(Message.Content, { message }, message.id)),
-    fieldError && (0, import_client_fetch10.instanceOfUiText)(fieldError) && /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(Message.Content, { message: fieldError })
+    fieldError && (0, import_client_fetch11.instanceOfUiText)(fieldError) && /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(Message.Content, { message: fieldError })
   ] });
 }
 
 // src/theme/default/components/form/link-button.tsx
-var import_client_fetch11 = require("@ory/client-fetch");
+var import_client_fetch12 = require("@ory/client-fetch");
 var import_elements_react11 = require("@ory/elements-react");
 var import_react6 = require("react");
 var import_react_intl11 = require("react-intl");
 var import_jsx_runtime46 = require("react/jsx-runtime");
 var DefaultLinkButton = (0, import_react6.forwardRef)(({ attributes, node }, ref) => {
   const intl = (0, import_react_intl11.useIntl)();
-  const label = (0, import_client_fetch11.getNodeLabel)(node);
+  const label = (0, import_client_fetch12.getNodeLabel)(node);
   return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
     "a",
     {
@@ -1772,7 +1775,7 @@ InputOTPSlot.displayName = "InputOTPSlot";
 
 // src/theme/default/components/form/pin-code-input.tsx
 var import_elements_react12 = require("@ory/elements-react");
-var import_client_fetch12 = require("@ory/client-fetch");
+var import_client_fetch13 = require("@ory/client-fetch");
 var import_jsx_runtime48 = require("react/jsx-runtime");
 var DefaultPinCodeInput = ({ attributes }) => {
   const { setValue, watch } = (0, import_react_hook_form7.useFormContext)();
@@ -1796,7 +1799,7 @@ var DefaultPinCodeInput = ({ attributes }) => {
           className: cn(
             "w-full flex gap-2 justify-stretch",
             // The settings flow input fields are supposed to be dense, so we don't need the extra padding we want on the user flows.
-            flowType === import_client_fetch12.FlowType.Settings && "max-w-[488px]"
+            flowType === import_client_fetch13.FlowType.Settings && "max-w-[488px]"
           ),
           children: [...Array(elements)].map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(InputOTPSlot, { index }, index))
         }
@@ -1918,9 +1921,9 @@ var settings_default = SvgSettings;
 var import_react7 = require("react");
 
 // src/util/client.ts
-var import_client_fetch13 = require("@ory/client-fetch");
+var import_client_fetch14 = require("@ory/client-fetch");
 function frontendClient(sdkUrl, opts = {}) {
-  const config = new import_client_fetch13.Configuration({
+  const config = new import_client_fetch14.Configuration({
     ...opts,
     basePath: sdkUrl,
     headers: {
@@ -1928,7 +1931,7 @@ function frontendClient(sdkUrl, opts = {}) {
       ...opts.headers
     }
   });
-  return new import_client_fetch13.FrontendApi(config);
+  return new import_client_fetch14.FrontendApi(config);
 }
 
 // src/theme/default/utils/logout.ts
@@ -2624,7 +2627,7 @@ function DefaultAuthMethodListContainer({
 }
 
 // src/theme/default/components/form/captcha.tsx
-var import_client_fetch14 = require("@ory/client-fetch");
+var import_client_fetch15 = require("@ory/client-fetch");
 var import_react_turnstile = require("@marsidev/react-turnstile");
 var import_react11 = require("react");
 var import_react_hook_form13 = require("react-hook-form");
@@ -2633,14 +2636,14 @@ var DefaultCaptcha = ({ node }) => {
   const { setValue } = (0, import_react_hook_form13.useFormContext)();
   const ref = (0, import_react11.useRef)();
   const nodes = [];
-  if ((0, import_client_fetch14.isUiNodeInputAttributes)(node.attributes)) {
+  if ((0, import_client_fetch15.isUiNodeInputAttributes)(node.attributes)) {
     if (node.attributes.name === "transient_payload.captcha_turnstile_response") {
       nodes.push(
         /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(DefaultInput, { node, attributes: node.attributes }, 1)
       );
     }
   }
-  if ((0, import_client_fetch14.isUiNodeInputAttributes)(node.attributes) && node.attributes.name === "captcha_turnstile_options") {
+  if ((0, import_client_fetch15.isUiNodeInputAttributes)(node.attributes) && node.attributes.name === "captcha_turnstile_options") {
     const options = JSON.parse(node.attributes.value);
     nodes.push(
       /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
@@ -2720,7 +2723,7 @@ function getOryComponents(overrides) {
 }
 
 // src/theme/default/flows/error.tsx
-var import_client_fetch31 = require("@ory/client-fetch");
+var import_client_fetch34 = require("@ory/client-fetch");
 var import_react15 = require("react");
 
 // src/context/intl-context.tsx
@@ -2730,11 +2733,11 @@ var import_react_intl20 = require("react-intl");
 var import_react13 = require("react");
 
 // src/context/form-state.ts
-var import_client_fetch16 = require("@ory/client-fetch");
+var import_client_fetch17 = require("@ory/client-fetch");
 var import_react12 = require("react");
 
 // src/components/card/card-two-step.utils.ts
-var import_client_fetch15 = require("@ory/client-fetch");
+var import_client_fetch16 = require("@ory/client-fetch");
 
 // src/context/flow-context.tsx
 var import_jsx_runtime70 = require("react/jsx-runtime");
@@ -2747,14 +2750,14 @@ var import_jsx_runtime71 = require("react/jsx-runtime");
 var import_jsx_runtime72 = require("react/jsx-runtime");
 
 // src/components/form/form-provider.tsx
-var import_client_fetch19 = require("@ory/client-fetch");
+var import_client_fetch20 = require("@ory/client-fetch");
 var import_react_hook_form14 = require("react-hook-form");
 
 // src/components/form/form-helpers.ts
-var import_client_fetch17 = require("@ory/client-fetch");
+var import_client_fetch18 = require("@ory/client-fetch");
 
 // src/components/form/form-resolver.ts
-var import_client_fetch18 = require("@ory/client-fetch");
+var import_client_fetch19 = require("@ory/client-fetch");
 
 // src/components/form/form-provider.tsx
 var import_jsx_runtime73 = require("react/jsx-runtime");
@@ -2769,32 +2772,32 @@ var import_jsx_runtime75 = require("react/jsx-runtime");
 var import_jsx_runtime76 = require("react/jsx-runtime");
 
 // src/components/card/card-two-step.tsx
-var import_client_fetch29 = require("@ory/client-fetch");
+var import_client_fetch31 = require("@ory/client-fetch");
 var import_react_hook_form19 = require("react-hook-form");
 
 // src/components/form/form.tsx
-var import_client_fetch26 = require("@ory/client-fetch");
+var import_client_fetch27 = require("@ory/client-fetch");
 var import_react_hook_form16 = require("react-hook-form");
 var import_react_intl13 = require("react-intl");
 
 // src/components/form/useOryFormSubmit.ts
-var import_client_fetch25 = require("@ory/client-fetch");
+var import_client_fetch26 = require("@ory/client-fetch");
 var import_react_hook_form15 = require("react-hook-form");
 
 // src/util/onSubmitLogin.ts
-var import_client_fetch20 = require("@ory/client-fetch");
+var import_client_fetch21 = require("@ory/client-fetch");
 
 // src/util/onSubmitRecovery.ts
-var import_client_fetch21 = require("@ory/client-fetch");
+var import_client_fetch22 = require("@ory/client-fetch");
 
 // src/util/onSubmitRegistration.ts
-var import_client_fetch22 = require("@ory/client-fetch");
+var import_client_fetch23 = require("@ory/client-fetch");
 
 // src/util/onSubmitSettings.ts
-var import_client_fetch23 = require("@ory/client-fetch");
+var import_client_fetch24 = require("@ory/client-fetch");
 
 // src/util/onSubmitVerification.ts
-var import_client_fetch24 = require("@ory/client-fetch");
+var import_client_fetch25 = require("@ory/client-fetch");
 
 // src/components/form/form.tsx
 var import_jsx_runtime77 = require("react/jsx-runtime");
@@ -2803,16 +2806,17 @@ var import_jsx_runtime77 = require("react/jsx-runtime");
 var import_jsx_runtime78 = require("react/jsx-runtime");
 
 // src/components/form/nodes/input.tsx
-var import_client_fetch27 = require("@ory/client-fetch");
+var import_client_fetch28 = require("@ory/client-fetch");
 var import_react14 = require("react");
 var import_react_hook_form17 = require("react-hook-form");
 var import_jsx_runtime79 = require("react/jsx-runtime");
 
 // src/components/form/nodes/node.tsx
-var import_client_fetch28 = require("@ory/client-fetch");
+var import_client_fetch29 = require("@ory/client-fetch");
 var import_jsx_runtime80 = require("react/jsx-runtime");
 
 // src/components/form/social.tsx
+var import_client_fetch30 = require("@ory/client-fetch");
 var import_react_hook_form18 = require("react-hook-form");
 var import_jsx_runtime81 = require("react/jsx-runtime");
 
@@ -2827,13 +2831,14 @@ var import_react_hook_form20 = require("react-hook-form");
 var import_jsx_runtime84 = require("react/jsx-runtime");
 
 // src/components/generic/divider.tsx
+var import_client_fetch32 = require("@ory/client-fetch");
 var import_jsx_runtime85 = require("react/jsx-runtime");
 
 // src/components/generic/page-header.tsx
 var import_jsx_runtime86 = require("react/jsx-runtime");
 
 // src/components/settings/settings-card.tsx
-var import_client_fetch30 = require("@ory/client-fetch");
+var import_client_fetch33 = require("@ory/client-fetch");
 var import_react_intl19 = require("react-intl");
 
 // src/components/settings/oidc-settings.tsx
@@ -5094,14 +5099,14 @@ function useStandardize(error) {
         timestamp: /* @__PURE__ */ new Date()
       };
     }
-    if ((0, import_client_fetch31.instanceOfFlowError)(error)) {
+    if ((0, import_client_fetch34.instanceOfFlowError)(error)) {
       const parsed = error.error;
       return {
         ...parsed,
         id: error.id,
         timestamp: error.created_at
       };
-    } else if (error.error && (0, import_client_fetch31.instanceOfGenericError)(error.error)) {
+    } else if (error.error && (0, import_client_fetch34.instanceOfGenericError)(error.error)) {
       return {
         code: (_a = error.error.code) != null ? _a : 500,
         message: error.error.message,
@@ -5222,7 +5227,7 @@ function ErrorLogo({ config }) {
 }
 
 // src/theme/default/flows/login.tsx
-var import_client_fetch32 = require("@ory/client-fetch");
+var import_client_fetch35 = require("@ory/client-fetch");
 var import_elements_react19 = require("@ory/elements-react");
 var import_jsx_runtime95 = require("react/jsx-runtime");
 function Login({
@@ -5237,7 +5242,7 @@ function Login({
     {
       config,
       flow,
-      flowType: import_client_fetch32.FlowType.Login,
+      flowType: import_client_fetch35.FlowType.Login,
       components,
       children: children != null ? children : /* @__PURE__ */ (0, import_jsx_runtime95.jsx)(import_elements_react19.OryTwoStepCard, {})
     }
@@ -5245,7 +5250,7 @@ function Login({
 }
 
 // src/theme/default/flows/recovery.tsx
-var import_client_fetch33 = require("@ory/client-fetch");
+var import_client_fetch36 = require("@ory/client-fetch");
 var import_elements_react20 = require("@ory/elements-react");
 var import_jsx_runtime96 = require("react/jsx-runtime");
 function Recovery({
@@ -5260,7 +5265,7 @@ function Recovery({
     {
       config,
       flow,
-      flowType: import_client_fetch33.FlowType.Recovery,
+      flowType: import_client_fetch36.FlowType.Recovery,
       components,
       children: children != null ? children : /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(import_elements_react20.OryTwoStepCard, {})
     }
@@ -5268,7 +5273,7 @@ function Recovery({
 }
 
 // src/theme/default/flows/registration.tsx
-var import_client_fetch34 = require("@ory/client-fetch");
+var import_client_fetch37 = require("@ory/client-fetch");
 var import_elements_react21 = require("@ory/elements-react");
 var import_jsx_runtime97 = require("react/jsx-runtime");
 function Registration({
@@ -5283,7 +5288,7 @@ function Registration({
     {
       config,
       flow,
-      flowType: import_client_fetch34.FlowType.Registration,
+      flowType: import_client_fetch37.FlowType.Registration,
       components,
       children: children != null ? children : /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(import_elements_react21.OryTwoStepCard, {})
     }
@@ -5291,7 +5296,7 @@ function Registration({
 }
 
 // src/theme/default/flows/settings.tsx
-var import_client_fetch35 = require("@ory/client-fetch");
+var import_client_fetch38 = require("@ory/client-fetch");
 var import_elements_react22 = require("@ory/elements-react");
 var import_jsx_runtime98 = require("react/jsx-runtime");
 function Settings({
@@ -5306,7 +5311,7 @@ function Settings({
     {
       config,
       flow,
-      flowType: import_client_fetch35.FlowType.Settings,
+      flowType: import_client_fetch38.FlowType.Settings,
       components,
       children: children != null ? children : /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)(import_jsx_runtime98.Fragment, { children: [
         /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(import_elements_react22.HeadlessPageHeader, {}),
@@ -5317,7 +5322,7 @@ function Settings({
 }
 
 // src/theme/default/flows/verification.tsx
-var import_client_fetch36 = require("@ory/client-fetch");
+var import_client_fetch39 = require("@ory/client-fetch");
 var import_elements_react23 = require("@ory/elements-react");
 var import_jsx_runtime99 = require("react/jsx-runtime");
 function Verification({
@@ -5332,7 +5337,7 @@ function Verification({
     {
       config,
       flow,
-      flowType: import_client_fetch36.FlowType.Verification,
+      flowType: import_client_fetch39.FlowType.Verification,
       components,
       children: children != null ? children : /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(import_elements_react23.OryTwoStepCard, {})
     }