@teamvortexsoftware/vortex-react-native 0.0.13 → 1.0.1

package/dist/utils/formUtils.js

@@ -1,4 +1,15 @@
 "use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.extractFormConfiguration = extractFormConfiguration;
 exports.convertFormStyleToRNStyle = convertFormStyleToRNStyle;
@@ -8,15 +19,25 @@ exports.getEmailPlaceholder = getEmailPlaceholder;
 exports.getSubmitButtonLabel = getSubmitButtonLabel;
 exports.hasGridLayout = hasGridLayout;
 exports.hasEmailAndShareInSeparateColumns = hasEmailAndShareInSeparateColumns;
+exports.getRoleOptions = getRoleOptions;
 /**
  * Extracts the form configuration from the widget configuration
  */
 function extractFormConfiguration(widgetConfiguration) {
     var _a, _b, _c;
-    if (!((_c = (_b = (_a = widgetConfiguration === null || widgetConfiguration === void 0 ? void 0 : widgetConfiguration.configuration) === null || _a === void 0 ? void 0 : _a.props) === null || _b === void 0 ? void 0 : _b["vortex.components.form"]) === null || _c === void 0 ? void 0 : _c.value)) {
+    const formValue = (_c = (_b = (_a = widgetConfiguration === null || widgetConfiguration === void 0 ? void 0 : widgetConfiguration.configuration) === null || _a === void 0 ? void 0 : _a.props) === null || _b === void 0 ? void 0 : _b['vortex.components.form']) === null || _c === void 0 ? void 0 : _c.value;
+    if (!formValue) {
         return null;
     }
-    return widgetConfiguration.configuration.props["vortex.components.form"].value;
+    // Normalize: if the value contains a root node, start traversal from it
+    if (formValue.root) {
+        return [formValue.root];
+    }
+    // If it's already an array, return as-is
+    if (Array.isArray(formValue)) {
+        return formValue;
+    }
+    return null;
 }
 /**
  * Converts form component style object to React Native styles
@@ -25,23 +46,35 @@ function convertFormStyleToRNStyle(style) {
     if (!style)
         return {};
     const rnStyle = {};
+    const toCamel = (s) => s.replace(/-([a-z])/g, (g) => g[1].toUpperCase());
+    const parseValue = (val) => {
+        if (typeof val === 'number')
+            return val;
+        if (typeof val !== 'string')
+            return String(val);
+        const pxMatch = val.match(/^(-?\d+(?:\.\d+)?)px$/i);
+        if (pxMatch)
+            return Number(pxMatch[1]);
+        const num = Number(val);
+        if (!isNaN(num))
+            return num;
+        return val;
+    };
     Object.keys(style).forEach((key) => {
-        const styleObj = style[key];
-        // Handle special cases like background-color to backgroundColor
-        const normalizedKey = key.replace(/-([a-z])/g, (g) => g[1].toUpperCase());
-        // Use computedValue if available, otherwise use value
-        if (styleObj.computedValue) {
-            rnStyle[normalizedKey] = styleObj.computedValue;
-        }
-        else if (styleObj.value !== undefined) {
-            // Handle numeric values
-            if (typeof styleObj.value === 'string' && !isNaN(Number(styleObj.value))) {
-                rnStyle[normalizedKey] = Number(styleObj.value);
+        const raw = style[key];
+        const normalizedKey = toCamel(key);
+        if (raw && typeof raw === 'object' && ('value' in raw || 'computedValue' in raw)) {
+            const styleObj = raw;
+            if (styleObj.computedValue !== undefined) {
+                rnStyle[normalizedKey] = parseValue(styleObj.computedValue);
             }
-            else {
-                rnStyle[normalizedKey] = styleObj.value;
+            else if (styleObj.value !== undefined) {
+                rnStyle[normalizedKey] = parseValue(styleObj.value);
             }
         }
+        else {
+            rnStyle[normalizedKey] = parseValue(raw);
+        }
     });
     return rnStyle;
 }
@@ -71,40 +104,90 @@ function findComponentByRole(formConfig, role) {
  * Merges theme styles with component-specific styles from form configuration
  */
 function mergeThemeAndComponentStyles(themeStyles, themeColors, formConfig) {
+    var _a;
     // Start with the base theme styles
     const mergedStyles = Object.assign({}, themeStyles);
+    // Helper: find first node by predicate
+    const findNode = (nodes, predicate) => {
+        var _a;
+        if (!nodes)
+            return null;
+        for (const node of nodes) {
+            if (predicate(node))
+                return node;
+            if ((_a = node.children) === null || _a === void 0 ? void 0 : _a.length) {
+                const found = findNode(node.children, predicate);
+                if (found)
+                    return found;
+            }
+        }
+        return null;
+    };
+    // 1) Merge root container style into containerStyles
+    const rootNode = formConfig === null || formConfig === void 0 ? void 0 : formConfig[0];
+    if (rootNode === null || rootNode === void 0 ? void 0 : rootNode.style) {
+        const rootStyle = convertFormStyleToRNStyle(rootNode.style);
+        // Avoid applying absolute dimensions that can break responsiveness on mobile
+        const _b = rootStyle, { width, height, maxWidth, minWidth, maxHeight, minHeight } = _b, responsiveRoot = __rest(_b, ["width", "height", "maxWidth", "minWidth", "maxHeight", "minHeight"]);
+        mergedStyles.containerStyles = Object.assign(Object.assign({}, mergedStyles.containerStyles), responsiveRoot);
+    }
     // Find submit button and email input components
     const submitButton = findComponentByRole(formConfig, 'submit');
     const emailInput = findComponentByRole(formConfig, 'email');
-    // Merge submit button styles
+    // 2) Merge submit button styles
     if (submitButton === null || submitButton === void 0 ? void 0 : submitButton.style) {
         const submitButtonStyle = convertFormStyleToRNStyle(submitButton.style);
-        mergedStyles.primaryButton = Object.assign(Object.assign(Object.assign({}, mergedStyles.primaryButton), (submitButtonStyle['backgroundColor'] && { backgroundColor: submitButtonStyle['backgroundColor'] })), (submitButtonStyle['borderColor'] && { borderColor: submitButtonStyle['borderColor'] }));
+        mergedStyles.primaryButton = Object.assign(Object.assign(Object.assign({}, mergedStyles.primaryButton), (submitButtonStyle['backgroundColor'] && {
+            backgroundColor: submitButtonStyle['backgroundColor'],
+        })), (submitButtonStyle['borderColor'] && { borderColor: submitButtonStyle['borderColor'] }));
         // Update button text if there's a color specified
         if (submitButtonStyle['color']) {
             mergedStyles.primaryButtonText = Object.assign(Object.assign({}, mergedStyles.primaryButtonText), { color: submitButtonStyle['color'] });
         }
     }
-    // Merge email input styles
+    // 3) Merge email input styles
     if (emailInput === null || emailInput === void 0 ? void 0 : emailInput.style) {
         const emailInputStyle = convertFormStyleToRNStyle(emailInput.style);
         mergedStyles.inputStyles = Object.assign(Object.assign({}, mergedStyles.inputStyles), emailInputStyle);
     }
+    // 4) Merge vrtx-share-options block theme into secondary buttons
+    const shareOptionsBlock = findNode(formConfig, (n) => n.type === 'block' &&
+        (n.subtype === 'vrtx-share-options' || n.tagName === 'vrtx-share-options'));
+    const optionEntries = (_a = shareOptionsBlock === null || shareOptionsBlock === void 0 ? void 0 : shareOptionsBlock.theme) === null || _a === void 0 ? void 0 : _a.options;
+    if (Array.isArray(optionEntries)) {
+        const map = {};
+        optionEntries.forEach((it) => {
+            if ((it === null || it === void 0 ? void 0 : it.key) && typeof it.value === 'string')
+                map[it.key] = it.value;
+        });
+        const bg = map['--vrtx-icon-button-background'];
+        const color = map['--vrtx-icon-button-color'];
+        if (bg) {
+            mergedStyles.secondaryButton = Object.assign(Object.assign({}, mergedStyles.secondaryButton), { backgroundColor: bg });
+        }
+        if (color) {
+            mergedStyles.secondaryButtonText = Object.assign(Object.assign({}, mergedStyles.secondaryButtonText), { color });
+        }
+    }
     return mergedStyles;
 }
 /**
  * Get email input placeholder from form configuration
  */
 function getEmailPlaceholder(formConfig) {
+    var _a;
     const emailInput = findComponentByRole(formConfig, 'email');
-    return (emailInput === null || emailInput === void 0 ? void 0 : emailInput.placeholder) || 'Enter email';
+    // Prefer attributes.placeholder as per current JSON shape
+    const attrPlaceholder = (_a = emailInput === null || emailInput === void 0 ? void 0 : emailInput.attributes) === null || _a === void 0 ? void 0 : _a.placeholder;
+    return attrPlaceholder || (emailInput === null || emailInput === void 0 ? void 0 : emailInput.placeholder) || 'Enter email';
 }
 /**
  * Get submit button label from form configuration
  */
 function getSubmitButtonLabel(formConfig) {
     const submitButton = findComponentByRole(formConfig, 'submit');
-    return (submitButton === null || submitButton === void 0 ? void 0 : submitButton.label) || 'Invite';
+    // Prefer textContent per current JSON; fallback to label
+    return (submitButton === null || submitButton === void 0 ? void 0 : submitButton.textContent) || (submitButton === null || submitButton === void 0 ? void 0 : submitButton.label) || 'Invite';
 }
 /**
  * Determines if the form layout uses a grid structure
@@ -133,42 +216,69 @@ function hasGridLayout(formConfig) {
 function hasEmailAndShareInSeparateColumns(formConfig) {
     if (!formConfig)
         return false;
-    // Look for a grid with multiple grid-items
-    const findSeparateColumns = (components) => {
-        for (const component of components) {
-            if (component.type === 'grid' && component.children) {
-                // Check if there are at least 2 grid-items
-                const gridItems = component.children.filter(child => child.type === 'grid-item');
-                if (gridItems.length >= 2) {
-                    // Check if one has email and one has share
-                    let hasEmailItem = false;
-                    let hasShareItem = false;
-                    for (const item of gridItems) {
-                        if (!item.children)
-                            continue;
-                        // Check for email component
-                        if (!hasEmailItem) {
-                            hasEmailItem = item.children.some(child => {
-                                var _a;
-                                return child.type === 'form' &&
-                                    ((_a = child.children) === null || _a === void 0 ? void 0 : _a.some(formChild => { var _a; return ((_a = formChild.vortex) === null || _a === void 0 ? void 0 : _a.role) === 'email'; }));
-                            });
-                        }
-                        // Check for share component
-                        if (!hasShareItem) {
-                            hasShareItem = item.children.some(child => child.type === 'vortex.components.share');
-                        }
+    // Adjusted to the current JSON tree (row/column/block)
+    const checkTree = (components) => {
+        for (const node of components) {
+            if (node.type === 'row' && Array.isArray(node.children)) {
+                // Look for two columns where one column has an email block and another has a submit block
+                const columns = node.children.filter((c) => c.type === 'column');
+                if (columns.length >= 2) {
+                    let hasEmailCol = false;
+                    let hasSubmitCol = false;
+                    for (const col of columns) {
+                        const blocks = (col.children || []).filter((c) => c.type === 'block');
+                        const hasEmail = blocks.some((b) => { var _a; return ((_a = b.vortex) === null || _a === void 0 ? void 0 : _a.role) === 'email' || b.subtype === 'vrtx-email-invitations'; });
+                        const hasSubmit = blocks.some((b) => { var _a; return ((_a = b.vortex) === null || _a === void 0 ? void 0 : _a.role) === 'submit' || b.subtype === 'vrtx-submit'; });
+                        if (hasEmail)
+                            hasEmailCol = true;
+                        if (hasSubmit)
+                            hasSubmitCol = true;
                     }
-                    return hasEmailItem && hasShareItem;
+                    if (hasEmailCol && hasSubmitCol)
+                        return true;
                 }
             }
-            if (component.children) {
-                const found = findSeparateColumns(component.children);
+            if (node.children && checkTree(node.children))
+                return true;
+        }
+        return false;
+    };
+    return checkTree(formConfig);
+}
+/**
+ * Extract role options from form configuration (e.g., vrtx-select with attributes.name === 'role')
+ */
+function getRoleOptions(formConfig) {
+    if (!formConfig)
+        return [];
+    const findRoleSelect = (components) => {
+        var _a, _b, _c, _d;
+        for (const component of components) {
+            const isSelect = component.subtype === 'vrtx-select' || component.tagName === 'vrtx-select';
+            const isRole = ((_a = component === null || component === void 0 ? void 0 : component.attributes) === null || _a === void 0 ? void 0 : _a.name) === 'role' || ((_b = component.vortex) === null || _b === void 0 ? void 0 : _b.role) === 'role';
+            if (isSelect && isRole) {
+                return ((_c = component === null || component === void 0 ? void 0 : component.settings) === null || _c === void 0 ? void 0 : _c.options) || null;
+            }
+            if ((_d = component.children) === null || _d === void 0 ? void 0 : _d.length) {
+                const found = findRoleSelect(component.children);
                 if (found)
-                    return true;
+                    return found;
             }
         }
-        return false;
+        return null;
     };
-    return findSeparateColumns(formConfig);
+    const options = findRoleSelect(formConfig);
+    if (Array.isArray(options)) {
+        // Normalize to label/value objects
+        return options.map((opt) => {
+            var _a;
+            return ({
+                id: opt.id,
+                label: (_a = opt.label) !== null && _a !== void 0 ? _a : String(opt.value),
+                value: String(opt.value),
+            });
+        });
+    }
+    return [];
 }
+//# sourceMappingURL=formUtils.js.map

package/dist/utils/formUtils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"formUtils.js","sourceRoot":"","sources":["../../src/utils/formUtils.ts"],"names":[],"mappings":"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","sourcesContent":["import { WidgetConfiguration } from '@teamvortexsoftware/vortex-types';\nimport { ThemeColors } from './themeUtils';\n\nexport interface FormComponentStyle {\n  [key: string]: {\n    label?: string;\n    value?: string | number;\n    computedValue?: string;\n    unit?: string;\n  };\n}\n\nexport interface FormComponentSettings {\n  action?: {\n    type: string;\n    value: string;\n    target?: string;\n  };\n  size?: number;\n}\n\nexport interface FormComponent {\n  id: string;\n  type: string;\n  subtype?: string;\n  label?: string;\n  hint?: string;\n  name?: string;\n  required?: boolean;\n  placeholder?: string;\n  style?: FormComponentStyle;\n  settings?: FormComponentSettings;\n  vortex?: {\n    role?: string;\n    canRemove?: boolean;\n  };\n  children?: FormComponent[];\n  multiValue?: boolean;\n  validation?: Array<{\n    type: string;\n    value: string;\n    operator: string;\n    canRemove: boolean;\n    errorMessage: string;\n  }>;\n  tagName?: string;\n  textContent?: string;\n  attributes?: {\n    [key: string]: string;\n  };\n}\n\nexport interface FormConfiguration {\n  value: FormComponent[];\n  valueType: string;\n}\n\n/**\n * Extracts the form configuration from the widget configuration\n */\nexport function extractFormConfiguration(\n  widgetConfiguration?: WidgetConfiguration\n): FormComponent[] | null {\n  const formValue = widgetConfiguration?.configuration?.props?.['vortex.components.form']\n    ?.value as any;\n  if (!formValue) {\n    return null;\n  }\n  // Normalize: if the value contains a root node, start traversal from it\n  if (formValue.root) {\n    return [formValue.root] as unknown as FormComponent[];\n  }\n  // If it's already an array, return as-is\n  if (Array.isArray(formValue)) {\n    return formValue as FormComponent[];\n  }\n  return null;\n}\n\n/**\n * Converts form component style object to React Native styles\n */\nexport function convertFormStyleToRNStyle(\n  style?: FormComponentStyle | Record<string, any>\n): Record<string, string | number> {\n  if (!style) return {};\n\n  const rnStyle: Record<string, string | number> = {};\n\n  const toCamel = (s: string) => s.replace(/-([a-z])/g, (g) => g[1].toUpperCase());\n  const parseValue = (val: any): string | number => {\n    if (typeof val === 'number') return val;\n    if (typeof val !== 'string') return String(val);\n    const pxMatch = val.match(/^(-?\\d+(?:\\.\\d+)?)px$/i);\n    if (pxMatch) return Number(pxMatch[1]);\n    const num = Number(val);\n    if (!isNaN(num)) return num;\n    return val;\n  };\n\n  Object.keys(style).forEach((key) => {\n    const raw = (style as any)[key];\n    const normalizedKey = toCamel(key);\n\n    if (raw && typeof raw === 'object' && ('value' in raw || 'computedValue' in raw)) {\n      const styleObj = raw as { value?: any; computedValue?: any };\n      if (styleObj.computedValue !== undefined) {\n        rnStyle[normalizedKey] = parseValue(styleObj.computedValue);\n      } else if (styleObj.value !== undefined) {\n        rnStyle[normalizedKey] = parseValue(styleObj.value);\n      }\n    } else {\n      rnStyle[normalizedKey] = parseValue(raw);\n    }\n  });\n\n  return rnStyle;\n}\n\n/**\n * Find a specific component by role in the form configuration\n */\nexport function findComponentByRole(\n  formConfig: FormComponent[] | null,\n  role: string\n): FormComponent | null {\n  if (!formConfig) return null;\n\n  const findComponent = (components: FormComponent[]): FormComponent | null => {\n    for (const component of components) {\n      if (component.vortex?.role === role) {\n        return component;\n      }\n\n      if (component.children) {\n        const found = findComponent(component.children);\n        if (found) return found;\n      }\n    }\n\n    return null;\n  };\n\n  return findComponent(formConfig);\n}\n\n/**\n * Merges theme styles with component-specific styles from form configuration\n */\nexport function mergeThemeAndComponentStyles(\n  themeStyles: Record<string, Record<string, string | number>>,\n  themeColors: ThemeColors,\n  formConfig: FormComponent[] | null\n): Record<string, Record<string, string | number>> {\n  // Start with the base theme styles\n  const mergedStyles = { ...themeStyles };\n\n  // Helper: find first node by predicate\n  const findNode = (\n    nodes: FormComponent[] | null | undefined,\n    predicate: (n: any) => boolean\n  ): any => {\n    if (!nodes) return null;\n    for (const node of nodes) {\n      if (predicate(node)) return node;\n      if (node.children?.length) {\n        const found = findNode(node.children, predicate);\n        if (found) return found;\n      }\n    }\n    return null;\n  };\n\n  // 1) Merge root container style into containerStyles\n  const rootNode = formConfig?.[0];\n  if (rootNode?.style) {\n    const rootStyle = convertFormStyleToRNStyle(rootNode.style as any);\n    // Avoid applying absolute dimensions that can break responsiveness on mobile\n    const { width, height, maxWidth, minWidth, maxHeight, minHeight, ...responsiveRoot } =\n      rootStyle as any;\n    mergedStyles.containerStyles = {\n      ...mergedStyles.containerStyles,\n      ...responsiveRoot,\n    };\n  }\n\n  // Find submit button and email input components\n  const submitButton = findComponentByRole(formConfig, 'submit');\n  const emailInput = findComponentByRole(formConfig, 'email');\n\n  // 2) Merge submit button styles\n  if (submitButton?.style) {\n    const submitButtonStyle = convertFormStyleToRNStyle(submitButton.style);\n    mergedStyles.primaryButton = {\n      ...mergedStyles.primaryButton,\n      ...(submitButtonStyle['backgroundColor'] && {\n        backgroundColor: submitButtonStyle['backgroundColor'],\n      }),\n      ...(submitButtonStyle['borderColor'] && { borderColor: submitButtonStyle['borderColor'] }),\n    };\n\n    // Update button text if there's a color specified\n    if (submitButtonStyle['color']) {\n      mergedStyles.primaryButtonText = {\n        ...mergedStyles.primaryButtonText,\n        color: submitButtonStyle['color'],\n      };\n    }\n  }\n\n  // 3) Merge email input styles\n  if (emailInput?.style) {\n    const emailInputStyle = convertFormStyleToRNStyle(emailInput.style);\n    mergedStyles.inputStyles = {\n      ...mergedStyles.inputStyles,\n      ...emailInputStyle,\n    };\n  }\n\n  // 4) Merge vrtx-share-options block theme into secondary buttons\n  const shareOptionsBlock = findNode(\n    formConfig,\n    (n) =>\n      n.type === 'block' &&\n      (n.subtype === 'vrtx-share-options' || n.tagName === 'vrtx-share-options')\n  ) as any;\n  const optionEntries: Array<{ key?: string; value?: string }> | undefined =\n    shareOptionsBlock?.theme?.options;\n  if (Array.isArray(optionEntries)) {\n    const map: Record<string, string> = {};\n    optionEntries.forEach((it) => {\n      if (it?.key && typeof it.value === 'string') map[it.key] = it.value;\n    });\n    const bg = map['--vrtx-icon-button-background'];\n    const color = map['--vrtx-icon-button-color'];\n    if (bg) {\n      mergedStyles.secondaryButton = {\n        ...mergedStyles.secondaryButton,\n        backgroundColor: bg,\n      };\n    }\n    if (color) {\n      mergedStyles.secondaryButtonText = {\n        ...mergedStyles.secondaryButtonText,\n        color,\n      };\n    }\n  }\n\n  return mergedStyles;\n}\n\n/**\n * Get email input placeholder from form configuration\n */\nexport function getEmailPlaceholder(formConfig: FormComponent[] | null): string {\n  const emailInput = findComponentByRole(formConfig, 'email');\n  // Prefer attributes.placeholder as per current JSON shape\n  const attrPlaceholder = (emailInput as any)?.attributes?.placeholder;\n  return attrPlaceholder || emailInput?.placeholder || 'Enter email';\n}\n\n/**\n * Get submit button label from form configuration\n */\nexport function getSubmitButtonLabel(formConfig: FormComponent[] | null): string {\n  const submitButton = findComponentByRole(formConfig, 'submit') as any;\n  // Prefer textContent per current JSON; fallback to label\n  return submitButton?.textContent || submitButton?.label || 'Invite';\n}\n\n/**\n * Determines if the form layout uses a grid structure\n */\nexport function hasGridLayout(formConfig: FormComponent[] | null): boolean {\n  if (!formConfig) return false;\n\n  const findGrid = (components: FormComponent[]): boolean => {\n    for (const component of components) {\n      if (component.type === 'grid') {\n        return true;\n      }\n\n      if (component.children) {\n        const found = findGrid(component.children);\n        if (found) return true;\n      }\n    }\n\n    return false;\n  };\n\n  return findGrid(formConfig);\n}\n\n/**\n * Determines if email and share components are in separate grid items\n */\nexport function hasEmailAndShareInSeparateColumns(formConfig: FormComponent[] | null): boolean {\n  if (!formConfig) return false;\n\n  // Adjusted to the current JSON tree (row/column/block)\n  const checkTree = (components: FormComponent[]): boolean => {\n    for (const node of components) {\n      if (node.type === 'row' && Array.isArray(node.children)) {\n        // Look for two columns where one column has an email block and another has a submit block\n        const columns = node.children.filter((c) => c.type === 'column');\n        if (columns.length >= 2) {\n          let hasEmailCol = false;\n          let hasSubmitCol = false;\n\n          for (const col of columns) {\n            const blocks = (col.children || []).filter((c) => c.type === 'block');\n            const hasEmail = blocks.some(\n              (b) => b.vortex?.role === 'email' || b.subtype === 'vrtx-email-invitations'\n            );\n            const hasSubmit = blocks.some(\n              (b) => b.vortex?.role === 'submit' || b.subtype === 'vrtx-submit'\n            );\n            if (hasEmail) hasEmailCol = true;\n            if (hasSubmit) hasSubmitCol = true;\n          }\n\n          if (hasEmailCol && hasSubmitCol) return true;\n        }\n      }\n\n      if (node.children && checkTree(node.children)) return true;\n    }\n    return false;\n  };\n\n  return checkTree(formConfig);\n}\n\n/**\n * Extract role options from form configuration (e.g., vrtx-select with attributes.name === 'role')\n */\nexport function getRoleOptions(\n  formConfig: FormComponent[] | null\n): Array<{ id?: string; label: string; value: string }> {\n  if (!formConfig) return [];\n\n  const findRoleSelect = (components: FormComponent[]): any | null => {\n    for (const component of components) {\n      const isSelect = component.subtype === 'vrtx-select' || component.tagName === 'vrtx-select';\n      const isRole =\n        (component as any)?.attributes?.name === 'role' || component.vortex?.role === 'role';\n      if (isSelect && isRole) {\n        return (component as any)?.settings?.options || null;\n      }\n      if (component.children?.length) {\n        const found = findRoleSelect(component.children);\n        if (found) return found;\n      }\n    }\n    return null;\n  };\n\n  const options = findRoleSelect(formConfig);\n  if (Array.isArray(options)) {\n    // Normalize to label/value objects\n    return options.map((opt: any) => ({\n      id: opt.id,\n      label: opt.label ?? String(opt.value),\n      value: String(opt.value),\n    }));\n  }\n  return [];\n}\n"]}

