unifyedx-storybook-new 0.1.48 → 0.1.50

package/dist/unifyedx-storybook-new.css

@@ -72,6 +72,7 @@
     --color-teal-700: oklch(51.1% .096 186.391);
     --color-blue-50: oklch(97% .014 254.604);
     --color-blue-100: oklch(93.2% .032 255.585);
+    --color-blue-200: oklch(88.2% .059 254.128);
     --color-blue-300: oklch(80.9% .105 251.813);
     --color-blue-400: oklch(70.7% .165 254.624);
     --color-blue-500: oklch(62.3% .214 259.815);
@@ -1073,6 +1074,10 @@
     border-color: var(--color-black);
   }
 
+  .border-blue-200 {
+    border-color: var(--color-blue-200);
+  }
+
   .border-gray-200 {
     border-color: var(--color-gray-200);
   }
@@ -1129,6 +1134,10 @@
     }
   }
 
+  .bg-blue-50 {
+    background-color: var(--color-blue-50);
+  }
+
   .bg-blue-100 {
     background-color: var(--color-blue-100);
   }
@@ -1475,6 +1484,10 @@
     color: var(--color-white);
   }
 
+  .capitalize {
+    text-transform: capitalize;
+  }
+
   .opacity-0 {
     opacity: 0;
   }
@@ -45203,11 +45216,6 @@ li.e-separator.e-menu-item.e-excel-separator {
   display: flex;
 }
 
-.native-radio-label {
-  color: #111827;
-  font-weight: 500;
-}
-
 .native-radio-description {
   color: #6b7280;
   margin-top: .125rem;
@@ -46980,6 +46988,85 @@ body.toast-backdrop #ui-toast-backdrop {
   line-height: 1.3;
 }
 
