@deneb-ui/create-template 2.0.107 → 2.0.109

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@deneb-ui/create-template",
-  "version": "2.0.107",
+  "version": "2.0.109",
   "description": "Scaffold production-ready DENEB UI storefront templates for Next.js in seconds.",
   "bin": {
     "create-deneb-template": "bin/index.js",

package/template/README.md

@@ -162,6 +162,24 @@ Edit `src/data/site-data.json` under `template.structure.theme`:
    ```
 3. Add the page content to `src/data/site-data.json`.
 
+### One-page section navigation
+
+Use route links such as `/about` only when that route is exported. For a
+one-page design, link to a stable section ID instead:
+
+```tsx
+<a href="#about">About</a>
+<section id="about" data-section-id="about" data-design-section="about">
+  {/* About content */}
+</section>
+```
+
+Every visible navigation item must resolve to exactly one visible section in
+the exported Home document. Keep labels such as Home, About, Services, Gallery,
+and Contact as neutral template UI copy rather than AI-generated marketing
+text. Test direct `/#about` loading and sticky-header scrolling before
+packaging.
+
 ---
 
 ## Packaging for Fivora

package/template/fivora-template.json

@@ -347,6 +347,21 @@
               "type": "text",
               "label": "Feature"
             }
+          },
+          {
+            "key": "price",
+            "type": "number",
+            "label": "Price"
+          },
+          {
+            "key": "priceLabel",
+            "type": "text",
+            "label": "Price Label (e.g. Starting from, per hour)"
+          },
+          {
+            "key": "showPrice",
+            "type": "boolean",
+            "label": "Show Price on Storefront"
           }
         ]
       },
@@ -442,8 +457,7 @@
           {
             "key": "price",
             "type": "number",
-            "label": "Price",
-            "required": true
+            "label": "Price"
           },
           {
             "key": "compareAtPrice",
@@ -469,6 +483,31 @@
             "key": "badge",
             "type": "text",
             "label": "Badge"
+          },
+          {
+            "key": "showPrice",
+            "type": "boolean",
+            "label": "Show Price on Storefront"
+          },
+          {
+            "key": "isPriceRange",
+            "type": "boolean",
+            "label": "Enable Price Range"
+          },
+          {
+            "key": "minPrice",
+            "type": "number",
+            "label": "Minimum Price"
+          },
+          {
+            "key": "maxPrice",
+            "type": "number",
+            "label": "Maximum Price"
+          },
+          {
+            "key": "priceRange",
+            "type": "text",
+            "label": "Price Range Display"
           }
         ]
       }

package/template/package.json

@@ -18,7 +18,7 @@
     "next": "15.5.23",
     "react": "19.2.8",
     "react-dom": "19.2.8",
