@tapcart/mobile-components 0.6.7 → 0.6.9

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.
Files changed (46) hide show
  1. package/dist/components/hooks/use-product-options.d.ts +1 -1
  2. package/dist/components/hooks/use-product-options.d.ts.map +1 -1
  3. package/dist/components/hooks/use-product-options.js +31 -17
  4. package/dist/components/hooks/use-shop.d.ts +14 -0
  5. package/dist/components/hooks/use-shop.d.ts.map +1 -0
  6. package/dist/components/hooks/use-shop.js +15 -0
  7. package/dist/components/hooks/use-sort-filter.d.ts +3 -2
  8. package/dist/components/hooks/use-sort-filter.d.ts.map +1 -1
  9. package/dist/components/hooks/use-sort-filter.js +1 -1
  10. package/dist/components/libs/sort-filter/search-integration.d.ts +9 -0
  11. package/dist/components/libs/sort-filter/search-integration.d.ts.map +1 -1
  12. package/dist/components/ui/button.d.ts +1 -0
  13. package/dist/components/ui/button.d.ts.map +1 -1
  14. package/dist/components/ui/button.js +3 -3
  15. package/dist/components/ui/carousel.d.ts +1 -0
  16. package/dist/components/ui/carousel.d.ts.map +1 -1
  17. package/dist/components/ui/carousel.js +5 -4
  18. package/dist/components/ui/favorite.d.ts +9 -1
  19. package/dist/components/ui/favorite.d.ts.map +1 -1
  20. package/dist/components/ui/favorite.js +8 -10
  21. package/dist/components/ui/money.d.ts +3 -1
  22. package/dist/components/ui/money.d.ts.map +1 -1
  23. package/dist/components/ui/money.js +2 -2
  24. package/dist/components/ui/price.d.ts +5 -1
  25. package/dist/components/ui/price.d.ts.map +1 -1
  26. package/dist/components/ui/price.js +3 -3
  27. package/dist/index.d.ts +2 -2
  28. package/dist/index.d.ts.map +1 -1
  29. package/dist/index.js +2 -2
  30. package/dist/lib/utils.d.ts +11 -3
  31. package/dist/lib/utils.d.ts.map +1 -1
  32. package/dist/lib/utils.js +13 -14
  33. package/dist/styles.css +9 -9
  34. package/package.json +1 -1
  35. package/dist/components/ThemeProvider.d.ts +0 -3
  36. package/dist/components/ThemeProvider.d.ts.map +0 -1
  37. package/dist/components/ThemeProvider.js +0 -18
  38. package/dist/components/ThemeToggle.d.ts +0 -2
  39. package/dist/components/ThemeToggle.d.ts.map +0 -1
  40. package/dist/components/ThemeToggle.js +0 -8
  41. package/dist/components/ui/input.d.ts +0 -17
  42. package/dist/components/ui/input.d.ts.map +0 -1
  43. package/dist/components/ui/input.js +0 -35
  44. package/dist/components/ui/product-grid.d.ts +0 -15
  45. package/dist/components/ui/product-grid.d.ts.map +0 -1
  46. package/dist/components/ui/product-grid.js +0 -22
@@ -1,6 +1,6 @@
1
1
  import { ProductVariant } from "app-studio-types";
2
2
  type SelectedOptions = Record<string, string>;
