@elevasis/ui 1.24.3 → 1.25.0

package/dist/features/settings/index.js

@@ -1,13 +1,13 @@
-import { useAvailablePresets } from '../../chunk-TQBM3OEW.js';
-import { OrganizationMembershipsList, WebhookUrlDisplayModal, MembershipFeaturePanel, MembershipStatusBadge, getCredentialSchema, OAuthConnectModal, buildCredentialValue } from '../../chunk-H3MU3WTM.js';
+import { useAvailablePresets } from '../../chunk-BS4J2LAW.js';
+import { OrganizationMembershipsList, WebhookUrlDisplayModal, MembershipFeaturePanel, MembershipStatusBadge, getCredentialSchema, OAuthConnectModal, buildCredentialValue } from '../../chunk-3EVTCVKR.js';
 import '../../chunk-PDHTXPSF.js';
 import { CustomModal } from '../../chunk-GBMNCNHX.js';
-import { PageTitleCaption, EmptyState, CardHeader, ListSkeleton, StatCard } from '../../chunk-IAZT3VO6.js';
+import { PageTitleCaption, EmptyState, CardHeader, ListSkeleton, StatCard } from '../../chunk-G25YWGUL.js';
 import '../../chunk-3KMDHCAR.js';
 import '../../chunk-NNKKBSJN.js';
 import { AppShellLoader } from '../../chunk-WWEMNIHW.js';
 import '../../chunk-QJ2S46NI.js';
-import { useUserMemberships, useUpdateWebhookEndpoint, useDeleteWebhookEndpoint, useCreateWebhookEndpoint, useListWebhookEndpoints, useUpdateMemberConfig, useOrganizationMembers, useUpdateCredential, CredentialSchemas } from '../../chunk-JTUX5FDC.js';
+import { useUserMemberships, useUpdateWebhookEndpoint, useDeleteWebhookEndpoint, useCreateWebhookEndpoint, useListWebhookEndpoints, useUpdateMemberConfig, useOrganizationMembers, useUpdateCredential, CredentialSchemas } from '../../chunk-R565P6XC.js';
 import { useResources, showErrorNotification } from '../../chunk-QDO6NF2I.js';
 import '../../chunk-NJJ3NQ7B.js';
 import '../../chunk-LXHZYSMQ.js';
@@ -17,10 +17,10 @@ import '../../chunk-ELJIFLCB.js';
 import '../../chunk-L4XXM55J.js';
 import '../../chunk-SLVC5OJ2.js';
 import '../../chunk-RNP5R5I3.js';
-import '../../chunk-TML32XBW.js';
+import '../../chunk-RMPXGBNI.js';
 import '../../chunk-SZHARWKU.js';
-import '../../chunk-OH74INP2.js';
-import '../../chunk-JR2C4XAN.js';
+import '../../chunk-FEZZ3IDU.js';
+import '../../chunk-CYXZHBP4.js';
 import '../../chunk-R7WLWGPO.js';
 import '../../chunk-NVOCKXUQ.js';
 import '../../chunk-V7XHGJQZ.js';
@@ -38,7 +38,7 @@ import { IconUser, IconCheck, IconCopy, IconMail, IconRefresh, IconAlertCircle,
 import { notifications } from '@mantine/notifications';
 import { useMutation, useQueryClient } from '@tanstack/react-query';
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
-import { useRef, useEffect, useMemo, useState, useCallback } from 'react';
+import { useState, useRef, useEffect, useMemo, useCallback } from 'react';
 import { create } from 'zustand';
 import { useForm } from '@mantine/form';
 
@@ -262,6 +262,7 @@ function AppearanceSettings({ initialTheme, onThemeChange }) {
   const { updateTheme } = useUpdateThemePreference();
   const { setColorScheme: setMantineColorScheme } = useMantineColorScheme();
   const availablePresets = useAvailablePresets();
+  const [modalOpen, setModalOpen] = useState(false);
   const hydratedRef = useRef(false);
   if (!hydratedRef.current) {
     setInternalTheme(initialTheme);
@@ -390,7 +391,8 @@ function AppearanceSettings({ initialTheme, onThemeChange }) {
               ] }),
               /* @__PURE__ */ jsxs(Group, { gap: "xs", children: [
                 /* @__PURE__ */ jsx(Button, { variant: "default", size: "xs", children: "Export" }),
-                /* @__PURE__ */ jsx(Button, { size: "xs", leftSection: /* @__PURE__ */ jsx(IconSparkles, { size: 14 }), children: "New Workflow" })
+                /* @__PURE__ */ jsx(Button, { size: "xs", leftSection: /* @__PURE__ */ jsx(IconSparkles, { size: 14 }), children: "New Workflow" }),
+                /* @__PURE__ */ jsx(Button, { variant: "light", size: "xs", onClick: () => setModalOpen(true), children: "Open Modal Preview" })
               ] })
             ] }),
             /* @__PURE__ */ jsx(SimpleGrid, { cols: { base: 1, sm: 3 }, spacing: "sm", children: [
@@ -488,7 +490,22 @@ function AppearanceSettings({ initialTheme, onThemeChange }) {
           /* @__PURE__ */ jsx(Alert, { variant: "light", color: "green", icon: /* @__PURE__ */ jsx(IconCheck, { size: 16 }), title: "Success", children: "Operation completed successfully." })
         ] })
       ] })
-    ] })
+    ] }),
+    /* @__PURE__ */ jsx(CustomModal, { opened: modalOpen, onClose: () => setModalOpen(false), size: "md", children: /* @__PURE__ */ jsxs(Stack, { gap: "md", p: "md", children: [
+      /* @__PURE__ */ jsx(Title, { order: 3, children: "Modal Preview" }),
+      /* @__PURE__ */ jsxs(Text, { size: "sm", children: [
+        "Modals should sit visibly above the page background. Elevation comes from the",
+        " ",
+        /* @__PURE__ */ jsx(Text, { span: true, ff: "monospace", size: "sm", children: "--color-elevated" }),
+        " ",
+        "token, which every preset defines as an opaque surface."
+      ] }),
+      /* @__PURE__ */ jsx(TextInput, { label: "Example field", placeholder: "Type something...", size: "xs" }),
+      /* @__PURE__ */ jsxs(Group, { justify: "flex-end", children: [
+        /* @__PURE__ */ jsx(Button, { variant: "default", size: "xs", onClick: () => setModalOpen(false), children: "Cancel" }),
+        /* @__PURE__ */ jsx(Button, { size: "xs", onClick: () => setModalOpen(false), children: "Confirm" })
+      ] })
+    ] }) })
   ] });
 }
 function EditWebhookEndpointModal({ opened, endpoint, onClose }) {