@caratlogic/design-system 0.1.19 → 0.1.20

package/dist/index.esm.js

@@ -66662,16 +66662,43 @@ const buildFacebookUrl = (url) => `https://www.facebook.com/sharer/sharer.php?u=
 const buildXUrl = (text, url) => `https://twitter.com/intent/tweet?text=${encodeURIComponent(text)}&url=${encodeURIComponent(url)}`;
 const isWebShareAvailable = () => typeof navigator !== 'undefined' && typeof navigator.share === 'function';
 const isValidEmail = (value) => /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(value.trim());
+/**
+ * Bulk share message: the title, then one numbered entry per item with its
+ * caption above its link. Blank lines between entries stop chat clients from
+ * running the links together.
+ */
+const buildBulkShareMessage = (title, items) => [
+    title,
+    ...items.map((item, index) => `\n${index + 1}. ${item.label}\n${item.url}`),
+].join('\n');
 
 const WhatsappIcon = ({ className }) => (jsxs("svg", { viewBox: "0 0 24 24", fill: "currentColor", "aria-hidden": "true", className: className, children: [jsx("path", { d: "M17.5 14.4c-.3-.1-1.7-.8-1.9-.9-.3-.1-.5-.1-.7.1s-.8.9-1 1.1-.4.2-.7.1c-1.6-.8-2.7-1.4-3.7-3.2-.3-.5.3-.5.8-1.5.1-.2.1-.4 0-.5l-.9-2.1c-.2-.6-.5-.5-.7-.5h-.6c-.2 0-.5.1-.8.4-.3.3-1 1-1 2.5s1.1 2.9 1.2 3.1c.2.2 2.2 3.3 5.3 4.6 2 .8 2.7.9 3.7.8.6-.1 1.7-.7 1.9-1.3.2-.7.2-1.2.2-1.3-.1-.2-.3-.3-.6-.4Z" }), jsx("path", { d: "M20 4A11 11 0 0 0 4 4a10.9 10.9 0 0 0-1.7 13.4L1 23l5.7-1.5A11 11 0 0 0 23 12 10.9 10.9 0 0 0 20 4Zm-8 18a9.1 9.1 0 0 1-4.6-1.3l-.3-.2-3.4.9.9-3.3-.2-.4A9 9 0 1 1 12 22Z" })] }));
 const SocialTile = ({ icon, label, bg, fg, onClick }) => (jsxs("button", { type: "button", onClick: onClick, className: "flex cursor-pointer flex-col items-center gap-2 focus-visible:outline-none", children: [jsx("span", { className: cn('flex h-12 w-12 items-center justify-center rounded-full transition-transform hover:scale-105', bg, fg), children: icon }), jsx("span", { className: "text-xs text-foreground", children: label })] }));