3
- export declare function useProductOptions(variants: ProductVariant[] | undefined | null): {
3
+ export declare function useProductOptions(variants: ProductVariant[] | undefined | null, selectedVariantId?: string | null): {
4
4
  selectedOptions: SelectedOptions;
5
5
  handleSelect: (optionName: string, optionValue: string) => void;
6
6
  selectedVariant: ProductVariant | undefined;
@@ -1 +1 @@
1
- {"version":3,"file":"use-product-options.d.ts","sourceRoot":"","sources":["../../../components/hooks/use-product-options.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAA;AAEjD,KAAK,eAAe,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;AAE7C,wBAAgB,iBAAiB,CAC/B,QAAQ,EAAE,cAAc,EAAE,GAAG,SAAS,GAAG,IAAI;;+BAyCX,MAAM,eAAe,MAAM,KAAG,IAAI;;EAwBrE"}
1
+ {"version":3,"file":"use-product-options.d.ts","sourceRoot":"","sources":["../../../components/hooks/use-product-options.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAA;AAEjD,KAAK,eAAe,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;AAE7C,wBAAgB,iBAAiB,CAC/B,QAAQ,EAAE,cAAc,EAAE,GAAG,SAAS,GAAG,IAAI,EAC7C,iBAAiB,CAAC,EAAE,MAAM,GAAG,IAAI;;+BA0DC,MAAM,eAAe,MAAM,KAAG,IAAI;;EAwBrE"}
@@ -1,6 +1,6 @@
1
1
  "use client";
2
- import { useState, useEffect, useMemo } from "react";
3
- export function useProductOptions(variants) {
2
+ import { useState, useEffect, useMemo, useCallback } from "react";
3
+ export function useProductOptions(variants, selectedVariantId) {
4
4
  const safeVariants = useMemo(() => variants || [], [variants]);
5
5
  const getCheapestProductFromVariants = useMemo(() => {
6
6
  return () => {
@@ -15,26 +15,40 @@ export function useProductOptions(variants) {
15
15
  });
16
16
  };
17
17
  }, [safeVariants]);
18
- const initializeSelectedOptions = useMemo(() => {
19
- return () => {
20
- const lowestPriceVariant = getCheapestProductFromVariants();
21
- if (lowestPriceVariant) {
22
- const selectedOptions = {};
23
- lowestPriceVariant.selectedOptions.forEach((option) => {
24
- selectedOptions[option.name] = option.value;
25
- });
26
- return selectedOptions;
27
- }
28
- return {};
18
+ const getSelectedOptions = useMemo(() => {
19
+ return (variant) => {
20
+ const selectedOptions = {};
21
+ variant.selectedOptions.forEach((option) => {
22
+ selectedOptions[option.name] = option.value;
23
+ });
24
+ return selectedOptions;
29
25
  };
30
- }, [getCheapestProductFromVariants]);
31
- const [selectedOptions, setSelectedOptions] = useState(initializeSelectedOptions());
26
+ }, []);
27
+ const getVariantById = useMemo(() => {
28
+ return (variantId) => {
29
+ return safeVariants.find((variant) => variant.id === variantId);
30
+ };
31
+ }, [safeVariants]);
32
+ const initializeSelectedOptions = useCallback((selectedVariantId) => {
33
+ if (selectedVariantId) {
34
+ const variant = getVariantById(selectedVariantId);
35
+ if (variant) {
36
+ return getSelectedOptions(variant);
37
+ }
38
+ }
39
+ const lowestPriceVariant = getCheapestProductFromVariants();
40
+ if (lowestPriceVariant) {
41
+ return getSelectedOptions(lowestPriceVariant);
42
+ }
43
+ return {};
44
+ }, [getCheapestProductFromVariants, getSelectedOptions, getVariantById]);
45
+ const [selectedOptions, setSelectedOptions] = useState(initializeSelectedOptions(selectedVariantId));
32
46
  const handleSelect = (optionName, optionValue) => {
33
47
  setSelectedOptions((prevOptions) => (Object.assign(Object.assign({}, prevOptions), { [optionName]: optionValue })));
34
48
  };
35
49
  useEffect(() => {
36
- setSelectedOptions(initializeSelectedOptions());
37
- }, [safeVariants, initializeSelectedOptions]);
50
+ setSelectedOptions(initializeSelectedOptions(selectedVariantId));
51
+ }, [safeVariants, initializeSelectedOptions, selectedVariantId]);
38
52
  const selectedVariant = useMemo(() => safeVariants.find((v) => v.selectedOptions.every((o) => selectedOptions[o.name] === o.value)), [safeVariants, selectedOptions]);
39
53
  return {
40
54
  selectedOptions,
@@ -0,0 +1,14 @@
1
+ import { Shop } from "app-studio-types";
2
+ type URL = string;
3
+ type UseShopProps = {
4
+ baseURL: URL;
5
+ fetcher?: (url: string) => Promise<any>;
6
+ };
7
+ type UseShopReturn = {
8
+ shop: Shop;
9
+ error: any;
10
+ isLoading: boolean;
11
+ };
12
+ export declare function useShop(props: UseShopProps | null): UseShopReturn;
13
+ export {};
14
+ //# sourceMappingURL=use-shop.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"use-shop.d.ts","sourceRoot":"","sources":["../../../components/hooks/use-shop.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAA;AAEvC,KAAK,GAAG,GAAG,MAAM,CAAA;AACjB,KAAK,YAAY,GAAG;IAClB,OAAO,EAAE,GAAG,CAAA;IACZ,OAAO,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,OAAO,CAAC,GAAG,CAAC,CAAA;CACxC,CAAA;AACD,KAAK,aAAa,GAAG;IACnB,IAAI,EAAE,IAAI,CAAA;IACV,KAAK,EAAE,GAAG,CAAA;IACV,SAAS,EAAE,OAAO,CAAA;CACnB,CAAA;AAED,wBAAgB,OAAO,CAAC,KAAK,EAAE,YAAY,GAAG,IAAI,GAAG,aAAa,CAkBjE"}
@@ -0,0 +1,15 @@
1
+ import useSWR from "swr";
2
+ export function useShop(props) {
3
+ let url = null;
4
+ if (props) {
5
+ const { baseURL } = props;
6
+ url = `${baseURL}/shop`;
7
+ }
8
+ const fetcher = (props === null || props === void 0 ? void 0 : props.fetcher) || ((url) => fetch(url).then((res) => res.json()));
9
+ const { data, error } = useSWR(url, fetcher);
10
+ return {
11
+ shop: data || [],
12
+ error,
13
+ isLoading: !data && !error,
14
+ };
15
+ }
@@ -1,5 +1,5 @@
1
1
  import { Collection } from "app-studio-types";
2
- import { FilterCategory, Integration, IntegrationSortItem } from "../libs/sort-filter/search-integration";
2
+ import { FilterCategory, FiltersAndRelatedCategories, Integration, IntegrationSortItem } from "../libs/sort-filter/search-integration";
3
3
  interface UseSortFilterProps {
4
4
  initialData: PageData;
5
5
  queryVariables: Record<string, any>;
@@ -7,6 +7,7 @@ interface UseSortFilterProps {
7
7
  interface PageData {
8
8
  filtersURL: string;
9
9
  sortFilterURL: string;
10
+ uiFilterState: FilterCategory[];
10
11
  }
11
12
  interface UseSortFilterReturn {
12
13
  sortFilterData: SortFilterData;
@@ -16,7 +17,7 @@ interface UseSortFilterReturn {
16
17
  }
17
18
  interface SortFilterData {
18
19
  collection: Collection;
19
- filtersAndRelatedCategories: FilterCategory[];
20
+ filtersAndRelatedCategories: FiltersAndRelatedCategories;
20
21
  sortOptions: IntegrationSortItem[];
21
22
  dynamicFiltersEnabled: boolean;
22
23
  integrations: Integration[];
@@ -1 +1 @@
1
- {"version":3,"file":"use-sort-filter.d.ts","sourceRoot":"","sources":["../../../components/hooks/use-sort-filter.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAA;AAE7C,OAAO,EAAE,cAAc,EAAE,WAAW,EAAE,mBAAmB,EAAqB,MAAM,wCAAwC,CAAA;AAG5H,UAAU,kBAAkB;IAC1B,WAAW,EAAE,QAAQ,CAAA;IACrB,cAAc,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;CACpC;AAED,UAAU,QAAQ;IAChB,UAAU,EAAE,MAAM,CAAA;IAClB,aAAa,EAAE,MAAM,CAAA;CACtB;AAED,UAAU,mBAAmB;IAC3B,cAAc,EAAE,cAAc,CAAC;IAC/B,IAAI,EAAE,GAAG,EAAE,CAAC;IACZ,MAAM,EAAE,MAAM,OAAO,CAAC,GAAG,CAAC,CAAC;IAC3B,SAAS,EAAE,OAAO,CAAC;CACpB;AAED,UAAU,cAAc;IACtB,UAAU,EAAE,UAAU,CAAA;IACtB,2BAA2B,EAAE,cAAc,EAAE,CAAA;IAC7C,WAAW,EAAE,mBAAmB,EAAE,CAAA;IAClC,qBAAqB,EAAE,OAAO,CAAA;IAC9B,YAAY,EAAE,WAAW,EAAE,CAAA;CAC5B;AAaD,QAAA,MAAM,aAAa,qCAGhB,kBAAkB,KAAG,mBAiCvB,CAAA;AAED,OAAO,EAAE,aAAa,EAAE,CAAA"}
1
+ {"version":3,"file":"use-sort-filter.d.ts","sourceRoot":"","sources":["../../../components/hooks/use-sort-filter.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAA;AAE7C,OAAO,EACL,cAAc,EACd,2BAA2B,EAC3B,WAAW,EACX,mBAAmB,EACpB,MAAM,wCAAwC,CAAA;AAG/C,UAAU,kBAAkB;IAC1B,WAAW,EAAE,QAAQ,CAAA;IACrB,cAAc,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;CACpC;AAED,UAAU,QAAQ;IAChB,UAAU,EAAE,MAAM,CAAA;IAClB,aAAa,EAAE,MAAM,CAAA;IACrB,aAAa,EAAE,cAAc,EAAE,CAAA;CAChC;AAED,UAAU,mBAAmB;IAC3B,cAAc,EAAE,cAAc,CAAC;IAC/B,IAAI,EAAE,GAAG,EAAE,CAAC;IACZ,MAAM,EAAE,MAAM,OAAO,CAAC,GAAG,CAAC,CAAC;IAC3B,SAAS,EAAE,OAAO,CAAC;CACpB;AAED,UAAU,cAAc;IACtB,UAAU,EAAE,UAAU,CAAA;IACtB,2BAA2B,EAAE,2BAA2B,CAAA;IACxD,WAAW,EAAE,mBAAmB,EAAE,CAAA;IAClC,qBAAqB,EAAE,OAAO,CAAA;IAC9B,YAAY,EAAE,WAAW,EAAE,CAAA;CAC5B;AAaD,QAAA,MAAM,aAAa,qCAGhB,kBAAkB,KAAG,mBA8BvB,CAAA;AAED,OAAO,EAAE,aAAa,EAAE,CAAA"}
@@ -15,7 +15,7 @@ const useSortFilter = ({ initialData, queryVariables, }) => {
15
15
  const getKey = () => {
16
16
  if (!sortFilterData || !sortFilterData.dynamicFiltersEnabled)
17
17
  return null;
18
- return Object.assign(Object.assign(Object.assign({}, queryVariables), (sortFilterData.searchQuery && { searchQuery: sortFilterData.searchQuery })), { filterCategories: sortFilterData === null || sortFilterData === void 0 ? void 0 : sortFilterData.filtersAndRelatedCategories.filterCategories, sortOption: sortFilterData === null || sortFilterData === void 0 ? void 0 : sortFilterData.sortOption, limit: 10 });
18
+ return Object.assign(Object.assign({}, sortFilterData.queryVariables), (initialData.uiFilterState && { filterCategories: initialData.uiFilterState }));
19
19
  };
20
20
  const { data, mutate } = useSWRInfinite(getKey, (body) => fetcher({ apiURL: initialData.filtersURL, body }), {
21
21
  revalidateFirstPage: true,
@@ -31,6 +31,15 @@ export type FilterCategory = {
31
31
  id: string | null;
32
32
  multiSelect?: boolean | undefined;
33
33
  };
34
+ export type RelatedCategory = {
35
+ id: string;
36
+ title: string;
37
+ handle: string;
38
+ };
39
+ export type FiltersAndRelatedCategories = {
40
+ filterCategories: FilterCategory[] | undefined | null;
41
+ relatedCategories: RelatedCategory[] | undefined | null;
42
+ };
34
43
  export interface SearchIntegration {
35
44
  getSortSearchParamKey(): string;
36
45
  getActiveSortFromSearchParams({ searchParams, sortOptions, }: {
@@ -1 +1 @@
1
- {"version":3,"file":"search-integration.d.ts","sourceRoot":"","sources":["../../../../components/libs/sort-filter/search-integration.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,uBAAuB,EAAE,MAAM,iBAAiB,CAAA;AAOzD,MAAM,MAAM,WAAW,GAAG;IACxB,IAAI,EAAE,MAAM,CAAA;IACZ,OAAO,EAAE,OAAO,CAAA;IAChB,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;CACnB,CAAA;AAED,MAAM,MAAM,mBAAmB,GAAG;IAChC,IAAI,EAAE,MAAM,CAAA;IACZ,IAAI,EAAE,MAAM,CAAA;IACZ,QAAQ,EAAE,MAAM,CAAA;IAChB,OAAO,EAAE,MAAM,CAAA;IACf,SAAS,EAAE,OAAO,CAAA;CACnB,CAAA;AAED,MAAM,MAAM,MAAM,GAAG;IACnB,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACrB,GAAG,EAAE,GAAG,CAAA;IACR,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACtB,UAAU,EAAE,OAAO,CAAA;IACnB,YAAY,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IAC5B,GAAG,EAAE,MAAM,GAAG,IAAI,CAAA;IAClB,GAAG,EAAE,MAAM,GAAG,IAAI,CAAA;CACnB,CAAA;AAED,MAAM,MAAM,cAAc,GAAG;IAC3B,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,EAAE,MAAM,CAAA;IACZ,OAAO,EAAE,MAAM,EAAE,CAAA;IACjB,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACrB,EAAE,EAAE,MAAM,GAAG,IAAI,CAAA;IACjB,WAAW,CAAC,EAAE,OAAO,GAAG,SAAS,CAAA;CAClC,CAAA;AAED,MAAM,WAAW,iBAAiB;IAIhC,qBAAqB,IAAI,MAAM,CAAA;IAE/B,6BAA6B,CAAC,EAC5B,YAAY,EACZ,WAAW,GACZ,EAAE;QACD,YAAY,EAAE,uBAAuB,CAAA;QACrC,WAAW,EAAE,mBAAmB,EAAE,CAAA;KACnC,GAAG,mBAAmB,GAAG,IAAI,CAAA;IAK9B,yBAAyB,CAAC,EACxB,UAAU,EACV,cAAc,GACf,EAAE;QACD,UAAU,EAAE,mBAAmB,GAAG,SAAS,CAAA;QAC3C,cAAc,EAAE,uBAAuB,CAAA;KACxC,GAAG,eAAe,CAAA;IAKnB,qCAAqC,CACnC,OAAO,EAAE,cAAc,EAAE,EACzB,YAAY,EAAE,uBAAuB,GACpC,MAAM,CAAA;CACV;AAED,eAAO,MAAM,uBAAuB,iBAAkB,WAAW,EAAE,gCAKlE,CAAC;AAEF,eAAO,MAAM,gBAAgB,sBACR,OAAO,MAAM,EAAE,WAAW,CAAC,0BACtB,MAAM,EAAE,KAC/B,OAIF,CAAC;AAEF,eAAO,MAAM,yBAAyB,iBACtB,WAAW,EAAE,KAC1B,iBA2BF,CAAA;AAED,eAAO,MAAM,yBAAyB,sBACjB,iBAAiB,GAAG,IAAI,YACc,CAAA"}
1
+ {"version":3,"file":"search-integration.d.ts","sourceRoot":"","sources":["../../../../components/libs/sort-filter/search-integration.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,uBAAuB,EAAE,MAAM,iBAAiB,CAAA;AAOzD,MAAM,MAAM,WAAW,GAAG;IACxB,IAAI,EAAE,MAAM,CAAA;IACZ,OAAO,EAAE,OAAO,CAAA;IAChB,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;CACnB,CAAA;AAED,MAAM,MAAM,mBAAmB,GAAG;IAChC,IAAI,EAAE,MAAM,CAAA;IACZ,IAAI,EAAE,MAAM,CAAA;IACZ,QAAQ,EAAE,MAAM,CAAA;IAChB,OAAO,EAAE,MAAM,CAAA;IACf,SAAS,EAAE,OAAO,CAAA;CACnB,CAAA;AAED,MAAM,MAAM,MAAM,GAAG;IACnB,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACrB,GAAG,EAAE,GAAG,CAAA;IACR,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACtB,UAAU,EAAE,OAAO,CAAA;IACnB,YAAY,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IAC5B,GAAG,EAAE,MAAM,GAAG,IAAI,CAAA;IAClB,GAAG,EAAE,MAAM,GAAG,IAAI,CAAA;CACnB,CAAA;AAED,MAAM,MAAM,cAAc,GAAG;IAC3B,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,EAAE,MAAM,CAAA;IACZ,OAAO,EAAE,MAAM,EAAE,CAAA;IACjB,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACrB,EAAE,EAAE,MAAM,GAAG,IAAI,CAAA;IACjB,WAAW,CAAC,EAAE,OAAO,GAAG,SAAS,CAAA;CAClC,CAAA;AAED,MAAM,MAAM,eAAe,GAAG;IAC5B,EAAE,EAAE,MAAM,CAAA;IACV,KAAK,EAAE,MAAM,CAAA;IACb,MAAM,EAAE,MAAM,CAAA;CACf,CAAA;AAED,MAAM,MAAM,2BAA2B,GAAG;IACxC,gBAAgB,EAAE,cAAc,EAAE,GAAG,SAAS,GAAG,IAAI,CAAA;IACrD,iBAAiB,EAAE,eAAe,EAAE,GAAG,SAAS,GAAG,IAAI,CAAA;CACxD,CAAA;AAED,MAAM,WAAW,iBAAiB;IAIhC,qBAAqB,IAAI,MAAM,CAAA;IAE/B,6BAA6B,CAAC,EAC5B,YAAY,EACZ,WAAW,GACZ,EAAE;QACD,YAAY,EAAE,uBAAuB,CAAA;QACrC,WAAW,EAAE,mBAAmB,EAAE,CAAA;KACnC,GAAG,mBAAmB,GAAG,IAAI,CAAA;IAK9B,yBAAyB,CAAC,EACxB,UAAU,EACV,cAAc,GACf,EAAE;QACD,UAAU,EAAE,mBAAmB,GAAG,SAAS,CAAA;QAC3C,cAAc,EAAE,uBAAuB,CAAA;KACxC,GAAG,eAAe,CAAA;IAKnB,qCAAqC,CACnC,OAAO,EAAE,cAAc,EAAE,EACzB,YAAY,EAAE,uBAAuB,GACpC,MAAM,CAAA;CACV;AAED,eAAO,MAAM,uBAAuB,iBAAkB,WAAW,EAAE,gCAKlE,CAAA;AAED,eAAO,MAAM,gBAAgB,sBACR,OAAO,MAAM,EAAE,WAAW,CAAC,0BACtB,MAAM,EAAE,KAC/B,OAEF,CAAA;AAED,eAAO,MAAM,yBAAyB,iBACtB,WAAW,EAAE,KAC1B,iBA2BF,CAAA;AAED,eAAO,MAAM,yBAAyB,sBACjB,iBAAiB,GAAG,IAAI,YACc,CAAA"}
@@ -8,6 +8,7 @@ export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElemen
8
8
  asChild?: boolean;
9
9
  loading?: boolean;
10
10
  icon?: string;
11
+ iconUrl?: string;
11
12
  labelClassName?: string;
12
13
  labelStyle?: React.CSSProperties | undefined;
13
14
  iconColor?: string;
@@ -1 +1 @@
1
- {"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../components/ui/button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAKjE,QAAA,MAAM,cAAc;;;mFAgCnB,CAAA;AAwCD,MAAM,WAAW,WACf,SAAQ,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EACnD,YAAY,CAAC,OAAO,cAAc,CAAC;IACrC,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,UAAU,CAAC,EAAE,KAAK,CAAC,aAAa,GAAG,SAAS,CAAA;IAC5C,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,YAAY,CAAC,EAAE,MAAM,GAAG,OAAO,CAAA;CAChC;AAED,QAAA,MAAM,MAAM,uFAoFX,CAAA;AAGD,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,CAAA"}
1
+ {"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../components/ui/button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAKjE,QAAA,MAAM,cAAc;;;mFAgCnB,CAAA;AAwCD,MAAM,WAAW,WACf,SAAQ,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EACnD,YAAY,CAAC,OAAO,cAAc,CAAC;IACrC,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,UAAU,CAAC,EAAE,KAAK,CAAC,aAAa,GAAG,SAAS,CAAA;IAC5C,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,YAAY,CAAC,EAAE,MAAM,GAAG,OAAO,CAAA;CAChC;AAED,QAAA,MAAM,MAAM,uFAqFX,CAAA;AAGD,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,CAAA"}
@@ -79,10 +79,10 @@ const labelVariants = cva("truncate", {
79
79
  },
80
80
  });
81
81
  const Button = React.forwardRef((_a, ref) => {
82
- var { className, labelClassName, labelStyle, variant, size, asChild = false, loading, icon, iconColor, iconPosition } = _a, props = __rest(_a, ["className", "labelClassName", "labelStyle", "variant", "size", "asChild", "loading", "icon", "iconColor", "iconPosition"]);
82
+ var { className, labelClassName, labelStyle, variant, size, asChild = false, loading, icon, iconColor, iconPosition, iconUrl } = _a, props = __rest(_a, ["className", "labelClassName", "labelStyle", "variant", "size", "asChild", "loading", "icon", "iconColor", "iconPosition", "iconUrl"]);
83
83
  const Comp = asChild ? Slot : "button";
84
- const IconButton = () => icon ? _jsx(Icon, { name: icon, size: "sm", style: { color: iconColor } }) : null;
85
- const BasicButton = () => (_jsxs(_Fragment, { children: [icon ? (_jsx(Icon, { name: icon, size: variant === "quickadd" ? "xs" : "sm", className: cn(iconVariants({ variant }), { "mr-2": iconPosition !== "right" }), style: { color: iconColor } })) : null, !loading ? (_jsx(Text, Object.assign({ type: "body-primary", className: cn(labelVariants({ variant }), labelClassName), style: labelStyle }, { children: props.children }))) : (_jsx(_Fragment, {}))] }));
84
+ const IconButton = () => icon || iconUrl ? _jsx(Icon, { name: icon, size: "sm", style: { color: iconColor } }) : null;
85
+ const BasicButton = () => (_jsxs(_Fragment, { children: [icon || iconUrl ? (_jsx(Icon, { name: iconUrl ? undefined : icon, url: iconUrl, size: variant === "quickadd" ? "xs" : "sm", className: cn(iconVariants({ variant }), { "mr-2": iconPosition !== "right" }), style: { color: iconColor } })) : null, !loading ? (_jsx(Text, Object.assign({ type: "body-primary", className: cn(labelVariants({ variant }), labelClassName), style: labelStyle }, { children: props.children }))) : (_jsx(_Fragment, {}))] }));
86
86
  const LoadingButton = () => (_jsx("div", Object.assign({ className: cn("flex items-center justify-center", size === "icon" ? "h-5" : "h-6") }, { children: _jsx(Icon, { className: cn(iconVariants({ variant }), "h-5 w-5 animate-spin"), name: "loader", style: { color: iconColor } }) })));
87
87
  return (_jsx(Comp, Object.assign({ className: cn(buttonVariants({ variant, size }), className, {
88
88
  "pointer-events-none": loading,
@@ -18,6 +18,7 @@ declare const CarouselPrevious: React.ForwardRefExoticComponent<Omit<import("../
18
18
  declare const CarouselNext: React.ForwardRefExoticComponent<Omit<import("../../components/ui/button").ButtonProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
19
19
  type CarouselDotsProps = {
20
20
  maxDots?: number;
21
+ dotColor?: string;
21
22
  };
22
23
  declare const CarouselDots: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & CarouselDotsProps & React.RefAttributes<HTMLDivElement>>;
23
24
  export { type CarouselApi, Carousel, CarouselContent, CarouselItem, CarouselPrevious, CarouselNext, CarouselDots, };
@@ -1 +1 @@
1
- {"version":3,"file":"carousel.d.ts","sourceRoot":"","sources":["../../../components/ui/carousel.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,gBAAgB,EAAE,EACvB,KAAK,oBAAoB,EAC1B,MAAM,sBAAsB,CAAA;AAM7B,KAAK,WAAW,GAAG,oBAAoB,CAAC,CAAC,CAAC,CAAA;AAC1C,KAAK,qBAAqB,GAAG,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAA;AAChE,KAAK,eAAe,GAAG,qBAAqB,CAAC,CAAC,CAAC,CAAA;AAC/C,KAAK,cAAc,GAAG,qBAAqB,CAAC,CAAC,CAAC,CAAA;AAE9C,KAAK,aAAa,GAAG;IACnB,IAAI,CAAC,EAAE,eAAe,CAAA;IACtB,OAAO,CAAC,EAAE,cAAc,CAAA;IACxB,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAA;IACvC,MAAM,CAAC,EAAE,CAAC,GAAG,EAAE,WAAW,KAAK,IAAI,CAAA;IACnC,YAAY,CAAC,EAAE,CAAC,MAAM,EAAC,KAAK,CAAC,MAAM,CAAC,KAAK,IAAI,CAAA;CAC9C,CAAA;AAuBD,QAAA,MAAM,QAAQ,6HAkHb,CAAA;AAGD,QAAA,MAAM,eAAe,6GAmBnB,CAAA;AAGF,QAAA,MAAM,YAAY,6GAmBhB,CAAA;AAGF,QAAA,MAAM,gBAAgB,kLA0BpB,CAAA;AAGF,QAAA,MAAM,YAAY,kLA0BhB,CAAA;AAIF,KAAK,iBAAiB,GAAG;IACvB,OAAO,CAAC,EAAE,MAAM,CAAA;CACjB,CAAA;AAED,QAAA,MAAM,YAAY,iIA8ChB,CAAC;AAGH,OAAO,EACL,KAAK,WAAW,EAChB,QAAQ,EACR,eAAe,EACf,YAAY,EACZ,gBAAgB,EAChB,YAAY,EACZ,YAAY,GACb,CAAA"}
1
+ {"version":3,"file":"carousel.d.ts","sourceRoot":"","sources":["../../../components/ui/carousel.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,gBAAgB,EAAE,EACvB,KAAK,oBAAoB,EAC1B,MAAM,sBAAsB,CAAA;AAM7B,KAAK,WAAW,GAAG,oBAAoB,CAAC,CAAC,CAAC,CAAA;AAC1C,KAAK,qBAAqB,GAAG,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAA;AAChE,KAAK,eAAe,GAAG,qBAAqB,CAAC,CAAC,CAAC,CAAA;AAC/C,KAAK,cAAc,GAAG,qBAAqB,CAAC,CAAC,CAAC,CAAA;AAE9C,KAAK,aAAa,GAAG;IACnB,IAAI,CAAC,EAAE,eAAe,CAAA;IACtB,OAAO,CAAC,EAAE,cAAc,CAAA;IACxB,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAA;IACvC,MAAM,CAAC,EAAE,CAAC,GAAG,EAAE,WAAW,KAAK,IAAI,CAAA;IACnC,YAAY,CAAC,EAAE,CAAC,MAAM,EAAC,KAAK,CAAC,MAAM,CAAC,KAAK,IAAI,CAAA;CAC9C,CAAA;AAuBD,QAAA,MAAM,QAAQ,6HAkHb,CAAA;AAGD,QAAA,MAAM,eAAe,6GAmBnB,CAAA;AAGF,QAAA,MAAM,YAAY,6GAmBhB,CAAA;AAGF,QAAA,MAAM,gBAAgB,kLA0BpB,CAAA;AAGF,QAAA,MAAM,YAAY,kLA0BhB,CAAA;AAIF,KAAK,iBAAiB,GAAG;IACvB,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB,CAAA;AAED,QAAA,MAAM,YAAY,iIA4ChB,CAAC;AAGH,OAAO,EACL,KAAK,WAAW,EAChB,QAAQ,EACR,eAAe,EACf,YAAY,EACZ,gBAAgB,EAChB,YAAY,EACZ,YAAY,GACb,CAAA"}
@@ -117,7 +117,7 @@ const CarouselNext = React.forwardRef((_a, ref) => {
117
117
  });
118
118
  CarouselNext.displayName = "CarouselNext";
119
119
  const CarouselDots = React.forwardRef((_a, ref) => {
120
- var { maxDots = 5 } = _a, props = __rest(_a, ["maxDots"]);
120
+ var { maxDots = 5, dotColor = "var(--coreColors-brandColorPrimary)" } = _a, props = __rest(_a, ["maxDots", "dotColor"]);
121
121
  const { api } = useCarousel();
122
122
  const [_, setUpdateState] = React.useState(false);
123
123
  const toggleUpdateState = React.useCallback(() => setUpdateState((prevState) => !prevState), []);
@@ -134,9 +134,10 @@ const CarouselDots = React.forwardRef((_a, ref) => {
134
134
  const numberOfSlides = Math.min((api === null || api === void 0 ? void 0 : api.scrollSnapList().length) || 0, maxDots);
135
135
  const currentSlide = Math.min((api === null || api === void 0 ? void 0 : api.selectedScrollSnap()) || 0, maxDots - 1);
136
136
  if (numberOfSlides > 1) {
137
- return (_jsx("div", Object.assign({ ref: ref, className: `flex justify-center ${props.className}` }, { children: Array.from({ length: numberOfSlides }, (_, i) => (_jsx(Button, { className: `mx-1 h-1.5 w-1.5 rounded-full p-0 border-none ${i === currentSlide
138
- ? 'bg-coreColors-brandColorPrimary'
139
- : 'bg-coreColors-brandColorPrimary opacity-50'}`, "aria-label": `Go to slide ${i + 1}`, onClick: () => api === null || api === void 0 ? void 0 : api.scrollTo(i) }, i))) })));
137
+ return (_jsx("div", Object.assign({ ref: ref, className: `flex justify-center ${props.className}` }, { children: Array.from({ length: numberOfSlides }, (_, i) => (_jsx(Button, { className: 'mx-1 h-1.5 w-1.5 rounded-full p-0 border-none', style: {
138
+ backgroundColor: dotColor,
139
+ opacity: i === currentSlide ? 1 : 0.5
140
+ }, "aria-label": `Go to slide ${i + 1}`, onClick: () => api === null || api === void 0 ? void 0 : api.scrollTo(i) }, i))) })));
140
141
  }
141
142
  else {
142
143
  return _jsx(_Fragment, {});
@@ -1,8 +1,10 @@
1
1
  import * as React from "react";
2
2
  import { type VariantProps } from "class-variance-authority";
3
+ import { Spacing } from "../../lib/utils";
4
+ import { BorderSides } from "./Input/types";
3
5
  declare const favoriteVariants: (props?: ({
4
6
  size?: "small" | "large" | null | undefined;
5
- showBackground?: boolean | null | undefined;
7
+ showBackgroundShadow?: boolean | null | undefined;
6
8
  layoutType?: "below-image-on-right" | "top-right" | "top-left" | "bottom-left" | "bottom-right" | null | undefined;
7
9
  } & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
8
10
  export interface FavoriteProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof favoriteVariants> {
@@ -10,9 +12,15 @@ export interface FavoriteProps extends React.ButtonHTMLAttributes<HTMLButtonElem
10
12
  onClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;
11
13
  iconUrl?: string;
12
14
  showBackground?: boolean;
15
+ showBackgroundShadow?: boolean;
13
16
  cornerRadius?: number;
14
17
  layoutType?: "below-image-on-right" | "top-right" | "top-left" | "bottom-left" | "bottom-right";
15
18
  favoriteFillColor?: string;
19
+ disabledFillColor?: string;
20
+ backgroundColor?: string;
21
+ borderSides?: BorderSides;
22
+ borderColorStyle?: string;
23
+ borderPadding?: Partial<Spacing>;
16
24
  }
17
25
  declare const Favorite: React.ForwardRefExoticComponent<FavoriteProps & React.RefAttributes<HTMLButtonElement>>;
18
26
  export { Favorite, favoriteVariants };
@@ -1 +1 @@
1
- {"version":3,"file":"favorite.d.ts","sourceRoot":"","sources":["../../../components/ui/favorite.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAKjE,QAAA,MAAM,gBAAgB;;;;mFA0BrB,CAAA;AAED,MAAM,WAAW,aACf,SAAQ,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EACnD,YAAY,CAAC,OAAO,gBAAgB,CAAC;IACvC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAA;IAC9D,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,UAAU,CAAC,EACP,sBAAsB,GACtB,WAAW,GACX,UAAU,GACV,aAAa,GACb,cAAc,CAAA;IAClB,iBAAiB,CAAC,EAAE,MAAM,CAAA;CAC3B;AAED,QAAA,MAAM,QAAQ,yFA0Cb,CAAA;AAGD,OAAO,EAAE,QAAQ,EAAE,gBAAgB,EAAE,CAAA"}
1
+ {"version":3,"file":"favorite.d.ts","sourceRoot":"","sources":["../../../components/ui/favorite.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAEjE,OAAO,EAA2B,OAAO,EAAmB,MAAM,iBAAiB,CAAA;AAEnF,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA;AAE3C,QAAA,MAAM,gBAAgB;;;;mFA0BrB,CAAA;AAED,MAAM,WAAW,aACf,SAAQ,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EACnD,YAAY,CAAC,OAAO,gBAAgB,CAAC;IACvC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAA;IAC9D,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,oBAAoB,CAAC,EAAE,OAAO,CAAA;IAC9B,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,UAAU,CAAC,EACP,sBAAsB,GACtB,WAAW,GACX,UAAU,GACV,aAAa,GACb,cAAc,CAAA;IAClB,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,eAAe,CAAC,EAAC,MAAM,CAAA;IACvB,WAAW,CAAC,EAAC,WAAW,CAAA;IACxB,gBAAgB,CAAC,EAAC,MAAM,CAAA;IACxB,aAAa,CAAC,EAAC,OAAO,CAAC,OAAO,CAAC,CAAA;CAChC;AAED,QAAA,MAAM,QAAQ,yFAsDb,CAAA;AAGD,OAAO,EAAE,QAAQ,EAAE,gBAAgB,EAAE,CAAA"}
@@ -12,16 +12,16 @@ var __rest = (this && this.__rest) || function (s, e) {
12
12
  import { jsx as _jsx } from "react/jsx-runtime";
13
13
  import * as React from "react";
14
14
  import { cva } from "class-variance-authority";
15
- import { cn } from "../../lib/utils";
15
+ import { cn, getBorderSidesStyle, getPaddingStyle } from "../../lib/utils";
16
16
  import { Icon } from "./icon";
17
- const favoriteVariants = cva("flex p-2 gap-2 rounded-[4px] shadow-buttonColors-primaryShadow", {
17
+ const favoriteVariants = cva("flex p-2 gap-2 rounded-[4px]", {
18
18
  variants: {
19
19
  size: {
20
20
  small: "p-2",
21
21
  large: "p-3",
22
22
  },
23
- showBackground: {
24
- true: "bg-coreColors-inputBackground",
23
+ showBackgroundShadow: {
24
+ true: "shadow-primary",
25
25
  false: "",
26
26
  },
27
27
  layoutType: {
@@ -34,19 +34,17 @@ const favoriteVariants = cva("flex p-2 gap-2 rounded-[4px] shadow-buttonColors-p
34
34
  },
35
35
  defaultVariants: {
36
36
  size: "small",
37
- showBackground: true,
37
+ showBackgroundShadow: false,
38
38
  layoutType: "below-image-on-right",
39
39
  },
40
40
  });
41
41
  const Favorite = React.forwardRef((_a, ref) => {
42
- var { className, size = "small", selected = false, onClick, iconUrl = "https://storage.googleapis.com/tapcart-asset-uploads-prod/default-icon-options/Heart_1.svg", showBackground = false, cornerRadius = 4, layoutType = "below-image-on-right", favoriteFillColor = "#D91E18FF" } = _a, props = __rest(_a, ["className", "size", "selected", "onClick", "iconUrl", "showBackground", "cornerRadius", "layoutType", "favoriteFillColor"]);
42
+ var { className, size = "small", selected = false, onClick, iconUrl = "https://storage.googleapis.com/tapcart-asset-uploads-prod/default-icon-options/Heart_1.svg", showBackground = false, showBackgroundShadow = false, cornerRadius = 4, layoutType = "below-image-on-right", favoriteFillColor = "#D91E18", disabledFillColor = "#727272", backgroundColor = "#FFFFFF", borderSides = ["all"], borderColorStyle = undefined, borderPadding = {} } = _a, props = __rest(_a, ["className", "size", "selected", "onClick", "iconUrl", "showBackground", "showBackgroundShadow", "cornerRadius", "layoutType", "favoriteFillColor", "disabledFillColor", "backgroundColor", "borderSides", "borderColorStyle", "borderPadding"]);
43
43
  return (_jsx("button", Object.assign({ onClick: onClick, ref: ref, className: cn(favoriteVariants({
44
44
  size,
45
- showBackground,
45
+ showBackgroundShadow,
46
46
  layoutType,
47
- }), className), style: {
48
- borderRadius: `${cornerRadius}px`,
49
- } }, props, { children: _jsx(Icon, { url: iconUrl, color: selected ? "stateColors-favorites" : "stateColors-disabled", size: size === "small" ? "xs" : "sm", fillColor: selected ? favoriteFillColor : "" }) })));
47
+ }), className), style: Object.assign(Object.assign({ borderRadius: `${cornerRadius}px`, backgroundColor: backgroundColor || "var(--coreColors-inputBackground)", borderColor: borderColorStyle }, getBorderSidesStyle(borderSides)), getPaddingStyle(borderPadding)) }, props, { children: _jsx(Icon, { url: iconUrl, color: selected ? "stateColors-favorites" : "stateColors-disabled", size: size === "small" ? "xs" : "sm", fillColor: selected ? favoriteFillColor : disabledFillColor }) })));
50
48
  });
51
49
  Favorite.displayName = "Favorite";
52
50
  export { Favorite, favoriteVariants };
@@ -1,3 +1,4 @@
1
+ import * as React from "react";
1
2
  import { type VariantProps } from "class-variance-authority";
2
3
  interface MoneyType {
3
4
  currency: string;
@@ -6,7 +7,8 @@ interface MoneyType {
6
7
  }
7
8
  declare const moneyVariants: (props?: ({} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
8
9
  export interface MoneyProps extends MoneyType, VariantProps<typeof moneyVariants> {
10
+ styles?: React.CSSProperties;
9
11
  }
10
- declare function Money({ price, locale, currency, ...props }: MoneyProps): import("react/jsx-runtime").JSX.Element;
12
+ declare function Money({ price, locale, currency, styles, ...props }: MoneyProps): import("react/jsx-runtime").JSX.Element;
11
13
  export { Money, moneyVariants };
12
14
  //# sourceMappingURL=money.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"money.d.ts","sourceRoot":"","sources":["../../../components/ui/money.tsx"],"names":[],"mappings":"AACA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAEjE,UAAU,SAAS;IACjB,QAAQ,EAAE,MAAM,CAAA;IAChB,MAAM,EAAE,MAAM,CAAA;IACd,KAAK,EAAE,MAAM,CAAA;CACd;AAED,QAAA,MAAM,aAAa,gGAMjB,CAAA;AAEF,MAAM,WAAW,UACf,SAAQ,SAAS,EACf,YAAY,CAAC,OAAO,aAAa,CAAC;CAAG;AAEzC,iBAAS,KAAK,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,UAAU,2CAS/D;AAED,OAAO,EAAE,KAAK,EAAE,aAAa,EAAE,CAAA"}
1
+ {"version":3,"file":"money.d.ts","sourceRoot":"","sources":["../../../components/ui/money.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAEjE,UAAU,SAAS;IACjB,QAAQ,EAAE,MAAM,CAAA;IAChB,MAAM,EAAE,MAAM,CAAA;IACd,KAAK,EAAE,MAAM,CAAA;CACd;AAED,QAAA,MAAM,aAAa,gGAMjB,CAAA;AAEF,MAAM,WAAW,UACf,SAAQ,SAAS,EACf,YAAY,CAAC,OAAO,aAAa,CAAC;IAChC,MAAM,CAAC,EAAE,KAAK,CAAC,aAAa,CAAA;CAC7B;AAEL,iBAAS,KAAK,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,GAAG,KAAK,EAAE,EAAE,UAAU,2CASvE;AAED,OAAO,EAAE,KAAK,EAAE,aAAa,EAAE,CAAA"}
@@ -19,13 +19,13 @@ const moneyVariants = cva("", {
19
19
  },
20
20
  });
21
21
  function Money(_a) {
22
- var { price, locale, currency } = _a, props = __rest(_a, ["price", "locale", "currency"]);
22
+ var { price, locale, currency, styles } = _a, props = __rest(_a, ["price", "locale", "currency", "styles"]);
23
23
  const formatter = new Intl.NumberFormat(locale, {
24
24
  style: "currency",
25
25
  currency: currency,
26
26
  currencyDisplay: "narrowSymbol",
27
27
  });
28
28
  let formattedPrice = formatter.format(Number(price));
29
- return _jsx("span", Object.assign({}, props, { children: formattedPrice }));
29
+ return _jsx("span", Object.assign({}, props, { style: styles }, { children: formattedPrice }));
30
30
  }
31
31
  export { Money, moneyVariants };
@@ -1,3 +1,4 @@
1
+ /// <reference types="react" />
1
2
  interface PriceProps {
2
3
  price: number;
3
4
  priceHigh?: number;
@@ -9,7 +10,10 @@ interface PriceProps {
9
10
  locale?: string;
10
11
  fontSize?: number;
11
12
  textAlignment?: 'left' | 'center' | 'right' | '';
13
+ standardStyles?: React.CSSProperties;
14
+ saleStyles?: React.CSSProperties;
15
+ strikeThroughStyles?: React.CSSProperties;
12
16
  }
13
- declare function Price({ price, priceHigh, priceRanges, isSale, compareAtPrice, compareAtPriceHigh, currency, locale, fontSize, textAlignment, }: PriceProps): import("react/jsx-runtime").JSX.Element;
17
+ declare function Price({ price, priceHigh, priceRanges, isSale, compareAtPrice, compareAtPriceHigh, currency, locale, fontSize, textAlignment, standardStyles, saleStyles, strikeThroughStyles, }: PriceProps): import("react/jsx-runtime").JSX.Element;
14
18
  export { Price };
15
19
  //# sourceMappingURL=price.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"price.d.ts","sourceRoot":"","sources":["../../../components/ui/price.tsx"],"names":[],"mappings":"AAIA,UAAU,UAAU;IAClB,KAAK,EAAE,MAAM,CAAA;IACb,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,cAAc,CAAC,EAAE,MAAM,GAAG,SAAS,CAAA;IACnC,kBAAkB,CAAC,EAAE,MAAM,CAAA;IAC3B,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,aAAa,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,OAAO,GAAG,EAAE,CAAC;CAClD;AAED,iBAAS,KAAK,CAAC,EACb,KAAK,EACL,SAAS,EACT,WAAmB,EACnB,MAAc,EACd,cAAc,EACd,kBAAkB,EAClB,QAAgB,EAChB,MAAgB,EAChB,QAAa,EACb,aAAkB,GACnB,EAAE,UAAU,2CA6DZ;AAED,OAAO,EAAE,KAAK,EAAE,CAAA"}
1
+ {"version":3,"file":"price.d.ts","sourceRoot":"","sources":["../../../components/ui/price.tsx"],"names":[],"mappings":";AAIA,UAAU,UAAU;IAClB,KAAK,EAAE,MAAM,CAAA;IACb,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,cAAc,CAAC,EAAE,MAAM,GAAG,SAAS,CAAA;IACnC,kBAAkB,CAAC,EAAE,MAAM,CAAA;IAC3B,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,aAAa,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,OAAO,GAAG,EAAE,CAAC;IACjD,cAAc,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IACrC,UAAU,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IACjC,mBAAmB,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC3C;AAED,iBAAS,KAAK,CAAC,EACb,KAAK,EACL,SAAS,EACT,WAAmB,EACnB,MAAc,EACd,cAAc,EACd,kBAAkB,EAClB,QAAgB,EAChB,MAAgB,EAChB,QAAa,EACb,aAAkB,EAClB,cAAc,EACd,UAAU,EACV,mBAAmB,GACpB,EAAE,UAAU,2CA8DZ;AAED,OAAO,EAAE,KAAK,EAAE,CAAA"}
@@ -2,16 +2,16 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import { Money } from "./money";
3
3
  import { Text } from "./text";
4
4
  import { cn } from "../../lib/utils";
5
- function Price({ price, priceHigh, priceRanges = false, isSale = false, compareAtPrice, compareAtPriceHigh, currency = "USD", locale = "en-US", fontSize = 15, textAlignment = '', }) {
5
+ function Price({ price, priceHigh, priceRanges = false, isSale = false, compareAtPrice, compareAtPriceHigh, currency = "USD", locale = "en-US", fontSize = 15, textAlignment = '', standardStyles, saleStyles, strikeThroughStyles, }) {
6
6
  const Spacer = () => (_jsx("span", { children: " - " }));
7
7
  const ProductPrice = () => {
8
8
  const colorClass = isSale ? 'text-textColors-salePriceText' : 'text-textColors-priceText';
9
- return (_jsx(Text, Object.assign({ className: `${colorClass} flex-shrink-0`, style: { fontSize: `${fontSize}px` } }, { children: _jsxs("span", Object.assign({ className: "flex-grow min-w-[fit-content]" }, { children: [_jsx(Money, { price: price, currency: currency, locale: locale }), priceRanges && priceHigh !== undefined && _jsx(Spacer, {}), priceRanges && priceHigh !== undefined && (_jsx(Money, { price: priceHigh, currency: currency, locale: locale }))] })) })));
9
+ return (_jsx(Text, Object.assign({ className: `${colorClass} flex-shrink-0`, style: { fontSize: `${fontSize}px` } }, { children: _jsxs("span", Object.assign({ className: "flex-grow min-w-[fit-content]" }, { children: [_jsx(Money, { price: price, currency: currency, locale: locale, styles: standardStyles }), priceRanges && priceHigh !== undefined && _jsx(Spacer, {}), priceRanges && priceHigh !== undefined && (_jsx(Money, { price: priceHigh, currency: currency, locale: locale, styles: saleStyles }))] })) })));
10
10
  };
11
11
  const StrikeThroughPrice = () => {
12
12
  if (!isSale || !compareAtPrice)
13
13
  return null;
14
- return (_jsxs(Text, Object.assign({ className: "line-through text-textColors-strikethroughPriceText flex-shrink-0", style: { fontSize: `${fontSize}px` } }, { children: [_jsx(Money, { price: compareAtPrice, currency: currency, locale: locale }), priceRanges && compareAtPriceHigh && _jsx(Spacer, {}), priceRanges && compareAtPriceHigh && (_jsx(Money, { price: compareAtPriceHigh, currency: currency, locale: locale }))] })));
14
+ return (_jsxs(Text, Object.assign({ className: "line-through text-textColors-strikethroughPriceText flex-shrink-0", style: Object.assign({ fontSize: `${fontSize}px` }, strikeThroughStyles) }, { children: [_jsx(Money, { price: compareAtPrice, currency: currency, locale: locale }), priceRanges && compareAtPriceHigh && _jsx(Spacer, {}), priceRanges && compareAtPriceHigh && (_jsx(Money, { price: compareAtPriceHigh, currency: currency, locale: locale }))] })));
15
15
  };
16
16
  return (_jsxs("div", Object.assign({ className: cn("flex flex-wrap gap-2", { "justify-start": textAlignment === "left" }, { "justify-end": textAlignment === "right" }, { "justify-center": textAlignment === "center" }) }, { children: [_jsx(ProductPrice, {}), _jsx(StrikeThroughPrice, {})] })));
17
17
  }
package/dist/index.d.ts CHANGED
@@ -1,9 +1,8 @@
1
- export { cn, cva, getColor, getBackgroundAndPaddingStyle, getBorderSidesStyle, getTextStyle, getVerticalAlignmentStyle, getBackgroundAndSpacingStyle, } from "./lib/utils";
1
+ export { cn, cva, getColor, getBackgroundAndPaddingStyle, getBorderSidesStyle, getTextStyle, getPaddingStyle, getVerticalAlignmentStyle, getBackgroundAndSpacingStyle, } from "./lib/utils";
2
2
  export * from "./components/hooks/use-collection";
3
3
  export * from "./components/hooks/use-infinite-scroll";
4
4
  export * from "./components/hooks/use-recommendations";
5
5
  export * from "./components/hooks/use-products";
6
- export * from "./components/hooks/use-products";
7
6
  export * from "./components/hooks/use-scroll-direction";
8
7
  export * from "./components/hooks/use-sort-filter";
9
8
  export * from "./components/ui/accordion";
@@ -49,5 +48,6 @@ export * from "./components/ui/video";
49
48
  export * from "./components/ui/wishlist";
50
49
  export * from "./components/hooks/use-product-options";
51
50
  export * from "./components/ui/wishlist-select";
51
+ export * from "./components/hooks/use-shop";
52
52
  export * from "./components/libs/sort-filter/search-integration";
53
53
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../index.ts"],"names":[],"mappings":"AACA,OAAO,EACL,EAAE,EACF,GAAG,EACH,QAAQ,EACR,4BAA4B,EAC5B,mBAAmB,EACnB,YAAY,EACZ,yBAAyB,EACzB,4BAA4B,GAC7B,MAAM,aAAa,CAAA;AACpB,cAAc,mCAAmC,CAAA;AACjD,cAAc,wCAAwC,CAAA;AACtD,cAAc,wCAAwC,CAAA;AACtD,cAAc,iCAAiC,CAAA;AAC/C,cAAc,iCAAiC,CAAA;AAC/C,cAAc,yCAAyC,CAAA;AACvD,cAAc,oCAAoC,CAAA;AAClD,cAAc,2BAA2B,CAAA;AACzC,cAAc,8BAA8B,CAAA;AAC5C,cAAc,uBAAuB,CAAA;AACrC,cAAc,wBAAwB,CAAA;AACtC,cAAc,0BAA0B,CAAA;AACxC,cAAc,0BAA0B,CAAA;AACxC,cAAc,sBAAsB,CAAA;AACpC,cAAc,8BAA8B,CAAA;AAC5C,cAAc,2BAA2B,CAAA;AACzC,cAAc,wBAAwB,CAAA;AACtC,cAAc,0BAA0B,CAAA;AACxC,cAAc,+BAA+B,CAAA;AAC7C,cAAc,0BAA0B,CAAA;AACxC,cAAc,sBAAsB,CAAA;AACpC,cAAc,sBAAsB,CAAA;AACpC,cAAc,uBAAuB,CAAA;AACrC,cAAc,6BAA6B,CAAA;AAC3C,cAAc,uBAAuB,CAAA;AACrC,cAAc,sCAAsC,CAAA;AACpD,cAAc,uBAAuB,CAAA;AACrC,cAAc,uBAAuB,CAAA;AACrC,cAAc,8BAA8B,CAAA;AAC5C,cAAc,iCAAiC,CAAA;AAC/C,cAAc,6BAA6B,CAAA;AAC3C,cAAc,6BAA6B,CAAA;AAC3C,cAAc,2BAA2B,CAAA;AACzC,cAAc,2BAA2B,CAAA;AACzC,cAAc,0BAA0B,CAAA;AACxC,cAAc,wBAAwB,CAAA;AACtC,cAAc,8BAA8B,CAAA;AAC5C,cAAc,wBAAwB,CAAA;AACtC,cAAc,sBAAsB,CAAA;AACpC,cAAc,sBAAsB,CAAA;AACpC,cAAc,0BAA0B,CAAA;AACxC,cAAc,uBAAuB,CAAA;AACrC,cAAc,yBAAyB,CAAA;AACvC,cAAc,8BAA8B,CAAA;AAC5C,cAAc,wBAAwB,CAAA;AACtC,cAAc,2BAA2B,CAAA;AACzC,cAAc,uBAAuB,CAAA;AACrC,cAAc,0BAA0B,CAAA;AACxC,cAAc,wCAAwC,CAAA;AACtD,cAAc,iCAAiC,CAAA;AAC/C,cAAc,kDAAkD,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../index.ts"],"names":[],"mappings":"AACA,OAAO,EACL,EAAE,EACF,GAAG,EACH,QAAQ,EACR,4BAA4B,EAC5B,mBAAmB,EACnB,YAAY,EACZ,eAAe,EACf,yBAAyB,EACzB,4BAA4B,GAC7B,MAAM,aAAa,CAAA;AACpB,cAAc,mCAAmC,CAAA;AACjD,cAAc,wCAAwC,CAAA;AACtD,cAAc,wCAAwC,CAAA;AACtD,cAAc,iCAAiC,CAAA;AAC/C,cAAc,yCAAyC,CAAA;AACvD,cAAc,oCAAoC,CAAA;AAClD,cAAc,2BAA2B,CAAA;AACzC,cAAc,8BAA8B,CAAA;AAC5C,cAAc,uBAAuB,CAAA;AACrC,cAAc,wBAAwB,CAAA;AACtC,cAAc,0BAA0B,CAAA;AACxC,cAAc,0BAA0B,CAAA;AACxC,cAAc,sBAAsB,CAAA;AACpC,cAAc,8BAA8B,CAAA;AAC5C,cAAc,2BAA2B,CAAA;AACzC,cAAc,wBAAwB,CAAA;AACtC,cAAc,0BAA0B,CAAA;AACxC,cAAc,+BAA+B,CAAA;AAC7C,cAAc,0BAA0B,CAAA;AACxC,cAAc,sBAAsB,CAAA;AACpC,cAAc,sBAAsB,CAAA;AACpC,cAAc,uBAAuB,CAAA;AACrC,cAAc,6BAA6B,CAAA;AAC3C,cAAc,uBAAuB,CAAA;AACrC,cAAc,sCAAsC,CAAA;AACpD,cAAc,uBAAuB,CAAA;AACrC,cAAc,uBAAuB,CAAA;AACrC,cAAc,8BAA8B,CAAA;AAC5C,cAAc,iCAAiC,CAAA;AAC/C,cAAc,6BAA6B,CAAA;AAC3C,cAAc,6BAA6B,CAAA;AAC3C,cAAc,2BAA2B,CAAA;AACzC,cAAc,2BAA2B,CAAA;AACzC,cAAc,0BAA0B,CAAA;AACxC,cAAc,wBAAwB,CAAA;AACtC,cAAc,8BAA8B,CAAA;AAC5C,cAAc,wBAAwB,CAAA;AACtC,cAAc,sBAAsB,CAAA;AACpC,cAAc,sBAAsB,CAAA;AACpC,cAAc,0BAA0B,CAAA;AACxC,cAAc,uBAAuB,CAAA;AACrC,cAAc,yBAAyB,CAAA;AACvC,cAAc,8BAA8B,CAAA;AAC5C,cAAc,wBAAwB,CAAA;AACtC,cAAc,2BAA2B,CAAA;AACzC,cAAc,uBAAuB,CAAA;AACrC,cAAc,0BAA0B,CAAA;AACxC,cAAc,wCAAwC,CAAA;AACtD,cAAc,iCAAiC,CAAA;AAC/C,cAAc,6BAA6B,CAAA;AAC3C,cAAc,kDAAkD,CAAA"}
package/dist/index.js CHANGED
@@ -1,10 +1,9 @@
1
1
  // component exports
2
- export { cn, cva, getColor, getBackgroundAndPaddingStyle, getBorderSidesStyle, getTextStyle, getVerticalAlignmentStyle, getBackgroundAndSpacingStyle, } from "./lib/utils";
2
+ export { cn, cva, getColor, getBackgroundAndPaddingStyle, getBorderSidesStyle, getTextStyle, getPaddingStyle, getVerticalAlignmentStyle, getBackgroundAndSpacingStyle, } from "./lib/utils";
3
3
  export * from "./components/hooks/use-collection";
4
4
  export * from "./components/hooks/use-infinite-scroll";
5
5
  export * from "./components/hooks/use-recommendations";
6
6
  export * from "./components/hooks/use-products";
7
- export * from "./components/hooks/use-products";
8
7
  export * from "./components/hooks/use-scroll-direction";
9
8
  export * from "./components/hooks/use-sort-filter";
10
9
  export * from "./components/ui/accordion";
@@ -50,4 +49,5 @@ export * from "./components/ui/video";
50
49
  export * from "./components/ui/wishlist";
51
50
  export * from "./components/hooks/use-product-options";
52
51
  export * from "./components/ui/wishlist-select";
52
+ export * from "./components/hooks/use-shop";
53
53
  export * from "./components/libs/sort-filter/search-integration";
@@ -24,7 +24,7 @@ export declare const getBorderSidesStyle: (borderSides: BorderSides) => {
24
24
  borderWidth?: undefined;
25
25
  };
26
26
  type VerticalAlignment = "top" | "middle" | "bottom";
27
- type Spacing = {
27
+ export type Spacing = {
28
28
  top: number;
29
29
  bottom: number;
30
30
  left: number;
@@ -55,18 +55,24 @@ type BackgroundAndPadding = {
55
55
  padding?: Partial<Spacing>;
56
56
  };
57
57
  export declare const getBackgroundAndPaddingStyle: (backgroundAndPadding: BackgroundAndPadding) => {
58
+ paddingTop: string | undefined;
59
+ paddingBottom: string | undefined;
60
+ paddingLeft: string | undefined;
61
+ paddingRight: string | undefined;
58
62
  backgroundColor: string | undefined;
59
63
  borderColor: string | undefined;
60
64
  borderTopWidth: string | undefined;
61
65
  borderBottomWidth: string | undefined;
62
66
  borderLeftWidth: string | undefined;
63
67
  borderRightWidth: string | undefined;
68
+ borderStyle: string | undefined;
69
+ borderRadius: string | undefined;
70
+ };
71
+ export declare const getPaddingStyle: (padding: Partial<Spacing>) => {
64
72
  paddingTop: string | undefined;
65
73
  paddingBottom: string | undefined;
66
74
  paddingLeft: string | undefined;
67
75
  paddingRight: string | undefined;
68
- borderStyle: string | undefined;
69
- borderRadius: string | undefined;
70
76
  };
71
77
  type BackgroundAndSpacing = AlignmentAndSpacing & {
72
78
  backgroundColor?: Color;
@@ -88,6 +94,7 @@ type TextStyle = {
88
94
  color: Color;
89
95
  uppercase: boolean;
90
96
  textAlignment: "left" | "center" | "right" | "justify";
97
+ wrapText: boolean;
91
98
  };
92
99
  type Headline = TextStyle;
93
100
  type Subtext = TextStyle;
@@ -98,5 +105,6 @@ export declare const getTextStyle: (textStyle: Headline | Subtext) => {
98
105
  color: string | undefined;
99
106
  textTransform: string;
100
107
  textAlign: "left" | "right" | "center" | "justify";
108
+ textWrap: string;
101
109
  };
102
110
  //# sourceMappingURL=utils.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../lib/utils.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAQ,MAAM,MAAM,CAAA;AAGvC,MAAM,MAAM,KAAK,GAAG;IAAE,IAAI,EAAE,QAAQ,GAAG,WAAW,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,CAAA;AAEnE,wBAAgB,EAAE,CAAC,GAAG,MAAM,EAAE,UAAU,EAAE,UAEzC;AAED,eAAO,MAAM,eAAe,UAc3B,CAAA;AAED,eAAO,MAAM,uBAAuB,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAM,CAAA;AAMjE,OAAO,EAAE,GAAG,EAAE,MAAM,0BAA0B,CAAA;AAI9C,eAAO,MAAM,QAAQ,gBAAiB,KAAK,GAAG,SAAS,uBAMtD,CAAA;AAED,KAAK,UAAU,GAAG,KAAK,GAAG,KAAK,GAAG,QAAQ,GAAG,MAAM,GAAG,OAAO,CAAA;AAC7D,KAAK,WAAW,GAAG,UAAU,EAAE,CAAA;AAE/B,eAAO,MAAM,mBAAmB;;;;;;;;;;;;CAU/B,CAAA;AAED,KAAK,iBAAiB,GAAG,KAAK,GAAG,QAAQ,GAAG,QAAQ,CAAA;AAEpD,KAAK,OAAO,GAAG;IACb,GAAG,EAAE,MAAM,CAAA;IACX,MAAM,EAAE,MAAM,CAAA;IACd,IAAI,EAAE,MAAM,CAAA;IACZ,KAAK,EAAE,MAAM,CAAA;CACd,CAAA;AAED,UAAU,mBAAmB;IAC3B,SAAS,EAAE,iBAAiB,CAAA;IAC5B,OAAO,EAAE,OAAO,CAAA;CACjB;AAED,eAAO,MAAM,yBAAyB,wBACf,mBAAmB;;;;;;;;;;;;CAczC,CAAA;AAED,KAAK,oBAAoB,GAAG;IAC1B,eAAe,CAAC,EAAE,KAAK,CAAA;IACvB,WAAW,CAAC,EAAE,WAAW,CAAA;IACzB,WAAW,CAAC,EAAE,KAAK,CAAA;IACnB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,OAAO,CAAC,EAAE,OAAO,CAAC,OAAO,CAAC,CAAA;CAC3B,CAAA;AAED,eAAO,MAAM,4BAA4B,yBACjB,oBAAoB;;;;;;;;;;;;;CAgC3C,CAAA;AAED,KAAK,oBAAoB,GAAG,mBAAmB,GAAG;IAChD,eAAe,CAAC,EAAE,KAAK,CAAA;IACvB,WAAW,CAAC,EAAE,KAAK,CAAA;IACnB,iBAAiB,CAAC,EAAE,MAAM,CAAA;CAC3B,CAAA;AAED,eAAO,MAAM,4BAA4B,yBACjB,oBAAoB;;;;;CAU3C,CAAA;AAED,KAAK,SAAS,GAAG;IACf,IAAI,EAAE;QACJ,MAAM,EAAE,MAAM,CAAA;QACd,MAAM,EAAE,MAAM,GAAG,MAAM,CAAA;KACxB,CAAA;IACD,IAAI,EAAE,MAAM,GAAG,MAAM,CAAA;IACrB,KAAK,EAAE,KAAK,CAAA;IACZ,SAAS,EAAE,OAAO,CAAA;IAClB,aAAa,EAAE,MAAM,GAAG,QAAQ,GAAG,OAAO,GAAG,SAAS,CAAA;CACvD,CAAA;AAED,KAAK,QAAQ,GAAG,SAAS,CAAA;AACzB,KAAK,OAAO,GAAG,SAAS,CAAA;AAExB,eAAO,MAAM,YAAY,cAAe,QAAQ,GAAG,OAAO;;;;;;;CAUzD,CAAA"}
1
+ {"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../lib/utils.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAQ,MAAM,MAAM,CAAA;AAGvC,MAAM,MAAM,KAAK,GAAG;IAAE,IAAI,EAAE,QAAQ,GAAG,WAAW,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,CAAA;AAEnE,wBAAgB,EAAE,CAAC,GAAG,MAAM,EAAE,UAAU,EAAE,UAEzC;AAED,eAAO,MAAM,eAAe,UAc3B,CAAA;AAED,eAAO,MAAM,uBAAuB,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAM,CAAA;AAMjE,OAAO,EAAE,GAAG,EAAE,MAAM,0BAA0B,CAAA;AAI9C,eAAO,MAAM,QAAQ,gBAAiB,KAAK,GAAG,SAAS,uBAUtD,CAAA;AAED,KAAK,UAAU,GAAG,KAAK,GAAG,KAAK,GAAG,QAAQ,GAAG,MAAM,GAAG,OAAO,CAAA;AAC7D,KAAK,WAAW,GAAG,UAAU,EAAE,CAAA;AAE/B,eAAO,MAAM,mBAAmB;;;;;;;;;;;;CAU/B,CAAA;AAED,KAAK,iBAAiB,GAAG,KAAK,GAAG,QAAQ,GAAG,QAAQ,CAAA;AAEpD,MAAM,MAAM,OAAO,GAAG;IACpB,GAAG,EAAE,MAAM,CAAA;IACX,MAAM,EAAE,MAAM,CAAA;IACd,IAAI,EAAE,MAAM,CAAA;IACZ,KAAK,EAAE,MAAM,CAAA;CACd,CAAA;AAED,UAAU,mBAAmB;IAC3B,SAAS,EAAE,iBAAiB,CAAA;IAC5B,OAAO,EAAE,OAAO,CAAA;CACjB;AAED,eAAO,MAAM,yBAAyB,wBACf,mBAAmB;;;;;;;;;;;;CAczC,CAAA;AAED,KAAK,oBAAoB,GAAG;IAC1B,eAAe,CAAC,EAAE,KAAK,CAAA;IACvB,WAAW,CAAC,EAAE,WAAW,CAAA;IACzB,WAAW,CAAC,EAAE,KAAK,CAAA;IACnB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,OAAO,CAAC,EAAE,OAAO,CAAC,OAAO,CAAC,CAAA;CAC3B,CAAA;AAED,eAAO,MAAM,4BAA4B,yBACjB,oBAAoB;;;;;;;;;;;;;CA4B3C,CAAA;AAED,eAAO,MAAM,eAAe,YACjB,QAAQ,OAAO,CAAC;;;;;CAU1B,CAAA;AAED,KAAK,oBAAoB,GAAG,mBAAmB,GAAG;IAChD,eAAe,CAAC,EAAE,KAAK,CAAA;IACvB,WAAW,CAAC,EAAE,KAAK,CAAA;IACnB,iBAAiB,CAAC,EAAE,MAAM,CAAA;CAC3B,CAAA;AAED,eAAO,MAAM,4BAA4B,yBACjB,oBAAoB;;;;;CAU3C,CAAA;AAED,KAAK,SAAS,GAAG;IACf,IAAI,EAAE;QACJ,MAAM,EAAE,MAAM,CAAA;QACd,MAAM,EAAE,MAAM,GAAG,MAAM,CAAA;KACxB,CAAA;IACD,IAAI,EAAE,MAAM,GAAG,MAAM,CAAA;IACrB,KAAK,EAAE,KAAK,CAAA;IACZ,SAAS,EAAE,OAAO,CAAA;IAClB,aAAa,EAAE,MAAM,GAAG,QAAQ,GAAG,OAAO,GAAG,SAAS,CAAA;IACtD,QAAQ,EAAE,OAAO,CAAA;CAClB,CAAA;AAED,KAAK,QAAQ,GAAG,SAAS,CAAA;AACzB,KAAK,OAAO,GAAG,SAAS,CAAA;AAExB,eAAO,MAAM,YAAY,cAAe,QAAQ,GAAG,OAAO;;;;;;;;CAWzD,CAAA"}
package/dist/lib/utils.js CHANGED
@@ -25,6 +25,9 @@ for (let iconColorLevel of iconColorLevels) {
25
25
  export { cva } from "class-variance-authority";
26
26
  // #region =-=-=-= Block Utils =-=-=-=
27
27
  export const getColor = (colorOption) => {
28
+ if ((colorOption === null || colorOption === void 0 ? void 0 : colorOption.value) === null) {
29
+ return undefined;
30
+ }
28
31
  return colorOption
29
32
  ? (colorOption === null || colorOption === void 0 ? void 0 : colorOption.type) === "brand-kit"
30
33
  ? `var(--${colorOption.value})`
@@ -57,27 +60,22 @@ export const getVerticalAlignmentStyle = (alignmentAndSpacing) => {
57
60
  };
58
61
  export const getBackgroundAndPaddingStyle = (backgroundAndPadding) => {
59
62
  const { backgroundColor, borderSides, borderColor, cornerRadius, padding } = backgroundAndPadding;
60
- return {
61
- backgroundColor: getColor(backgroundColor),
62
- borderColor: getColor(borderColor),
63
- borderTopWidth: (borderSides === null || borderSides === void 0 ? void 0 : borderSides.includes("top")) || (borderSides === null || borderSides === void 0 ? void 0 : borderSides.includes("all"))
63
+ return Object.assign({ backgroundColor: getColor(backgroundColor), borderColor: getColor(borderColor), borderTopWidth: (borderSides === null || borderSides === void 0 ? void 0 : borderSides.includes("top")) || (borderSides === null || borderSides === void 0 ? void 0 : borderSides.includes("all"))
64
64
  ? "1px"
65
- : undefined,
66
- borderBottomWidth: (borderSides === null || borderSides === void 0 ? void 0 : borderSides.includes("bottom")) || (borderSides === null || borderSides === void 0 ? void 0 : borderSides.includes("all"))
65
+ : undefined, borderBottomWidth: (borderSides === null || borderSides === void 0 ? void 0 : borderSides.includes("bottom")) || (borderSides === null || borderSides === void 0 ? void 0 : borderSides.includes("all"))
67
66
  ? "1px"
68
- : undefined,
69
- borderLeftWidth: (borderSides === null || borderSides === void 0 ? void 0 : borderSides.includes("left")) || (borderSides === null || borderSides === void 0 ? void 0 : borderSides.includes("all"))
67
+ : undefined, borderLeftWidth: (borderSides === null || borderSides === void 0 ? void 0 : borderSides.includes("left")) || (borderSides === null || borderSides === void 0 ? void 0 : borderSides.includes("all"))
70
68
  ? "1px"
71
- : undefined,
72
- borderRightWidth: (borderSides === null || borderSides === void 0 ? void 0 : borderSides.includes("right")) || (borderSides === null || borderSides === void 0 ? void 0 : borderSides.includes("all"))
69
+ : undefined, borderRightWidth: (borderSides === null || borderSides === void 0 ? void 0 : borderSides.includes("right")) || (borderSides === null || borderSides === void 0 ? void 0 : borderSides.includes("all"))
73
70
  ? "1px"
74
- : undefined,
71
+ : undefined, borderStyle: (borderSides === null || borderSides === void 0 ? void 0 : borderSides.length) ? "solid" : undefined, borderRadius: cornerRadius !== undefined ? `${cornerRadius}px` : undefined }, getPaddingStyle(padding || {}));
72
+ };
73
+ export const getPaddingStyle = (padding) => {
74
+ return {
75
75
  paddingTop: (padding === null || padding === void 0 ? void 0 : padding.top) !== undefined ? `${padding.top}px` : undefined,
76
76
  paddingBottom: (padding === null || padding === void 0 ? void 0 : padding.bottom) !== undefined ? `${padding.bottom}px` : undefined,
77
77
  paddingLeft: (padding === null || padding === void 0 ? void 0 : padding.left) !== undefined ? `${padding.left}px` : undefined,
78
78
  paddingRight: (padding === null || padding === void 0 ? void 0 : padding.right) !== undefined ? `${padding.right}px` : undefined,
79
- borderStyle: (borderSides === null || borderSides === void 0 ? void 0 : borderSides.length) ? "solid" : undefined,
80
- borderRadius: cornerRadius !== undefined ? `${cornerRadius}px` : undefined,
81
79
  };
82
80
  };
83
81
  export const getBackgroundAndSpacingStyle = (backgroundAndSpacing) => {
@@ -90,7 +88,7 @@ export const getBackgroundAndSpacingStyle = (backgroundAndSpacing) => {
90
88
  };
91
89
  };
92
90
  export const getTextStyle = (textStyle) => {
93
- const { font, size, color, uppercase, textAlignment } = textStyle;
91
+ const { font, size, color, uppercase, textAlignment, wrapText } = textStyle;
94
92
  return {
95
93
  fontFamily: font.family === "initial" ? undefined : font.family,
96
94
  fontWeight: font.weight === "initial" ? undefined : font.weight,
@@ -98,6 +96,7 @@ export const getTextStyle = (textStyle) => {
98
96
  color: getColor(color),
99
97
  textTransform: uppercase ? "uppercase" : "none",
100
98
  textAlign: textAlignment,
99
+ textWrap: wrapText ? "wrap" : "nowrap",
101
100
  };
102
101
  };
103
102
  // #endregion =-=-=-= END BLOCK UTILS =-=-=-=
package/dist/styles.css CHANGED
@@ -994,6 +994,9 @@ video {
994
994
  .max-h-\[240px\] {
995
995
  max-height: 240px;
996
996
  }
997
+ .max-h-\[300px\] {
998
+ max-height: 300px;
999
+ }
997
1000
  .max-h-screen {
998
1001
  max-height: 100vh;
999
1002
  }
@@ -1054,9 +1057,6 @@ video {
1054
1057
  .w-\[40px\] {
1055
1058
  width: 40px;
1056
1059
  }
1057
- .w-\[69px\] {
1058
- width: 69px;
1059
- }
1060
1060
  .w-auto {
1061
1061
  width: auto;
1062
1062
  }
@@ -1084,6 +1084,9 @@ video {
1084
1084
  min-width: -moz-fit-content;
1085
1085
  min-width: fit-content;
1086
1086
  }
1087
+ .max-w-\[200px\] {
1088
+ max-width: 200px;
1089
+ }
1087
1090
  .max-w-full {
1088
1091
  max-width: 100%;
1089
1092
  }
@@ -1224,6 +1227,9 @@ video {
1224
1227
  .grid-cols-\[auto\2c auto\2c 1fr\] {
1225
1228
  grid-template-columns: auto auto 1fr;
1226
1229
  }
1230
+ .grid-cols-\[auto_1fr_auto\] {
1231
+ grid-template-columns: auto 1fr auto;
1232
+ }
1227
1233
  .flex-row {
1228
1234
  flex-direction: row;
1229
1235
  }
@@ -1242,9 +1248,6 @@ video {
1242
1248
  .items-start {
1243
1249
  align-items: flex-start;
1244
1250
  }
1245
- .items-end {
1246
- align-items: flex-end;
1247
- }
1248
1251
  .items-center {
1249
1252
  align-items: center;
1250
1253
  }
@@ -1429,9 +1432,6 @@ video {
1429
1432
  .border-t-\[0px\] {
1430
1433
  border-top-width: 0px;
1431
1434
  }
1432
- .border-t-\[1px\] {
1433
- border-top-width: 1px;
1434
- }
1435
1435
  .border-none {
1436
1436
  border-style: none;
1437
1437
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tapcart/mobile-components",
3
- "version": "0.6.7",
3
+ "version": "0.6.9",
4
4
  "main": "dist/index.js",
5
5
  "types": "dist/index.d.ts",
6
6
  "style": "dist/styles.css",
@@ -1,3 +0,0 @@
1
- import { ThemeProviderProps } from "next-themes/dist/types";
2
- export declare function ThemeProvider({ children, ...props }: ThemeProviderProps): import("react/jsx-runtime").JSX.Element;
3
- //# sourceMappingURL=ThemeProvider.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"ThemeProvider.d.ts","sourceRoot":"","sources":["../../components/ThemeProvider.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAA;AAE3D,wBAAgB,aAAa,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,kBAAkB,2CAEvE"}
@@ -1,18 +0,0 @@
1
- "use client";
2
- var __rest = (this && this.__rest) || function (s, e) {
3
- var t = {};
4
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
5
- t[p] = s[p];
6
- if (s != null && typeof Object.getOwnPropertySymbols === "function")
7
- for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
8
- if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
9
- t[p[i]] = s[p[i]];
10
- }
11
- return t;
12
- };
13
- import { jsx as _jsx } from "react/jsx-runtime";
14
- import { ThemeProvider as NextThemesProvider } from "next-themes";
15
- export function ThemeProvider(_a) {
16
- var { children } = _a, props = __rest(_a, ["children"]);
17
- return _jsx(NextThemesProvider, Object.assign({}, props, { children: children }));
18
- }
@@ -1,2 +0,0 @@
1
- export declare function ThemeToggle(): import("react/jsx-runtime").JSX.Element;
2
- //# sourceMappingURL=ThemeToggle.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"ThemeToggle.d.ts","sourceRoot":"","sources":["../../components/ThemeToggle.tsx"],"names":[],"mappings":"AAOA,wBAAgB,WAAW,4CAc1B"}
@@ -1,8 +0,0 @@
1
- "use client";
2
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
- import { useTheme } from "next-themes";
4
- import { Button } from "../components/ui/button";
5
- export function ThemeToggle() {
6
- const { setTheme, theme } = useTheme();
7
- return (_jsxs(Button, Object.assign({ variant: "ghost", size: "sm", onClick: () => setTheme(theme === "light" ? "dark" : "light") }, { children: [_jsx("div", { className: "rotate-0 scale-100 transition-all dark:-rotate-90 dark:scale-0" }), _jsx("div", { className: "absolute rotate-90 scale-0 transition-all dark:rotate-0 dark:scale-100" }), _jsx("span", Object.assign({ className: "sr-only" }, { children: "Toggle theme" }))] })));
8
- }
@@ -1,17 +0,0 @@
1
- import * as React from "react";
2
- import { type VariantProps } from "class-variance-authority";
3
- declare const inputVariants: (props?: ({
4
- error?: boolean | null | undefined;
5
- } & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
6
- export interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "onChange">, VariantProps<typeof inputVariants> {
7
- id: string;
8
- label?: string;
9
- icon?: string;
10
- asChild?: boolean;
11
- value: string;
12
- placeholder: string;
13
- onChange: (_: string) => void;
14
- }
15
- declare const Input: React.ForwardRefExoticComponent<InputProps & React.RefAttributes<HTMLInputElement>>;
16
- export { Input };
17
- //# sourceMappingURL=input.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"input.d.ts","sourceRoot":"","sources":["../../../components/ui/input.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAIjE,QAAA,MAAM,aAAa;;mFAalB,CAAA;AAED,MAAM,WAAW,UACf,SAAQ,IAAI,CAAC,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,UAAU,CAAC,EACnE,YAAY,CAAC,OAAO,aAAa,CAAC;IACpC,EAAE,EAAE,MAAM,CAAA;IACV,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,KAAK,EAAE,MAAM,CAAA;IACb,WAAW,EAAE,MAAM,CAAA;IACnB,QAAQ,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI,CAAA;CAC9B;AAED,QAAA,MAAM,KAAK,qFAkDV,CAAA;AAGD,OAAO,EAAE,KAAK,EAAE,CAAA"}
@@ -1,35 +0,0 @@
1
- var __rest = (this && this.__rest) || function (s, e) {
2
- var t = {};
3
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
4
- t[p] = s[p];
5
- if (s != null && typeof Object.getOwnPropertySymbols === "function")
6
- for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
7
- if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
8
- t[p[i]] = s[p[i]];
9
- }
10
- return t;
11
- };
12
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
13
- import * as React from "react";
14
- import { Slot } from "@radix-ui/react-slot";
15
- import { cva } from "class-variance-authority";
16
- import { cn } from "../../lib/utils";
17
- import { Icon } from "./icon";
18
- const inputVariants = cva("flex h-14 w-full rounded border border-coreColors-dividingLines bg-coreColors-inputBackground px-4 pt-5 pb-2 placeholder-shown:p-4 text-textColors-primaryColor text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-textColors-secondaryColor focus-visible:outline-none focus-visible:ring-0 disabled:cursor-not-allowed disabled:opacity-50 focus:border-coreColors-brandColorPrimary peer data-[icon=true]:pr-10", {
19
- variants: {
20
- error: {
21
- true: "border-stateColors-error text-stateColors-error placeholder:text-stateColors-error focus:border-stateColors-error [&+label]:text-stateColors-error",
22
- false: "",
23
- },
24
- },
25
- defaultVariants: {
26
- error: false,
27
- },
28
- });
29
- const Input = React.forwardRef((_a, ref) => {
30
- var { className, error = false, id, type, label, icon, asChild, value, placeholder, onChange } = _a, props = __rest(_a, ["className", "error", "id", "type", "label", "icon", "asChild", "value", "placeholder", "onChange"]);
31
- const Comp = asChild ? Slot : "div";
32
- return (_jsxs(Comp, Object.assign({ className: "relative group" }, { children: [_jsx("input", Object.assign({ placeholder: placeholder, value: value, onChange: (e) => onChange(e.target.value), id: id, type: type, className: cn(inputVariants({ error }), className), "data-icon": !!icon, ref: ref }, props)), label ? (_jsx("label", Object.assign({ htmlFor: id, className: "absolute text-[10px] text-textColors-secondaryColor group-active:text-coreColors-brandColorPrimary top-2 z-10 h-4 origin-[0] start-4 opacity-100 peer-placeholder-shown:opacity-0" }, { children: label }))) : null, icon ? (_jsx(Icon, { name: icon, "data-error": error, size: "sm", className: "absolute w-5 aspect-square fill-current text-textColors-secondaryColor top-[18px] z-10 origin-[0] end-4 peer-pr-8 icon data-[error=true]:text-stateColors-error" })) : null] })));
33
- });
34
- Input.displayName = "Input";
35
- export { Input };
@@ -1,15 +0,0 @@
1
- type Product = any;
2
- interface PageData {
3
- products: Product[];
4
- cursorBlob?: string;
5
- filtersData: any;
6
- }
7
- interface ProductGridItemsProps {
8
- initialData: PageData;
9
- loadMoreProducts: (params: any) => Promise<PageData>;
10
- queryVariables: Record<string, any>;
11
- config: Record<string, any>;
12
- }
13
- declare function ProductGrid({ loadMoreProducts, initialData, queryVariables, config, }: ProductGridItemsProps): import("react/jsx-runtime").JSX.Element;
14
- export { ProductGrid };
15
- //# sourceMappingURL=product-grid.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"product-grid.d.ts","sourceRoot":"","sources":["../../../components/ui/product-grid.tsx"],"names":[],"mappings":"AAkBA,KAAK,OAAO,GAAG,GAAG,CAAA;AAClB,UAAU,QAAQ;IAChB,QAAQ,EAAE,OAAO,EAAE,CAAA;IACnB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,WAAW,EAAE,GAAG,CAAA;CACjB;AAED,UAAU,qBAAqB;IAC7B,WAAW,EAAE,QAAQ,CAAA;IACrB,gBAAgB,EAAE,CAAC,MAAM,EAAE,GAAG,KAAK,OAAO,CAAC,QAAQ,CAAC,CAAA;IACpD,cAAc,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;IACnC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;CAC5B;AAED,iBAAS,WAAW,CAAC,EACnB,gBAAgB,EAChB,WAAW,EACX,cAAc,EACd,MAAM,GACP,EAAE,qBAAqB,2CAmCvB;AAED,OAAO,EAAE,WAAW,EAAE,CAAA"}
@@ -1,22 +0,0 @@
1
- "use client";
2
- import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
3
- import { useInfiniteScroll } from "../hooks/use-infinite-scroll";
4
- import { ProductCard } from "./product-card";
5
- const Loader = () => (_jsx("div", Object.assign({ className: "grid-cols-2 lg:grid-cols-3" }, { children: Array(4)
6
- .fill(0)
7
- .map((_, index) => (_jsx("div", { className: "aspect-[2/3] animate-pulse bg-neutral-100 dark:bg-neutral-900" }, index))) })));
8
- function ProductGrid({ loadMoreProducts, initialData, queryVariables, config, }) {
9
- const { data, error, isLoadingInitialData, isLoadingMore, isEmpty, isReachingEnd, ref, products, } = useInfiniteScroll({
10
- initialData,
11
- loadMoreProducts,
12
- queryVariables,
13
- });
14
- if (error)
15
- return _jsx("div", { children: "Failed to load data" });
16
- if (isLoadingInitialData)
17
- return _jsx(Loader, {});
18
- return (_jsxs(_Fragment, { children: [_jsx("div", Object.assign({ className: "grid-cols-2 lg:grid-cols-3" }, { children: products.map((product, i) => (_jsx(ProductCard, {
19
- // @ts-expect-error
20
- product: product, config: config, isLoading: false }, product.handle))) })), isLoadingMore ? _jsx(Loader, {}) : _jsx("div", { ref: ref })] }));
21
- }
22
- export { ProductGrid };