-    "@deneb-ui/ui": "^2.0.107"
+    "@deneb-ui/ui": "^2.0.109"
   },
   "devDependencies": {
     "@eslint/eslintrc": "3.3.6",
@@ -28,7 +28,7 @@
     "eslint": "9.39.5",
     "eslint-config-next": "15.5.23",
     "typescript": "5.8.3",
-    "@deneb-ui/cli": "^2.0.107",
+    "@deneb-ui/cli": "^2.0.109",
     "tailwindcss": "^3.4.17",
     "postcss": "8.5.26",
     "autoprefixer": "^10.4.20"

package/template/src/app/page.tsx

@@ -255,6 +255,28 @@ export default function HomePage() {
             const badge = contentText(product.badge);
             const category = contentText(product.category);
 
+            const itemShowPrice =
+              (product as any)?.showPrice !== undefined
+                ? Boolean((product as any).showPrice)
+                : ((product as any)?.customData?.showPrice !== undefined
+                  ? Boolean((product as any).customData.showPrice)
+                  : true);
+            const isRange = Boolean(
+              (product as any)?.isPriceRange ||
+              ((product as any)?.minPrice !== undefined && (product as any)?.maxPrice !== undefined) ||
+              (product as any)?.priceRange
+            );
+            let displayPrice = `${currency} ${price}`;
+            if (isRange) {
+              if ((product as any).priceRange) {
+                displayPrice = String((product as any).priceRange);
+              } else {
+                const min = (product as any).minPrice !== undefined ? (product as any).minPrice : price;
+                const max = (product as any).maxPrice !== undefined ? (product as any).maxPrice : price;
+                displayPrice = `${currency} ${min} – ${currency} ${max}`;
+              }
+            }
+
             return (
               <EditableCard
                 key={productId ?? index}
@@ -266,7 +288,11 @@ export default function HomePage() {
                 radius="xl"
                 style={{ display: 'flex', flexDirection: 'column' }}
               >
-                <div style={{ position: 'relative', overflow: 'hidden', borderRadius: '12px', marginBottom: '0.75rem' }}>
+                <a
+                  href={platformProductDetailHref(productId)}
+                  data-preview-static="Open the stable live product detail page"
+                  style={{ position: 'relative', overflow: 'hidden', borderRadius: '12px', marginBottom: '0.75rem', display: 'block' }}
+                >
                   <EditableImage
                     src={contentText(product.imageUrl) || '/placeholder.svg'}
                     alt={contentText(product.name)}
@@ -284,7 +310,7 @@ export default function HomePage() {
                       {badge}
                     </span>
                   )}
-                </div>
+                </a>
 
                 <div style={{ display: 'flex', flexDirection: 'column', flex: 1, gap: '0.5rem' }}>
                   {category && (
@@ -296,14 +322,20 @@ export default function HomePage() {
                       {category}
                     </span>
                   )}
-                  <EditableText
-                    variant="h3"
-                    size="lg"
-                    weight="bold"
-                    color="heading"
-                    data-preview-field-path={`products[${index}].name`}
-                    defaultValue={contentText(product.name)}
-                  />
+                  <a
+                    href={platformProductDetailHref(productId)}
+                    data-preview-static="Open the stable live product detail page"
+                    style={{ textDecoration: 'none', color: 'inherit' }}
+                  >
+                    <EditableText
+                      variant="h3"
+                      size="lg"
+                      weight="bold"
+                      color="heading"
+                      data-preview-field-path={`products[${index}].name`}
+                      defaultValue={contentText(product.name)}
+                    />
+                  </a>
                   <EditableText
                     variant="p"
                     color="muted"
@@ -311,25 +343,45 @@ export default function HomePage() {
                     defaultValue={contentText(product.description)}
                   />
 
-                  <div style={{ display: 'flex', alignItems: 'baseline', gap: '0.5rem', marginTop: 'auto', paddingTop: '0.75rem' }}>
-                    <EditableText
-                      as="span"
-                      weight="bold"
-                      size="xl"
-                      color="primary"
-                      data-preview-field-path={`products[${index}].price`}
-                      defaultValue={`${currency} ${price}`}
-                    />
-                    {compareAt > 0 && (
+                  {itemShowPrice ? (
+                    <div style={{ display: 'flex', alignItems: 'baseline', gap: '0.5rem', marginTop: 'auto', paddingTop: '0.75rem', flexWrap: 'wrap' }}>
                       <EditableText
                         as="span"
-                        color="muted"
-                        style={{ textDecoration: 'line-through', fontSize: '0.875rem' }}
-                        data-preview-field-path={`products[${index}].compareAtPrice`}
-                        defaultValue={`${currency} ${compareAt}`}
+                        weight="bold"
+                        size="xl"
+                        color="primary"
+                        data-preview-field-path={`products[${index}].price`}
+                        defaultValue={displayPrice}
                       />
-                    )}
-                  </div>
+                      {compareAt > 0 && !isRange && (
+                        <EditableText
+                          as="span"
+                          color="muted"
+                          style={{ textDecoration: 'line-through', fontSize: '0.875rem' }}
+                          data-preview-field-path={`products[${index}].compareAtPrice`}
+                          defaultValue={`${currency} ${compareAt}`}
+                        />
+                      )}
+                    </div>
+                  ) : (
+                    <div style={{ marginTop: 'auto', paddingTop: '0.75rem' }}>
+                      <span
+                        style={{
+                          display: 'inline-flex',
+                          alignItems: 'center',
+                          padding: '3px 8px',
+                          borderRadius: '6px',
+                          fontSize: '0.75rem',
+                          fontWeight: 600,
+                          backgroundColor: 'rgba(255, 255, 255, 0.08)',
+                          color: 'var(--muted-text, #94a3b8)',
+                          border: '1px solid rgba(255, 255, 255, 0.12)',
+                        }}
+                      >
+                        Price on Request
+                      </span>
+                    </div>
+                  )}
 
                   <div style={{ marginTop: '0.75rem' }}>
                     <a

package/template/src/app/services/page.tsx

@@ -93,6 +93,72 @@ export default function ServicesPage() {
                     ))}
                   </ul>
                 )}
+                {(() => {
+                  const itemShowPrice =
+                    (service as any)?.showPrice !== undefined
+                      ? Boolean((service as any).showPrice)
+                      : ((service as any)?.customData?.showPrice !== undefined
+                        ? Boolean((service as any).customData.showPrice)
+                        : true);
+                  const price = (service as any).price;
+                  const priceLabel = contentText((service as any).priceLabel);
+                  const hasNumericPrice = price !== undefined && price !== null && String(price).trim() !== '';
+                  const formattedPrice = hasNumericPrice
+                    ? typeof price === 'number'
+                      ? `LKR ${price.toLocaleString()}`
+                      : String(price).includes('LKR')
+                        ? String(price)
+                        : `LKR ${price}`
+                    : '';
+
+                  if (itemShowPrice && (hasNumericPrice || priceLabel)) {
+                    return (
+                      <div style={{ marginTop: 'auto', paddingTop: '0.75rem', display: 'flex', alignItems: 'baseline', gap: '0.375rem', flexWrap: 'wrap' }}>
+                        {hasNumericPrice && (
+                          <EditableText
+                            as="span"
+                            weight="bold"
+                            size="lg"
+                            color="primary"
+                            data-preview-field-path={`services[${index}].price`}
+                            defaultValue={formattedPrice}
+                          />
+                        )}
+                        {priceLabel && (
+                          <EditableText
+                            as="span"
+                            color="muted"
+                            data-preview-field-path={`services[${index}].priceLabel`}
+                            defaultValue={priceLabel}
+                            style={{ fontSize: '0.8125rem' }}
+                          />
+                        )}
+                      </div>
+                    );
+                  }
+                  if (!itemShowPrice) {
+                    return (
+                      <div style={{ marginTop: 'auto', paddingTop: '0.75rem' }}>
+                        <span
+                          style={{
+                            display: 'inline-flex',
+                            alignItems: 'center',
+                            padding: '3px 8px',
+                            borderRadius: '6px',
+                            fontSize: '0.75rem',
+                            fontWeight: 600,
+                            backgroundColor: 'rgba(255, 255, 255, 0.08)',
+                            color: 'var(--muted-text, #94a3b8)',
+                            border: '1px solid rgba(255, 255, 255, 0.12)',
+                          }}
+                        >
+                          Quote on Request
+                        </span>
+                      </div>
+                    );
+                  }
+                  return null;
+                })()}
               </EditableCard>
             );
           })}