@katlux/block-ecommerce 0.1.1-alpha.88 → 0.1.1-alpha.89

package/dist/module.d.mts

@@ -1,6 +1,8 @@
+import * as _nuxt_schema from '@nuxt/schema';
+
 interface ModuleOptions {
 }
-declare const _default: any;
+declare const _default: _nuxt_schema.NuxtModule<ModuleOptions, ModuleOptions, false>;
 
 export { _default as default };
 export type { ModuleOptions };

package/dist/module.json

@@ -4,7 +4,7 @@
   "compatibility": {
     "nuxt": "^3.0.0"
   },
-  "version": "0.1.1-alpha.88",
+  "version": "0.1.1-alpha.89",
   "builder": {
     "@nuxt/module-builder": "1.0.2",
     "unbuild": "3.6.1"

package/dist/runtime/components/KProductList/KProductList.d.vue.ts

@@ -6,6 +6,7 @@ type __VLS_Props = {
     rowActions?: KProductRowAction[];
     gridColumns?: number | string;
     gap?: string;
+    locale?: string;
 };
 declare var __VLS_1: {
     item: import("@katlux/providers").TDataRow;
@@ -21,6 +22,7 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {},
     rowActions: KProductRowAction[];
     gridColumns: number | string;
     gap: string;
+    locale: string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;

package/dist/runtime/components/KProductList/KProductList.logic.d.ts

@@ -6,6 +6,7 @@ export interface KProductListProps {
     rowActions?: KProductRowAction[];
     gridColumns?: number | string;
     gap?: string;
+    locale?: string;
 }
 export declare const KProductListDefaultProps: {
     dataProvider: {

package/dist/runtime/components/KProductList/KProductList.vue

@@ -1,20 +1,21 @@
 <template>
-<div class="k-product-list" :class="{ 'is-grid': isGrid, 'is-list': !isGrid }">
+<div class="k-product-list" :class="{ 'is-grid': isGrid, 'is-list': !isGrid }" :style="containerVars">
 	<!-- If there's a custom template provided via default slot -->
 	<template v-if="$slots.default">
-		<div class="list-container" :style="isGrid ? gridStyles : listStyles">
+		<div class="list-container">
 			<slot v-for="(item, index) in props.dataProvider.pageData.value" :item="item" :index="index"></slot>
 		</div>
 	</template>
 
 	<!-- Otherwise, use the default KProductListItem -->
 	<template v-else>
-		<div class="list-container" :style="isGrid ? gridStyles : listStyles">
+		<div class="list-container">
 			<KProductListItem
 				v-for="(item, index) in props.dataProvider.pageData.value" 
 				:key="item.id || index"
 				:item="item"
 				:row-actions="rowActions"
+				:locale="props.locale"
 			>
 				<template v-for="(_, slot) in $slots" #[slot]="scope">
 					<slot :name="slot" v-bind="scope"></slot>
@@ -30,6 +31,7 @@
 </template>
 
 <script setup>
+import { computed } from "vue";
 import { ADataProvider } from "@katlux/providers";
 import { useKProductListLogic } from "./KProductList.logic";
 const props = defineProps({
@@ -37,9 +39,14 @@ const props = defineProps({
   layout: { type: String, required: false, default: "grid" },
   rowActions: { type: Array, required: false, default: () => [] },
   gridColumns: { type: [Number, String], required: false, default: 4 },
-  gap: { type: String, required: false, default: "1rem" }
+  gap: { type: String, required: false, default: "1rem" },
+  locale: { type: String, required: false, default: void 0 }
 });
 const { isGrid, gridStyles, listStyles } = useKProductListLogic(props);
+const containerVars = computed(() => ({
+  "--k-product-grid-cols": String(props.gridColumns),
+  "--k-product-gap": props.gap
+}));
 </script>
 
 <style scoped>
@@ -49,6 +56,16 @@ const { isGrid, gridStyles, listStyles } = useKProductListLogic(props);
 .k-product-list .list-container {
   width: 100%;
 }
+.k-product-list.is-grid .list-container {
+  display: grid;
+  grid-template-columns: repeat(var(--k-product-grid-cols, 4), minmax(0, 1fr));
+  gap: var(--k-product-gap, 1rem);
+}
+.k-product-list.is-list .list-container {
+  display: flex;
+  flex-direction: column;
+  gap: var(--k-product-gap, 1rem);
+}
 .k-product-list .footer {
   display: flex;
   justify-content: flex-end;

package/dist/runtime/components/KProductList/KProductList.vue.d.ts

@@ -6,6 +6,7 @@ type __VLS_Props = {
     rowActions?: KProductRowAction[];
     gridColumns?: number | string;
     gap?: string;
+    locale?: string;
 };
 declare var __VLS_1: {
     item: import("@katlux/providers").TDataRow;
@@ -21,6 +22,7 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {},
     rowActions: KProductRowAction[];
     gridColumns: number | string;
     gap: string;
+    locale: string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;

package/dist/runtime/components/KProductListItem/KProductListItem.d.vue.ts

@@ -2,6 +2,7 @@ import type { KProductItemData, KProductRowAction } from '@katlux/providers';
 type __VLS_Props = {
     item: KProductItemData;
     rowActions?: KProductRowAction[];
+    locale?: string;
 };
 declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;

package/dist/runtime/components/KProductListItem/KProductListItem.logic.d.ts

@@ -3,6 +3,7 @@ import type { KProductItemData, KProductRowAction } from '@katlux/providers';
 export interface KProductListItemProps {
     item: KProductItemData;
     rowActions?: KProductRowAction[];
+    locale?: string;
 }
 export declare const KProductListItemDefaultProps: {
     item: {
@@ -13,7 +14,12 @@ export declare const KProductListItemDefaultProps: {
         type: PropType<KProductRowAction[]>;
         default: () => never[];
     };
+    locale: {
+        type: PropType<string>;
+        default: undefined;
+    };
 };
+export declare function formatCurrencyPrice(price: number | undefined | null, rawCurrency?: string, locale?: string): string;
 export declare function useKProductListItemLogic(props: KProductListItemProps): {
     hasActions: import("vue").ComputedRef<boolean | undefined>;
     formattedPrice: import("vue").ComputedRef<string>;

package/dist/runtime/components/KProductListItem/KProductListItem.logic.js

@@ -7,16 +7,67 @@ export const KProductListItemDefaultProps = {
   rowActions: {
     type: Array,
     default: () => []
+  },
+  locale: {
+    type: String,
+    default: void 0
   }
 };
+const CURRENCY_MAP = {
+  TL: "TRY",
+  tl: "TRY",
+  "\u20BA": "TRY",
+  TRY: "TRY",
+  USD: "USD",
+  usd: "USD",
+  "$": "USD",
+  EUR: "EUR",
+  eur: "EUR",
+  "\u20AC": "EUR",
+  GBP: "GBP",
+  gbp: "GBP",
+  "\xA3": "GBP",
+  JPY: "JPY",
+  jpy: "JPY",
+  "\xA5": "JPY"
+};
+export function formatCurrencyPrice(price, rawCurrency, locale) {
+  if (price === void 0 || price === null || typeof price !== "number" || !Number.isFinite(price)) {
+    return "";
+  }
+  const cleanCurr = (rawCurrency || "USD").trim();
+  const isoCode = CURRENCY_MAP[cleanCurr] || cleanCurr.toUpperCase();
+  let activeLocale = locale;
+  if (!activeLocale) {
+    if (isoCode === "TRY") {
+      activeLocale = "tr-TR";
+    } else if (typeof navigator !== "undefined" && navigator.language) {
+      activeLocale = navigator.language;
+    } else {
+      activeLocale = "en-US";
+    }
+  }
+  try {
+    return new Intl.NumberFormat(activeLocale, {
+      style: "currency",
+      currency: isoCode
+    }).format(price);
+  } catch {
+    try {
+      const formattedNumber = new Intl.NumberFormat(activeLocale, {
+        minimumFractionDigits: 2,
+        maximumFractionDigits: 2
+      }).format(price);
+      return `${rawCurrency || ""} ${formattedNumber}`.trim();
+    } catch {
+      return `${rawCurrency || ""} ${price.toFixed(2)}`.trim();
+    }
+  }
+}
 export function useKProductListItemLogic(props) {
   const hasActions = computed(() => props.rowActions && props.rowActions.length > 0);
   const formattedPrice = computed(() => {
-    if (props.item.price === void 0) return "";
-    return new Intl.NumberFormat("en-US", {
-      style: "currency",
-      currency: props.item.currency || "USD"
-    }).format(props.item.price);
+    return formatCurrencyPrice(props.item.price, props.item.currency, props.locale);
   });
   return {
     hasActions,

package/dist/runtime/components/KProductListItem/KProductListItem.vue

@@ -23,7 +23,8 @@
 <script setup>
 const props = defineProps({
   item: { type: Object, required: true },
-  rowActions: { type: Array, required: false }
+  rowActions: { type: Array, required: false },
+  locale: { type: String, required: false }
 });
 import { useKProductListItemLogic } from "./KProductListItem.logic";
 const { hasActions, formattedPrice } = useKProductListItemLogic(props);

package/dist/runtime/components/KProductListItem/KProductListItem.vue.d.ts

@@ -2,6 +2,7 @@ import type { KProductItemData, KProductRowAction } from '@katlux/providers';
 type __VLS_Props = {
     item: KProductItemData;
     rowActions?: KProductRowAction[];
+    locale?: string;
 };
 declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@katlux/block-ecommerce",
-	"version": "0.1.1-alpha.88",
+	"version": "0.1.1-alpha.89",
 	"description": "Pre-built eCommerce block components for Katlux toolkit",
 	"author": "Katlux",
 	"license": "Apache-2.0",