@asgardeo/react 0.6.1 → 0.6.3

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.
Files changed (11) hide show
  1. package/dist/cjs/index.js +831 -956
  2. package/dist/cjs/index.js.map +4 -4
  3. package/dist/components/presentation/SignIn/component-driven/BaseSignIn.d.ts +12 -4
  4. package/dist/components/presentation/SignIn/component-driven/SignInOptionFactory.d.ts +0 -1
  5. package/dist/components/presentation/SignIn/non-component-driven/BaseSignIn.d.ts +12 -0
  6. package/dist/components/presentation/SignUp/BaseSignUp.d.ts +12 -0
  7. package/dist/components/presentation/SignUp/BaseSignUp.styles.d.ts +0 -1
  8. package/dist/index.js +656 -781
  9. package/dist/index.js.map +4 -4
  10. package/package.json +3 -3
  11. package/dist/components/presentation/SignIn/non-component-driven/BaseSignIn.styles.d.ts +0 -52
package/dist/index.js CHANGED
@@ -5539,7 +5539,8 @@ var useStyles13 = (theme, colorScheme, variant, clickable) => {
5539
5539
  }
5540
5540
  `;
5541
5541
  const headerStyles = css13`
5542
- padding: calc(${theme.vars.spacing.unit} * 2) calc(${theme.vars.spacing.unit} * 2) 0;
5542
+ padding: 0 calc(${theme.vars.spacing.unit} * 2);
5543
+ margin-top: calc(${theme.vars.spacing.unit} * 2);
5543
5544
  display: flex;
5544
5545
  flex-direction: column;
5545
5546
  gap: ${theme.vars.spacing.unit};