-const ShareBody = ({ url, urls, title = 'Check this out', entityLabel = 'item', onInviteEmail, hideInvite = false, hideHeader = false, }) => {
+const ShareBody = ({ url, urls, items, title = 'Check this out', entityLabel = 'item', onInviteEmail, hideInvite = false, hideHeader = false, }) => {
     const [email, setEmail] = useState('');
     const [sending, setSending] = useState(false);
-    const isMulti = (urls?.length ?? 0) > 0;
-    const shareUrls = isMulti ? (urls ?? []) : url ? [url] : [];
+    const shareItems = items ?? [];
+    const isMulti = shareItems.length > 0 || (urls?.length ?? 0) > 0;
+    const shareUrls = shareItems.length
+        ? shareItems.map((item) => item.url)
+        : isMulti
+            ? (urls ?? [])
+            : url
+                ? [url]
+                : [];
     const hasContent = shareUrls.length > 0;
-    const shareBody = isMulti ? [title, ...shareUrls].join('\n') : url;
+    // Captioned items read as a numbered list; bare urls keep the older format.
+    const shareBody = shareItems.length
+        ? buildBulkShareMessage(title, shareItems)
+        : isMulti
+            ? [title, ...shareUrls].join('\n')
+            : url;
+    /**
+     * What chat apps receive. A single share puts its link on its own line, the
+     * same shape as one entry of a bulk message — glued to the caption it reads
+     * as one run-on sentence. Copy Link still copies the bare url.
+     */
+    const shareMessage = isMulti ? shareBody : [title, url].filter(Boolean).join('\n');
     const openInPopup = (href) => {
         if (!hasContent)
             return;
@@ -66698,7 +66725,7 @@ const ShareBody = ({ url, urls, title = 'Check this out', entityLabel = 'item',
             return;
         }
         try {
-            await navigator.share(isMulti ? { title, text: shareBody } : { url, title });
+            await navigator.share(isMulti ? { title, text: shareMessage } : { url, title, text: shareMessage });
         }
         catch (e) {
             const err = e;
@@ -66733,16 +66760,14 @@ const ShareBody = ({ url, urls, title = 'Check this out', entityLabel = 'item',
     };
     return (jsxs("div", { className: "flex flex-col gap-3", children: [!hideHeader && (jsxs(Fragment$2, { children: [jsxs("header", { className: "flex flex-col gap-1", children: [jsx("h3", { className: "text-base font-semibold text-foreground", children: "Share" }), jsx("p", { className: "text-xs text-muted-foreground", children: isMulti
                                     ? `Anyone with these links can open the public view of the selected ${entityLabel}s.`
-                                    : `Anyone with the link can open the public view of this ${entityLabel}.` })] }), jsx(Separator, {})] })), jsxs("section", { className: "flex flex-col gap-3", children: [jsx("h4", { className: "text-sm font-medium text-foreground", children: "Social" }), jsxs("div", { className: "grid grid-cols-3 gap-3", children: [jsx(SocialTile, { icon: jsx(WhatsappIcon, { className: "h-6 w-6" }), label: "Whatsapp", bg: "bg-[#25D366]", fg: "text-white", onClick: () => openInPopup(isMulti
-                                    ? buildWhatsappUrl('', shareBody)
-                                    : buildWhatsappUrl(title, url)) }), !isMulti && (jsx(SocialTile, { icon: jsx(Facebook, { className: "h-6 w-6", fill: "currentColor" }), label: "Facebook", bg: "bg-[#1877F2]", fg: "text-white", onClick: () => openInPopup(buildFacebookUrl(url)) })), !isMulti && (jsx(SocialTile, { icon: jsx(X$2, { className: "h-6 w-6", strokeWidth: 2.5 }), label: "X", bg: "bg-black", fg: "text-white", onClick: () => openInPopup(buildXUrl(title, url)) })), jsx(SocialTile, { icon: jsx(Link2, { className: "h-6 w-6", strokeWidth: 1.5 }), label: "Copy Link", bg: "bg-muted", fg: "text-foreground", onClick: handleCopy }), jsx(SocialTile, { icon: jsx(Share2, { className: "h-6 w-6", strokeWidth: 1.5 }), label: "System Share", bg: "bg-muted", fg: "text-foreground", onClick: handleSystemShare })] })] }), !hideInvite && (jsxs(Fragment$2, { children: [jsx(Separator, {}), jsxs("section", { className: "flex flex-col gap-2", children: [jsx("h4", { className: "text-sm font-medium text-foreground", children: "Invite your Merchants" }), jsxs("form", { className: "flex items-center gap-2", onSubmit: (e) => {
+                                    : `Anyone with the link can open the public view of this ${entityLabel}.` })] }), jsx(Separator, {})] })), jsxs("section", { className: "flex flex-col gap-3", children: [jsx("h4", { className: "text-sm font-medium text-foreground", children: "Social" }), jsxs("div", { className: "grid grid-cols-3 gap-3", children: [jsx(SocialTile, { icon: jsx(WhatsappIcon, { className: "h-6 w-6" }), label: "Whatsapp", bg: "bg-[#25D366]", fg: "text-white", onClick: () => openInPopup(buildWhatsappUrl('', shareMessage)) }), !isMulti && (jsx(SocialTile, { icon: jsx(Facebook, { className: "h-6 w-6", fill: "currentColor" }), label: "Facebook", bg: "bg-[#1877F2]", fg: "text-white", onClick: () => openInPopup(buildFacebookUrl(url)) })), !isMulti && (jsx(SocialTile, { icon: jsx(X$2, { className: "h-6 w-6", strokeWidth: 2.5 }), label: "X", bg: "bg-black", fg: "text-white", onClick: () => openInPopup(buildXUrl(title, url)) })), jsx(SocialTile, { icon: jsx(Link2, { className: "h-6 w-6", strokeWidth: 1.5 }), label: "Copy Link", bg: "bg-muted", fg: "text-foreground", onClick: handleCopy }), jsx(SocialTile, { icon: jsx(Share2, { className: "h-6 w-6", strokeWidth: 1.5 }), label: "System Share", bg: "bg-muted", fg: "text-foreground", onClick: handleSystemShare })] })] }), !hideInvite && (jsxs(Fragment$2, { children: [jsx(Separator, {}), jsxs("section", { className: "flex flex-col gap-2", children: [jsx("h4", { className: "text-sm font-medium text-foreground", children: "Invite your Merchants" }), jsxs("form", { className: "flex items-center gap-2", onSubmit: (e) => {
                                     e.preventDefault();
                                     void handleSend();
                                 }, children: [jsx("input", { type: "email", value: email, onChange: (e) => setEmail(e.target.value), placeholder: "Example@gmail.com", className: "flex-1 rounded-md border border-border bg-input-background px-3 py-2 text-sm text-foreground outline-none placeholder:text-muted-foreground focus:border-primary focus:ring-2 focus:ring-primary/10" }), jsx(Button$1, { type: "submit", size: "sm", style: { width: '118px' }, className: "bg-primary text-primary-foreground hover:bg-primary/90", disabled: sending, children: sending ? 'Sending…' : 'Send' })] })] })] }))] }));
 };
-const ShareMenu = ({ children, url, urls, title, entityLabel, onInviteEmail, hideInvite, side = 'bottom', align = 'end', open, onOpenChange, }) => (jsxs(Popover, { open: open, onOpenChange: onOpenChange, children: [jsx(PopoverTrigger, { asChild: true, children: children }), jsx(PopoverContent, { side: side, align: align, sideOffset: 8, className: "w-[360px] p-4", children: jsx(ShareBody, { url: url, urls: urls, title: title, entityLabel: entityLabel, onInviteEmail: onInviteEmail, hideInvite: hideInvite }) })] }));
-const ShareDialog = ({ open, onOpenChange, url, urls, title, entityLabel = 'item', onInviteEmail, hideInvite, stockId, }) => {
-    const count = urls?.length ?? 0;
+const ShareMenu = ({ children, url, urls, items, title, entityLabel, onInviteEmail, hideInvite, side = 'bottom', align = 'end', open, onOpenChange, }) => (jsxs(Popover, { open: open, onOpenChange: onOpenChange, children: [jsx(PopoverTrigger, { asChild: true, children: children }), jsx(PopoverContent, { side: side, align: align, sideOffset: 8, className: "w-[360px] p-4", children: jsx(ShareBody, { url: url, urls: urls, items: items, title: title, entityLabel: entityLabel, onInviteEmail: onInviteEmail, hideInvite: hideInvite }) })] }));
+const ShareDialog = ({ open, onOpenChange, url, urls, items, title, entityLabel = 'item', onInviteEmail, hideInvite, stockId, }) => {
+    const count = items?.length ?? urls?.length ?? 0;
     const isMulti = count > 0;
     const trimmedStockId = stockId?.trim();
     const heading = isMulti
@@ -66752,7 +66777,7 @@ const ShareDialog = ({ open, onOpenChange, url, urls, title, entityLabel = 'item
             : 'Share';
     return (jsx(Dialog, { open: open, onOpenChange: onOpenChange, children: jsxs(DialogContent, { className: "sm:max-w-[400px]", children: [jsxs(DialogHeader, { children: [jsx(DialogTitle, { children: heading }), jsx(DialogDescription, { children: isMulti
                                 ? `Anyone with these links can open the public view of the selected ${entityLabel}s.`
-                                : `Anyone with the link can open the public view of this ${entityLabel}.` })] }), jsx(ShareBody, { url: url, urls: urls, title: title, entityLabel: entityLabel, onInviteEmail: onInviteEmail, hideInvite: hideInvite, hideHeader: true })] }) }));
+                                : `Anyone with the link can open the public view of this ${entityLabel}.` })] }), jsx(ShareBody, { url: url, urls: urls, items: items, title: title, entityLabel: entityLabel, onInviteEmail: onInviteEmail, hideInvite: hideInvite, hideHeader: true })] }) }));
 };
 
 const Table = React.forwardRef(({ className, ...props }, ref) => (jsx("table", { ref: ref, className: cn('w-full text-sm text-left border-collapse', className), ...props })));
