@datlv-trustshop/shopify-inapp-components 0.1.30 → 0.1.32

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -120,7 +120,7 @@ export const ArticleList = ({ limit, className = "", onArticleClick, layout = "s
120
120
  lineHeight: "1.4",
121
121
  }, children: article.title }), renderButton ? (renderButton(article, {
122
122
  onClick: () => handleArticleClick(article),
123
- })) : (_jsx(Box, { children: _jsx(Button, { icon: ExternalIcon, onClick: () => handleArticleClick(article), variant: "plain", children: article.link ? "Read article" : "Learn more" }) }))] })] }) }, article.id))) }), showNavigation && displayArticles.length > 1 && (_jsxs(_Fragment, { children: [_jsx("button", { onClick: handlePrevious, "aria-label": "Previous slide", style: {
123
+ })) : (_jsx(Box, { children: _jsx(Button, { icon: ExternalIcon, onClick: () => handleArticleClick(article), variant: "plain", children: article.buttonText || (article.link ? "Read article" : "Learn more") }) }))] })] }) }, article.id))) }), showNavigation && displayArticles.length > 1 && (_jsxs(_Fragment, { children: [_jsx("button", { onClick: handlePrevious, "aria-label": "Previous slide", style: {
124
124
  position: "absolute",
125
125
  top: "50%",
126
126
  transform: "translateY(-50%)",
@@ -99,7 +99,7 @@ export const ArticleSlide = ({ limit, className = "", onArticleClick, autoPlay =
99
99
  display: "inline-flex",
100
100
  alignItems: "center",
101
101
  gap: "4px",
102
- }, children: [article.link ? "Read article" : "Learn more", _jsxs("svg", { width: "14", height: "14", viewBox: "0 0 20 20", fill: "currentColor", children: [_jsx("path", { d: "M17 2a1 1 0 0 1 1 1v4a1 1 0 1 1-2 0V4.414l-7.293 7.293a1 1 0 0 1-1.414-1.414L14.586 3H12a1 1 0 1 1 0-2h5Z" }), _jsx("path", { d: "M3 6a1 1 0 0 1 1-1h5a1 1 0 1 1 0 2H5v10h10v-4a1 1 0 1 1 2 0v5a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V6Z" })] })] }))] })] }) }, article.id))) }), showNavigation && displayArticles.length > 1 && (_jsxs(_Fragment, { children: [_jsx("button", { onClick: handlePrevious, "aria-label": "Previous slide", style: {
102
+ }, children: [article.buttonText || (article.link ? "Read article" : "Learn more"), _jsxs("svg", { width: "14", height: "14", viewBox: "0 0 20 20", fill: "currentColor", children: [_jsx("path", { d: "M17 2a1 1 0 0 1 1 1v4a1 1 0 1 1-2 0V4.414l-7.293 7.293a1 1 0 0 1-1.414-1.414L14.586 3H12a1 1 0 1 1 0-2h5Z" }), _jsx("path", { d: "M3 6a1 1 0 0 1 1-1h5a1 1 0 1 1 0 2H5v10h10v-4a1 1 0 1 1 2 0v5a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V6Z" })] })] }))] })] }) }, article.id))) }), showNavigation && displayArticles.length > 1 && (_jsxs(_Fragment, { children: [_jsx("button", { onClick: handlePrevious, "aria-label": "Previous slide", style: {
103
103
  position: "absolute",
104
104
  top: "50%",
105
105
  transform: "translateY(-50%)",
@@ -10,7 +10,7 @@ export const GrowApps = ({ className = "", onAppClick, onDismiss, dismissKey = D
10
10
  const slidesContainerRef = useRef(null);
11
11
  const currentPositionRef = useRef(0);
12
12
  const { data } = useDashboard();
13
- const growAppsTranslations = useTranslation('growApps');
13
+ const growAppsTranslations = useTranslation("growApps");
14
14
  const allGrowApps = data?.grow_apps || [];
15
15
  const displayLimit = data?.grow_apps_display_limit || maxItems;
16
16
  const growApps = allGrowApps.slice(0, displayLimit);
@@ -137,7 +137,8 @@ export const GrowApps = ({ className = "", onAppClick, onDismiss, dismissKey = D
137
137
  return (_jsx("div", { className: className, style: { width: "100%" }, children: _jsx(Card, { children: _jsx(Box, { children: _jsx(Text, { variant: "bodyMd", tone: "subdued", as: "p", children: growAppsTranslations?.noData || "No apps available" }) }) }) }));
138
138
  }
139
139
  const activator = (_jsx(Button, { icon: MenuHorizontalIcon, variant: "tertiary", onClick: togglePopoverActive, ariaExpanded: popoverActive }));
140
- return (_jsx("div", { className: className, style: { width: "100%" }, children: _jsx(Card, { children: _jsx(Box, { children: _jsxs(BlockStack, { gap: "200", children: [_jsxs(InlineStack, { align: "space-between", blockAlign: "center", wrap: false, gap: "300", children: [_jsxs(BlockStack, { gap: "100", children: [_jsx(Text, { variant: "headingMd", as: "h3", children: growAppsTranslations?.title || "Grow faster with apps" }), _jsx(Text, { variant: "bodyMd", tone: "subdued", as: "p", children: growAppsTranslations?.subtitle || "Discover powerful apps to enhance your store, streamline workflows, and boost sales." })] }), _jsxs(InlineStack, { gap: "100", wrap: false, children: [showDismiss && (_jsx(Box, { padding: "150", children: _jsx(Popover, { active: popoverActive, activator: activator, onClose: togglePopoverActive, ariaHaspopup: false, children: _jsx(ActionList, { actionRole: "menuitem", items: [
140
+ return (_jsx("div", { className: className, style: { width: "100%" }, children: _jsx(Card, { children: _jsx(Box, { children: _jsxs(BlockStack, { gap: "200", children: [_jsxs(InlineStack, { align: "space-between", blockAlign: "center", wrap: false, gap: "300", children: [_jsxs(BlockStack, { gap: "100", children: [_jsx(Text, { variant: "headingMd", as: "h3", children: growAppsTranslations?.title || "Grow faster with apps" }), _jsx(Text, { variant: "bodyMd", tone: "subdued", as: "p", children: growAppsTranslations?.subtitle ||
141
+ "Discover powerful apps to enhance your store, streamline workflows, and boost sales." })] }), _jsxs(InlineStack, { gap: "100", wrap: false, children: [showDismiss && (_jsx(Box, { padding: "150", children: _jsx(Popover, { active: popoverActive, activator: activator, onClose: togglePopoverActive, ariaHaspopup: false, children: _jsx(ActionList, { actionRole: "menuitem", items: [
141
142
  {
142
143
  content: growAppsTranslations?.dismiss || "Dismiss",
143
144
  onAction: handleDismiss,
@@ -189,17 +190,29 @@ export const GrowApps = ({ className = "", onAppClick, onDismiss, dismissKey = D
189
190
  transform: "translateX(0px)",
190
191
  }, children: growApps.map((app, index) => {
191
192
  const iconUrl = app.icon_url || app.imageUrl || "";
192
- const buttonText = app.button_text || app.button_get_app || growAppsTranslations?.install || "Get app";
193
+ const buttonText = app.button_text ||
194
+ app.button_get_app ||
195
+ growAppsTranslations?.install ||
196
+ "Get app";
193
197
  return (_jsx("div", { "data-index": index, style: {
194
198
  flexShrink: 0,
195
199
  width: "282px",
196
200
  transition: "transform 0.2s ease",
197
- }, children: _jsx(Card, { children: _jsx(Box, { minWidth: "250px", children: _jsxs(BlockStack, { gap: "300", children: [_jsx(InlineStack, { gap: "400", blockAlign: "start", children: iconUrl && (_jsx("img", { src: iconUrl, alt: app.title, width: 60, height: 60, style: {
201
+ }, children: _jsx(Card, { children: _jsx(Box, { minWidth: "250px", minHeight: "180px", children: _jsxs(BlockStack, { gap: "300", children: [_jsx(InlineStack, { gap: "400", blockAlign: "start", children: iconUrl && (_jsx("img", { src: iconUrl, alt: app.title, width: 60, height: 60, style: {
198
202
  borderRadius: "8px",
199
203
  flexShrink: 0,
200
- } })) }), _jsxs(BlockStack, { gap: "200", children: [_jsx(Text, { variant: "headingSm", as: "h4", children: app.title }), _jsx("div", { style: {
204
+ } })) }), _jsxs(BlockStack, { gap: "200", children: [_jsx("div", { style: {
201
205
  display: "-webkit-box",
202
- WebkitLineClamp: 3,
206
+ fontSize: "13px",
207
+ fontWeight: 650,
208
+ color: "#303030",
209
+ WebkitLineClamp: 1,
210
+ WebkitBoxOrient: "vertical",
211
+ overflow: "hidden",
212
+ textOverflow: "ellipsis",
213
+ }, children: app.title }), _jsx("div", { style: {
214
+ display: "-webkit-box",
215
+ WebkitLineClamp: 2,
203
216
  WebkitBoxOrient: "vertical",
204
217
  overflow: "hidden",
205
218
  textOverflow: "ellipsis",
@@ -193,6 +193,7 @@ export function adaptArticle(apiData) {
193
193
  category: apiData.category || apiData.section || apiData.label,
194
194
  readTime: apiData.read_time || apiData.readTime || apiData.reading_time,
195
195
  tags: apiData.tags || apiData.keywords || [],
196
+ buttonText: apiData.button_text || apiData.buttonText,
196
197
  };
197
198
  }
198
199
  function adaptProductUpdates(updates) {
@@ -11,4 +11,5 @@ export interface ArticleItem {
11
11
  category?: string;
12
12
  readTime?: number;
13
13
  tags?: string[];
14
+ buttonText?: string;
14
15
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@datlv-trustshop/shopify-inapp-components",
3
- "version": "0.1.30",
3
+ "version": "0.1.32",
4
4
  "private": false,
5
5
  "description": "React TypeScript components for Shopify in-app dashboard content",
6
6
  "main": "dist/index.js",