droplinked-editor-configs 1.9.10 → 1.9.12

package/dist/lib/stores/app/appStore.d.ts

@@ -12,10 +12,7 @@ export interface IAppStore {
     states: {
         cart: Icart;
         user: {
-            [shopName: string]: {
-                token: string;
-                user: IUser;
-            };
+            [shopName: string]: IUser;
         } | null;
         shop: IShop;
     };
@@ -34,10 +31,7 @@ declare const useAppStore: import('zustand').UseBoundStore<Omit<Omit<import('zus
             states: {
                 cart: Icart;
                 user: {
-                    [shopName: string]: {
-                        token: string;
-                        user: IUser;
-                    };
+                    [shopName: string]: IUser;
                 } | null;
                 shop: IShop;
             };
@@ -51,10 +45,7 @@ declare const useAppStore: import('zustand').UseBoundStore<Omit<Omit<import('zus
             states: {
                 cart: Icart;
                 user: {
-                    [shopName: string]: {
-                        token: string;
-                        user: IUser;
-                    };
+                    [shopName: string]: IUser;
                 } | null;
                 shop: IShop;
             };

package/dist/lib/utils/urlUtils.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Checks if a given string is likely an external URL (domain or http/https).
+ * It returns true for "google.com", "www.test.com", "http://site.com".
+ * It returns false for "home", "/about", "contact-us".
+ */
+export declare const isExternalUrl: (url: string) => boolean;
+/**
+ * Normalizes a URL string.
+ * If it's detected as an external URL but missing protocol, prepends https://.
+ */
+export declare const normalizeUrl: (url: string) => string;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "droplinked-editor-configs",
   "private": false,
-  "version": "1.9.10",
+  "version": "1.9.12",
   "type": "module",
   "main": "dist/droplinked-editor.umd.js",
   "module": "dist/droplinked-editor.es.js",

package/src/components/SocialMediaBar/SocialMediaBar.tsx

@@ -2,6 +2,7 @@ import React from 'react';
 import { socialMediaLinks } from './socialLinks';
 import CustomIcon from 'components/customIcon/CustomIcon';
 import useThemeInfo from 'hooks/useThemeInfo';
+import { isExternalUrl, normalizeUrl } from 'lib/utils/urlUtils';
 
 // Accept socialChannels as prop
 interface SocialChannel {
@@ -25,12 +26,11 @@ interface SocialMediaBarProps {
 const SocialMediaBar: React.FC<SocialMediaBarProps> = React.memo(({ socialChannels }) => {
   const { shopDesign: { foreground } } = useThemeInfo()
 
-  // Map channel name to icon from socialMediaLinks
-  const getIconByChannel = (channel: string) => {
-    const found = socialMediaLinks.find(
+  // Map channel name to social link item
+  const getSocialLinkItem = (channel: string) => {
+    return socialMediaLinks.find(
       (item) => item.key.replace('URL', '').toLowerCase() === channel.toLowerCase()
     );
-    return found ? found.icon : undefined;
   };
 
   return (
@@ -39,12 +39,22 @@ const SocialMediaBar: React.FC<SocialMediaBarProps> = React.memo(({ socialChanne
         .filter((item) => !!item.links?.url && !!item.links?.channel)
         .map((item, idx) => {
           const { channel, url } = item.links!;
-          const Icon = getIconByChannel(channel!);
-          if (!Icon) return null;
+          const socialItem = getSocialLinkItem(channel!);
+          if (!socialItem) return null;
+
+          const Icon = socialItem.icon;
+          let href = url!;
+
+          if (isExternalUrl(href)) {
+            href = normalizeUrl(href);
+          } else {
+            href = `${socialItem.link}${href.replace(/^\//, '')}`;
+          }
+
           return (
             <a
               key={channel + idx}
-              href={url}
+              href={href}
               target="_blank"
               rel="noopener noreferrer"
               className="inline-block rounded-md p-[10px] transition-colors duration-100 ease-out"
@@ -58,31 +68,4 @@ const SocialMediaBar: React.FC<SocialMediaBarProps> = React.memo(({ socialChanne
   );
 });
 
-export default SocialMediaBar;
-
-/**
- * Utility function to darken a hexadecimal color by a percentage
- * 
- * @param color - Hexadecimal color string (e.g., "#FFFFFF")
- * @param percent - Percentage to darken the color (-100 to 100)
- * @returns Darkened hexadecimal color string
- */
-const darkenColor = (color: string, percent: number): string => {
-  let num = parseInt(color.slice(1), 16);
-  let amt = Math.round(2.55 * percent);
-  let R = (num >> 16) + amt;
-  let G = ((num >> 8) & 0x00ff) + amt;
-  let B = (num & 0x0000ff) + amt;
-
-  return (
-    '#' +
-    (
-      0x1000000 +
-      (R < 255 ? (R < 1 ? 0 : R) : 255) * 0x10000 +
-      (G < 255 ? (G < 1 ? 0 : G) : 255) * 0x100 +
-      (B < 255 ? (B < 1 ? 0 : B) : 255)
-    )
-      .toString(16)
-      .slice(1)
-  );
-};
+export default SocialMediaBar;

package/src/components/footer/components/FooterNavigation.tsx

@@ -1,6 +1,7 @@
 import { ArrowrightSm } from "assets/icon/Navigation/ArrowRight/ArrowrightSm";
 import Text from "components/ui/Text";
 import useThemeInfo from "hooks/useThemeInfo";
+import { isExternalUrl, normalizeUrl } from "lib/utils/urlUtils";
 import React from "react";
 
 interface LinkItem {
@@ -49,14 +50,14 @@ export default function FooterNavigation({ linkManagement }: FooterNavigationPro
   const firstColumnLinks: LinkItem[] =
     linkManagement?.firstColumn?.links?.map(link => ({
       caption: link.list?.label ?? "",
-      link: link.list?.url ?? "#"
+      link: link.list?.url ? normalizeUrl(link.list.url) : "#"
     })) ?? [];
 
   const secondColumnName = linkManagement?.secondColumn?.name ?? "Second Column";
   const secondColumnLinks: LinkItem[] =
     linkManagement?.secondColumn?.links?.map(link => ({
       caption: link.list?.label ?? "",
-      link: link.list?.url ?? "#"
+      link: link.list?.url ? normalizeUrl(link.list.url) : "#"
     })) ?? [];
 
   return (
@@ -85,7 +86,7 @@ const CommonLinks: React.FC<CommonLinksProps> = ({ links, linkTextClass, isDynam
       {links.map(({ caption, link }, index) => (
         <li key={index}>
           {isDynamic ? (
-            <a href={link} target="_self" rel="noopener noreferrer" className="flex">
+            <a href={link} target={isExternalUrl(link) ? "_blank" : "_self"} rel="noopener noreferrer" className="flex">
               <span className="group flex">
                 <Text className={`relative flex items-center text-sm ${linkTextClass}`}>
                   {caption}

package/src/components/header/Sidebar.tsx

@@ -18,7 +18,7 @@ interface Props {
 function Sidebar({ iconColor, linkManagement, ProfileDropdownWrapper }: Props) {
     const { isOpen, onOpen, onClose } = useDisclosure()
     const { states: { user, shop: { url } } } = useAppStore()
-    const { id } = user?.[url]?.user || {}
+    const { id } = user?.[url] || {}
     const { shopDesign: { backgroundBody } } = useThemeInfo()
     const [isLargerThan768] = useMediaQuery('(min-width: 768px)')
     const { defineMultiStyleConfig } = createMultiStyleConfigHelpers(parts.keys)

package/src/lib/stores/app/appStore.ts

@@ -16,7 +16,7 @@ interface Icart {
 export interface IAppStore {
     states: {
         cart: Icart;
-        user: { [shopName: string]: { token: string; user: IUser } } | null;
+        user: { [shopName: string]: IUser } | null;
         shop: IShop;
     };
     methods: {

package/src/lib/utils/urlUtils.ts

@@ -0,0 +1,40 @@
+/**
+ * Checks if a given string is likely an external URL (domain or http/https).
+ * It returns true for "google.com", "www.test.com", "http://site.com".
+ * It returns false for "home", "/about", "contact-us".
+ */
+export const isExternalUrl = (url: string): boolean => {
+    if (!url) return false;
+
+    // Already has protocol
+    if (/^https?:\/\//i.test(url)) {
+        return true;
+    }
+
+    // Check for domain-like pattern (e.g., "example.com", "sub.domain.net/path")
+    // Pattern: starts with alphanumeric, contains dots, ends with TLD (2+ chars)
+    // We exclude strings that start with '/' (absolute paths)
+    if (url.startsWith('/')) {
+        return false;
+    }
+
+    // Regex to match domain at the start of the string
+    // [domain part].[tld] followed by optional path/query
+    const domainRegex = /^([a-zA-Z0-9]([a-zA-Z0-9\-]{0,61}[a-zA-Z0-9])?\.)+[a-zA-Z]{2,}(\/.*)?$/;
+
+    return domainRegex.test(url);
+};
+
+/**
+ * Normalizes a URL string.
+ * If it's detected as an external URL but missing protocol, prepends https://.
+ */
+export const normalizeUrl = (url: string): string => {
+    if (!url) return url;
+
+    if (isExternalUrl(url) && !/^https?:\/\//i.test(url)) {
+        return `https://${url}`;
+    }
+
+    return url;
+};