package/dist/utils/gradientUtils.js

@@ -0,0 +1,120 @@
+"use strict";
+/**
+ * Gradient Parsing Utilities
+ *
+ * Pure JavaScript utilities for parsing CSS gradients.
+ * These are shared between native (moduleLoaders.ts) and web (moduleLoaders.web.ts)
+ * implementations to avoid code duplication.
+ *
+ * These utilities have NO native dependencies and are safe to import from anywhere.
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.parseCSSLinearGradient = parseCSSLinearGradient;
+exports.angleToGradientPoints = angleToGradientPoints;
+exports.parseGradientFirstColor = parseGradientFirstColor;
+/**
+ * Parses a CSS linear-gradient string into a structured format.
+ *
+ * Supports formats like:
+ * - "linear-gradient(90deg, #ff0000 0%, #0000ff 100%)"
+ * - "linear-gradient(to right, #ff0000 0%, #0000ff 100%)"
+ * - "linear-gradient(135deg, rgba(255,0,0,1) 0%, rgba(0,0,255,1) 100%)"
+ *
+ * @param css - CSS linear-gradient string
+ * @returns Parsed gradient data or null if parsing fails
+ */
+function parseCSSLinearGradient(css) {
+    var _a, _b;
+    if (!css || !css.includes('linear-gradient')) {
+        return null;
+    }
+    // Parse angle
+    let angle = 180; // Default: top to bottom
+    const angleMatch = css.match(/linear-gradient\(\s*(\d+)deg/i);
+    if (angleMatch) {
+        angle = parseInt(angleMatch[1], 10);
+    }
+    else {
+        // Handle directional keywords
+        const directionMatch = css.match(/linear-gradient\(\s*to\s+(\w+)(?:\s+(\w+))?/i);
+        if (directionMatch) {
+            const direction = directionMatch[1].toLowerCase();
+            const secondDirection = (_a = directionMatch[2]) === null || _a === void 0 ? void 0 : _a.toLowerCase();
+            const directionAngles = {
+                'right': 90,
+                'left': 270,
+                'bottom': 180,
+                'top': 0,
+                'right-bottom': 135,
+                'left-bottom': 225,
+                'right-top': 45,
+                'left-top': 315,
+            };
+            const key = secondDirection ? `${direction}-${secondDirection}` : direction;
+            angle = (_b = directionAngles[key]) !== null && _b !== void 0 ? _b : 180;
+        }
+    }
+    // Parse color stops
+    const stopsRegex = /(#[0-9a-fA-F]{3,8}|rgba?\([^)]+\)|[a-z]+)\s+(\d+)%/gi;
+    const colors = [];
+    const locations = [];
+    let match;
+    while ((match = stopsRegex.exec(css)) !== null) {
+        const color = match[1].trim();
+        const location = parseInt(match[2], 10) / 100;
+        if (color !== 'to' && color !== 'from') {
+            colors.push(color);
+            locations.push(location);
+        }
+    }
+    if (colors.length < 2) {
+        return null;
+    }
+    return { type: 'linear', angle, colors, locations };
+}
+/**
+ * Converts a CSS gradient angle to start/end points for LinearGradient component.
+ *
+ * CSS gradient angles:
+ * - 0deg = bottom to top
+ * - 90deg = left to right
+ * - 180deg = top to bottom
+ * - 270deg = right to left
+ *
+ * LinearGradient uses normalized coordinates (0-1) for start/end points.
+ *
+ * @param angle - CSS gradient angle in degrees
+ * @returns Start and end points for LinearGradient
+ */
+function angleToGradientPoints(angle) {
+    const normalizedAngle = ((angle % 360) + 360) % 360;
+    const rad = ((90 - normalizedAngle) * Math.PI) / 180;
+    const cos = Math.cos(rad);
+    const sin = Math.sin(rad);
+    return {
+        start: { x: 0.5 - cos / 2, y: 0.5 + sin / 2 },
+        end: { x: 0.5 + cos / 2, y: 0.5 - sin / 2 },
+    };
+}
+/**
+ * Extracts the first color from a CSS gradient string.
+ * Used as a fallback when gradient libraries are not available.
+ *
+ * @param gradientString - CSS linear-gradient string
+ * @returns First color from the gradient or null
+ */
+function parseGradientFirstColor(gradientString) {
+    if (!gradientString || !gradientString.includes('linear-gradient')) {
+        return null;
+    }
+    const stopsRegex = /(#[0-9a-fA-F]{3,8}|rgba?\([^)]+\)|[a-z]+)\s+(\d+)%/i;
+    const match = stopsRegex.exec(gradientString);
+    if (match) {
+        const color = match[1].trim();
+        if (color !== 'to' && color !== 'from') {
+            return color;
+        }
+    }
+    return null;
+}
+//# sourceMappingURL=gradientUtils.js.map

package/dist/utils/gradientUtils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"gradientUtils.js","sourceRoot":"","sources":["../../src/utils/gradientUtils.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * Gradient Parsing Utilities\n *\n * Pure JavaScript utilities for parsing CSS gradients.\n * These are shared between native (moduleLoaders.ts) and web (moduleLoaders.web.ts)\n * implementations to avoid code duplication.\n *\n * These utilities have NO native dependencies and are safe to import from anywhere.\n */\n\n/**\n * Parsed gradient data structure\n */\nexport interface ParsedGradient {\n  type: 'linear';\n  angle: number;\n  colors: string[];\n  locations: number[];\n}\n\n/**\n * Gradient points for LinearGradient component\n */\nexport interface GradientPoints {\n  start: { x: number; y: number };\n  end: { x: number; y: number };\n}\n\n/**\n * Parses a CSS linear-gradient string into a structured format.\n *\n * Supports formats like:\n * - \"linear-gradient(90deg, #ff0000 0%, #0000ff 100%)\"\n * - \"linear-gradient(to right, #ff0000 0%, #0000ff 100%)\"\n * - \"linear-gradient(135deg, rgba(255,0,0,1) 0%, rgba(0,0,255,1) 100%)\"\n *\n * @param css - CSS linear-gradient string\n * @returns Parsed gradient data or null if parsing fails\n */\nexport function parseCSSLinearGradient(css: string): ParsedGradient | null {\n  if (!css || !css.includes('linear-gradient')) {\n    return null;\n  }\n\n  // Parse angle\n  let angle = 180; // Default: top to bottom\n\n  const angleMatch = css.match(/linear-gradient\\(\\s*(\\d+)deg/i);\n  if (angleMatch) {\n    angle = parseInt(angleMatch[1], 10);\n  } else {\n    // Handle directional keywords\n    const directionMatch = css.match(/linear-gradient\\(\\s*to\\s+(\\w+)(?:\\s+(\\w+))?/i);\n    if (directionMatch) {\n      const direction = directionMatch[1].toLowerCase();\n      const secondDirection = directionMatch[2]?.toLowerCase();\n\n      const directionAngles: Record<string, number> = {\n        'right': 90,\n        'left': 270,\n        'bottom': 180,\n        'top': 0,\n        'right-bottom': 135,\n        'left-bottom': 225,\n        'right-top': 45,\n        'left-top': 315,\n      };\n\n      const key = secondDirection ? `${direction}-${secondDirection}` : direction;\n      angle = directionAngles[key] ?? 180;\n    }\n  }\n\n  // Parse color stops\n  const stopsRegex = /(#[0-9a-fA-F]{3,8}|rgba?\\([^)]+\\)|[a-z]+)\\s+(\\d+)%/gi;\n  const colors: string[] = [];\n  const locations: number[] = [];\n\n  let match;\n  while ((match = stopsRegex.exec(css)) !== null) {\n    const color = match[1].trim();\n    const location = parseInt(match[2], 10) / 100;\n\n    if (color !== 'to' && color !== 'from') {\n      colors.push(color);\n      locations.push(location);\n    }\n  }\n\n  if (colors.length < 2) {\n    return null;\n  }\n\n  return { type: 'linear', angle, colors, locations };\n}\n\n/**\n * Converts a CSS gradient angle to start/end points for LinearGradient component.\n *\n * CSS gradient angles:\n * - 0deg = bottom to top\n * - 90deg = left to right\n * - 180deg = top to bottom\n * - 270deg = right to left\n *\n * LinearGradient uses normalized coordinates (0-1) for start/end points.\n *\n * @param angle - CSS gradient angle in degrees\n * @returns Start and end points for LinearGradient\n */\nexport function angleToGradientPoints(angle: number): GradientPoints {\n  const normalizedAngle = ((angle % 360) + 360) % 360;\n  const rad = ((90 - normalizedAngle) * Math.PI) / 180;\n\n  const cos = Math.cos(rad);\n  const sin = Math.sin(rad);\n\n  return {\n    start: { x: 0.5 - cos / 2, y: 0.5 + sin / 2 },\n    end: { x: 0.5 + cos / 2, y: 0.5 - sin / 2 },\n  };\n}\n\n/**\n * Extracts the first color from a CSS gradient string.\n * Used as a fallback when gradient libraries are not available.\n *\n * @param gradientString - CSS linear-gradient string\n * @returns First color from the gradient or null\n */\nexport function parseGradientFirstColor(gradientString: string): string | null {\n  if (!gradientString || !gradientString.includes('linear-gradient')) {\n    return null;\n  }\n\n  const stopsRegex = /(#[0-9a-fA-F]{3,8}|rgba?\\([^)]+\\)|[a-z]+)\\s+(\\d+)%/i;\n  const match = stopsRegex.exec(gradientString);\n\n  if (match) {\n    const color = match[1].trim();\n    if (color !== 'to' && color !== 'from') {\n      return color;\n    }\n  }\n\n  return null;\n}\n"]}

package/dist/utils/invitationEvents.js

@@ -0,0 +1,45 @@
+"use strict";
+/**
+ * Simple event emitter for invitation-related events.
+ * Used to notify components (like VrtxOutgoingInvitations) when invitations are created
+ * so they can refresh their data.
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.subscribeToInvitationEvent = subscribeToInvitationEvent;
+exports.emitInvitationEvent = emitInvitationEvent;
+const listeners = new Map();
+/**
+ * Subscribe to an invitation event.
+ * @param event The event type to listen for
+ * @param listener The callback to invoke when the event is emitted
+ * @returns A function to unsubscribe
+ */
+function subscribeToInvitationEvent(event, listener) {
+    if (!listeners.has(event)) {
+        listeners.set(event, new Set());
+    }
+    listeners.get(event).add(listener);
+    // Return unsubscribe function
+    return () => {
+        var _a;
+        (_a = listeners.get(event)) === null || _a === void 0 ? void 0 : _a.delete(listener);
+    };
+}
+/**
+ * Emit an invitation event to notify all subscribers.
+ * @param event The event type to emit
+ */
+function emitInvitationEvent(event) {
+    const eventListeners = listeners.get(event);
+    if (eventListeners) {
+        eventListeners.forEach((listener) => {
+            try {
+                listener();
+            }
+            catch (err) {
+                console.warn(`[InvitationEvents] Error in listener for ${event}:`, err);
+            }
+        });
+    }
+}
+//# sourceMappingURL=invitationEvents.js.map

package/dist/utils/invitationEvents.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"invitationEvents.js","sourceRoot":"","sources":["../../src/utils/invitationEvents.ts"],"names":[],"mappings":";AAAA;;;;GAIG;;AAcH,gEAaC;AAMD,kDAWC;AAtCD,MAAM,SAAS,GAA2D,IAAI,GAAG,EAAE,CAAC;AAEpF;;;;;GAKG;AACH,SAAgB,0BAA0B,CACxC,KAA0B,EAC1B,QAAiC;IAEjC,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE,CAAC;QAC1B,SAAS,CAAC,GAAG,CAAC,KAAK,EAAE,IAAI,GAAG,EAAE,CAAC,CAAC;IAClC,CAAC;IACD,SAAS,CAAC,GAAG,CAAC,KAAK,CAAE,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC;IAEpC,8BAA8B;IAC9B,OAAO,GAAG,EAAE;;QACV,MAAA,SAAS,CAAC,GAAG,CAAC,KAAK,CAAC,0CAAE,MAAM,CAAC,QAAQ,CAAC,CAAC;IACzC,CAAC,CAAC;AACJ,CAAC;AAED;;;GAGG;AACH,SAAgB,mBAAmB,CAAC,KAA0B;IAC5D,MAAM,cAAc,GAAG,SAAS,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC;IAC5C,IAAI,cAAc,EAAE,CAAC;QACnB,cAAc,CAAC,OAAO,CAAC,CAAC,QAAQ,EAAE,EAAE;YAClC,IAAI,CAAC;gBACH,QAAQ,EAAE,CAAC;YACb,CAAC;YAAC,OAAO,GAAG,EAAE,CAAC;gBACb,OAAO,CAAC,IAAI,CAAC,4CAA4C,KAAK,GAAG,EAAE,GAAG,CAAC,CAAC;YAC1E,CAAC;QACH,CAAC,CAAC,CAAC;IACL,CAAC;AACH,CAAC","sourcesContent":["/**\n * Simple event emitter for invitation-related events.\n * Used to notify components (like VrtxOutgoingInvitations) when invitations are created\n * so they can refresh their data.\n */\n\ntype InvitationEventType = 'invitationCreated' | 'invitationRevoked' | 'invitationAccepted' | 'invitationDeleted';\n\ntype InvitationEventListener = () => void;\n\nconst listeners: Map<InvitationEventType, Set<InvitationEventListener>> = new Map();\n\n/**\n * Subscribe to an invitation event.\n * @param event The event type to listen for\n * @param listener The callback to invoke when the event is emitted\n * @returns A function to unsubscribe\n */\nexport function subscribeToInvitationEvent(\n  event: InvitationEventType,\n  listener: InvitationEventListener\n): () => void {\n  if (!listeners.has(event)) {\n    listeners.set(event, new Set());\n  }\n  listeners.get(event)!.add(listener);\n\n  // Return unsubscribe function\n  return () => {\n    listeners.get(event)?.delete(listener);\n  };\n}\n\n/**\n * Emit an invitation event to notify all subscribers.\n * @param event The event type to emit\n */\nexport function emitInvitationEvent(event: InvitationEventType): void {\n  const eventListeners = listeners.get(event);\n  if (eventListeners) {\n    eventListeners.forEach((listener) => {\n      try {\n        listener();\n      } catch (err) {\n        console.warn(`[InvitationEvents] Error in listener for ${event}:`, err);\n      }\n    });\n  }\n}\n"]}