+.full-config-page {
+  background: #f5f6f8;
+  min-height: 100vh;
+  padding: 18px;
+}
+
+.full-config-page .icon {
+  justify-content: center;
+  align-items: center;
+  display: flex;
+}
+
+.full-config-page .pill {
+  display: inline-block;
+}
+
+.full-config-page .tab-content {
+  height: calc(100vh - 200px);
+  overflow-y: auto;
+}
+
+.full-config-page ::-webkit-scrollbar {
+  width: 8px;
+}
+
+.full-config-page ::-webkit-scrollbar-track {
+  background: #f1f1f1;
+  border-radius: 4px;
+}
+
+.full-config-page ::-webkit-scrollbar-thumb {
+  background: #c1c1c1;
+  border-radius: 4px;
+}
+
+.full-config-page ::-webkit-scrollbar-thumb:hover {
+  background: #a8a8a8;
+}
+
+.native-radiogroup-container {
+  gap: 1rem;
+  display: flex;
+  flex-direction: row !important;
+}
+
+.native-radio-option {
+  border-radius: .375rem;
+  align-items: flex-start;
+  gap: .5rem;
+  padding: .5rem;
+  transition: background-color .2s;
+  display: flex;
+}
+
+.native-radio-option:hover {
+  background-color: #f3f4f6;
+}
+
+.native-radio-option input[type="radio"] {
+  margin-top: .25rem;
+}
+
+.native-radio-option label {
+  cursor: pointer;
+  flex-direction: column;
+  gap: .25rem;
+  display: flex;
+}
+
+.native-radio-label {
+  color: #1f2937;
+  font-weight: 500;
+}
+
+.native-radio-description {
+  color: #6b7280;
+  font-size: .875rem;
+}
+
 @property --tw-translate-x {
   syntax: "*";
   inherits: false;

package/dist/unifyedx-storybook-new.es.js

@@ -76690,20 +76690,6 @@ function getComponentForType(input) {
   const C = REGISTRY[t] || REGISTRY[t.toLowerCase?.()] || UnknownType;
   return C;
 }
-function renderByType(input, props = {}) {
-  const C = getComponentForType(input);
-  const pass = input && typeof input === "object" ? { item: input, ...props } : props;
-  return /* @__PURE__ */ jsx(C, { ...pass });
-}
-function register(type, component) {
-  if (!type || !component) return;
-  const key = String(type).trim();
-  REGISTRY[key] = component;
-  REGISTRY[key.toLowerCase()] = component;
-}
-function ConfigRenderFactory(input, props = {}) {
-  return renderByType(input, props);
-}
 
 function DynamicConfig({
   appid,
@@ -77153,189 +77139,6 @@ function DynamicConfig({
   ] });
 }
 
-const DynamicConfig_stories = {
-  title: "Utils/Configuration/DynamicConfig",
-  parameters: {
-    layout: "fullscreen",
-    docs: {
-      description: {
-        component: "DynamicConfig is a powerful configuration component that automatically generates UI forms based on JSON schema. It handles API calls, data transformation, and form validation."
-      }
-    }
-  }
-};
-
-const FullConfigPage = ({
-  config,
-  appid = "default-app",
-  disableApi = false
-}) => {
-  const [activeTab, setActiveTab] = useState(0);
-  const [showCancelModal, setShowCancelModal] = useState(false);
-  const {
-    pageHeader = {},
-    appletHeader = {},
-    breadcrumb = [],
-    overview = {},
-    configuration = []
-  } = config;
-  const defaultPageHeader = {
-    heading: "App Details",
-    subHeading: "View app details and customize configurations to align with institutional requirements.",
-    isLeftArrow: true,
-    onBackClick: () => window.history.back(),
-    ...pageHeader
-  };
-  const breadcrumbItems = breadcrumb.map((item) => ({
-    label: item.text,
-    href: item.href || "#"
-  }));
-  const handleCancelRequest = useCallback(() => {
-    console.log("handleCancelRequest called - showing modal");
-    setShowCancelModal(true);
-  }, []);
-  const handleCancelConfirm = useCallback((result) => {
-    setShowCancelModal(false);
-    if (result.primary) {
-      console.log("User confirmed cancel - navigating back");
-      window.history.back();
-    } else {
-      console.log("User cancelled the cancel action - modal closed, data preserved");
-    }
-  }, []);
-  const defaultAppletHeader = {
-    heading: "Application",
-    subHeading: "Application configuration and details",
-    tags: [],
-    ...appletHeader
-  };
-  const defaultOverview = {
-    about: "This application provides comprehensive functionality for your organization.",
-    images: {
-      desktop: "https://via.placeholder.com/600x400?text=Desktop+View",
-      mobile1: "https://via.placeholder.com/200x400?text=Mobile+View+1",
-      mobile2: "https://via.placeholder.com/200x400?text=Mobile+View+2"
-    },
-    features: [
-      {
-        title: "Feature 1",
-        description: "Description of feature 1"
-      },
-      {
-        title: "Feature 2",
-        description: "Description of feature 2"
-      }
-    ],
-    ...overview
-  };
-  const tabs = [
-    { label: "Overview", content: renderOverview(defaultOverview) },
-    { label: "Configuration", content: /* @__PURE__ */ jsx(DynamicConfig, { appid, configdata: { configuration }, disableApi, onCancel: handleCancelRequest }) }
-  ];
-  function renderIcon(icon) {
-    if (!icon) {
-      return "📱";
-    }
-    if (icon.includes("<svg")) {
-      return /* @__PURE__ */ jsx("div", { dangerouslySetInnerHTML: { __html: icon } });
-    }
-    return icon;
-  }
-  function renderOverview(overviewData) {
-    return /* @__PURE__ */ jsxs("div", { className: "bg-white rounded-2xl p-1", children: [
-      /* @__PURE__ */ jsxs("section", { className: "mb-8", children: [
-        /* @__PURE__ */ jsx("h2", { className: "text-xl font-semibold mb-2", children: "About" }),
-        /* @__PURE__ */ jsx("p", { className: "text-gray-700 text-base", children: overviewData.about })
-      ] }),
-      /* @__PURE__ */ jsxs("section", { className: "flex flex-row gap-6 justify-center items-center mb-8", children: [
-        /* @__PURE__ */ jsx(
-          "img",
-          {
-            src: overviewData.images.desktop,
-            alt: "Desktop View",
-            className: "rounded-xl border border-gray-200 w-[340px] h-[220px] object-cover"
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          "img",
-          {
-            src: overviewData.images.mobile1,
-            alt: "Mobile View 1",
-            className: "rounded-2xl border border-gray-200 w-[120px] h-[220px] object-cover"
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          "img",
-          {
-            src: overviewData.images.mobile2,
-            alt: "Mobile View 2",
-            className: "rounded-2xl border border-gray-200 w-[120px] h-[220px] object-cover"
-          }
-        )
-      ] }),
-      /* @__PURE__ */ jsxs("section", { children: [
-        /* @__PURE__ */ jsx("h3", { className: "text-lg font-semibold mb-4", children: "Key Features" }),
-        /* @__PURE__ */ jsx("ul", { className: "space-y-3", children: overviewData.features.map((feature, index) => /* @__PURE__ */ jsxs("li", { children: [
-          /* @__PURE__ */ jsx("span", { className: "font-semibold", children: feature.title }),
-          /* @__PURE__ */ jsx("br", {}),
-          /* @__PURE__ */ jsx("span", { className: "text-gray-700", children: feature.description })
-        ] }, index)) })
-      ] })
-    ] });
-  }
-  return /* @__PURE__ */ jsxs("div", { className: "full-config-page", children: [
-    /* @__PURE__ */ jsx(
-      PageHeader,
-      {
-        heading: defaultPageHeader.heading,
-        subHeading: breadcrumbItems.length > 0 ? void 0 : defaultPageHeader.subHeading,
-        breadcrumbItems,
-        isLeftArrow: defaultPageHeader.isLeftArrow,
-        onBackClick: defaultPageHeader.onBackClick
-      }
-    ),
-    /* @__PURE__ */ jsxs("div", { className: "bg-[#ffffff] border border-[#eef2f6] rounded-[12px] px-6 py-5 flex gap-4 items-start mb-4 shadow-sm", children: [
-      /* @__PURE__ */ jsx("div", { className: "icon w-[72px] h-[72px] rounded-full flex items-center justify-center bg-[#F5F5F6] text-[#1C274C] font-bold text-[18px]", children: renderIcon(defaultAppletHeader.icon) }),
-      /* @__PURE__ */ jsxs("div", { className: "flex flex-col min-w-0", children: [
-        /* @__PURE__ */ jsx("h2", { className: "text-[24px] font-semibold m-0 leading-tight truncate", children: defaultAppletHeader.heading }),
-        /* @__PURE__ */ jsx("p", { className: "text-[13px] text-[#101112] mt-1 mb-0 max-w-[800px] leading-normal", children: defaultAppletHeader.subHeading }),
-        /* @__PURE__ */ jsx("div", { className: "mt-2 flex flex-wrap gap-2", children: defaultAppletHeader.tags && defaultAppletHeader.tags.map((tag, index) => /* @__PURE__ */ jsx(
-          "span",
-          {
-            className: "pill inline-block px-[10px] py-[6px] rounded-[14px] text-[11px] border border-[#e6e9ee] text-[#767676] font-semibold mt-1",
-            children: tag
-          },
-          index
-        )) })
-      ] })
-    ] }),
-    /* @__PURE__ */ jsxs("div", { className: "bg-white border border-gray-300 rounded-2xl w-full mt-5 ", children: [
-      /* @__PURE__ */ jsx("div", { className: "border-b border-gray-200", children: /* @__PURE__ */ jsx("nav", { className: "flex space-x-8", "aria-label": "Tabs", children: tabs.map((tab, index) => /* @__PURE__ */ jsx(
-        "button",
-        {
-          onClick: () => setActiveTab(index),
-          className: `${activeTab === index ? "border-black text-black" : "border-transparent text-gray-500 hover:text-gray-700 hover:border-gray-300"} whitespace-nowrap py-3 px-6 border-b-2 font-medium text-sm transition-colors duration-200`,
-          children: tab.label
-        },
-        index
-      )) }) }),
-      /* @__PURE__ */ jsx("div", { className: "p-8 h-full overflow-y-auto", children: tabs[activeTab].content })
-    ] }),
-    /* @__PURE__ */ jsx(
-      Modal,
-      {
-        isOpen: showCancelModal,
-        onClose: handleCancelConfirm,
-        variant: "warning",
-        title: "Are you sure you want to cancel?",
-        primaryButtonText: "Proceed",
-        secondaryButtonText: "Cancel",
-        children: "Your unsaved changes will be lost if you proceed."
-      }
-    )
-  ] });
-};
-
 function ToastProvider({ children }) {
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     children,
@@ -77578,5 +77381,5 @@ const CustomGridToolbar = ({
   ] });
 };
 
-export { AddUserGroupsRolesModal, Avatar, AvatarGroup$1 as AvatarGroup, Badge, Breadcrumbs, Button$1 as Button, Checkbox, ConfigRenderFactory, CustomDialog, CustomGridToolbar, DataTableRenderer, DatePicker, DateRangePicker$1 as DateRangePicker, DynamicConfig, DynamicConfig_stories as DynamicConfigStory, FileUploadModal, FullConfigPage, FullScreenLoader, GenericFilter, Input, ManageCollectionList, ManageCollectionList as ManageCollectionListDefault, Modal, MultiSelect, OptionsMenu, PageHeader, PageLayout, Pagination, RadioGroup, SearchBar, SectionRenderer, Select, Sidebar, Spinner, Textarea, ToastProvider, ToggleSwitch, Tooltip, TreeView, UnifyedCoreButton, WizardModal, adGroupsListSearchApi, axiosDelete, axiosGet, axiosPatch, axiosPost, axiosPut, cookies$1 as cookies, createHttpClient, directoryPermissionsApi, filePermissionsApi, gateWayUrl, gatewayBase, getBaseUrl, getComponentForType, getSnapshot, http, localStore, myDriveGatewayBaseV2, notify, provisioningBase, rbacBase, register, renderByType, searchRolesApi, sessionStore, userSearchBase };
+export { AddUserGroupsRolesModal, Avatar, AvatarGroup$1 as AvatarGroup, Badge, Breadcrumbs, Button$1 as Button, Checkbox, CustomDialog, CustomGridToolbar, DatePicker, DateRangePicker$1 as DateRangePicker, DynamicConfig, FileUploadModal, FullScreenLoader, GenericFilter, Input, ManageCollectionList, Modal, MultiSelect, OptionsMenu, PageHeader, PageLayout, Pagination, RadioGroup, SearchBar, Select, Sidebar, Spinner, Textarea, ToastProvider, ToggleSwitch, Tooltip, TreeView, UnifyedCoreButton, WizardModal, adGroupsListSearchApi, axiosDelete, axiosGet, axiosPatch, axiosPost, axiosPut, cookies$1 as cookies, createHttpClient, directoryPermissionsApi, filePermissionsApi, gateWayUrl, gatewayBase, getBaseUrl, getSnapshot, http, localStore, myDriveGatewayBaseV2, notify, provisioningBase, rbacBase, searchRolesApi, sessionStore, userSearchBase };
 //# sourceMappingURL=unifyedx-storybook-new.es.js.map