@@ -77614,5 +77639,5 @@ var RichTextAreaImpl = /*#__PURE__*/Object.freeze({
   RichTextarea: RichTextarea
 });
 
-export { ACTIVITY_CATEGORIES, ACTIVITY_CATEGORY_META, ActionBadge, ActionButtonWithTooltip, ActivityFeed, AdvancedSearchDrawer, Alert, ApiComboBox, AppSidebar, AuditEntryCard, AuditHistoryPanel, AuditTimeline, AuditTimelineShimmer, Badge, BadgeType, BusinessContactStatusFilter, Button, CUSTOMER_AUDIT_CONFIG, CertificateRowList, ChangePill, Collapsible, CollapsibleCard, CollapsibleContent, CollapsibleTrigger, ConfirmDialog, ContactTypeFilter, CopyButton, CountrySelect, CreateFormPageHeader, CreateFormPageShell, CurrencyDisplayTabs, CurrencyInput, CurrencyToggle, CustomCombobox, CustomFieldInput, CustomFieldValue, CustomTable, CustomizeColumnsDrawer, DIAMOND_AUDIT_CONFIG, DashboardShell, DataEditableTable, DataTable, DateInput, DetailChip, DetailPageLayout, DetailPageSkeleton, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EmptyValue, EntityHeader, Field, FieldSkeleton, FileUploader, FilterMultiSelect, FilterSelect, FormSectionCard, FormSectionCardSkeleton, GEM_AUDIT_CONFIG, HistoryEntryCard, HistoryTimeline, HistoryTimelineShimmer, INVOICE_AUDIT_CONFIG, IconButton, IdHyperlinkText, InAppNotificationCard, InAppNotificationsPanel, InfoBanner, InventoryComboBox, InventoryItemCard, InventoryItemRow, InvoiceComboBox, KYCStatusFilter, KeyValueGrid, LAYOUT_AUDIT_CONFIG, LabeledToggle, MEMO_IN_AUDIT_CONFIG, MEMO_OUT_AUDIT_CONFIG, MediaGallery, MemoInComboBox, MetricCard, MetricRow, MetricTile, Modal, MoreInfoPanel, MoreInfoTrigger, NOT_CAPTURED, Navbar, NavbarActions, NavbarAvatar, NavbarIconButton, NavbarSearch, NavbarTitle, NumberInput, NumberedStepCard, OtpInput, OwnershipFilter, OwnershipSplitCard, PROFORMA_AUDIT_CONFIG, PageHeader, PageTabs, Pagination, PaginationSelect, PartnerShareCard, PriceInput, Protected, PurchaseOrderComboBox, QUOTATION_AUDIT_CONFIG, RadioCardGroup, ReadMoreText, RefreshButton, RichTextarea$1 as RichTextarea, SEARCHABLE_SELECT_PAGE_SIZE, SafeImage, SearchBox, SearchInput, SearchableSelect, SectionCard, SectionIcon, SegmentedControl, ShareDialog, ShareMenu, ShimmerTable, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupLabel, SidebarHeader, SidebarInset, SidebarMenu, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, SlideOut, SlideOutClose, SlideOutContent, SlideOutDescription, SlideOutHeader, SlideOutOverlay, SlideOutPortal, SlideOutTitle, SlideOutTrigger, Slider, SpecList, Spinner, SquareSkeleton, StateSelect, StatusBadge$1 as StatusBadge, StatusFilter, Stepper, StockTypeFilter, TablePagination, TableSkeleton, Tabs, TabsContent, TabsList, TabsTrigger, TagsInput, TextHyperlink, TimePicker, ToggleSwitch, TruncateTooltip, WarehouseComboBox, WarehouseFilter, ZoomSplitViewer, asList, asText, badgeVariants, buildBulkShareTitle, buildInventoryPublicUrl, buildInventoryRowProps, buildInventoryShareTitle, buildWhatsappUrl, buttonVariants, cn, countries, countryByCode, createVideoMediaItem, dropdownMenuItemDestructiveClass, fieldTypeIcon, findRegion, flagEmoji, formatAddressLocation, formatFileSize, generateActionDescription, generateTitle, getBadgeTypeForStatus, getChangePills, getCountryName, getInitials, getStatesOfCountry, iconButtonVariants, inAppNotificationCardA11y, inAppNotificationsPanelA11y, isBlank, isIndiaCountry, isKnownRegion, isPathActive, isValidAlpha2CountryCode, isValueEmpty, notify, releaseStaleOverlayBodyLock, renderBadge, resolveCountryCode, toAddressFormValues, useAuditShowMore, useBadge, useButton, useDropdownMenu, useInAppNotificationsPanel, useNavbar, useSidebar, videoThumbnailSrc, watchOverlayBodyLock };
+export { ACTIVITY_CATEGORIES, ACTIVITY_CATEGORY_META, ActionBadge, ActionButtonWithTooltip, ActivityFeed, AdvancedSearchDrawer, Alert, ApiComboBox, AppSidebar, AuditEntryCard, AuditHistoryPanel, AuditTimeline, AuditTimelineShimmer, Badge, BadgeType, BusinessContactStatusFilter, Button, CUSTOMER_AUDIT_CONFIG, CertificateRowList, ChangePill, Collapsible, CollapsibleCard, CollapsibleContent, CollapsibleTrigger, ConfirmDialog, ContactTypeFilter, CopyButton, CountrySelect, CreateFormPageHeader, CreateFormPageShell, CurrencyDisplayTabs, CurrencyInput, CurrencyToggle, CustomCombobox, CustomFieldInput, CustomFieldValue, CustomTable, CustomizeColumnsDrawer, DIAMOND_AUDIT_CONFIG, DashboardShell, DataEditableTable, DataTable, DateInput, DetailChip, DetailPageLayout, DetailPageSkeleton, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EmptyValue, EntityHeader, Field, FieldSkeleton, FileUploader, FilterMultiSelect, FilterSelect, FormSectionCard, FormSectionCardSkeleton, GEM_AUDIT_CONFIG, HistoryEntryCard, HistoryTimeline, HistoryTimelineShimmer, INVOICE_AUDIT_CONFIG, IconButton, IdHyperlinkText, InAppNotificationCard, InAppNotificationsPanel, InfoBanner, InventoryComboBox, InventoryItemCard, InventoryItemRow, InvoiceComboBox, KYCStatusFilter, KeyValueGrid, LAYOUT_AUDIT_CONFIG, LabeledToggle, MEMO_IN_AUDIT_CONFIG, MEMO_OUT_AUDIT_CONFIG, MediaGallery, MemoInComboBox, MetricCard, MetricRow, MetricTile, Modal, MoreInfoPanel, MoreInfoTrigger, NOT_CAPTURED, Navbar, NavbarActions, NavbarAvatar, NavbarIconButton, NavbarSearch, NavbarTitle, NumberInput, NumberedStepCard, OtpInput, OwnershipFilter, OwnershipSplitCard, PROFORMA_AUDIT_CONFIG, PageHeader, PageTabs, Pagination, PaginationSelect, PartnerShareCard, PriceInput, Protected, PurchaseOrderComboBox, QUOTATION_AUDIT_CONFIG, RadioCardGroup, ReadMoreText, RefreshButton, RichTextarea$1 as RichTextarea, SEARCHABLE_SELECT_PAGE_SIZE, SafeImage, SearchBox, SearchInput, SearchableSelect, SectionCard, SectionIcon, SegmentedControl, ShareDialog, ShareMenu, ShimmerTable, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupLabel, SidebarHeader, SidebarInset, SidebarMenu, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, SlideOut, SlideOutClose, SlideOutContent, SlideOutDescription, SlideOutHeader, SlideOutOverlay, SlideOutPortal, SlideOutTitle, SlideOutTrigger, Slider, SpecList, Spinner, SquareSkeleton, StateSelect, StatusBadge$1 as StatusBadge, StatusFilter, Stepper, StockTypeFilter, TablePagination, TableSkeleton, Tabs, TabsContent, TabsList, TabsTrigger, TagsInput, TextHyperlink, TimePicker, ToggleSwitch, TruncateTooltip, WarehouseComboBox, WarehouseFilter, ZoomSplitViewer, asList, asText, badgeVariants, buildBulkShareMessage, buildBulkShareTitle, buildInventoryPublicUrl, buildInventoryRowProps, buildInventoryShareTitle, buildWhatsappUrl, buttonVariants, cn, countries, countryByCode, createVideoMediaItem, dropdownMenuItemDestructiveClass, fieldTypeIcon, findRegion, flagEmoji, formatAddressLocation, formatFileSize, generateActionDescription, generateTitle, getBadgeTypeForStatus, getChangePills, getCountryName, getInitials, getStatesOfCountry, iconButtonVariants, inAppNotificationCardA11y, inAppNotificationsPanelA11y, isBlank, isIndiaCountry, isKnownRegion, isPathActive, isValidAlpha2CountryCode, isValueEmpty, notify, releaseStaleOverlayBodyLock, renderBadge, resolveCountryCode, toAddressFormValues, useAuditShowMore, useBadge, useButton, useDropdownMenu, useInAppNotificationsPanel, useNavbar, useSidebar, videoThumbnailSrc, watchOverlayBodyLock };
 //# sourceMappingURL=index.esm.js.map