@@ -5558,7 +5559,8 @@ var useStyles13 = (theme, colorScheme, variant, clickable) => {
5558
5559
  margin-top: ${theme.vars.spacing.unit};
5559
5560
  `;
5560
5561
  const contentStyles = css13`
5561
- padding: calc(${theme.vars.spacing.unit} * 2);
5562
+ padding: 0 calc(${theme.vars.spacing.unit} * 2);
5563
+ margin-bottom: calc(${theme.vars.spacing.unit} * 2);
5562
5564
  flex: 1;
5563
5565
  `;
5564
5566
  const footerStyles = css13`
@@ -5963,7 +5965,7 @@ var Logo = ({ className, src, alt, title, size = "medium" }) => {
5963
5965
  };
5964
5966
  var Logo_default = Logo;
5965
5967
 
5966
- // src/components/presentation/SignIn/non-component-driven/BaseSignIn.styles.ts
5968
+ // src/components/presentation/SignIn/BaseSignIn.styles.ts
5967
5969
  import { css as css16 } from "@emotion/css";
5968
5970
  import { useMemo as useMemo23 } from "react";
5969
5971
  var useStyles16 = (theme, colorScheme) => {
@@ -5982,17 +5984,18 @@ var useStyles16 = (theme, colorScheme) => {
5982
5984
  display: flex;
5983
5985
  flex-direction: column;
5984
5986
  align-items: center;
5985
- margin-bottom: calc(${theme.vars.spacing.unit} * 3);
5987
+ margin-bottom: calc(${theme.vars.spacing.unit} * 2);
5986
5988
  `;
5987
5989
  const header = css16`
5988
5990
  gap: 0;
5991
+ align-items: center;
5989
5992
  `;
5990
5993
  const title = css16`
5991
5994
  margin: 0 0 calc(${theme.vars.spacing.unit} * 1) 0;
5992
5995
  color: ${theme.vars.colors.text.primary};
5993
5996
  `;
5994
5997
  const subtitle = css16`
5995
- margin-top: calc(${theme.vars.spacing.unit} * 1);
5998
+ margin-bottom: calc(${theme.vars.spacing.unit} * 1);
5996
5999
  color: ${theme.vars.colors.text.secondary};
5997
6000
  `;
5998
6001
  const messagesContainer = css16`
@@ -6061,7 +6064,7 @@ var useStyles16 = (theme, colorScheme) => {
6061
6064
  margin-bottom: calc(${theme.vars.spacing.unit} * 1);
6062
6065
  `;
6063
6066
  const flowMessagesContainer = css16`
6064
- margin-top: calc(${theme.vars.spacing.unit} * 2);
6067
+ margin-bottom: calc(${theme.vars.spacing.unit} * 2);
6065
6068
  `;
6066
6069
  const flowMessageItem = css16`
6067
6070
  margin-bottom: calc(${theme.vars.spacing.unit} * 1);
@@ -6107,12 +6110,12 @@ var BaseSignIn_styles_default = useStyles16;
6107
6110
  // src/components/presentation/SignIn/non-component-driven/BaseSignIn.tsx
6108
6111
  import { jsx as jsx53, jsxs as jsxs26 } from "react/jsx-runtime";
6109
6112
  var isPasskeyAuthenticator = (authenticator) => authenticator.authenticatorId === ApplicationNativeAuthenticationConstants3.SupportedAuthenticators.Passkey && authenticator.metadata?.promptType === EmbeddedSignInFlowAuthenticatorPromptType.InternalPrompt && authenticator.metadata?.additionalData?.challengeData;
6110
- var BaseSignIn = (props) => {
6113
+ var BaseSignIn = ({ showLogo = true, ...rest }) => {
6111
6114
  const { theme } = useTheme_default();
6112
6115
  const styles = BaseSignIn_styles_default(theme, theme.vars.colors.text.primary);
6113
6116
  return /* @__PURE__ */ jsxs26("div", { children: [
6114
- /* @__PURE__ */ jsx53("div", { className: styles.logoContainer, children: /* @__PURE__ */ jsx53(Logo_default, { size: "large" }) }),
6115
- /* @__PURE__ */ jsx53(FlowProvider_default, { children: /* @__PURE__ */ jsx53(BaseSignInContent, { ...props }) })
6117
+ showLogo && /* @__PURE__ */ jsx53("div", { className: styles.logoContainer, children: /* @__PURE__ */ jsx53(Logo_default, { size: "large" }) }),
6118
+ /* @__PURE__ */ jsx53(FlowProvider_default, { children: /* @__PURE__ */ jsx53(BaseSignInContent, { showLogo, ...rest }) })
6116
6119
  ] });
6117
6120
  };
6118
6121
  var HIDDEN_AUTHENTICATORS = ["T3JnYW5pemF0aW9uQXV0aGVudGljYXRvcjpTU08"];
@@ -6130,7 +6133,9 @@ var BaseSignInContent = ({
6130
6133
  errorClassName = "",
6131
6134
  messageClassName = "",
6132
6135
  size = "medium",
6133
- variant = "outlined"
6136
+ variant = "outlined",
6137
+ showTitle = true,
6138
+ showSubtitle = true
6134
6139
  }) => {
6135
6140
  const { theme } = useTheme_default();
6136
6141
  const { t } = useTranslation_default();
@@ -6671,9 +6676,11 @@ var BaseSignInContent = ({
6671
6676
  );
6672
6677
  const optionAuthenticators = availableAuthenticators.filter((auth) => !userPromptAuthenticators.includes(auth)).filter((authenticator) => !HIDDEN_AUTHENTICATORS.includes(authenticator.authenticatorId));
6673
6678
  return /* @__PURE__ */ jsxs26(Card_default, { className: cx19(containerClasses, styles.card), variant, children: [
6674
- /* @__PURE__ */ jsxs26(Card_default.Header, { className: styles.header, children: [
6675
- /* @__PURE__ */ jsx53(Card_default.Title, { level: 2, className: styles.title, children: flowTitle || t("signin.title") }),
6676
- flowSubtitle && /* @__PURE__ */ jsx53(Typography_default, { variant: "body1", className: styles.subtitle, children: flowSubtitle || t("signin.subtitle") }),
6679
+ (showTitle || showSubtitle) && /* @__PURE__ */ jsxs26(Card_default.Header, { className: styles.header, children: [
6680
+ showTitle && /* @__PURE__ */ jsx53(Card_default.Title, { level: 2, className: styles.title, children: flowTitle || t("signin.title") }),
6681
+ showSubtitle && /* @__PURE__ */ jsx53(Typography_default, { variant: "body1", className: styles.subtitle, children: flowSubtitle || t("signin.subtitle") })
6682
+ ] }),
6683
+ /* @__PURE__ */ jsxs26(Card_default.Content, { children: [
6677
6684
  flowMessages && flowMessages.length > 0 && /* @__PURE__ */ jsx53("div", { className: styles.flowMessagesContainer, children: flowMessages.map((flowMessage, index) => /* @__PURE__ */ jsx53(
6678
6685
  Alert_default,
6679
6686
  {
@@ -6686,9 +6693,7 @@ var BaseSignInContent = ({
6686
6693
  messages.length > 0 && /* @__PURE__ */ jsx53("div", { className: styles.messagesContainer, children: messages.map((message, index) => {
6687
6694
  const variant2 = message.type.toLowerCase() === "error" ? "error" : message.type.toLowerCase() === "warning" ? "warning" : message.type.toLowerCase() === "success" ? "success" : "info";
6688
6695
  return /* @__PURE__ */ jsx53(Alert_default, { variant: variant2, className: cx19(styles.messageItem, messageClasses), children: /* @__PURE__ */ jsx53(Alert_default.Description, { children: message.message }) }, index);
6689
- }) })
6690
- ] }),
6691
- /* @__PURE__ */ jsxs26(Card_default.Content, { children: [
6696
+ }) }),
6692
6697
  error && /* @__PURE__ */ jsxs26(Alert_default, { variant: "error", className: cx19(styles.errorContainer, errorClasses), children: [
6693
6698
  /* @__PURE__ */ jsx53(Alert_default.Title, { children: "Error" }),
6694
6699
  /* @__PURE__ */ jsx53(Alert_default.Description, { children: error })
@@ -6818,147 +6823,6 @@ import { useState as useState15, useCallback as useCallback10 } from "react";
6818
6823
  import { cx as cx20 } from "@emotion/css";
6819
6824
  import { withVendorCSSClassPrefix as withVendorCSSClassPrefix20 } from "@asgardeo/browser";
6820
6825
 
6821
- // src/components/presentation/SignIn/BaseSignIn.styles.ts
6822
- import { css as css17 } from "@emotion/css";
6823
- import { useMemo as useMemo24 } from "react";
6824
- var useStyles17 = (theme, colorScheme) => {
6825
- return useMemo24(() => {
6826
- const signIn = css17`
6827
- min-width: 420px;
6828
- margin: 0 auto;
6829
- `;
6830
- const card = css17`
6831
- background: ${theme.vars.colors.background.surface};
6832
- border-radius: ${theme.vars.borderRadius.large};
6833
- gap: calc(${theme.vars.spacing.unit} * 2);
6834
- min-width: 420px;
6835
- `;
6836
- const logoContainer = css17`
6837
- display: flex;
6838
- flex-direction: column;
6839
- align-items: center;
6840
- margin-bottom: calc(${theme.vars.spacing.unit} * 3);
6841
- `;
6842
- const header = css17`
6843
- gap: 0;
6844
- `;
6845
- const title = css17`
6846
- margin: 0 0 calc(${theme.vars.spacing.unit} * 1) 0;
6847
- color: ${theme.vars.colors.text.primary};
6848
- `;
6849
- const subtitle = css17`
6850
- margin-top: calc(${theme.vars.spacing.unit} * 1);
6851
- color: ${theme.vars.colors.text.secondary};
6852
- `;
6853
- const messagesContainer = css17`
6854
- margin-top: calc(${theme.vars.spacing.unit} * 2);
6855
- `;
6856
- const messageItem = css17`
6857
- margin-bottom: calc(${theme.vars.spacing.unit} * 1);
6858
- `;
6859
- const errorContainer = css17`
6860
- margin-bottom: calc(${theme.vars.spacing.unit} * 2);
6861
- `;
6862
- const contentContainer = css17`
6863
- display: flex;
6864
- flex-direction: column;
6865
- gap: calc(${theme.vars.spacing.unit} * 2);
6866
- `;
6867
- const loadingContainer = css17`
6868
- display: flex;
6869
- flex-direction: column;
6870
- align-items: center;
6871
- padding: calc(${theme.vars.spacing.unit} * 4);
6872
- `;
6873
- const loadingText = css17`
6874
- margin-top: calc(${theme.vars.spacing.unit} * 2);
6875
- color: ${theme.vars.colors.text.secondary};
6876
- `;
6877
- const divider = css17`
6878
- margin: calc(${theme.vars.spacing.unit} * 1) 0;
6879
- `;
6880
- const centeredContainer = css17`
6881
- text-align: center;
6882
- padding: calc(${theme.vars.spacing.unit} * 4);
6883
- `;
6884
- const passkeyContainer = css17`
6885
- margin-bottom: calc(${theme.vars.spacing.unit} * 2);
6886
- `;
6887
- const passkeyText = css17`
6888
- margin-top: calc(${theme.vars.spacing.unit} * 1);
6889
- color: ${theme.vars.colors.text.secondary};
6890
- `;
6891
- const form = css17`
6892
- display: flex;
6893
- flex-direction: column;
6894
- gap: calc(${theme.vars.spacing.unit} * 2);
6895
- `;
6896
- const formDivider = css17`
6897
- margin: calc(${theme.vars.spacing.unit} * 1) 0;
6898
- `;
6899
- const authenticatorSection = css17`
6900
- display: flex;
6901
- flex-direction: column;
6902
- gap: calc(${theme.vars.spacing.unit} * 1);
6903
- `;
6904
- const authenticatorItem = css17`
6905
- width: 100%;
6906
- `;
6907
- const noAuthenticatorCard = css17`
6908
- background: ${theme.vars.colors.background.surface};
6909
- border-radius: ${theme.vars.borderRadius.large};
6910
- padding: calc(${theme.vars.spacing.unit} * 2);
6911
- `;
6912
- const errorAlert = css17`
6913
- margin-bottom: calc(${theme.vars.spacing.unit} * 2);
6914
- `;
6915
- const messagesAlert = css17`
6916
- margin-bottom: calc(${theme.vars.spacing.unit} * 1);
6917
- `;
6918
- const flowMessagesContainer = css17`
6919
- margin-top: calc(${theme.vars.spacing.unit} * 2);
6920
- `;
6921
- const flowMessageItem = css17`
6922
- margin-bottom: calc(${theme.vars.spacing.unit} * 1);
6923
- `;
6924
- return {
6925
- signIn,
6926
- card,
6927
- logoContainer,
6928
- header,
6929
- title,
6930
- subtitle,
6931
- messagesContainer,
6932
- messageItem,
6933
- errorContainer,
6934
- contentContainer,
6935
- loadingContainer,
6936
- loadingText,
6937
- divider,
6938
- centeredContainer,
6939
- passkeyContainer,
6940
- passkeyText,
6941
- form,
6942
- formDivider,
6943
- authenticatorSection,
6944
- authenticatorItem,
6945
- noAuthenticatorCard,
6946
- errorAlert,
6947
- messagesAlert,
6948
- flowMessagesContainer,
6949
- flowMessageItem
6950
- };
6951
- }, [
6952
- theme.vars.colors.background.surface,
6953
- theme.vars.colors.text.primary,
6954
- theme.vars.colors.text.secondary,
6955
- theme.vars.borderRadius.large,
6956
- theme.vars.spacing.unit,
6957
- colorScheme
6958
- ]);
6959
- };
6960
- var BaseSignIn_styles_default2 = useStyles17;
6961
-
6962
6826
  // src/components/presentation/SignIn/component-driven/SignInOptionFactory.tsx
6963
6827
  import React from "react";
6964
6828
  import { AsgardeoRuntimeError as AsgardeoRuntimeError7, FieldType as FieldType7 } from "@asgardeo/browser";
@@ -7129,69 +6993,225 @@ var renderSignInComponents = (components, formValues, touchedFields, formErrors,
7129
6993
  )
7130
6994
  ).filter(Boolean);
7131
6995
 
7132
- // src/components/presentation/SignIn/component-driven/BaseSignIn.tsx
7133
- import { jsx as jsx56, jsxs as jsxs27 } from "react/jsx-runtime";
7134
- var BaseSignIn2 = (props) => {
7135
- const { theme } = useTheme_default();
7136
- const styles = BaseSignIn_styles_default2(theme, theme.vars.colors.text.primary);
7137
- return /* @__PURE__ */ jsxs27("div", { children: [
7138
- /* @__PURE__ */ jsx56("div", { className: styles.logoContainer, children: /* @__PURE__ */ jsx56(Logo_default, { size: "large" }) }),
7139
- /* @__PURE__ */ jsx56(FlowProvider_default, { children: /* @__PURE__ */ jsx56(BaseSignInContent2, { ...props }) })
7140
- ] });
6996
+ // src/components/presentation/SignUp/transformer.ts
6997
+ import {
6998
+ EmbeddedFlowComponentType as EmbeddedFlowComponentType2
6999
+ } from "@asgardeo/browser";
7000
+ var generateId = (prefix) => {
7001
+ const suffix = Math.random().toString(36).substring(2, 6);
7002
+ return `${prefix}_${suffix}`;
7141
7003
  };
7142
- var BaseSignInContent2 = ({
7143
- components = [],
7144
- onSubmit,
7145
- onError,
7146
- className = "",
7147
- inputClassName = "",
7148
- buttonClassName = "",
7149
- errorClassName = "",
7150
- messageClassName = "",
7151
- size = "medium",
7152
- variant = "outlined",
7153
- isLoading: externalIsLoading,
7154
- children
7155
- }) => {
7156
- const { theme } = useTheme_default();
7157
- const { t } = useTranslation_default();
7158
- const { subtitle: flowSubtitle, title: flowTitle, messages: flowMessages } = useFlow_default();
7159
- const styles = BaseSignIn_styles_default2(theme, theme.vars.colors.text.primary);
7160
- const [isSubmitting, setIsSubmitting] = useState15(false);
7161
- const [error, setError] = useState15(null);
7162
- const isLoading = externalIsLoading || isSubmitting;
7163
- const extractFormFields = useCallback10(
7164
- (components2) => {
7165
- const fields = [];
7166
- const processComponents = (comps) => {
7167
- comps.forEach((component) => {
7168
- if (component.type === "INPUT" && component.config) {
7169
- const identifier = component.config["identifier"] || component.id;
7170
- fields.push({
7171
- name: identifier,
7172
- required: component.config["required"] || false,
7173
- initialValue: "",
7174
- validator: (value) => {
7175
- if (component.config["required"] && (!value || value.trim() === "")) {
7176
- return t("field.required");
7177
- }
7178
- return null;
7179
- }
7180
- });
7181
- }
7182
- if (component.components) {
7183
- processComponents(component.components);
7184
- }
7185
- });
7186
- };
7187
- processComponents(components2);
7188
- return fields;
7004
+ var getInputVariant = (type, name) => {
7005
+ switch (type.toLowerCase()) {
7006
+ case "email":
7007
+ return "EMAIL";
7008
+ case "password":
7009
+ return "PASSWORD";
7010
+ default:
7011
+ return "TEXT";
7012
+ }
7013
+ };
7014
+ var getInputLabel = (name, type, t) => {
7015
+ const i18nKey = `elements.fields.${name}`;
7016
+ const label = t(i18nKey);
7017
+ if (label === i18nKey || !label) {
7018
+ return name.charAt(0).toUpperCase() + name.slice(1);
7019
+ }
7020
+ return label;
7021
+ };
7022
+ var getInputPlaceholder = (name, type, t) => {
7023
+ const label = getInputLabel(name, type, t);
7024
+ const placeholder = t("elements.fields.placeholder", { field: label });
7025
+ if (!placeholder || placeholder === "elements.fields.placeholder") {
7026
+ return `Enter your ${label}`;
7027
+ }
7028
+ return placeholder;
7029
+ };
7030
+ var convertSimpleInputToComponent = (input, t) => {
7031
+ let fieldType = input.type;
7032
+ if (input.name.toLowerCase().includes("password") && input.type.toLowerCase() === "string") {
7033
+ fieldType = "password";
7034
+ }
7035
+ const variant = getInputVariant(input.type, input.name);
7036
+ const label = getInputLabel(input.name, input.type, t);
7037
+ const placeholder = getInputPlaceholder(input.name, input.type, t);
7038
+ return {
7039
+ id: generateId("input"),
7040
+ type: EmbeddedFlowComponentType2.Input,
7041
+ variant,
7042
+ config: {
7043
+ type: input.type,
7044
+ label,
7045
+ placeholder,
7046
+ required: input.required,
7047
+ identifier: input.name,
7048
+ hint: ""
7189
7049
  },
7190
- [t]
7191
- );
7192
- const formFields = components ? extractFormFields(components) : [];
7193
- const form = useForm({
7194
- initialValues: {},
7050
+ components: []
7051
+ };
7052
+ };
7053
+ var convertActionToComponent = (action, t) => {
7054
+ const normalizedId = action.id.replace(/_auth$/, "");
7055
+ const i18nKey = `elements.buttons.${normalizedId}`;
7056
+ let text = t(i18nKey);
7057
+ if (!text || text === i18nKey) {
7058
+ text = action.id.replace(/_/g, " ");
7059
+ text = text.charAt(0).toUpperCase() + text.slice(1);
7060
+ }
7061
+ return {
7062
+ id: generateId("action"),
7063
+ type: EmbeddedFlowComponentType2.Button,
7064
+ variant: "SECONDARY",
7065
+ config: {
7066
+ type: "button",
7067
+ text,
7068
+ actionId: action.id,
7069
+ actionType: action.type
7070
+ },
7071
+ components: []
7072
+ };
7073
+ };
7074
+ var transformSimpleToComponentDriven = (response, t) => {
7075
+ const inputComponents = response?.data?.inputs?.map((input) => convertSimpleInputToComponent(input, t)) || [];
7076
+ const actionComponents = response?.data?.actions?.map((action) => convertActionToComponent(action, t)) || [];
7077
+ const submitButton = inputComponents.length > 0 ? {
7078
+ id: generateId("button"),
7079
+ type: EmbeddedFlowComponentType2.Button,
7080
+ variant: "PRIMARY",
7081
+ config: {
7082
+ type: "submit",
7083
+ text: t("elements.buttons.signUp")
7084
+ },
7085
+ components: []
7086
+ } : null;
7087
+ const formComponents = [];
7088
+ if (inputComponents.length > 0) {
7089
+ formComponents.push(...inputComponents);
7090
+ if (submitButton) formComponents.push(submitButton);
7091
+ }
7092
+ const result = [];
7093
+ if (formComponents.length > 0) {
7094
+ result.push({
7095
+ id: generateId("form"),
7096
+ type: EmbeddedFlowComponentType2.Form,
7097
+ config: {},
7098
+ components: formComponents
7099
+ });
7100
+ }
7101
+ if (actionComponents.length > 0) {
7102
+ result.push(...actionComponents);
7103
+ }
7104
+ return result;
7105
+ };
7106
+ var extractErrorMessage = (error, t) => {
7107
+ let errorMessage = t("errors.sign.up.flow.failure");
7108
+ if (error && typeof error === "object") {
7109
+ if (error.flowStatus === "ERROR" && error.failureReason) {
7110
+ errorMessage = error.failureReason;
7111
+ } else if (error.code && (error.message || error.description)) {
7112
+ errorMessage = error.description || error.message;
7113
+ } else if (error instanceof Error && error.name === "AsgardeoAPIError") {
7114
+ try {
7115
+ const errorResponse = JSON.parse(
7116
+ error.message
7117
+ );
7118
+ if (errorResponse.failureReason) {
7119
+ errorMessage = errorResponse.failureReason;
7120
+ } else if (errorResponse.description) {
7121
+ errorMessage = errorResponse.description;
7122
+ } else if (errorResponse.message) {
7123
+ errorMessage = errorResponse.message;
7124
+ } else {
7125
+ errorMessage = error.message;
7126
+ }
7127
+ } catch {
7128
+ errorMessage = error.message;
7129
+ }
7130
+ } else if (error.message) {
7131
+ errorMessage = error.message;
7132
+ }
7133
+ } else if (typeof error === "string") {
7134
+ errorMessage = error;
7135
+ }
7136
+ return errorMessage;
7137
+ };
7138
+
7139
+ // src/components/presentation/SignIn/component-driven/BaseSignIn.tsx
7140
+ import { jsx as jsx56, jsxs as jsxs27 } from "react/jsx-runtime";
7141
+ var BaseSignIn2 = ({ showLogo = true, ...rest }) => {
7142
+ const { theme } = useTheme_default();
7143
+ const styles = BaseSignIn_styles_default(theme, theme.vars.colors.text.primary);
7144
+ return /* @__PURE__ */ jsxs27("div", { children: [
7145
+ showLogo && /* @__PURE__ */ jsx56("div", { className: styles.logoContainer, children: /* @__PURE__ */ jsx56(Logo_default, { size: "large" }) }),
7146
+ /* @__PURE__ */ jsx56(FlowProvider_default, { children: /* @__PURE__ */ jsx56(BaseSignInContent2, { showLogo, ...rest }) })
7147
+ ] });
7148
+ };
7149
+ var BaseSignInContent2 = ({
7150
+ components = [],
7151
+ onSubmit,
7152
+ onError,
7153
+ className = "",
7154
+ inputClassName = "",
7155
+ buttonClassName = "",
7156
+ errorClassName = "",
7157
+ messageClassName = "",
7158
+ size = "medium",
7159
+ variant = "outlined",
7160
+ isLoading: externalIsLoading,
7161
+ children,
7162
+ showTitle = true,
7163
+ showSubtitle = true,
7164
+ showLogo = true
7165
+ }) => {
7166
+ const { theme } = useTheme_default();
7167
+ const { t } = useTranslation_default();
7168
+ const { subtitle: flowSubtitle, title: flowTitle, messages: flowMessages, addMessage, clearMessages } = useFlow_default();
7169
+ const styles = BaseSignIn_styles_default(theme, theme.vars.colors.text.primary);
7170
+ const [isSubmitting, setIsSubmitting] = useState15(false);
7171
+ const isLoading = externalIsLoading || isSubmitting;
7172
+ const handleError = useCallback10(
7173
+ (error) => {
7174
+ const errorMessage = extractErrorMessage(error, t);
7175
+ clearMessages();
7176
+ addMessage({
7177
+ type: "error",
7178
+ message: errorMessage
7179
+ });
7180
+ },
7181
+ [t, addMessage, clearMessages]
7182
+ );
7183
+ const extractFormFields = useCallback10(
7184
+ (components2) => {
7185
+ const fields = [];
7186
+ const processComponents = (comps) => {
7187
+ comps.forEach((component) => {
7188
+ if (component.type === "INPUT" && component.config) {
7189
+ const identifier = component.config["identifier"] || component.id;
7190
+ fields.push({
7191
+ name: identifier,
7192
+ required: component.config["required"] || false,
7193
+ initialValue: "",
7194
+ validator: (value) => {
7195
+ if (component.config["required"] && (!value || value.trim() === "")) {
7196
+ return t("field.required");
7197
+ }
7198
+ return null;
7199
+ }
7200
+ });
7201
+ }
7202
+ if (component.components) {
7203
+ processComponents(component.components);
7204
+ }
7205
+ });
7206
+ };
7207
+ processComponents(components2);
7208
+ return fields;
7209
+ },
7210
+ [t]
7211
+ );
7212
+ const formFields = components ? extractFormFields(components) : [];
7213
+ const form = useForm({
7214
+ initialValues: {},
7195
7215
  fields: formFields,
7196
7216
  validateOnBlur: true,
7197
7217
  validateOnChange: false,
@@ -7220,7 +7240,7 @@ var BaseSignInContent2 = ({
7220
7240
  return;
7221
7241
  }
7222
7242
  setIsSubmitting(true);
7223
- setError(null);
7243
+ clearMessages();
7224
7244
  try {
7225
7245
  const filteredInputs = {};
7226
7246
  if (data) {
@@ -7244,8 +7264,7 @@ var BaseSignInContent2 = ({
7244
7264
  }
7245
7265
  await onSubmit?.(payload, component);
7246
7266
  } catch (err) {
7247
- const errorMessage = err instanceof Error ? err.message : t("errors.sign.in.flow.failure");
7248
- setError(errorMessage);
7267
+ handleError(err);
7249
7268
  onError?.(err);
7250
7269
  } finally {
7251
7270
  setIsSubmitting(false);
@@ -7288,7 +7307,6 @@ var BaseSignInContent2 = ({
7288
7307
  handleInputChange,
7289
7308
  {
7290
7309
  buttonClassName: buttonClasses,
7291
- error,
7292
7310
  inputClassName: inputClasses,
7293
7311
  onInputBlur: handleInputBlur,
7294
7312
  onSubmit: handleSubmit,
@@ -7304,7 +7322,6 @@ var BaseSignInContent2 = ({
7304
7322
  isLoading,
7305
7323
  size,
7306
7324
  variant,
7307
- error,
7308
7325
  inputClasses,
7309
7326
  buttonClasses,
7310
7327
  handleInputBlur,
@@ -7318,7 +7335,6 @@ var BaseSignInContent2 = ({
7318
7335
  touched: touchedFields,
7319
7336
  isValid: isFormValid,
7320
7337
  isLoading,
7321
- error,
7322
7338
  components,
7323
7339
  handleInputChange,
7324
7340
  handleSubmit,
@@ -7336,9 +7352,11 @@ var BaseSignInContent2 = ({
7336
7352
  return /* @__PURE__ */ jsx56(Card_default, { className: cx20(containerClasses, styles.card), variant, children: /* @__PURE__ */ jsx56(Card_default.Content, { children: /* @__PURE__ */ jsx56(Alert_default, { variant: "warning", children: /* @__PURE__ */ jsx56(Typography_default, { variant: "body1", children: t("errors.sign.in.components.not.available") }) }) }) });
7337
7353
  }
7338
7354
  return /* @__PURE__ */ jsxs27(Card_default, { className: cx20(containerClasses, styles.card), variant, children: [
7339
- /* @__PURE__ */ jsxs27(Card_default.Header, { className: styles.header, children: [
7340
- /* @__PURE__ */ jsx56(Card_default.Title, { level: 2, className: styles.title, children: flowTitle || t("signin.title") }),
7341
- /* @__PURE__ */ jsx56(Typography_default, { variant: "body1", className: styles.subtitle, children: flowSubtitle || t("signin.subtitle") }),
7355
+ (showTitle || showSubtitle) && /* @__PURE__ */ jsxs27(Card_default.Header, { className: styles.header, children: [
7356
+ showTitle && /* @__PURE__ */ jsx56(Card_default.Title, { level: 2, className: styles.title, children: flowTitle || t("signin.title") }),
7357
+ showSubtitle && /* @__PURE__ */ jsx56(Typography_default, { variant: "body1", className: styles.subtitle, children: flowSubtitle || t("signin.subtitle") })
7358
+ ] }),
7359
+ /* @__PURE__ */ jsxs27(Card_default.Content, { children: [
7342
7360
  flowMessages && flowMessages.length > 0 && /* @__PURE__ */ jsx56("div", { className: styles.flowMessagesContainer, children: flowMessages.map((message, index) => /* @__PURE__ */ jsx56(
7343
7361
  Alert_default,
7344
7362
  {
@@ -7347,13 +7365,7 @@ var BaseSignInContent2 = ({
7347
7365
  children: /* @__PURE__ */ jsx56(Alert_default.Description, { children: message.message })
7348
7366
  },
7349
7367
  index
7350
- )) })
7351
- ] }),
7352
- /* @__PURE__ */ jsxs27(Card_default.Content, { children: [
7353
- error && /* @__PURE__ */ jsxs27(Alert_default, { variant: "error", className: cx20(styles.errorContainer, errorClasses), children: [
7354
- /* @__PURE__ */ jsx56(Alert_default.Title, { children: t("errors.title") }),
7355
- /* @__PURE__ */ jsx56(Alert_default.Description, { children: error })
7356
- ] }),
7368
+ )) }),
7357
7369
  /* @__PURE__ */ jsx56("div", { className: styles.contentContainer, children: components && renderComponents(components) })
7358
7370
  ] })
7359
7371
  ] });
@@ -7385,19 +7397,12 @@ import {
7385
7397
  } from "@asgardeo/browser";
7386
7398
 
7387
7399
  // src/components/presentation/SignIn/component-driven/transformer.ts
7388
- import { EmbeddedFlowComponentType as EmbeddedFlowComponentType2 } from "@asgardeo/browser";
7389
- var generateId = (prefix) => {
7400
+ import { EmbeddedFlowComponentType as EmbeddedFlowComponentType3 } from "@asgardeo/browser";
7401
+ var generateId2 = (prefix) => {
7390
7402
  const suffix = Math.random().toString(36).substring(2, 6);
7391
7403
  return `${prefix}_${suffix}`;
7392
7404
  };
7393
- var getInputVariant = (type, name) => {
7394
- const lowerName = name.toLowerCase();
7395
- if (lowerName.includes("password")) {
7396
- return "PASSWORD";
7397
- }
7398
- if (lowerName.includes("email")) {
7399
- return "EMAIL";
7400
- }
7405
+ var getInputVariant2 = (type, name) => {
7401
7406
  switch (type.toLowerCase()) {
7402
7407
  case "email":
7403
7408
  return "EMAIL";
@@ -7407,7 +7412,7 @@ var getInputVariant = (type, name) => {
7407
7412
  return "TEXT";
7408
7413
  }
7409
7414
  };
7410
- var getInputLabel = (name, type, t) => {
7415
+ var getInputLabel2 = (name, type, t) => {
7411
7416
  const i18nKey = `elements.fields.${name}`;
7412
7417
  const label = t(i18nKey);
7413
7418
  if (label === i18nKey || !label) {
@@ -7415,24 +7420,28 @@ var getInputLabel = (name, type, t) => {
7415
7420
  }
7416
7421
  return label;
7417
7422
  };
7418
- var getInputPlaceholder = (name, type, t) => {
7419
- const label = getInputLabel(name, type, t);
7423
+ var getInputPlaceholder2 = (name, type, t) => {
7424
+ const label = getInputLabel2(name, type, t);
7420
7425
  const placeholder = t("elements.fields.placeholder", { field: label });
7421
7426
  if (!placeholder || placeholder === "elements.fields.placeholder") {
7422
7427
  return `Enter your ${label}`;
7423
7428
  }
7424
7429
  return placeholder;
7425
7430
  };
7426
- var convertSimpleInputToComponent = (input, t) => {
7427
- const variant = getInputVariant(input.type, input.name);
7428
- const label = getInputLabel(input.name, input.type, t);
7429
- const placeholder = getInputPlaceholder(input.name, input.type, t);
7431
+ var convertSimpleInputToComponent2 = (input, t) => {
7432
+ let fieldType = input.type;
7433
+ if (input.name.toLowerCase().includes("password") && input.type.toLowerCase() === "string") {
7434
+ fieldType = "password";
7435
+ }
7436
+ const variant = getInputVariant2(fieldType, input.name);
7437
+ const label = getInputLabel2(input.name, fieldType, t);
7438
+ const placeholder = getInputPlaceholder2(input.name, fieldType, t);
7430
7439
  return {
7431
- id: generateId("input"),
7432
- type: EmbeddedFlowComponentType2.Input,
7440
+ id: generateId2("input"),
7441
+ type: EmbeddedFlowComponentType3.Input,
7433
7442
  variant,
7434
7443
  config: {
7435
- type: input.type,
7444
+ type: fieldType,
7436
7445
  label,
7437
7446
  placeholder,
7438
7447
  required: input.required,
@@ -7442,16 +7451,17 @@ var convertSimpleInputToComponent = (input, t) => {
7442
7451
  components: []
7443
7452
  };
7444
7453
  };
7445
- var convertActionToComponent = (action, t) => {
7446
- const i18nKey = `elements.buttons.${action.id}`;
7454
+ var convertActionToComponent2 = (action, t) => {
7455
+ const normalizedId = action.id.replace(/_auth$/, "");
7456
+ const i18nKey = `elements.buttons.${normalizedId}`;
7447
7457
  let text = t(i18nKey);
7448
7458
  if (!text || text === i18nKey) {
7449
7459
  text = action.id.replace(/_/g, " ");
7450
7460
  text = text.charAt(0).toUpperCase() + text.slice(1);
7451
7461
  }
7452
7462
  return {
7453
- id: generateId("action"),
7454
- type: EmbeddedFlowComponentType2.Button,
7463
+ id: generateId2("action"),
7464
+ type: EmbeddedFlowComponentType3.Button,
7455
7465
  variant: "SECONDARY",
7456
7466
  config: {
7457
7467
  type: "button",
@@ -7462,12 +7472,12 @@ var convertActionToComponent = (action, t) => {
7462
7472
  components: []
7463
7473
  };
7464
7474
  };
7465
- var transformSimpleToComponentDriven = (response, t) => {
7466
- const inputComponents = response?.data?.inputs?.map((input) => convertSimpleInputToComponent(input, t)) || [];
7467
- const actionComponents = response?.data?.actions?.map((action) => convertActionToComponent(action, t)) || [];
7475
+ var transformSimpleToComponentDriven2 = (response, t) => {
7476
+ const inputComponents = response?.data?.inputs?.map((input) => convertSimpleInputToComponent2(input, t)) || [];
7477
+ const actionComponents = response?.data?.actions?.map((action) => convertActionToComponent2(action, t)) || [];
7468
7478
  const submitButton = inputComponents.length > 0 ? {
7469
- id: generateId("button"),
7470
- type: EmbeddedFlowComponentType2.Button,
7479
+ id: generateId2("button"),
7480
+ type: EmbeddedFlowComponentType3.Button,
7471
7481
  variant: "PRIMARY",
7472
7482
  config: {
7473
7483
  type: "submit",
@@ -7483,8 +7493,8 @@ var transformSimpleToComponentDriven = (response, t) => {
7483
7493
  const result = [];
7484
7494
  if (formComponents.length > 0) {
7485
7495
  result.push({
7486
- id: generateId("form"),
7487
- type: EmbeddedFlowComponentType2.Form,
7496
+ id: generateId2("form"),
7497
+ type: EmbeddedFlowComponentType3.Form,
7488
7498
  config: {},
7489
7499
  components: formComponents
7490
7500
  });
@@ -7497,7 +7507,7 @@ var transformSimpleToComponentDriven = (response, t) => {
7497
7507
  var normalizeFlowResponse = (response, t) => {
7498
7508
  return {
7499
7509
  flowId: response.flowId,
7500
- components: transformSimpleToComponentDriven(response, t)
7510
+ components: transformSimpleToComponentDriven2(response, t)
7501
7511
  };
7502
7512
  };
7503
7513
 
@@ -7677,6 +7687,9 @@ var SignIn2 = ({ className, size = "medium", children, ...rest }) => {
7677
7687
  onSuccess: handleSuccess,
7678
7688
  className,
7679
7689
  size,
7690
+ showLogo: true,
7691
+ showSubtitle: true,
7692
+ showTitle: true,
7680
7693
  ...rest
7681
7694
  }
7682
7695
  );
@@ -7694,7 +7707,7 @@ import { cx as cx21 } from "@emotion/css";
7694
7707
  import { useEffect as useEffect14, useState as useState17, useCallback as useCallback11, useRef as useRef5 } from "react";
7695
7708
 
7696
7709
  // src/components/presentation/SignUp/SignUpOptionFactory.tsx
7697
- import { EmbeddedFlowComponentType as EmbeddedFlowComponentType3 } from "@asgardeo/browser";
7710
+ import { EmbeddedFlowComponentType as EmbeddedFlowComponentType4 } from "@asgardeo/browser";
7698
7711
 
7699
7712
  // src/components/adapters/CheckboxInput.tsx
7700
7713
  import { FieldType as FieldType8 } from "@asgardeo/browser";
@@ -8099,354 +8112,207 @@ var TypographyComponent = ({ component }) => {
8099
8112
  default:
8100
8113
  typographyVariant = "body1";
8101
8114
  }
8102
- return /* @__PURE__ */ jsx65(
8103
- Typography_default,
8104
- {
8105
- variant: typographyVariant,
8106
- style: { marginBottom: `calc(${theme.vars.spacing.unit} * 2)` },
8107
- children: text
8108
- },
8109
- component.id
8110
- );
8111
- };
8112
- var Typography_default2 = TypographyComponent;
8113
-
8114
- // src/components/presentation/SignUp/SignUpOptionFactory.tsx
8115
- import { jsx as jsx66 } from "react/jsx-runtime";
8116
- var createSignUpComponent = ({ component, onSubmit, ...rest }) => {
8117
- switch (component.type) {
8118
- case EmbeddedFlowComponentType3.Typography:
8119
- return /* @__PURE__ */ jsx66(Typography_default2, { component, onSubmit, ...rest });
8120
- case EmbeddedFlowComponentType3.Input:
8121
- const inputVariant = component.variant?.toUpperCase();
8122
- const inputType = component.config["type"]?.toLowerCase();
8123
- if (inputVariant === "EMAIL" || inputType === "email") {
8124
- return /* @__PURE__ */ jsx66(EmailInput_default, { component, onSubmit, ...rest });
8125
- }
8126
- if (inputVariant === "PASSWORD" || inputType === "password") {
8127
- return /* @__PURE__ */ jsx66(PasswordInput_default, { component, onSubmit, ...rest });
8128
- }
8129
- if (inputVariant === "TELEPHONE" || inputType === "tel") {
8130
- return /* @__PURE__ */ jsx66(TelephoneInput_default, { component, onSubmit, ...rest });
8131
- }
8132
- if (inputVariant === "NUMBER" || inputType === "number") {
8133
- return /* @__PURE__ */ jsx66(NumberInput_default, { component, onSubmit, ...rest });
8134
- }
8135
- if (inputVariant === "DATE" || inputType === "date") {
8136
- return /* @__PURE__ */ jsx66(DateInput_default, { component, onSubmit, ...rest });
8137
- }
8138
- if (inputVariant === "CHECKBOX" || inputType === "checkbox") {
8139
- return /* @__PURE__ */ jsx66(CheckboxInput_default, { component, onSubmit, ...rest });
8140
- }
8141
- return /* @__PURE__ */ jsx66(TextInput_default, { component, onSubmit, ...rest });
8142
- case EmbeddedFlowComponentType3.Button: {
8143
- const buttonVariant = component.variant?.toUpperCase();
8144
- const buttonText = component.config["text"] || component.config["label"] || "";
8145
- if (buttonVariant === "SOCIAL") {
8146
- if (buttonText.toLowerCase().includes("google")) {
8147
- return /* @__PURE__ */ jsx66(GoogleButton_default, { onClick: () => onSubmit(component, {}), ...rest, children: buttonText });
8148
- }
8149
- if (buttonText.toLowerCase().includes("github")) {
8150
- return /* @__PURE__ */ jsx66(GitHubButton_default, { onClick: () => onSubmit(component, {}), ...rest, children: buttonText });
8151
- }
8152
- if (buttonText.toLowerCase().includes("microsoft")) {
8153
- return /* @__PURE__ */ jsx66(MicrosoftButton_default, { onClick: () => onSubmit(component, {}), ...rest, children: buttonText });
8154
- }
8155
- if (buttonText.toLowerCase().includes("facebook")) {
8156
- return /* @__PURE__ */ jsx66(FacebookButton_default, { onClick: () => onSubmit(component, {}), ...rest, children: buttonText });
8157
- }
8158
- if (buttonText.toLowerCase().includes("linkedin")) {
8159
- return /* @__PURE__ */ jsx66(LinkedInButton_default, { onClick: () => onSubmit(component, {}), ...rest, children: buttonText });
8160
- }
8161
- if (buttonText.toLowerCase().includes("ethereum")) {
8162
- return /* @__PURE__ */ jsx66(SignInWithEthereumButton_default, { onClick: () => onSubmit(component, {}), ...rest, children: buttonText });
8163
- }
8164
- }
8165
- return /* @__PURE__ */ jsx66(SubmitButton_default, { component, onSubmit, ...rest });
8166
- }
8167
- case EmbeddedFlowComponentType3.Form:
8168
- return /* @__PURE__ */ jsx66(FormContainer_default, { component, onSubmit, ...rest });
8169
- case EmbeddedFlowComponentType3.Divider:
8170
- return /* @__PURE__ */ jsx66(DividerComponent_default, { component, onSubmit, ...rest });
8171
- case EmbeddedFlowComponentType3.Image:
8172
- return /* @__PURE__ */ jsx66(ImageComponent_default, { component, onSubmit, ...rest });
8173
- default:
8174
- return /* @__PURE__ */ jsx66("div", {});
8175
- }
8176
- };
8177
- var createSignUpOptionFromComponent = (component, formValues, touchedFields, formErrors, isLoading, isFormValid, onInputChange, options) => createSignUpComponent({
8178
- component,
8179
- formErrors,
8180
- formValues,
8181
- isFormValid,
8182
- isLoading,
8183
- onInputChange,
8184
- touchedFields,
8185
- ...options
8186
- });
8187
- var renderSignUpComponents = (components, formValues, touchedFields, formErrors, isLoading, isFormValid, onInputChange, options) => components.map(
8188
- (component, index) => createSignUpOptionFromComponent(
8189
- component,
8190
- formValues,
8191
- touchedFields,
8192
- formErrors,
8193
- isLoading,
8194
- isFormValid,
8195
- onInputChange,
8196
- {
8197
- ...options,
8198
- // Use component id as key, fallback to index
8199
- key: component.id || index
8200
- }
8201
- )
8202
- ).filter(Boolean);
8203
-
8204
- // src/components/presentation/SignUp/transformer.ts
8205
- import {
8206
- EmbeddedFlowComponentType as EmbeddedFlowComponentType4
8207
- } from "@asgardeo/browser";
8208
- var generateId2 = (prefix) => {
8209
- const suffix = Math.random().toString(36).substring(2, 6);
8210
- return `${prefix}_${suffix}`;
8211
- };
8212
- var getInputVariant2 = (type, name) => {
8213
- const lowerName = name.toLowerCase();
8214
- if (lowerName.includes("password")) {
8215
- return "PASSWORD";
8216
- }
8217
- if (lowerName.includes("email")) {
8218
- return "EMAIL";
8219
- }
8220
- switch (type.toLowerCase()) {
8221
- case "email":
8222
- return "EMAIL";
8223
- case "password":
8224
- return "PASSWORD";
8225
- default:
8226
- return "TEXT";
8227
- }
8228
- };
8229
- var getInputLabel2 = (name, type, t) => {
8230
- const i18nKey = `elements.fields.${name}`;
8231
- const label = t(i18nKey);
8232
- if (label === i18nKey || !label) {
8233
- return name.charAt(0).toUpperCase() + name.slice(1);
8234
- }
8235
- return label;
8236
- };
8237
- var getInputPlaceholder2 = (name, type, t) => {
8238
- const label = getInputLabel2(name, type, t);
8239
- const placeholder = t("elements.fields.placeholder", { field: label });
8240
- if (!placeholder || placeholder === "elements.fields.placeholder") {
8241
- return `Enter your ${label}`;
8242
- }
8243
- return placeholder;
8244
- };
8245
- var convertSimpleInputToComponent2 = (input, t) => {
8246
- const variant = getInputVariant2(input.type, input.name);
8247
- const label = getInputLabel2(input.name, input.type, t);
8248
- const placeholder = getInputPlaceholder2(input.name, input.type, t);
8249
- return {
8250
- id: generateId2("input"),
8251
- type: EmbeddedFlowComponentType4.Input,
8252
- variant,
8253
- config: {
8254
- type: input.type,
8255
- label,
8256
- placeholder,
8257
- required: input.required,
8258
- identifier: input.name,
8259
- hint: ""
8260
- },
8261
- components: []
8262
- };
8263
- };
8264
- var convertActionToComponent2 = (action, t) => {
8265
- const i18nKey = `elements.buttons.${action.id}`;
8266
- let text = t(i18nKey);
8267
- if (!text || text === i18nKey) {
8268
- text = action.id.replace(/_/g, " ");
8269
- text = text.charAt(0).toUpperCase() + text.slice(1);
8270
- }
8271
- return {
8272
- id: generateId2("action"),
8273
- type: EmbeddedFlowComponentType4.Button,
8274
- variant: "SECONDARY",
8275
- config: {
8276
- type: "button",
8277
- text,
8278
- actionId: action.id,
8279
- actionType: action.type
8280
- },
8281
- components: []
8282
- };
8283
- };
8284
- var transformSimpleToComponentDriven2 = (response, t) => {
8285
- const inputComponents = response?.data?.inputs?.map((input) => convertSimpleInputToComponent2(input, t)) || [];
8286
- const actionComponents = response?.data?.actions?.map((action) => convertActionToComponent2(action, t)) || [];
8287
- const submitButton = inputComponents.length > 0 ? {
8288
- id: generateId2("button"),
8289
- type: EmbeddedFlowComponentType4.Button,
8290
- variant: "PRIMARY",
8291
- config: {
8292
- type: "submit",
8293
- text: t("elements.buttons.signUp")
8294
- },
8295
- components: []
8296
- } : null;
8297
- const formComponents = [];
8298
- if (inputComponents.length > 0) {
8299
- formComponents.push(...inputComponents);
8300
- if (submitButton) formComponents.push(submitButton);
8301
- }
8302
- const result = [];
8303
- if (formComponents.length > 0) {
8304
- result.push({
8305
- id: generateId2("form"),
8306
- type: EmbeddedFlowComponentType4.Form,
8307
- config: {},
8308
- components: formComponents
8309
- });
8310
- }
8311
- if (actionComponents.length > 0) {
8312
- result.push(...actionComponents);
8313
- }
8314
- return result;
8115
+ return /* @__PURE__ */ jsx65(
8116
+ Typography_default,
8117
+ {
8118
+ variant: typographyVariant,
8119
+ style: { marginBottom: `calc(${theme.vars.spacing.unit} * 2)` },
8120
+ children: text
8121
+ },
8122
+ component.id
8123
+ );
8315
8124
  };
8316
- var extractErrorMessage = (error, t) => {
8317
- let errorMessage = t("errors.sign.up.flow.failure");
8318
- if (error && typeof error === "object") {
8319
- if (error.flowStatus === "ERROR" && error.failureReason) {
8320
- errorMessage = error.failureReason;
8321
- } else if (error.code && (error.message || error.description)) {
8322
- errorMessage = error.description || error.message;
8323
- } else if (error instanceof Error && error.name === "AsgardeoAPIError") {
8324
- try {
8325
- const errorResponse = JSON.parse(
8326
- error.message
8327
- );
8328
- if (errorResponse.failureReason) {
8329
- errorMessage = errorResponse.failureReason;
8330
- } else if (errorResponse.description) {
8331
- errorMessage = errorResponse.description;
8332
- } else if (errorResponse.message) {
8333
- errorMessage = errorResponse.message;
8334
- } else {
8335
- errorMessage = error.message;
8125
+ var Typography_default2 = TypographyComponent;
8126
+
8127
+ // src/components/presentation/SignUp/SignUpOptionFactory.tsx
8128
+ import { jsx as jsx66 } from "react/jsx-runtime";
8129
+ var createSignUpComponent = ({ component, onSubmit, ...rest }) => {
8130
+ switch (component.type) {
8131
+ case EmbeddedFlowComponentType4.Typography:
8132
+ return /* @__PURE__ */ jsx66(Typography_default2, { component, onSubmit, ...rest });
8133
+ case EmbeddedFlowComponentType4.Input:
8134
+ const inputVariant = component.variant?.toUpperCase();
8135
+ const inputType = component.config["type"]?.toLowerCase();
8136
+ if (inputVariant === "EMAIL" || inputType === "email") {
8137
+ return /* @__PURE__ */ jsx66(EmailInput_default, { component, onSubmit, ...rest });
8138
+ }
8139
+ if (inputVariant === "PASSWORD" || inputType === "password") {
8140
+ return /* @__PURE__ */ jsx66(PasswordInput_default, { component, onSubmit, ...rest });
8141
+ }
8142
+ if (inputVariant === "TELEPHONE" || inputType === "tel") {
8143
+ return /* @__PURE__ */ jsx66(TelephoneInput_default, { component, onSubmit, ...rest });
8144
+ }
8145
+ if (inputVariant === "NUMBER" || inputType === "number") {
8146
+ return /* @__PURE__ */ jsx66(NumberInput_default, { component, onSubmit, ...rest });
8147
+ }
8148
+ if (inputVariant === "DATE" || inputType === "date") {
8149
+ return /* @__PURE__ */ jsx66(DateInput_default, { component, onSubmit, ...rest });
8150
+ }
8151
+ if (inputVariant === "CHECKBOX" || inputType === "checkbox") {
8152
+ return /* @__PURE__ */ jsx66(CheckboxInput_default, { component, onSubmit, ...rest });
8153
+ }
8154
+ return /* @__PURE__ */ jsx66(TextInput_default, { component, onSubmit, ...rest });
8155
+ case EmbeddedFlowComponentType4.Button: {
8156
+ const buttonVariant = component.variant?.toUpperCase();
8157
+ const buttonText = component.config["text"] || component.config["label"] || "";
8158
+ if (buttonVariant === "SOCIAL") {
8159
+ if (buttonText.toLowerCase().includes("google")) {
8160
+ return /* @__PURE__ */ jsx66(GoogleButton_default, { onClick: () => onSubmit(component, {}), ...rest, children: buttonText });
8161
+ }
8162
+ if (buttonText.toLowerCase().includes("github")) {
8163
+ return /* @__PURE__ */ jsx66(GitHubButton_default, { onClick: () => onSubmit(component, {}), ...rest, children: buttonText });
8164
+ }
8165
+ if (buttonText.toLowerCase().includes("microsoft")) {
8166
+ return /* @__PURE__ */ jsx66(MicrosoftButton_default, { onClick: () => onSubmit(component, {}), ...rest, children: buttonText });
8167
+ }
8168
+ if (buttonText.toLowerCase().includes("facebook")) {
8169
+ return /* @__PURE__ */ jsx66(FacebookButton_default, { onClick: () => onSubmit(component, {}), ...rest, children: buttonText });
8170
+ }
8171
+ if (buttonText.toLowerCase().includes("linkedin")) {
8172
+ return /* @__PURE__ */ jsx66(LinkedInButton_default, { onClick: () => onSubmit(component, {}), ...rest, children: buttonText });
8173
+ }
8174
+ if (buttonText.toLowerCase().includes("ethereum")) {
8175
+ return /* @__PURE__ */ jsx66(SignInWithEthereumButton_default, { onClick: () => onSubmit(component, {}), ...rest, children: buttonText });
8336
8176
  }
8337
- } catch {
8338
- errorMessage = error.message;
8339
8177
  }
8340
- } else if (error.message) {
8341
- errorMessage = error.message;
8178
+ return /* @__PURE__ */ jsx66(SubmitButton_default, { component, onSubmit, ...rest });
8342
8179
  }
8343
- } else if (typeof error === "string") {
8344
- errorMessage = error;
8180
+ case EmbeddedFlowComponentType4.Form:
8181
+ return /* @__PURE__ */ jsx66(FormContainer_default, { component, onSubmit, ...rest });
8182
+ case EmbeddedFlowComponentType4.Divider:
8183
+ return /* @__PURE__ */ jsx66(DividerComponent_default, { component, onSubmit, ...rest });
8184
+ case EmbeddedFlowComponentType4.Image:
8185
+ return /* @__PURE__ */ jsx66(ImageComponent_default, { component, onSubmit, ...rest });
8186
+ default:
8187
+ return /* @__PURE__ */ jsx66("div", {});
8345
8188
  }
8346
- return errorMessage;
8347
8189
  };
8190
+ var createSignUpOptionFromComponent = (component, formValues, touchedFields, formErrors, isLoading, isFormValid, onInputChange, options) => createSignUpComponent({
8191
+ component,
8192
+ formErrors,
8193
+ formValues,
8194
+ isFormValid,
8195
+ isLoading,
8196
+ onInputChange,
8197
+ touchedFields,
8198
+ ...options
8199
+ });
8200
+ var renderSignUpComponents = (components, formValues, touchedFields, formErrors, isLoading, isFormValid, onInputChange, options) => components.map(
8201
+ (component, index) => createSignUpOptionFromComponent(
8202
+ component,
8203
+ formValues,
8204
+ touchedFields,
8205
+ formErrors,
8206
+ isLoading,
8207
+ isFormValid,
8208
+ onInputChange,
8209
+ {
8210
+ ...options,
8211
+ // Use component id as key, fallback to index
8212
+ key: component.id || index
8213
+ }
8214
+ )
8215
+ ).filter(Boolean);
8348
8216
 
8349
8217
  // src/components/presentation/SignUp/BaseSignUp.styles.ts
8350
- import { css as css18 } from "@emotion/css";
8351
- import { useMemo as useMemo25 } from "react";
8352
- var useStyles18 = (theme, colorScheme) => {
8353
- return useMemo25(() => {
8354
- const signUp = css18`
8218
+ import { css as css17 } from "@emotion/css";
8219
+ import { useMemo as useMemo24 } from "react";
8220
+ var useStyles17 = (theme, colorScheme) => {
8221
+ return useMemo24(() => {
8222
+ const signUp = css17`
8355
8223
  min-width: 420px;
8356
8224
  margin: 0 auto;
8357
8225
  `;
8358
- const card = css18`
8226
+ const card = css17`
8359
8227
  background: ${theme.vars.colors.background.surface};
8360
8228
  border-radius: ${theme.vars.borderRadius.large};
8361
8229
  gap: calc(${theme.vars.spacing.unit} * 2);
8362
8230
  min-width: 420px;
8363
8231
  `;
8364
- const logoContainer = css18`
8232
+ const logoContainer = css17`
8365
8233
  display: flex;
8366
8234
  flex-direction: column;
8367
8235
  align-items: center;
8368
- margin-bottom: calc(${theme.vars.spacing.unit} * 3);
8236
+ margin-bottom: calc(${theme.vars.spacing.unit} * 2);
8369
8237
  `;
8370
- const header = css18`
8238
+ const header = css17`
8371
8239
  gap: 0;
8240
+ align-items: center;
8372
8241
  `;
8373
- const title = css18`
8242
+ const title = css17`
8374
8243
  margin: 0 0 calc(${theme.vars.spacing.unit} * 1) 0;
8375
8244
  color: ${theme.vars.colors.text.primary};
8376
8245
  `;
8377
- const subtitle = css18`
8378
- margin-top: calc(${theme.vars.spacing.unit} * 1);
8246
+ const subtitle = css17`
8247
+ margin-bottom: calc(${theme.vars.spacing.unit} * 1);
8379
8248
  color: ${theme.vars.colors.text.secondary};
8380
8249
  `;
8381
- const messagesContainer = css18`
8382
- margin-top: calc(${theme.vars.spacing.unit} * 2);
8383
- `;
8384
- const messageItem = css18`
8250
+ const messageItem = css17`
8385
8251
  margin-bottom: calc(${theme.vars.spacing.unit} * 1);
8386
8252
  `;
8387
- const errorContainer = css18`
8253
+ const errorContainer = css17`
8388
8254
  margin-bottom: calc(${theme.vars.spacing.unit} * 2);
8389
8255
  `;
8390
- const contentContainer = css18`
8256
+ const contentContainer = css17`
8391
8257
  display: flex;
8392
8258
  flex-direction: column;
8393
8259
  gap: calc(${theme.vars.spacing.unit} * 2);
8394
8260
  `;
8395
- const loadingContainer = css18`
8261
+ const loadingContainer = css17`
8396
8262
  display: flex;
8397
8263
  flex-direction: column;
8398
8264
  align-items: center;
8399
8265
  padding: calc(${theme.vars.spacing.unit} * 4);
8400
8266
  `;
8401
- const loadingText = css18`
8267
+ const loadingText = css17`
8402
8268
  margin-top: calc(${theme.vars.spacing.unit} * 2);
8403
8269
  color: ${theme.vars.colors.text.secondary};
8404
8270
  `;
8405
- const divider = css18`
8271
+ const divider = css17`
8406
8272
  margin: calc(${theme.vars.spacing.unit} * 1) 0;
8407
8273
  `;
8408
- const centeredContainer = css18`
8274
+ const centeredContainer = css17`
8409
8275
  text-align: center;
8410
8276
  padding: calc(${theme.vars.spacing.unit} * 4);
8411
8277
  `;
8412
- const passkeyContainer = css18`
8278
+ const passkeyContainer = css17`
8413
8279
  margin-bottom: calc(${theme.vars.spacing.unit} * 2);
8414
8280
  `;
8415
- const passkeyText = css18`
8281
+ const passkeyText = css17`
8416
8282
  margin-top: calc(${theme.vars.spacing.unit} * 1);
8417
8283
  color: ${theme.vars.colors.text.secondary};
8418
8284
  `;
8419
- const form = css18`
8285
+ const form = css17`
8420
8286
  display: flex;
8421
8287
  flex-direction: column;
8422
8288
  gap: calc(${theme.vars.spacing.unit} * 2);
8423
8289
  `;
8424
- const formDivider = css18`
8290
+ const formDivider = css17`
8425
8291
  margin: calc(${theme.vars.spacing.unit} * 1) 0;
8426
8292
  `;
8427
- const authenticatorSection = css18`
8293
+ const authenticatorSection = css17`
8428
8294
  display: flex;
8429
8295
  flex-direction: column;
8430
8296
  gap: calc(${theme.vars.spacing.unit} * 1);
8431
8297
  `;
8432
- const authenticatorItem = css18`
8298
+ const authenticatorItem = css17`
8433
8299
  width: 100%;
8434
8300
  `;
8435
- const noAuthenticatorCard = css18`
8301
+ const noAuthenticatorCard = css17`
8436
8302
  background: ${theme.vars.colors.background.surface};
8437
8303
  border-radius: ${theme.vars.borderRadius.large};
8438
8304
  padding: calc(${theme.vars.spacing.unit} * 2);
8439
8305
  `;
8440
- const errorAlert = css18`
8306
+ const errorAlert = css17`
8441
8307
  margin-bottom: calc(${theme.vars.spacing.unit} * 2);
8442
8308
  `;
8443
- const messagesAlert = css18`
8309
+ const messagesAlert = css17`
8444
8310
  margin-bottom: calc(${theme.vars.spacing.unit} * 1);
8445
8311
  `;
8446
- const flowMessagesContainer = css18`
8447
- margin-top: calc(${theme.vars.spacing.unit} * 2);
8312
+ const flowMessagesContainer = css17`
8313
+ margin-bottom: calc(${theme.vars.spacing.unit} * 2);
8448
8314
  `;
8449
- const flowMessageItem = css18`
8315
+ const flowMessageItem = css17`
8450
8316
  margin-bottom: calc(${theme.vars.spacing.unit} * 1);
8451
8317
  `;
8452
8318
  return {
@@ -8456,7 +8322,6 @@ var useStyles18 = (theme, colorScheme) => {
8456
8322
  header,
8457
8323
  title,
8458
8324
  subtitle,
8459
- messagesContainer,
8460
8325
  messageItem,
8461
8326
  errorContainer,
8462
8327
  contentContainer,
@@ -8485,16 +8350,16 @@ var useStyles18 = (theme, colorScheme) => {
8485
8350
  colorScheme
8486
8351
  ]);
8487
8352
  };
8488
- var BaseSignUp_styles_default = useStyles18;
8353
+ var BaseSignUp_styles_default = useStyles17;
8489
8354
 
8490
8355
  // src/components/presentation/SignUp/BaseSignUp.tsx
8491
8356
  import { jsx as jsx67, jsxs as jsxs28 } from "react/jsx-runtime";
8492
- var BaseSignUp = (props) => {
8357
+ var BaseSignUp = ({ showLogo = true, ...rest }) => {
8493
8358
  const { theme, colorScheme } = useTheme_default();
8494
8359
  const styles = BaseSignUp_styles_default(theme, colorScheme);
8495
8360
  return /* @__PURE__ */ jsxs28("div", { children: [
8496
- /* @__PURE__ */ jsx67("div", { className: styles.logoContainer, children: /* @__PURE__ */ jsx67(Logo_default, { size: "large" }) }),
8497
- /* @__PURE__ */ jsx67(FlowProvider_default, { children: /* @__PURE__ */ jsx67(BaseSignUpContent, { ...props }) })
8361
+ showLogo && /* @__PURE__ */ jsx67("div", { className: styles.logoContainer, children: /* @__PURE__ */ jsx67(Logo_default, { size: "large" }) }),
8362
+ /* @__PURE__ */ jsx67(FlowProvider_default, { children: /* @__PURE__ */ jsx67(BaseSignUpContent, { showLogo, ...rest }) })
8498
8363
  ] });
8499
8364
  };
8500
8365
  var BaseSignUpContent = ({
@@ -8512,7 +8377,9 @@ var BaseSignUpContent = ({
8512
8377
  size = "medium",
8513
8378
  variant = "outlined",
8514
8379
  isInitialized,
8515
- children
8380
+ children,
8381
+ showTitle = true,
8382
+ showSubtitle = true
8516
8383
  }) => {
8517
8384
  const { theme, colorScheme } = useTheme_default();
8518
8385
  const { t } = useTranslation_default();
@@ -8540,7 +8407,7 @@ var BaseSignUpContent = ({
8540
8407
  return response;
8541
8408
  }
8542
8409
  if (response?.data && (response.data.inputs || response.data.actions)) {
8543
- const transformedComponents = transformSimpleToComponentDriven2(response, t);
8410
+ const transformedComponents = transformSimpleToComponentDriven(response, t);
8544
8411
  return {
8545
8412
  ...response,
8546
8413
  data: {
@@ -8905,9 +8772,11 @@ var BaseSignUpContent = ({
8905
8772
  ] }) }) });
8906
8773
  }
8907
8774
  return /* @__PURE__ */ jsxs28(Card_default, { className: cx21(containerClasses, styles.card), variant, children: [
8908
- /* @__PURE__ */ jsxs28(Card_default.Header, { className: styles.header, children: [
8909
- /* @__PURE__ */ jsx67(Card_default.Title, { level: 2, className: styles.title, children: flowTitle || t("signup.title") }),
8910
- /* @__PURE__ */ jsx67(Typography_default, { variant: "body1", className: styles.subtitle, children: flowSubtitle || t("signup.subtitle") }),
8775
+ (showTitle || showSubtitle) && /* @__PURE__ */ jsxs28(Card_default.Header, { className: styles.header, children: [
8776
+ showTitle && /* @__PURE__ */ jsx67(Card_default.Title, { level: 2, className: styles.title, children: flowTitle || t("signup.title") }),
8777
+ showSubtitle && /* @__PURE__ */ jsx67(Typography_default, { variant: "body1", className: styles.subtitle, children: flowSubtitle || t("signup.subtitle") })
8778
+ ] }),
8779
+ /* @__PURE__ */ jsxs28(Card_default.Content, { children: [
8911
8780
  flowMessages && flowMessages.length > 0 && /* @__PURE__ */ jsx67("div", { className: styles.flowMessagesContainer, children: flowMessages.map((message, index) => /* @__PURE__ */ jsx67(
8912
8781
  Alert_default,
8913
8782
  {
@@ -8916,9 +8785,9 @@ var BaseSignUpContent = ({
8916
8785
  children: /* @__PURE__ */ jsx67(Alert_default.Description, { children: message.message })
8917
8786
  },
8918
8787
  message.id || index
8919
- )) })
8920
- ] }),
8921
- /* @__PURE__ */ jsx67(Card_default.Content, { children: /* @__PURE__ */ jsx67("div", { className: styles.contentContainer, children: currentFlow.data?.components && currentFlow.data.components.length > 0 ? renderComponents(currentFlow.data.components) : /* @__PURE__ */ jsx67(Alert_default, { variant: "warning", children: /* @__PURE__ */ jsx67(Typography_default, { variant: "body1", children: t("errors.sign.up.components.not.available") }) }) }) })
8788
+ )) }),
8789
+ /* @__PURE__ */ jsx67("div", { className: styles.contentContainer, children: currentFlow.data?.components && currentFlow.data.components.length > 0 ? renderComponents(currentFlow.data.components) : /* @__PURE__ */ jsx67(Alert_default, { variant: "warning", children: /* @__PURE__ */ jsx67(Typography_default, { variant: "body1", children: t("errors.sign.up.components.not.available") }) }) })
8790
+ ] })
8922
8791
  ] });
8923
8792
  };
8924
8793
  var BaseSignUp_default = BaseSignUp;
@@ -8942,9 +8811,12 @@ var SignUp = ({
8942
8811
  }) => {
8943
8812
  const { signUp, isInitialized, applicationId, platform } = useAsgardeo_default();
8944
8813
  const handleInitialize = async (payload) => {
8814
+ const urlParams = new URL(window.location.href).searchParams;
8815
+ const applicationIdFromUrl = urlParams.get("applicationId");
8816
+ const effectiveApplicationId = applicationId || applicationIdFromUrl;
8945
8817
  const initialPayload = payload || {
8946
8818
  flowType: EmbeddedFlowType2.Registration,
8947
- ...platform === Platform5.AsgardeoV2 && applicationId && { applicationId }
8819
+ ...platform === Platform5.AsgardeoV2 && effectiveApplicationId && { applicationId: effectiveApplicationId }
8948
8820
  };
8949
8821
  return await signUp(initialPayload);
8950
8822
  };
@@ -8971,6 +8843,9 @@ var SignUp = ({
8971
8843
  size,
8972
8844
  isInitialized,
8973
8845
  children,
8846
+ showLogo: true,
8847
+ showTitle: platform === Platform5.AsgardeoV2,
8848
+ showSubtitle: platform === Platform5.AsgardeoV2,
8974
8849
  ...rest
8975
8850
  }
8976
8851
  );
@@ -9048,14 +8923,14 @@ var getMappedUserProfileValue_default = getMappedUserProfileValue;
9048
8923
  // src/components/primitives/Avatar/Avatar.tsx
9049
8924
  import { withVendorCSSClassPrefix as withVendorCSSClassPrefix22, bem as bem16 } from "@asgardeo/browser";
9050
8925
  import { cx as cx22 } from "@emotion/css";
9051
- import { useMemo as useMemo27 } from "react";
8926
+ import { useMemo as useMemo26 } from "react";
9052
8927
 
9053
8928
  // src/components/primitives/Avatar/Avatar.styles.ts
9054
- import { css as css19 } from "@emotion/css";
9055
- import { useMemo as useMemo26 } from "react";
9056
- var useStyles19 = (theme, colorScheme, size, variant, backgroundColor) => {
9057
- return useMemo26(() => {
9058
- const baseAvatar = css19`
8929
+ import { css as css18 } from "@emotion/css";
8930
+ import { useMemo as useMemo25 } from "react";
8931
+ var useStyles18 = (theme, colorScheme, size, variant, backgroundColor) => {
8932
+ return useMemo25(() => {
8933
+ const baseAvatar = css18`
9059
8934
  align-items: center;
9060
8935
  background: ${backgroundColor || theme.vars.colors.background.surface};
9061
8936
  border: ${backgroundColor ? "none" : `1px solid ${theme.vars.colors.border}`};
@@ -9071,19 +8946,19 @@ var useStyles19 = (theme, colorScheme, size, variant, backgroundColor) => {
9071
8946
  width: ${size}px;
9072
8947
  `;
9073
8948
  const variantStyles = {
9074
- circular: css19`
8949
+ circular: css18`
9075
8950
  border-radius: 50%;
9076
8951
  `,
9077
- square: css19`
8952
+ square: css18`
9078
8953
  border-radius: 8px;
9079
8954
  `
9080
8955
  };
9081
- const imageStyles = css19`
8956
+ const imageStyles = css18`
9082
8957
  height: 100%;
9083
8958
  object-fit: cover;
9084
8959
  width: 100%;
9085
8960
  `;
9086
- const skeletonStyles = css19`
8961
+ const skeletonStyles = css18`
9087
8962
  width: 100%;
9088
8963
  height: 100%;
9089
8964
  background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
@@ -9100,7 +8975,7 @@ var useStyles19 = (theme, colorScheme, size, variant, backgroundColor) => {
9100
8975
  }
9101
8976
  }
9102
8977
  `;
9103
- const iconStyles = css19`
8978
+ const iconStyles = css18`
9104
8979
  width: 60%;
9105
8980
  height: 60%;
9106
8981
  fill: ${backgroundColor ? "#ffffff" : theme.vars.colors.text.secondary};
@@ -9115,7 +8990,7 @@ var useStyles19 = (theme, colorScheme, size, variant, backgroundColor) => {
9115
8990
  };
9116
8991
  }, [theme, colorScheme, size, variant, backgroundColor]);
9117
8992
  };
9118
- var Avatar_styles_default = useStyles19;
8993
+ var Avatar_styles_default = useStyles18;
9119
8994
 
9120
8995
  // src/components/primitives/Avatar/Avatar.tsx
9121
8996
  import { jsx as jsx73 } from "react/jsx-runtime";
@@ -9148,7 +9023,7 @@ var Avatar = ({
9148
9023
  const colors = generateColor(seed);
9149
9024
  return `linear-gradient(${angle}deg, ${colors})`;
9150
9025
  };
9151
- const backgroundColor = useMemo27(() => {
9026
+ const backgroundColor = useMemo26(() => {
9152
9027
  if (!name || imageUrl) {
9153
9028
  return void 0;
9154
9029
  }
@@ -9311,18 +9186,18 @@ var X = (props) => /* @__PURE__ */ jsxs32(
9311
9186
  var X_default = X;
9312
9187
 
9313
9188
  // src/components/primitives/Dialog/Dialog.styles.ts
9314
- import { css as css20 } from "@emotion/css";
9315
- import { useMemo as useMemo28 } from "react";
9316
- var useStyles20 = (theme, colorScheme) => {
9317
- return useMemo28(() => {
9318
- const overlay = css20`
9189
+ import { css as css19 } from "@emotion/css";
9190
+ import { useMemo as useMemo27 } from "react";
9191
+ var useStyles19 = (theme, colorScheme) => {
9192
+ return useMemo27(() => {
9193
+ const overlay = css19`
9319
9194
  background-color: rgba(0, 0, 0, 0.5);
9320
9195
  display: flex;
9321
9196
  align-items: center;
9322
9197
  justify-content: center;
9323
9198
  z-index: 9999;
9324
9199
  `;
9325
- const content = css20`
9200
+ const content = css19`
9326
9201
  background: ${theme.vars.colors.background.surface};
9327
9202
  border-radius: ${theme.vars.borderRadius.large};
9328
9203
  box-shadow: 0 2px 8px ${colorScheme === "dark" ? "rgba(0, 0, 0, 0.3)" : "rgba(0, 0, 0, 0.15)"};
@@ -9330,7 +9205,7 @@ var useStyles20 = (theme, colorScheme) => {
9330
9205
  overflow-y: auto;
9331
9206
  z-index: 10000;
9332
9207
  `;
9333
- const dropdownContent = css20`
9208
+ const dropdownContent = css19`
9334
9209
  background: ${theme.vars.colors.background.surface};
9335
9210
  border-radius: ${theme.vars.borderRadius.large};
9336
9211
  box-shadow: 0 2px 8px ${colorScheme === "dark" ? "rgba(0, 0, 0, 0.3)" : "rgba(0, 0, 0, 0.15)"};
@@ -9340,23 +9215,23 @@ var useStyles20 = (theme, colorScheme) => {
9340
9215
  overflow-y: auto;
9341
9216
  z-index: 10000;
9342
9217
  `;
9343
- const header = css20`
9218
+ const header = css19`
9344
9219
  display: flex;
9345
9220
  justify-content: space-between;
9346
9221
  align-items: center;
9347
9222
  padding: calc(${theme.vars.spacing.unit} * 3) calc(${theme.vars.spacing.unit} * 4.5);
9348
9223
  border-bottom: 1px solid ${theme.vars.colors.border};
9349
9224
  `;
9350
- const headerTitle = css20`
9225
+ const headerTitle = css19`
9351
9226
  margin: 0;
9352
9227
  font-size: 1.2rem;
9353
9228
  font-weight: 600;
9354
9229
  color: ${theme.vars.colors.text.primary};
9355
9230
  `;
9356
- const contentBody = css20`
9231
+ const contentBody = css19`
9357
9232
  padding: calc(${theme.vars.spacing.unit} * 2);
9358
9233
  `;
9359
- const description = css20`
9234
+ const description = css19`
9360
9235
  margin: 0;
9361
9236
  color: ${theme.vars.colors.text.secondary};
9362
9237
  font-size: ${theme.vars.typography.fontSizes.sm};
@@ -9373,7 +9248,7 @@ var useStyles20 = (theme, colorScheme) => {
9373
9248
  };
9374
9249
  }, [theme, colorScheme]);
9375
9250
  };
9376
- var Dialog_styles_default = useStyles20;
9251
+ var Dialog_styles_default = useStyles19;
9377
9252
 
9378
9253
  // src/components/primitives/Dialog/Dialog.tsx
9379
9254
  import { jsx as jsx78, jsxs as jsxs33 } from "react/jsx-runtime";
@@ -9567,36 +9442,36 @@ import { cx as cx24 } from "@emotion/css";
9567
9442
  import { withVendorCSSClassPrefix as withVendorCSSClassPrefix24, bem as bem18 } from "@asgardeo/browser";
9568
9443
 
9569
9444
  // src/components/primitives/MultiInput/MultiInput.styles.ts
9570
- import { css as css21 } from "@emotion/css";
9571
- import { useMemo as useMemo29 } from "react";
9572
- var useStyles21 = (theme, colorScheme, disabled, hasError, canAddMore, canRemove) => {
9573
- return useMemo29(() => {
9574
- const container = css21`
9445
+ import { css as css20 } from "@emotion/css";
9446
+ import { useMemo as useMemo28 } from "react";
9447
+ var useStyles20 = (theme, colorScheme, disabled, hasError, canAddMore, canRemove) => {
9448
+ return useMemo28(() => {
9449
+ const container = css20`
9575
9450
  display: flex;
9576
9451
  flex-direction: column;
9577
9452
  gap: ${theme.vars.spacing.unit};
9578
9453
  `;
9579
- const inputRow = css21`
9454
+ const inputRow = css20`
9580
9455
  display: flex;
9581
9456
  align-items: center;
9582
9457
  gap: ${theme.vars.spacing.unit};
9583
9458
  position: relative;
9584
9459
  `;
9585
- const inputWrapper = css21`
9460
+ const inputWrapper = css20`
9586
9461
  flex: 1;
9587
9462
  `;
9588
- const plusIcon = css21`
9463
+ const plusIcon = css20`
9589
9464
  background: ${theme.vars.colors.secondary.main};
9590
9465
  border-radius: 50%;
9591
9466
  outline: 4px ${theme.vars.colors.secondary.main} auto;
9592
9467
  color: ${theme.vars.colors.secondary.contrastText};
9593
9468
  `;
9594
- const listContainer = css21`
9469
+ const listContainer = css20`
9595
9470
  display: flex;
9596
9471
  flex-direction: column;
9597
9472
  gap: 0;
9598
9473
  `;
9599
- const listItem = css21`
9474
+ const listItem = css20`
9600
9475
  display: flex;
9601
9476
  align-items: center;
9602
9477
  justify-content: space-between;
@@ -9611,11 +9486,11 @@ var useStyles21 = (theme, colorScheme, disabled, hasError, canAddMore, canRemove
9611
9486
  margin-bottom: 0;
9612
9487
  }
9613
9488
  `;
9614
- const listItemText = css21`
9489
+ const listItemText = css20`
9615
9490
  flex: 1;
9616
9491
  word-break: break-word;
9617
9492
  `;
9618
- const removeButton = css21`
9493
+ const removeButton = css20`
9619
9494
  padding: calc(${theme.vars.spacing.unit} / 2);
9620
9495
  min-width: auto;
9621
9496
  color: ${theme.vars.colors.error.main};
@@ -9635,7 +9510,7 @@ var useStyles21 = (theme, colorScheme, disabled, hasError, canAddMore, canRemove
9635
9510
  opacity: 0.6;
9636
9511
  }
9637
9512
  `;
9638
- const icon = css21`
9513
+ const icon = css20`
9639
9514
  width: 16px;
9640
9515
  height: 16px;
9641
9516
  stroke: currentColor;
@@ -9657,7 +9532,7 @@ var useStyles21 = (theme, colorScheme, disabled, hasError, canAddMore, canRemove
9657
9532
  };
9658
9533
  }, [theme, colorScheme, disabled, hasError, canAddMore, canRemove]);
9659
9534
  };
9660
- var MultiInput_styles_default = useStyles21;
9535
+ var MultiInput_styles_default = useStyles20;
9661
9536
 
9662
9537
  // src/components/primitives/MultiInput/MultiInput.tsx
9663
9538
  import { jsx as jsx79, jsxs as jsxs34 } from "react/jsx-runtime";
@@ -9802,15 +9677,15 @@ var MultiInput = ({
9802
9677
  var MultiInput_default = MultiInput;
9803
9678
 
9804
9679
  // src/components/presentation/UserProfile/BaseUserProfile.styles.ts
9805
- import { css as css22 } from "@emotion/css";
9806
- import { useMemo as useMemo30 } from "react";
9680
+ import { css as css21 } from "@emotion/css";
9681
+ import { useMemo as useMemo29 } from "react";
9807
9682
  import { withVendorCSSClassPrefix as withVendorCSSClassPrefix25 } from "@asgardeo/browser";
9808
- var useStyles22 = (theme, colorScheme) => {
9809
- const valuePlaceholder = css22`
9683
+ var useStyles21 = (theme, colorScheme) => {
9684
+ const valuePlaceholder = css21`
9810
9685
  font-style: italic;
9811
9686
  opacity: 0.7;
9812
9687
  `;
9813
- const editButton = css22`
9688
+ const editButton = css21`
9814
9689
  font-style: italic;
9815
9690
  text-decoration: underline;
9816
9691
  opacity: 0.7;
@@ -9821,19 +9696,19 @@ var useStyles22 = (theme, colorScheme) => {
9821
9696
  background-color: transparent;
9822
9697
  }
9823
9698
  `;
9824
- const fieldInner = css22`
9699
+ const fieldInner = css21`
9825
9700
  flex: 1;
9826
9701
  display: flex;
9827
9702
  align-items: center;
9828
9703
  gap: ${theme.vars.spacing.unit};
9829
9704
  `;
9830
- const fieldActions = css22`
9705
+ const fieldActions = css21`
9831
9706
  display: flex;
9832
9707
  gap: calc(${theme.vars.spacing.unit} / 2);
9833
9708
  align-items: center;
9834
9709
  margin-inline-start: calc(${theme.vars.spacing.unit} * 4);
9835
9710
  `;
9836
- const complexTextarea = css22`
9711
+ const complexTextarea = css21`
9837
9712
  min-height: 60px;
9838
9713
  width: 100%;
9839
9714
  padding: 8px;
@@ -9841,57 +9716,57 @@ var useStyles22 = (theme, colorScheme) => {
9841
9716
  border-radius: ${theme.vars.borderRadius.small};
9842
9717
  resize: vertical;
9843
9718
  `;
9844
- const objectKey = css22`
9719
+ const objectKey = css21`
9845
9720
  padding: ${theme.vars.spacing.unit};
9846
9721
  vertical-align: top;
9847
9722
  `;
9848
- const objectValue = css22`
9723
+ const objectValue = css21`
9849
9724
  padding: ${theme.vars.spacing.unit};
9850
9725
  vertical-align: top;
9851
9726
  `;
9852
- return useMemo30(() => {
9853
- const root = css22`
9727
+ return useMemo29(() => {
9728
+ const root = css21`
9854
9729
  padding: calc(${theme.vars.spacing.unit} * 4);
9855
9730
  min-width: 600px;
9856
9731
  margin: 0 auto;
9857
9732
  `;
9858
- const card = css22`
9733
+ const card = css21`
9859
9734
  background: ${theme.vars.colors.background.surface};
9860
9735
  border-radius: ${theme.vars.borderRadius.large};
9861
9736
  `;
9862
- const header = css22`
9737
+ const header = css21`
9863
9738
  display: flex;
9864
9739
  align-items: center;
9865
9740
  gap: calc(${theme.vars.spacing.unit} * 1.5);
9866
9741
  margin-bottom: calc(${theme.vars.spacing.unit} * 1.5);
9867
9742
  `;
9868
- const profileInfo = css22`
9743
+ const profileInfo = css21`
9869
9744
  flex: 1;
9870
9745
  `;
9871
- const name = css22`
9746
+ const name = css21`
9872
9747
  font-size: 1.5rem;
9873
9748
  font-weight: 600;
9874
9749
  margin: 0;
9875
9750
  color: ${theme.vars.colors.text.primary};
9876
9751
  `;
9877
- const infoContainer = css22`
9752
+ const infoContainer = css21`
9878
9753
  display: flex;
9879
9754
  flex-direction: column;
9880
9755
  `;
9881
- const info = css22`
9756
+ const info = css21`
9882
9757
  padding: calc(${theme.vars.spacing.unit} * 1.5) 0;
9883
9758
  border-bottom: 1px solid ${theme.vars.colors.border};
9884
9759
  `;
9885
- const field = css22`
9760
+ const field = css21`
9886
9761
  display: flex;
9887
9762
  align-items: center;
9888
9763
  padding: calc(${theme.vars.spacing.unit} / 2) 0;
9889
9764
  min-height: 28px;
9890
9765
  `;
9891
- const lastField = css22`
9766
+ const lastField = css21`
9892
9767
  border-bottom: none;
9893
9768
  `;
9894
- const label = css22`
9769
+ const label = css21`
9895
9770
  font-size: 0.875rem;
9896
9771
  font-weight: 500;
9897
9772
  color: ${theme.vars.colors.text.secondary};
@@ -9900,7 +9775,7 @@ var useStyles22 = (theme, colorScheme) => {
9900
9775
  line-height: 28px;
9901
9776
  text-align: start;
9902
9777
  `;
9903
- const value = css22`
9778
+ const value = css21`
9904
9779
  color: ${theme.vars.colors.text.primary};
9905
9780
  flex: 1;
9906
9781
  display: inline-block;
@@ -9933,10 +9808,10 @@ var useStyles22 = (theme, colorScheme) => {
9933
9808
  border-color: ${theme.vars.colors.border};
9934
9809
  }
9935
9810
  `;
9936
- const popup = css22`
9811
+ const popup = css21`
9937
9812
  padding: calc(${theme.vars.spacing.unit} * 2);
9938
9813
  `;
9939
- const alert = css22`
9814
+ const alert = css21`
9940
9815
  margin-bottom: calc(${theme.vars.spacing.unit} * 3);
9941
9816
  `;
9942
9817
  return {
@@ -9972,7 +9847,7 @@ var useStyles22 = (theme, colorScheme) => {
9972
9847
  colorScheme
9973
9848
  ]);
9974
9849
  };
9975
- var BaseUserProfile_styles_default = useStyles22;
9850
+ var BaseUserProfile_styles_default = useStyles21;
9976
9851
 
9977
9852
  // src/utils/getDisplayName.ts
9978
9853
  var getDisplayName = (mergedMappings, user) => {
@@ -10496,11 +10371,11 @@ import { cx as cx26 } from "@emotion/css";
10496
10371
  import { useState as useState21 } from "react";
10497
10372
 
10498
10373
  // src/components/presentation/UserDropdown/BaseUserDropdown.styles.ts
10499
- import { css as css23 } from "@emotion/css";
10500
- import { useMemo as useMemo31 } from "react";
10501
- var useStyles23 = (theme, colorScheme) => {
10502
- return useMemo31(() => {
10503
- const trigger = css23`
10374
+ import { css as css22 } from "@emotion/css";
10375
+ import { useMemo as useMemo30 } from "react";
10376
+ var useStyles22 = (theme, colorScheme) => {
10377
+ return useMemo30(() => {
10378
+ const trigger = css22`
10504
10379
  display: inline-flex;
10505
10380
  align-items: center;
10506
10381
  gap: calc(${theme.vars.spacing.unit} * 0.75);
@@ -10527,7 +10402,7 @@ var useStyles23 = (theme, colorScheme) => {
10527
10402
  box-shadow: none;
10528
10403
  }
10529
10404
  `;
10530
- const userName = css23`
10405
+ const userName = css22`
10531
10406
  color: ${theme.vars.colors.text.primary};
10532
10407
  font-size: 0.875rem;
10533
10408
  font-weight: 500;
@@ -10536,7 +10411,7 @@ var useStyles23 = (theme, colorScheme) => {
10536
10411
  text-overflow: ellipsis;
10537
10412
  white-space: nowrap;
10538
10413
  `;
10539
- const dropdownContent = css23`
10414
+ const dropdownContent = css22`
10540
10415
  background: ${theme.vars.colors.background.surface};
10541
10416
  border-radius: ${theme.vars.borderRadius.large};
10542
10417
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
@@ -10546,12 +10421,12 @@ var useStyles23 = (theme, colorScheme) => {
10546
10421
  z-index: 1000;
10547
10422
  overflow: hidden;
10548
10423
  `;
10549
- const dropdownMenu = css23`
10424
+ const dropdownMenu = css22`
10550
10425
  display: flex;
10551
10426
  flex-direction: column;
10552
10427
  width: 100%;
10553
10428
  `;
10554
- const menuItem = css23`
10429
+ const menuItem = css22`
10555
10430
  display: flex;
10556
10431
  align-items: center;
10557
10432
  justify-content: flex-start;
@@ -10579,7 +10454,7 @@ var useStyles23 = (theme, colorScheme) => {
10579
10454
  box-shadow: none;
10580
10455
  }
10581
10456
  `;
10582
- const menuItemAnchor = css23`
10457
+ const menuItemAnchor = css22`
10583
10458
  display: flex;
10584
10459
  align-items: center;
10585
10460
  justify-content: flex-start;
@@ -10600,18 +10475,18 @@ var useStyles23 = (theme, colorScheme) => {
10600
10475
  background-color: ${theme.vars.colors.action?.hover || "rgba(0, 0, 0, 0.05)"};
10601
10476
  }
10602
10477
  `;
10603
- const divider = css23`
10478
+ const divider = css22`
10604
10479
  margin: calc(${theme.vars.spacing.unit} * 0.5) 0;
10605
10480
  border-bottom: 1px solid ${theme.vars.colors.border};
10606
10481
  `;
10607
- const dropdownHeader = css23`
10482
+ const dropdownHeader = css22`
10608
10483
  display: flex;
10609
10484
  align-items: center;
10610
10485
  gap: ${theme.vars.spacing.unit};
10611
10486
  padding: calc(${theme.vars.spacing.unit} * 1.5);
10612
10487
  border-bottom: 1px solid ${theme.vars.colors.border};
10613
10488
  `;
10614
- const headerInfo = css23`
10489
+ const headerInfo = css22`
10615
10490
  display: flex;
10616
10491
  flex-direction: column;
10617
10492
  gap: calc(${theme.vars.spacing.unit} / 4);
@@ -10621,7 +10496,7 @@ var useStyles23 = (theme, colorScheme) => {
10621
10496
  text-overflow: ellipsis;
10622
10497
  white-space: nowrap;
10623
10498
  `;
10624
- const headerName = css23`
10499
+ const headerName = css22`
10625
10500
  color: ${theme.vars.colors.text.primary};
10626
10501
  font-size: 1rem;
10627
10502
  font-weight: 500;
@@ -10630,7 +10505,7 @@ var useStyles23 = (theme, colorScheme) => {
10630
10505
  text-overflow: ellipsis;
10631
10506
  white-space: nowrap;
10632
10507
  `;
10633
- const headerEmail = css23`
10508
+ const headerEmail = css22`
10634
10509
  color: ${theme.vars.colors.text.secondary};
10635
10510
  font-size: 0.875rem;
10636
10511
  margin: 0;
@@ -10638,14 +10513,14 @@ var useStyles23 = (theme, colorScheme) => {
10638
10513
  text-overflow: ellipsis;
10639
10514
  white-space: nowrap;
10640
10515
  `;
10641
- const loadingContainer = css23`
10516
+ const loadingContainer = css22`
10642
10517
  display: flex;
10643
10518
  align-items: center;
10644
10519
  justify-content: center;
10645
10520
  min-height: 80px;
10646
10521
  gap: ${theme.vars.spacing.unit};
10647
10522
  `;
10648
- const loadingText = css23`
10523
+ const loadingText = css22`
10649
10524
  color: ${theme.vars.colors.text.secondary};
10650
10525
  font-size: 0.875rem;
10651
10526
  `;
@@ -10677,7 +10552,7 @@ var useStyles23 = (theme, colorScheme) => {
10677
10552
  colorScheme
10678
10553
  ]);
10679
10554
  };
10680
- var BaseUserDropdown_styles_default = useStyles23;
10555
+ var BaseUserDropdown_styles_default = useStyles22;
10681
10556
 
10682
10557
  // src/components/presentation/UserDropdown/BaseUserDropdown.tsx
10683
10558
  import { jsx as jsx82, jsxs as jsxs36 } from "react/jsx-runtime";
@@ -10989,15 +10864,15 @@ ChevronDown.displayName = "ChevronDown";
10989
10864
  var ChevronDown_default = ChevronDown;
10990
10865
 
10991
10866
  // src/components/presentation/OrganizationSwitcher/BaseOrganizationSwitcher.styles.ts
10992
- import { css as css24 } from "@emotion/css";
10993
- import { useMemo as useMemo32 } from "react";
10994
- var useStyles24 = (theme, colorScheme) => {
10995
- return useMemo32(() => {
10996
- const root = css24`
10867
+ import { css as css23 } from "@emotion/css";
10868
+ import { useMemo as useMemo31 } from "react";
10869
+ var useStyles23 = (theme, colorScheme) => {
10870
+ return useMemo31(() => {
10871
+ const root = css23`
10997
10872
  display: inline-block;
10998
10873
  position: relative;
10999
10874
  `;
11000
- const trigger = css24`
10875
+ const trigger = css23`
11001
10876
  display: inline-flex;
11002
10877
  align-items: center;
11003
10878
  gap: ${theme.vars.spacing.unit};
@@ -11017,7 +10892,7 @@ var useStyles24 = (theme, colorScheme) => {
11017
10892
  background-color: ${theme.vars.colors.background.surface};
11018
10893
  }
11019
10894
  `;
11020
- const triggerLabel = css24`
10895
+ const triggerLabel = css23`
11021
10896
  color: ${theme.vars.colors.text.primary};
11022
10897
  font-weight: 500;
11023
10898
  overflow: hidden;
@@ -11025,7 +10900,7 @@ var useStyles24 = (theme, colorScheme) => {
11025
10900
  white-space: nowrap;
11026
10901
  flex: 1;
11027
10902
  `;
11028
- const content = css24`
10903
+ const content = css23`
11029
10904
  min-width: 280px;
11030
10905
  max-width: 400px;
11031
10906
  background-color: ${theme.vars.colors.background.surface};
@@ -11035,13 +10910,13 @@ var useStyles24 = (theme, colorScheme) => {
11035
10910
  outline: none;
11036
10911
  z-index: 1000;
11037
10912
  `;
11038
- const header = css24`
10913
+ const header = css23`
11039
10914
  display: flex;
11040
10915
  align-items: center;
11041
10916
  gap: ${theme.vars.spacing.unit};
11042
10917
  padding: ${theme.vars.spacing.unit} calc(${theme.vars.spacing.unit} * 2);
11043
10918
  `;
11044
- const headerInfo = css24`
10919
+ const headerInfo = css23`
11045
10920
  display: flex;
11046
10921
  flex-direction: column;
11047
10922
  gap: calc(${theme.vars.spacing.unit} / 4);
@@ -11049,7 +10924,7 @@ var useStyles24 = (theme, colorScheme) => {
11049
10924
  min-width: 0;
11050
10925
  overflow: hidden;
11051
10926
  `;
11052
- const headerName = css24`
10927
+ const headerName = css23`
11053
10928
  color: ${theme.vars.colors.text.primary};
11054
10929
  font-size: 0.875rem;
11055
10930
  font-weight: 500;
@@ -11058,7 +10933,7 @@ var useStyles24 = (theme, colorScheme) => {
11058
10933
  text-overflow: ellipsis;
11059
10934
  white-space: nowrap;
11060
10935
  `;
11061
- const headerMeta = css24`
10936
+ const headerMeta = css23`
11062
10937
  color: ${theme.vars.colors.text.secondary};
11063
10938
  font-size: 0.75rem;
11064
10939
  margin: 0;
@@ -11066,7 +10941,7 @@ var useStyles24 = (theme, colorScheme) => {
11066
10941
  text-overflow: ellipsis;
11067
10942
  white-space: nowrap;
11068
10943
  `;
11069
- const headerRole = css24`
10944
+ const headerRole = css23`
11070
10945
  color: ${theme.vars.colors.text.secondary};
11071
10946
  font-size: 0.75rem;
11072
10947
  margin: 0;
@@ -11075,16 +10950,16 @@ var useStyles24 = (theme, colorScheme) => {
11075
10950
  white-space: nowrap;
11076
10951
  text-transform: capitalize;
11077
10952
  `;
11078
- const manageButton = css24`
10953
+ const manageButton = css23`
11079
10954
  min-width: auto;
11080
10955
  margin-inline-start: auto;
11081
10956
  `;
11082
- const menu = css24`
10957
+ const menu = css23`
11083
10958
  display: flex;
11084
10959
  flex-direction: column;
11085
10960
  width: 100%;
11086
10961
  `;
11087
- const menuItem = css24`
10962
+ const menuItem = css23`
11088
10963
  display: flex;
11089
10964
  align-items: center;
11090
10965
  justify-content: flex-start;
@@ -11109,11 +10984,11 @@ var useStyles24 = (theme, colorScheme) => {
11109
10984
  background-color: ${theme.vars.colors.action?.hover || "rgba(0, 0, 0, 0.04)"};
11110
10985
  }
11111
10986
  `;
11112
- const menuDivider = css24`
10987
+ const menuDivider = css23`
11113
10988
  margin: calc(${theme.vars.spacing.unit} * 0.5) 0;
11114
10989
  border-bottom: 1px solid ${theme.vars.colors.border};
11115
10990
  `;
11116
- const organizationInfo = css24`
10991
+ const organizationInfo = css23`
11117
10992
  display: flex;
11118
10993
  flex-direction: column;
11119
10994
  gap: calc(${theme.vars.spacing.unit} / 4);
@@ -11121,7 +10996,7 @@ var useStyles24 = (theme, colorScheme) => {
11121
10996
  min-width: 0;
11122
10997
  overflow: hidden;
11123
10998
  `;
11124
- const organizationName = css24`
10999
+ const organizationName = css23`
11125
11000
  color: ${theme.vars.colors.text.primary};
11126
11001
  font-size: 0.875rem;
11127
11002
  font-weight: 500;
@@ -11130,7 +11005,7 @@ var useStyles24 = (theme, colorScheme) => {
11130
11005
  text-overflow: ellipsis;
11131
11006
  white-space: nowrap;
11132
11007
  `;
11133
- const organizationMeta = css24`
11008
+ const organizationMeta = css23`
11134
11009
  color: ${theme.vars.colors.text.secondary};
11135
11010
  font-size: 0.75rem;
11136
11011
  margin: 0;
@@ -11138,40 +11013,40 @@ var useStyles24 = (theme, colorScheme) => {
11138
11013
  text-overflow: ellipsis;
11139
11014
  white-space: nowrap;
11140
11015
  `;
11141
- const loadingContainer = css24`
11016
+ const loadingContainer = css23`
11142
11017
  display: flex;
11143
11018
  align-items: center;
11144
11019
  justify-content: center;
11145
11020
  min-height: 80px;
11146
11021
  gap: ${theme.vars.spacing.unit};
11147
11022
  `;
11148
- const loadingText = css24`
11023
+ const loadingText = css23`
11149
11024
  color: ${theme.vars.colors.text.secondary};
11150
11025
  font-size: 0.875rem;
11151
11026
  `;
11152
- const errorContainer = css24`
11027
+ const errorContainer = css23`
11153
11028
  display: flex;
11154
11029
  align-items: center;
11155
11030
  justify-content: center;
11156
11031
  min-height: 80px;
11157
11032
  padding: calc(${theme.vars.spacing.unit} * 2);
11158
11033
  `;
11159
- const errorText = css24`
11034
+ const errorText = css23`
11160
11035
  color: ${theme.vars.colors.text.secondary};
11161
11036
  font-size: 0.875rem;
11162
11037
  text-align: center;
11163
11038
  `;
11164
- const sectionHeader = css24`
11039
+ const sectionHeader = css23`
11165
11040
  text-transform: uppercase;
11166
11041
  letter-spacing: 0.05em;
11167
11042
  color: ${theme.vars.colors.text.secondary};
11168
11043
  `;
11169
- const sectionHeaderContainer = css24`
11044
+ const sectionHeaderContainer = css23`
11170
11045
  border-top: none;
11171
11046
  border-bottom: none;
11172
11047
  padding-bottom: calc(${theme.vars.spacing.unit} / 2);
11173
11048
  `;
11174
- const roleCapitalized = css24`
11049
+ const roleCapitalized = css23`
11175
11050
  text-transform: capitalize;
11176
11051
  `;
11177
11052
  return {
@@ -11211,7 +11086,7 @@ var useStyles24 = (theme, colorScheme) => {
11211
11086
  colorScheme
11212
11087
  ]);
11213
11088
  };
11214
- var BaseOrganizationSwitcher_styles_default = useStyles24;
11089
+ var BaseOrganizationSwitcher_styles_default = useStyles23;
11215
11090
 
11216
11091
  // src/components/presentation/OrganizationSwitcher/BaseOrganizationSwitcher.tsx
11217
11092
  import { Fragment as Fragment17, jsx as jsx87, jsxs as jsxs39 } from "react/jsx-runtime";
@@ -11478,50 +11353,50 @@ import { cx as cx28 } from "@emotion/css";
11478
11353
  import { useState as useState24 } from "react";
11479
11354
 
11480
11355
  // src/components/presentation/CreateOrganization/BaseCreateOrganization.styles.ts
11481
- import { css as css25 } from "@emotion/css";
11482
- import { useMemo as useMemo33 } from "react";
11483
- var useStyles25 = (theme, colorScheme) => {
11484
- return useMemo33(() => {
11485
- const root = css25`
11356
+ import { css as css24 } from "@emotion/css";
11357
+ import { useMemo as useMemo32 } from "react";
11358
+ var useStyles24 = (theme, colorScheme) => {
11359
+ return useMemo32(() => {
11360
+ const root = css24`
11486
11361
  padding: calc(${theme.vars.spacing.unit} * 4);
11487
11362
  min-width: 600px;
11488
11363
  margin: 0 auto;
11489
11364
  `;
11490
- const card = css25`
11365
+ const card = css24`
11491
11366
  background: ${theme.vars.colors.background.surface};
11492
11367
  border-radius: ${theme.vars.borderRadius.large};
11493
11368
  padding: calc(${theme.vars.spacing.unit} * 4);
11494
11369
  `;
11495
- const content = css25`
11370
+ const content = css24`
11496
11371
  display: flex;
11497
11372
  flex-direction: column;
11498
11373
  gap: calc(${theme.vars.spacing.unit} * 2);
11499
11374
  `;
11500
- const form = css25`
11375
+ const form = css24`
11501
11376
  display: flex;
11502
11377
  flex-direction: column;
11503
11378
  gap: calc(${theme.vars.spacing.unit} * 2);
11504
11379
  width: 100%;
11505
11380
  `;
11506
- const header = css25`
11381
+ const header = css24`
11507
11382
  display: flex;
11508
11383
  align-items: center;
11509
11384
  gap: calc(${theme.vars.spacing.unit} * 1.5);
11510
11385
  margin-bottom: calc(${theme.vars.spacing.unit} * 1.5);
11511
11386
  `;
11512
- const field = css25`
11387
+ const field = css24`
11513
11388
  display: flex;
11514
11389
  align-items: center;
11515
11390
  padding: ${theme.vars.spacing.unit} 0;
11516
11391
  border-bottom: 1px solid ${theme.vars.colors.border};
11517
11392
  min-height: 32px;
11518
11393
  `;
11519
- const fieldGroup = css25`
11394
+ const fieldGroup = css24`
11520
11395
  display: flex;
11521
11396
  flex-direction: column;
11522
11397
  gap: calc(${theme.vars.spacing.unit} * 0.5);
11523
11398
  `;
11524
- const textarea = css25`
11399
+ const textarea = css24`
11525
11400
  width: 100%;
11526
11401
  padding: ${theme.vars.spacing.unit} calc(${theme.vars.spacing.unit} * 1.5);
11527
11402
  border: 1px solid ${theme.vars.colors.border};
@@ -11543,28 +11418,28 @@ var useStyles25 = (theme, colorScheme) => {
11543
11418
  cursor: not-allowed;
11544
11419
  }
11545
11420
  `;
11546
- const textareaError = css25`
11421
+ const textareaError = css24`
11547
11422
  border-color: ${theme.vars.colors.error.main};
11548
11423
  `;
11549
- const input = css25``;
11550
- const avatarContainer = css25`
11424
+ const input = css24``;
11425
+ const avatarContainer = css24`
11551
11426
  align-items: flex-start;
11552
11427
  display: flex;
11553
11428
  gap: calc(${theme.vars.spacing.unit} * 2);
11554
11429
  margin-bottom: ${theme.vars.spacing.unit};
11555
11430
  `;
11556
- const actions = css25`
11431
+ const actions = css24`
11557
11432
  display: flex;
11558
11433
  gap: ${theme.vars.spacing.unit};
11559
11434
  justify-content: flex-end;
11560
11435
  padding-top: calc(${theme.vars.spacing.unit} * 2);
11561
11436
  `;
11562
- const infoContainer = css25`
11437
+ const infoContainer = css24`
11563
11438
  display: flex;
11564
11439
  flex-direction: column;
11565
11440
  gap: ${theme.vars.spacing.unit};
11566
11441
  `;
11567
- const value = css25`
11442
+ const value = css24`
11568
11443
  color: ${theme.vars.colors.text.primary};
11569
11444
  flex: 1;
11570
11445
  display: flex;
@@ -11574,10 +11449,10 @@ var useStyles25 = (theme, colorScheme) => {
11574
11449
  min-height: 32px;
11575
11450
  line-height: 32px;
11576
11451
  `;
11577
- const popup = css25`
11452
+ const popup = css24`
11578
11453
  padding: calc(${theme.vars.spacing.unit} * 2);
11579
11454
  `;
11580
- const errorAlert = css25`
11455
+ const errorAlert = css24`
11581
11456
  margin-bottom: calc(${theme.vars.spacing.unit} * 2);
11582
11457
  `;
11583
11458
  return {
@@ -11613,7 +11488,7 @@ var useStyles25 = (theme, colorScheme) => {
11613
11488
  colorScheme
11614
11489
  ]);
11615
11490
  };
11616
- var BaseCreateOrganization_styles_default = useStyles25;
11491
+ var BaseCreateOrganization_styles_default = useStyles24;
11617
11492
 
11618
11493
  // src/components/presentation/CreateOrganization/BaseCreateOrganization.tsx
11619
11494
  import { jsx as jsx88, jsxs as jsxs40 } from "react/jsx-runtime";
@@ -11873,30 +11748,30 @@ import { cx as cx29 } from "@emotion/css";
11873
11748
  import { useState as useState26, useCallback as useCallback14 } from "react";
11874
11749
 
11875
11750
  // src/components/primitives/KeyValueInput/KeyValueInput.styles.ts
11876
- import { css as css26 } from "@emotion/css";
11877
- import { useMemo as useMemo34 } from "react";
11878
- var useStyles26 = (theme, colorScheme, disabled, readOnly, hasError) => {
11879
- return useMemo34(() => {
11880
- const container = css26`
11751
+ import { css as css25 } from "@emotion/css";
11752
+ import { useMemo as useMemo33 } from "react";
11753
+ var useStyles25 = (theme, colorScheme, disabled, readOnly, hasError) => {
11754
+ return useMemo33(() => {
11755
+ const container = css25`
11881
11756
  display: flex;
11882
11757
  flex-direction: column;
11883
11758
  gap: calc(${theme.vars.spacing.unit} / 2);
11884
11759
  `;
11885
- const label = css26`
11760
+ const label = css25`
11886
11761
  font-size: 0.875rem;
11887
11762
  font-weight: 500;
11888
11763
  color: ${theme.vars.colors.text.primary};
11889
11764
  margin-bottom: calc(${theme.vars.spacing.unit} / 2);
11890
11765
  `;
11891
- const requiredIndicator = css26`
11766
+ const requiredIndicator = css25`
11892
11767
  color: ${theme.vars.colors.error.main};
11893
11768
  `;
11894
- const pairsList = css26`
11769
+ const pairsList = css25`
11895
11770
  display: flex;
11896
11771
  flex-direction: column;
11897
11772
  gap: calc(${theme.vars.spacing.unit} / 4);
11898
11773
  `;
11899
- const pairRow = css26`
11774
+ const pairRow = css25`
11900
11775
  display: flex;
11901
11776
  align-items: center;
11902
11777
  gap: calc(${theme.vars.spacing.unit} / 2);
@@ -11909,11 +11784,11 @@ var useStyles26 = (theme, colorScheme, disabled, readOnly, hasError) => {
11909
11784
  background-color: ${theme.vars.colors.action.hover};
11910
11785
  }
11911
11786
  `;
11912
- const pairInput = css26`
11787
+ const pairInput = css25`
11913
11788
  flex: 1;
11914
11789
  min-width: 0;
11915
11790
  `;
11916
- const addRow = css26`
11791
+ const addRow = css25`
11917
11792
  display: flex;
11918
11793
  align-items: center;
11919
11794
  gap: calc(${theme.vars.spacing.unit} / 2);
@@ -11923,7 +11798,7 @@ var useStyles26 = (theme, colorScheme, disabled, readOnly, hasError) => {
11923
11798
  background-color: transparent;
11924
11799
  margin-top: calc(${theme.vars.spacing.unit} / 2);
11925
11800
  `;
11926
- const removeButton = css26`
11801
+ const removeButton = css25`
11927
11802
  min-width: auto;
11928
11803
  width: 24px;
11929
11804
  height: 24px;
@@ -11946,7 +11821,7 @@ var useStyles26 = (theme, colorScheme, disabled, readOnly, hasError) => {
11946
11821
  opacity: 0.6;
11947
11822
  }
11948
11823
  `;
11949
- const addButton = css26`
11824
+ const addButton = css25`
11950
11825
  min-width: auto;
11951
11826
  width: 24px;
11952
11827
  height: 24px;
@@ -11969,39 +11844,39 @@ var useStyles26 = (theme, colorScheme, disabled, readOnly, hasError) => {
11969
11844
  opacity: 0.6;
11970
11845
  }
11971
11846
  `;
11972
- const helperText = css26`
11847
+ const helperText = css25`
11973
11848
  font-size: 0.75rem;
11974
11849
  color: ${hasError ? theme.vars.colors.error.main : theme.vars.colors.text.secondary};
11975
11850
  margin-top: calc(${theme.vars.spacing.unit} / 2);
11976
11851
  `;
11977
- const emptyState = css26`
11852
+ const emptyState = css25`
11978
11853
  padding: ${theme.vars.spacing.unit};
11979
11854
  text-align: center;
11980
11855
  color: ${theme.vars.colors.text.secondary};
11981
11856
  font-style: italic;
11982
11857
  font-size: 0.75rem;
11983
11858
  `;
11984
- const readOnlyPair = css26`
11859
+ const readOnlyPair = css25`
11985
11860
  display: flex;
11986
11861
  align-items: center;
11987
11862
  gap: calc(${theme.vars.spacing.unit} / 2);
11988
11863
  padding: calc(${theme.vars.spacing.unit} / 4) 0;
11989
11864
  min-height: 20px;
11990
11865
  `;
11991
- const readOnlyKey = css26`
11866
+ const readOnlyKey = css25`
11992
11867
  font-size: 0.75rem;
11993
11868
  font-weight: 500;
11994
11869
  color: ${theme.vars.colors.text.secondary};
11995
11870
  min-width: 80px;
11996
11871
  flex-shrink: 0;
11997
11872
  `;
11998
- const readOnlyValue = css26`
11873
+ const readOnlyValue = css25`
11999
11874
  font-size: 0.75rem;
12000
11875
  color: ${theme.vars.colors.text.primary};
12001
11876
  word-break: break-word;
12002
11877
  flex: 1;
12003
11878
  `;
12004
- const counterText = css26`
11879
+ const counterText = css25`
12005
11880
  font-size: 0.75rem;
12006
11881
  color: ${theme.vars.colors.text.secondary};
12007
11882
  margin-top: calc(${theme.vars.spacing.unit} / 2);
@@ -12025,7 +11900,7 @@ var useStyles26 = (theme, colorScheme, disabled, readOnly, hasError) => {
12025
11900
  };
12026
11901
  }, [theme, colorScheme, disabled, readOnly, hasError]);
12027
11902
  };
12028
- var KeyValueInput_styles_default = useStyles26;
11903
+ var KeyValueInput_styles_default = useStyles25;
12029
11904
 
12030
11905
  // src/components/primitives/KeyValueInput/KeyValueInput.tsx
12031
11906
  import { jsx as jsx90, jsxs as jsxs41 } from "react/jsx-runtime";
@@ -12235,48 +12110,48 @@ var KeyValueInput = ({
12235
12110
  var KeyValueInput_default = KeyValueInput;
12236
12111
 
12237
12112
  // src/components/presentation/OrganizationProfile/BaseOrganizationProfile.styles.ts
12238
- import { css as css27 } from "@emotion/css";
12239
- import { useMemo as useMemo35 } from "react";
12240
- var useStyles27 = (theme, colorScheme) => {
12241
- return useMemo35(() => {
12113
+ import { css as css26 } from "@emotion/css";
12114
+ import { useMemo as useMemo34 } from "react";
12115
+ var useStyles26 = (theme, colorScheme) => {
12116
+ return useMemo34(() => {
12242
12117
  return {
12243
- root: css27`
12118
+ root: css26`
12244
12119
  padding: calc(${theme.vars.spacing.unit} * 4);
12245
12120
  min-width: 600px;
12246
12121
  margin: 0 auto;
12247
12122
  `,
12248
- card: css27`
12123
+ card: css26`
12249
12124
  background: ${theme.vars.colors.background.surface};
12250
12125
  border-radius: ${theme.vars.borderRadius.large};
12251
12126
  `,
12252
- header: css27`
12127
+ header: css26`
12253
12128
  display: flex;
12254
12129
  align-items: center;
12255
12130
  gap: calc(${theme.vars.spacing.unit} * 2);
12256
12131
  margin-bottom: calc(${theme.vars.spacing.unit} * 3);
12257
12132
  padding-bottom: calc(${theme.vars.spacing.unit} * 2);
12258
12133
  `,
12259
- orgInfo: css27`
12134
+ orgInfo: css26`
12260
12135
  flex: 1;
12261
12136
  `,
12262
- name: css27`
12137
+ name: css26`
12263
12138
  font-size: 1.5rem;
12264
12139
  font-weight: 600;
12265
12140
  margin: 0 0 8px 0;
12266
12141
  color: ${theme.vars.colors.text.primary};
12267
12142
  `,
12268
- handle: css27`
12143
+ handle: css26`
12269
12144
  font-size: 1rem;
12270
12145
  color: ${theme.vars.colors.text.secondary};
12271
12146
  margin: 0;
12272
12147
  font-family: monospace;
12273
12148
  `,
12274
- infoContainer: css27`
12149
+ infoContainer: css26`
12275
12150
  display: flex;
12276
12151
  flex-direction: column;
12277
12152
  gap: ${theme.vars.spacing.unit};
12278
12153
  `,
12279
- field: css27`
12154
+ field: css26`
12280
12155
  display: flex;
12281
12156
  align-items: flex-start;
12282
12157
  padding: calc(${theme.vars.spacing.unit} / 2) 0;
@@ -12284,21 +12159,21 @@ var useStyles27 = (theme, colorScheme) => {
12284
12159
  min-height: 28px;
12285
12160
  gap: ${theme.vars.spacing.unit};
12286
12161
  `,
12287
- fieldLast: css27`
12162
+ fieldLast: css26`
12288
12163
  border-bottom: none;
12289
12164
  `,
12290
- fieldContent: css27`
12165
+ fieldContent: css26`
12291
12166
  flex: 1;
12292
12167
  display: flex;
12293
12168
  align-items: center;
12294
12169
  gap: ${theme.vars.spacing.unit};
12295
12170
  `,
12296
- fieldActions: css27`
12171
+ fieldActions: css26`
12297
12172
  display: flex;
12298
12173
  align-items: center;
12299
12174
  gap: calc(${theme.vars.spacing.unit} / 2);
12300
12175
  `,
12301
- label: css27`
12176
+ label: css26`
12302
12177
  font-size: 0.875rem;
12303
12178
  font-weight: 500;
12304
12179
  color: ${theme.vars.colors.text.secondary};
@@ -12306,7 +12181,7 @@ var useStyles27 = (theme, colorScheme) => {
12306
12181
  flex-shrink: 0;
12307
12182
  line-height: 28px;
12308
12183
  `,
12309
- value: css27`
12184
+ value: css26`
12310
12185
  color: ${theme.vars.colors.text.primary};
12311
12186
  flex: 1;
12312
12187
  display: flex;
@@ -12317,11 +12192,11 @@ var useStyles27 = (theme, colorScheme) => {
12317
12192
  line-height: 28px;
12318
12193
  word-break: break-word;
12319
12194
  `,
12320
- valueEmpty: css27`
12195
+ valueEmpty: css26`
12321
12196
  font-style: italic;
12322
12197
  opacity: 0.7;
12323
12198
  `,
12324
- statusBadge: css27`
12199
+ statusBadge: css26`
12325
12200
  padding: calc(${theme.vars.spacing.unit} / 2) ${theme.vars.spacing.unit};
12326
12201
  border-radius: ${theme.vars.borderRadius.small};
12327
12202
  font-size: 0.75rem;
@@ -12330,12 +12205,12 @@ var useStyles27 = (theme, colorScheme) => {
12330
12205
  text-transform: uppercase;
12331
12206
  letter-spacing: 0.5px;
12332
12207
  `,
12333
- permissionsList: css27`
12208
+ permissionsList: css26`
12334
12209
  display: flex;
12335
12210
  flex-wrap: wrap;
12336
12211
  gap: calc(${theme.vars.spacing.unit} / 2);
12337
12212
  `,
12338
- permissionBadge: css27`
12213
+ permissionBadge: css26`
12339
12214
  padding: calc(${theme.vars.spacing.unit} / 4) ${theme.vars.spacing.unit};
12340
12215
  border-radius: ${theme.vars.borderRadius.small};
12341
12216
  font-size: 0.75rem;
@@ -12343,52 +12218,52 @@ var useStyles27 = (theme, colorScheme) => {
12343
12218
  color: ${theme.vars.colors.primary.contrastText};
12344
12219
  border: 1px solid ${theme.vars.colors.border};
12345
12220
  `,
12346
- attributesList: css27`
12221
+ attributesList: css26`
12347
12222
  display: flex;
12348
12223
  flex-direction: column;
12349
12224
  gap: calc(${theme.vars.spacing.unit} / 4);
12350
12225
  `,
12351
- attributeItem: css27`
12226
+ attributeItem: css26`
12352
12227
  display: flex;
12353
12228
  gap: ${theme.vars.spacing.unit};
12354
12229
  padding: calc(${theme.vars.spacing.unit} / 4) 0;
12355
12230
  align-items: center;
12356
12231
  `,
12357
- attributeKey: css27`
12232
+ attributeKey: css26`
12358
12233
  font-size: 0.75rem;
12359
12234
  font-weight: 500;
12360
12235
  color: ${theme.vars.colors.text.secondary};
12361
12236
  min-width: 80px;
12362
12237
  flex-shrink: 0;
12363
12238
  `,
12364
- attributeValue: css27`
12239
+ attributeValue: css26`
12365
12240
  font-size: 0.75rem;
12366
12241
  color: ${theme.vars.colors.text.primary};
12367
12242
  word-break: break-word;
12368
12243
  flex: 1;
12369
12244
  `,
12370
- popup: css27`
12245
+ popup: css26`
12371
12246
  padding: calc(${theme.vars.spacing.unit} * 2);
12372
12247
  `,
12373
- editButton: css27`
12248
+ editButton: css26`
12374
12249
  min-width: auto;
12375
12250
  padding: calc(${theme.vars.spacing.unit} / 2);
12376
12251
  min-height: auto;
12377
12252
  `,
12378
- placeholderButton: css27`
12253
+ placeholderButton: css26`
12379
12254
  font-style: italic;
12380
12255
  text-decoration: underline;
12381
12256
  opacity: 0.7;
12382
12257
  padding: 0;
12383
12258
  min-height: auto;
12384
12259
  `,
12385
- fieldInput: css27`
12260
+ fieldInput: css26`
12386
12261
  margin-bottom: 0;
12387
12262
  `
12388
12263
  };
12389
12264
  }, [theme, colorScheme]);
12390
12265
  };
12391
- var BaseOrganizationProfile_styles_default = useStyles27;
12266
+ var BaseOrganizationProfile_styles_default = useStyles26;
12392
12267
 
12393
12268
  // src/components/presentation/OrganizationProfile/BaseOrganizationProfile.tsx
12394
12269
  import { Fragment as Fragment19, jsx as jsx91, jsxs as jsxs42 } from "react/jsx-runtime";
@@ -12813,21 +12688,21 @@ import { useEffect as useEffect16, useState as useState29 } from "react";
12813
12688
 
12814
12689
  // src/components/presentation/OrganizationList/BaseOrganizationList.tsx
12815
12690
  import { cx as cx31 } from "@emotion/css";
12816
- import { useMemo as useMemo37 } from "react";
12691
+ import { useMemo as useMemo36 } from "react";
12817
12692
 
12818
12693
  // src/components/presentation/OrganizationList/BaseOrganizationList.styles.ts
12819
- import { css as css28 } from "@emotion/css";
12820
- import { useMemo as useMemo36 } from "react";
12821
- var useStyles28 = (theme, colorScheme) => {
12822
- return useMemo36(() => {
12823
- const root = css28`
12694
+ import { css as css27 } from "@emotion/css";
12695
+ import { useMemo as useMemo35 } from "react";
12696
+ var useStyles27 = (theme, colorScheme) => {
12697
+ return useMemo35(() => {
12698
+ const root = css27`
12824
12699
  padding: calc(${theme.vars.spacing.unit} * 4);
12825
12700
  min-width: 600px;
12826
12701
  margin: 0 auto;
12827
12702
  background: ${theme.vars.colors.background.surface};
12828
12703
  border-radius: ${theme.vars.borderRadius.large};
12829
12704
  `;
12830
- const header = css28`
12705
+ const header = css27`
12831
12706
  display: flex;
12832
12707
  align-items: center;
12833
12708
  justify-content: space-between;
@@ -12835,21 +12710,21 @@ var useStyles28 = (theme, colorScheme) => {
12835
12710
  padding-bottom: calc(${theme.vars.spacing.unit} * 2);
12836
12711
  border-bottom: 1px solid ${theme.vars.colors.border};
12837
12712
  `;
12838
- const headerInfo = css28`
12713
+ const headerInfo = css27`
12839
12714
  flex: 1;
12840
12715
  `;
12841
- const title = css28`
12716
+ const title = css27`
12842
12717
  font-size: 1.5rem;
12843
12718
  font-weight: 600;
12844
12719
  margin: 0 0 8px 0;
12845
12720
  color: ${theme.vars.colors.text.primary};
12846
12721
  `;
12847
- const subtitle = css28`
12722
+ const subtitle = css27`
12848
12723
  color: ${theme.vars.colors.text.secondary};
12849
12724
  font-size: 0.875rem;
12850
12725
  margin: 0;
12851
12726
  `;
12852
- const refreshButton = css28`
12727
+ const refreshButton = css27`
12853
12728
  background-color: ${theme.vars.colors.background.surface};
12854
12729
  border: 1px solid ${theme.vars.colors.border};
12855
12730
  border-radius: ${theme.vars.borderRadius.small};
@@ -12863,12 +12738,12 @@ var useStyles28 = (theme, colorScheme) => {
12863
12738
  border-color: ${theme.vars.colors.primary.main};
12864
12739
  }
12865
12740
  `;
12866
- const listContainer = css28`
12741
+ const listContainer = css27`
12867
12742
  display: flex;
12868
12743
  flex-direction: column;
12869
12744
  gap: calc(${theme.vars.spacing.unit} * 1.5);
12870
12745
  `;
12871
- const organizationItem = css28`
12746
+ const organizationItem = css27`
12872
12747
  border: 1px solid ${theme.vars.colors.border};
12873
12748
  border-radius: ${theme.vars.borderRadius.medium};
12874
12749
  display: flex;
@@ -12881,46 +12756,46 @@ var useStyles28 = (theme, colorScheme) => {
12881
12756
  box-shadow: 0 2px 8px ${theme.vars.colors.primary.main}20;
12882
12757
  }
12883
12758
  `;
12884
- const organizationContent = css28`
12759
+ const organizationContent = css27`
12885
12760
  display: flex;
12886
12761
  align-items: center;
12887
12762
  gap: calc(${theme.vars.spacing.unit} * 2);
12888
12763
  flex: 1;
12889
12764
  `;
12890
- const organizationInfo = css28`
12765
+ const organizationInfo = css27`
12891
12766
  flex: 1;
12892
12767
  `;
12893
- const organizationName = css28`
12768
+ const organizationName = css27`
12894
12769
  font-size: 1.125rem;
12895
12770
  font-weight: 600;
12896
12771
  margin: 0 0 4px 0;
12897
12772
  color: ${theme.vars.colors.text.primary};
12898
12773
  `;
12899
- const organizationHandle = css28`
12774
+ const organizationHandle = css27`
12900
12775
  color: ${theme.vars.colors.text.secondary};
12901
12776
  font-size: 0.875rem;
12902
12777
  margin: 0 0 4px 0;
12903
12778
  font-family: monospace;
12904
12779
  `;
12905
- const organizationStatus = css28`
12780
+ const organizationStatus = css27`
12906
12781
  color: ${theme.vars.colors.text.secondary};
12907
12782
  font-size: 0.875rem;
12908
12783
  margin: 0;
12909
12784
  `;
12910
- const statusText = css28`
12785
+ const statusText = css27`
12911
12786
  font-weight: 500;
12912
12787
  `;
12913
- const statusTextActive = css28`
12788
+ const statusTextActive = css27`
12914
12789
  color: ${theme.vars.colors.success.main};
12915
12790
  `;
12916
- const statusTextInactive = css28`
12791
+ const statusTextInactive = css27`
12917
12792
  color: ${theme.vars.colors.error.main};
12918
12793
  `;
12919
- const organizationActions = css28`
12794
+ const organizationActions = css27`
12920
12795
  display: flex;
12921
12796
  align-items: center;
12922
12797
  `;
12923
- const badge = css28`
12798
+ const badge = css27`
12924
12799
  border-radius: ${theme.vars.borderRadius.large};
12925
12800
  font-size: 0.75rem;
12926
12801
  font-weight: 500;
@@ -12928,15 +12803,15 @@ var useStyles28 = (theme, colorScheme) => {
12928
12803
  text-transform: uppercase;
12929
12804
  letter-spacing: 0.5px;
12930
12805
  `;
12931
- const badgeSuccess = css28`
12806
+ const badgeSuccess = css27`
12932
12807
  background-color: color-mix(in srgb, ${theme.vars.colors.success.main} 20%, transparent);
12933
12808
  color: ${theme.vars.colors.success.main};
12934
12809
  `;
12935
- const badgeError = css28`
12810
+ const badgeError = css27`
12936
12811
  background-color: color-mix(in srgb, ${theme.vars.colors.error.main} 20%, transparent);
12937
12812
  color: ${theme.vars.colors.error.main};
12938
12813
  `;
12939
- const loadingContainer = css28`
12814
+ const loadingContainer = css27`
12940
12815
  padding: calc(${theme.vars.spacing.unit} * 4);
12941
12816
  text-align: center;
12942
12817
  display: flex;
@@ -12944,25 +12819,25 @@ var useStyles28 = (theme, colorScheme) => {
12944
12819
  align-items: center;
12945
12820
  gap: calc(${theme.vars.spacing.unit} * 2);
12946
12821
  `;
12947
- const loadingText = css28`
12822
+ const loadingText = css27`
12948
12823
  margin-top: ${theme.vars.spacing.unit};
12949
12824
  `;
12950
- const errorContainer = css28`
12825
+ const errorContainer = css27`
12951
12826
  background-color: color-mix(in srgb, ${theme.vars.colors.error.main} 20%, transparent);
12952
12827
  border: 1px solid ${theme.vars.colors.error.main};
12953
12828
  border-radius: ${theme.vars.borderRadius.medium};
12954
12829
  color: ${theme.vars.colors.error.main};
12955
12830
  padding: calc(${theme.vars.spacing.unit} * 2);
12956
12831
  `;
12957
- const emptyContainer = css28`
12832
+ const emptyContainer = css27`
12958
12833
  padding: calc(${theme.vars.spacing.unit} * 4);
12959
12834
  text-align: center;
12960
12835
  `;
12961
- const emptyText = css28`
12836
+ const emptyText = css27`
12962
12837
  color: ${theme.vars.colors.text.secondary};
12963
12838
  font-size: 1rem;
12964
12839
  `;
12965
- const loadMoreButton = css28`
12840
+ const loadMoreButton = css27`
12966
12841
  background-color: ${theme.vars.colors.primary.main};
12967
12842
  border: none;
12968
12843
  border-radius: ${theme.vars.borderRadius.medium};
@@ -12983,13 +12858,13 @@ var useStyles28 = (theme, colorScheme) => {
12983
12858
  opacity: 0.6;
12984
12859
  }
12985
12860
  `;
12986
- const errorMargin = css28`
12861
+ const errorMargin = css27`
12987
12862
  margin-top: calc(${theme.vars.spacing.unit} * 2);
12988
12863
  `;
12989
- const loadMoreMargin = css28`
12864
+ const loadMoreMargin = css27`
12990
12865
  margin-top: calc(${theme.vars.spacing.unit} * 3);
12991
12866
  `;
12992
- const popupContent = css28`
12867
+ const popupContent = css27`
12993
12868
  padding: ${theme.vars.spacing.unit};
12994
12869
  `;
12995
12870
  return {
@@ -13039,7 +12914,7 @@ var useStyles28 = (theme, colorScheme) => {
13039
12914
  colorScheme
13040
12915
  ]);
13041
12916
  };
13042
- var BaseOrganizationList_styles_default = useStyles28;
12917
+ var BaseOrganizationList_styles_default = useStyles27;
13043
12918
 
13044
12919
  // src/components/presentation/OrganizationList/BaseOrganizationList.tsx
13045
12920
  import { jsx as jsx93, jsxs as jsxs43 } from "react/jsx-runtime";
@@ -13120,7 +12995,7 @@ var BaseOrganizationList = ({
13120
12995
  const { theme, colorScheme } = useTheme_default();
13121
12996
  const styles = BaseOrganizationList_styles_default(theme, colorScheme);
13122
12997
  const { t } = useTranslation_default();
13123
- const organizationsWithSwitchAccess = useMemo37(() => {
12998
+ const organizationsWithSwitchAccess = useMemo36(() => {
13124
12999
  if (!allOrganizations?.organizations) {
13125
13000
  return [];
13126
13001
  }
@@ -13190,11 +13065,11 @@ var BaseOrganizationList = ({
13190
13065
  var BaseOrganizationList_default = BaseOrganizationList;
13191
13066
 
13192
13067
  // src/components/presentation/OrganizationList/OrganizationList.styles.ts
13193
- import { css as css29 } from "@emotion/css";
13194
- import { useMemo as useMemo38 } from "react";
13195
- var useStyles29 = (theme, colorScheme) => {
13196
- return useMemo38(() => {
13197
- const cssOrganizationListWrapper = css29`
13068
+ import { css as css28 } from "@emotion/css";
13069
+ import { useMemo as useMemo37 } from "react";
13070
+ var useStyles28 = (theme, colorScheme) => {
13071
+ return useMemo37(() => {
13072
+ const cssOrganizationListWrapper = css28`
13198
13073
  /* Container wrapper styles for OrganizationList component */
13199
13074
  width: 100%;
13200
13075
 
@@ -13225,11 +13100,11 @@ var useStyles29 = (theme, colorScheme) => {
13225
13100
  `;
13226
13101
  return {
13227
13102
  root: cssOrganizationListWrapper,
13228
- container: css29`
13103
+ container: css28`
13229
13104
  position: relative;
13230
13105
  width: 100%;
13231
13106
  `,
13232
- errorState: css29`
13107
+ errorState: css28`
13233
13108
  padding: calc(${theme.vars.spacing.unit} * 2);
13234
13109
  background-color: color-mix(in srgb, ${theme.vars.colors.error.main} 10%, transparent);
13235
13110
  border: 1px solid ${theme.vars.colors.error.main};
@@ -13237,7 +13112,7 @@ var useStyles29 = (theme, colorScheme) => {
13237
13112
  color: ${theme.vars.colors.error.main};
13238
13113
  text-align: center;
13239
13114
  `,
13240
- loadingOverlay: css29`
13115
+ loadingOverlay: css28`
13241
13116
  position: absolute;
13242
13117
  inset: 0;
13243
13118
  background-color: color-mix(in srgb, ${theme.vars.colors.background.surface} 80%, transparent);
@@ -13250,7 +13125,7 @@ var useStyles29 = (theme, colorScheme) => {
13250
13125
  };
13251
13126
  }, [theme, colorScheme]);
13252
13127
  };
13253
- var OrganizationList_styles_default = useStyles29;
13128
+ var OrganizationList_styles_default = useStyles28;
13254
13129
 
13255
13130
  // src/components/presentation/OrganizationList/OrganizationList.tsx
13256
13131
  import { jsx as jsx94 } from "react/jsx-runtime";