@riosst100/pwa-marketplace 1.2.7 → 1.2.8

package/src/overwrites/venia-ui/lib/components/SearchBar/searchBar.module.css

@@ -1,50 +1,50 @@
-.root {
-    composes: items-center from global;
-    composes: justify-items-center from global;
-    composes: justify-self-center from global;
-    composes: max-w-site from global;
-    composes: px-xs from global;
-    composes: py-0 from global;
-    composes: w-full from global;
-
-    /* TODO @TW: review (B6) */
-    /* composes: hidden from global; */
-    display: none;
-}
-
-.root_open {
-    composes: root;
-
-    composes: z-dropdown from global;
-
-    /* TODO @TW: review (B6) */
-    /* composes: grid from global; */
-    display: grid;
-}
-
-.form {
-    composes: grid from global;
-    composes: items-center from global;
-    composes: justify-items-stretch from global;
-    composes: w-full from global;
-}
-
-.container {
-    composes: inline-flex from global;
-    composes: items-center from global;
-    composes: justify-center from global;
-    composes: max-w-[24rem] from global;
-    composes: relative from global;
-    composes: w-full from global;
-}
-
-.search {
-    composes: grid from global;
-    composes: relative from global;
-}
-
-.autocomplete {
-    composes: grid from global;
-    /* composes: relative from global; */
-    composes: z-menu from global;
+.root {
+    composes: items-center from global;
+    composes: justify-items-center from global;
+    composes: justify-self-center from global;
+    composes: max-w-site from global;
+    composes: px-xs from global;
+    composes: py-0 from global;
+    composes: w-full from global;
+
+    /* TODO @TW: review (B6) */
+    /* composes: hidden from global; */
+    display: none;
+}
+
+.root_open {
+    composes: root;
+
+    composes: z-dropdown from global;
+
+    /* TODO @TW: review (B6) */
+    /* composes: grid from global; */
+    display: grid;
+}
+
+.form {
+    composes: grid from global;
+    composes: items-center from global;
+    composes: justify-items-stretch from global;
+    composes: w-full from global;
+}
+
+.container {
+    composes: inline-flex from global;
+    composes: items-center from global;
+    composes: justify-center from global;
+    composes: max-w-[24rem] from global;
+    composes: relative from global;
+    composes: w-full from global;
+}
+
+.search {
+    composes: grid from global;
+    composes: relative from global;
+}
+
+.autocomplete {
+    composes: grid from global;
+    /* composes: relative from global; */
+    composes: z-menu from global;
 }

package/src/overwrites/venia-ui/lib/components/SearchBar/searchField.js

@@ -1,40 +1,40 @@
-import React from 'react';
-import { func } from 'prop-types';
-import { useSearchField } from '@magento/peregrine/lib/talons/SearchBar';
-import TextInput from '@magento/venia-ui/lib/components/TextInput';
-import Trigger from '@magento/venia-ui/lib/components/Trigger';
-import { SearchNormal } from 'iconsax-react';
-import cn from 'classnames';
-
-const SearchField = props => {
-    const { isSearchOpen, onChange, onFocus, addLabel } = props;
-    const { inputRef, resetForm, value } = useSearchField({ isSearchOpen });
-
-    const handleSearch = () => {
-        console.log('search');
-    }
-    const searchButton =
-        <Trigger action={handleSearch} addLabel={addLabel}>
-            <SearchNormal size="18" color="#280135" variant="Outline" />
-        </Trigger>
-
-    return (
-        <TextInput
-            id="search_query"
-            after={searchButton}
-            field="search_query"
-            data-cy="SearchField-textInput"
-            onFocus={onFocus}
-            onValueChange={onChange}
-            forwardedRef={inputRef}
-            classes={cn('search input')}
-        />
-    );
-};
-
-export default SearchField;
-
-SearchField.propTypes = {
-    onChange: func,
-    onFocus: func
-};
+import React from 'react';
+import { func } from 'prop-types';
+import { useSearchField } from '@magento/peregrine/lib/talons/SearchBar';
+import TextInput from '@magento/venia-ui/lib/components/TextInput';
+import Trigger from '@magento/venia-ui/lib/components/Trigger';
+import { SearchNormal } from 'iconsax-react';
+import cn from 'classnames';
+
+const SearchField = props => {
+    const { isSearchOpen, onChange, onFocus, addLabel } = props;
+    const { inputRef, resetForm, value } = useSearchField({ isSearchOpen });
+
+    const handleSearch = () => {
+        console.log('search');
+    }
+    const searchButton =
+        <Trigger action={handleSearch} addLabel={addLabel}>
+            <SearchNormal size="18" color="#280135" variant="Outline" />
+        </Trigger>
+
+    return (
+        <TextInput
+            id="search_query"
+            after={searchButton}
+            field="search_query"
+            data-cy="SearchField-textInput"
+            onFocus={onFocus}
+            onValueChange={onChange}
+            forwardedRef={inputRef}
+            classes={cn('search input')}
+        />
+    );
+};
+
+export default SearchField;
+
+SearchField.propTypes = {
+    onChange: func,
+    onFocus: func
+};

package/src/overwrites/venia-ui/lib/components/SearchBar/suggestedCategories.js

@@ -1,48 +1,48 @@
-import React from 'react';
-import { arrayOf, func, number, shape, string } from 'prop-types';
-
-import { useStyle } from '@magento/venia-ui/lib/classify';
-import SuggestedCategory from './suggestedCategory';
-import defaultClasses from './suggestedCategories.module.css';
-
-const SuggestedCategories = props => {
-    const { categories, limit, onNavigate, value } = props;
-    const classes = useStyle(defaultClasses, props.classes);
-
-    const items = categories
-        .slice(0, limit)
-        .map(({ label, value: categoryId }) => (
-            <li key={categoryId} className={classes.item}>
-                <SuggestedCategory
-                    categoryId={categoryId}
-                    label={label}
-                    onNavigate={onNavigate}
-                    value={value}
-                />
-            </li>
-        ));
-
-    return <ul className={classes.root}>{items}</ul>;
-};
-
-export default SuggestedCategories;
-
-SuggestedCategories.defaultProps = {
-    limit: 4
-};
-
-SuggestedCategories.propTypes = {
-    categories: arrayOf(
-        shape({
-            label: string.isRequired,
-            value: string.isRequired
-        })
-    ).isRequired,
-    classes: shape({
-        item: string,
-        root: string
-    }),
-    limit: number.isRequired,
-    onNavigate: func,
-    value: string
-};
+import React from 'react';
+import { arrayOf, func, number, shape, string } from 'prop-types';
+
+import { useStyle } from '@magento/venia-ui/lib/classify';
+import SuggestedCategory from './suggestedCategory';
+import defaultClasses from './suggestedCategories.module.css';
+
+const SuggestedCategories = props => {
+    const { categories, limit, onNavigate, value } = props;
+    const classes = useStyle(defaultClasses, props.classes);
+
+    const items = categories
+        .slice(0, limit)
+        .map(({ label, value: categoryId }) => (
+            <li key={categoryId} className={classes.item}>
+                <SuggestedCategory
+                    categoryId={categoryId}
+                    label={label}
+                    onNavigate={onNavigate}
+                    value={value}
+                />
+            </li>
+        ));
+
+    return <ul className={classes.root}>{items}</ul>;
+};
+
+export default SuggestedCategories;
+
+SuggestedCategories.defaultProps = {
+    limit: 4
+};
+
+SuggestedCategories.propTypes = {
+    categories: arrayOf(
+        shape({
+            label: string.isRequired,
+            value: string.isRequired
+        })
+    ).isRequired,
+    classes: shape({
+        item: string,
+        root: string
+    }),
+    limit: number.isRequired,
+    onNavigate: func,
+    value: string
+};

package/src/overwrites/venia-ui/lib/components/SearchBar/suggestedCategories.module.css

@@ -1,13 +1,13 @@
-.root {
-    composes: border-t from global;
-    composes: border-solid from global;
-    composes: border-subtle from global;
-    composes: gap-3 from global;
-    composes: grid from global;
-    composes: pt-3 from global;
-}
-
-/* TODO @TW: cannot compose */
-.root:empty {
-    display: none;
-}
+.root {
+    composes: border-t from global;
+    composes: border-solid from global;
+    composes: border-subtle from global;
+    composes: gap-3 from global;
+    composes: grid from global;
+    composes: pt-3 from global;
+}
+
+/* TODO @TW: cannot compose */
+.root:empty {
+    display: none;
+}

package/src/overwrites/venia-ui/lib/components/SearchBar/suggestedCategory.js

@@ -1,49 +1,49 @@
-import React from 'react';
-import { FormattedMessage } from 'react-intl';
-import { func, shape, string } from 'prop-types';
-import { Link } from 'react-router-dom';
-import { useSuggestedCategory } from '@magento/peregrine/lib/talons/SearchBar';
-
-import { useStyle } from '@magento/venia-ui/lib/classify';
-import defaultClasses from './suggestedCategory.module.css';
-
-const SuggestedCategory = props => {
-    const { categoryId, label, onNavigate, value } = props;
-    const talonProps = useSuggestedCategory({
-        categoryId,
-        label,
-        onNavigate,
-        searchValue: value
-    });
-    const { destination, handleClick } = talonProps;
-    const classes = useStyle(defaultClasses, props.classes);
-
-    return (
-        <Link className={classes.root} to={destination} onClick={handleClick}>
-            <strong className={classes.value}>{value}</strong>
-            <span className={classes.label}>
-                <FormattedMessage
-                    id={'searchBar.label'}
-                    defaultMessage={' in {label}'}
-                    values={{
-                        label
-                    }}
-                />
-            </span>
-        </Link>
-    );
-};
-
-export default SuggestedCategory;
-
-SuggestedCategory.propTypes = {
-    categoryId: string,
-    classes: shape({
-        label: string,
-        root: string,
-        value: string
-    }),
-    label: string.isRequired,
-    onNavigate: func,
-    value: string.isRequired
-};
+import React from 'react';
+import { FormattedMessage } from 'react-intl';
+import { func, shape, string } from 'prop-types';
+import { Link } from 'react-router-dom';
+import { useSuggestedCategory } from '@magento/peregrine/lib/talons/SearchBar';
+
+import { useStyle } from '@magento/venia-ui/lib/classify';
+import defaultClasses from './suggestedCategory.module.css';
+
+const SuggestedCategory = props => {
+    const { categoryId, label, onNavigate, value } = props;
+    const talonProps = useSuggestedCategory({
+        categoryId,
+        label,
+        onNavigate,
+        searchValue: value
+    });
+    const { destination, handleClick } = talonProps;
+    const classes = useStyle(defaultClasses, props.classes);
+
+    return (
+        <Link className={classes.root} to={destination} onClick={handleClick}>
+            <strong className={classes.value}>{value}</strong>
+            <span className={classes.label}>
+                <FormattedMessage
+                    id={'searchBar.label'}
+                    defaultMessage={' in {label}'}
+                    values={{
+                        label
+                    }}
+                />
+            </span>
+        </Link>
+    );
+};
+
+export default SuggestedCategory;
+
+SuggestedCategory.propTypes = {
+    categoryId: string,
+    classes: shape({
+        label: string,
+        root: string,
+        value: string
+    }),
+    label: string.isRequired,
+    onNavigate: func,
+    value: string.isRequired
+};

package/src/overwrites/venia-ui/lib/components/SearchBar/suggestedProduct.js

@@ -1,97 +1,97 @@
-import React from 'react';
-import { func, number, shape, string } from 'prop-types';
-import { Link } from 'react-router-dom';
-import Price from '@magento/venia-ui/lib/components/Price';
-import { useStyle } from '@magento/venia-ui/lib/classify';
-
-import Image from '@magento/venia-ui/lib/components/Image';
-import defaultClasses from './suggestedProduct.module.css';
-import { useSuggestedProduct } from '@magento/peregrine/lib/talons/SearchBar';
-
-const IMAGE_WIDTH = 60;
-
-const SuggestedProduct = props => {
-    const classes = useStyle(defaultClasses, props.classes);
-    const {
-        url_key,
-        small_image,
-        name,
-        onNavigate,
-        price,
-        price_range,
-        url_suffix,
-        sku
-    } = props;
-
-    const talonProps = useSuggestedProduct({
-        name,
-        price,
-        price_range,
-        onNavigate,
-        url_key,
-        url_suffix,
-        sku
-    });
-
-    const { priceProps, handleClick, uri } = talonProps;
-
-    return (
-        <Link
-            className={classes.root}
-            to={uri}
-            onClick={handleClick}
-            data-cy="SuggestedProduct-root"
-        >
-            <Image
-                alt={name}
-                classes={{ image: classes.thumbnail, root: classes.image }}
-                resource={small_image}
-                width={IMAGE_WIDTH}
-                data-cy="SuggestedProduct-image"
-            />
-            <span className={classes.name}>{name}</span>
-            <span data-cy="SuggestedProduct-price" className={classes.price}>
-                <Price {...priceProps} />
-            </span>
-        </Link>
-    );
-};
-
-SuggestedProduct.propTypes = {
-    url_key: string.isRequired,
-    small_image: string.isRequired,
-    name: string.isRequired,
-    onNavigate: func,
-    price: shape({
-        regularPrice: shape({
-            amount: shape({
-                currency: string,
-                value: number
-            })
-        })
-    }).isRequired,
-    price_range: shape({
-        maximum_price: shape({
-            final_price: shape({
-                currency: string,
-                value: number
-            }),
-            regular_price: shape({
-                currency: string,
-                value: number
-            }),
-            discount: shape({
-                amount_off: number
-            })
-        })
-    }),
-    classes: shape({
-        root: string,
-        image: string,
-        name: string,
-        price: string,
-        thumbnail: string
-    })
-};
-
-export default SuggestedProduct;
+import React from 'react';
+import { func, number, shape, string } from 'prop-types';
+import { Link } from 'react-router-dom';
+import Price from '@magento/venia-ui/lib/components/Price';
+import { useStyle } from '@magento/venia-ui/lib/classify';
+
+import Image from '@magento/venia-ui/lib/components/Image';
+import defaultClasses from './suggestedProduct.module.css';
+import { useSuggestedProduct } from '@magento/peregrine/lib/talons/SearchBar';
+
+const IMAGE_WIDTH = 60;
+
+const SuggestedProduct = props => {
+    const classes = useStyle(defaultClasses, props.classes);
+    const {
+        url_key,
+        small_image,
+        name,
+        onNavigate,
+        price,
+        price_range,
+        url_suffix,
+        sku
+    } = props;
+
+    const talonProps = useSuggestedProduct({
+        name,
+        price,
+        price_range,
+        onNavigate,
+        url_key,
+        url_suffix,
+        sku
+    });
+
+    const { priceProps, handleClick, uri } = talonProps;
+
+    return (
+        <Link
+            className={classes.root}
+            to={uri}
+            onClick={handleClick}
+            data-cy="SuggestedProduct-root"
+        >
+            <Image
+                alt={name}
+                classes={{ image: classes.thumbnail, root: classes.image }}
+                resource={small_image}
+                width={IMAGE_WIDTH}
+                data-cy="SuggestedProduct-image"
+            />
+            <span className={classes.name}>{name}</span>
+            <span data-cy="SuggestedProduct-price" className={classes.price}>
+                <Price {...priceProps} />
+            </span>
+        </Link>
+    );
+};
+
+SuggestedProduct.propTypes = {
+    url_key: string.isRequired,
+    small_image: string.isRequired,
+    name: string.isRequired,
+    onNavigate: func,
+    price: shape({
+        regularPrice: shape({
+            amount: shape({
+                currency: string,
+                value: number
+            })
+        })
+    }).isRequired,
+    price_range: shape({
+        maximum_price: shape({
+            final_price: shape({
+                currency: string,
+                value: number
+            }),
+            regular_price: shape({
+                currency: string,
+                value: number
+            }),
+            discount: shape({
+                amount_off: number
+            })
+        })
+    }),
+    classes: shape({
+        root: string,
+        image: string,
+        name: string,
+        price: string,
+        thumbnail: string
+    })
+};
+
+export default SuggestedProduct;

package/src/overwrites/venia-ui/lib/components/SearchBar/suggestedProduct.module.css

@@ -1,24 +1,24 @@
-.root {
-    composes: gap-xs from global;
-    composes: grid from global;
-    composes: grid-flow-col from global;
-    composes: items-center from global;
-    grid-template-columns: 60px 1fr;
-}
-
-.image {
-    composes: items-center from global;
-    composes: inline-flex from global;
-    composes: justify-center from global;
-}
-
-.thumbnail {
-    composes: h-[75px] from global;
-    composes: max-h-[75px] from global;
-    composes: object-contain from global;
-    composes: object-center from global;
-}
-
-.name {
-    composes: break-words from global;
-}
+.root {
+    composes: gap-xs from global;
+    composes: grid from global;
+    composes: grid-flow-col from global;
+    composes: items-center from global;
+    grid-template-columns: 60px 1fr;
+}
+
+.image {
+    composes: items-center from global;
+    composes: inline-flex from global;
+    composes: justify-center from global;
+}
+
+.thumbnail {
+    composes: h-[75px] from global;
+    composes: max-h-[75px] from global;
+    composes: object-contain from global;
+    composes: object-center from global;
+}
+
+.name {
+    composes: break-words from global;
+}