@soppiya/app-bridge 1.1.6 → 1.1.8

package/dist/components/collections-pciker/api/query.d.ts

@@ -1,5 +1,8 @@
 export declare const collectionQuery: import("@graphql-typed-document-node/core").TypedDocumentNode<import("../../../shared/graphql/graphql").CollectionsQuery, import("../../../shared/graphql/graphql").Exact<{
-    skip?: import("../../../shared/graphql/graphql").InputMaybe<import("../../../shared/graphql/graphql").Scalars["Int"]["input"]>;
-    filterKeys?: import("../../../shared/graphql/graphql").InputMaybe<import("../../../shared/graphql/graphql").CollectionFilterKeys>;
+    after?: import("../../../shared/graphql/graphql").InputMaybe<import("../../../shared/graphql/graphql").Scalars["ID"]["input"]>;
+    before?: import("../../../shared/graphql/graphql").InputMaybe<import("../../../shared/graphql/graphql").Scalars["ID"]["input"]>;
+    first?: import("../../../shared/graphql/graphql").InputMaybe<import("../../../shared/graphql/graphql").Scalars["Int"]["input"]>;
+    last?: import("../../../shared/graphql/graphql").InputMaybe<import("../../../shared/graphql/graphql").Scalars["Int"]["input"]>;
     query?: import("../../../shared/graphql/graphql").InputMaybe<import("../../../shared/graphql/graphql").Scalars["String"]["input"]>;
+    filterKeys?: import("../../../shared/graphql/graphql").InputMaybe<import("../../../shared/graphql/graphql").CollectionFilterKeys>;
 }>>;

package/dist/components/collections-pciker/api/query.js

@@ -1,6 +1,12 @@
 import { graphql } from "../../../shared/graphql/index.js";
-const collectionQuery = graphql(`query Collections($skip: Int, $filterKeys: CollectionFilterKeys, $query: String) {
-  collections(skip: $skip, filterKeys: $filterKeys, query: $query) {
+const collectionQuery = graphql(`query Collections($after: ID, $before: ID, $first: Int, $last: Int, $query: String, $filterKeys: CollectionFilterKeys) {
+  collections(after: $after, before: $before, first: $first, last: $last, query: $query, filterKeys: $filterKeys) {
+    pageInfo {
+      endCursor
+      hasNextPage
+      hasPreviousPage
+      startCursor
+    }
     edges {
       node {
         _id
@@ -11,12 +17,6 @@ const collectionQuery = graphql(`query Collections($skip: Int, $filterKeys: Coll
         }
       }
     }
-    pageInfo {
-      endCursor
-      hasNextPage
-      hasPreviousPage
-      startCursor
-    }
   }
 }`);
 export { collectionQuery };

package/dist/components/collections-pciker/model/useCollections.d.ts

@@ -1,6 +1,6 @@
 import { CollectionFilterKeys } from "../../../shared/graphql/graphql";
 type Props = {
-    skip?: number;
+    skip?: boolean;
     query?: string | null;
     filterKeys?: CollectionFilterKeys;
 };

package/dist/components/collections-pciker/model/useCollections.js

@@ -3,10 +3,10 @@ import { collectionQuery } from "../api/query.js";
 const useCollections = (props = {})=>{
     const { skip, query, filterKeys } = props;
     const { data, loading: isLoadingCollections, error, fetchMore } = useQuery(collectionQuery, {
+        skip,
         variables: {
             filterKeys,
-            query,
-            skip
+            query
         }
     });
     const collections = data?.collections?.edges?.map((edge)=>edge?.node)?.filter((node)=>null != node);
@@ -16,8 +16,7 @@ const useCollections = (props = {})=>{
         fetchMore({
             variables: {
                 filterKeys,
-                query,
-                skip
+                query
             }
         });
     };

package/dist/components/country-picker/api/query.d.ts

@@ -0,0 +1,8 @@
+export declare const countryQuery: import("@graphql-typed-document-node/core").TypedDocumentNode<import("../../../shared/graphql/graphql")._CountriesQuery, import("../../../shared/graphql/graphql").Exact<{
+    after?: import("../../../shared/graphql/graphql").InputMaybe<import("../../../shared/graphql/graphql").Scalars["ID"]["input"]>;
+    before?: import("../../../shared/graphql/graphql").InputMaybe<import("../../../shared/graphql/graphql").Scalars["ID"]["input"]>;
+    first?: import("../../../shared/graphql/graphql").InputMaybe<import("../../../shared/graphql/graphql").Scalars["Int"]["input"]>;
+    last?: import("../../../shared/graphql/graphql").InputMaybe<import("../../../shared/graphql/graphql").Scalars["Int"]["input"]>;
+    query?: import("../../../shared/graphql/graphql").InputMaybe<import("../../../shared/graphql/graphql").Scalars["String"]["input"]>;
+    filterKeys?: import("../../../shared/graphql/graphql").InputMaybe<import("../../../shared/graphql/graphql")._CountryFilterKeys>;
+}>>;

package/dist/components/country-picker/api/query.js

@@ -0,0 +1,19 @@
+import { graphql } from "../../../shared/graphql/index.js";
+const countryQuery = graphql(`query _countries($after: ID, $before: ID, $first: Int, $last: Int, $query: String, $filterKeys: _CountryFilterKeys) {
+  _countries(after: $after, before: $before, first: $first, last: $last, query: $query, filterKeys: $filterKeys) {
+    pageInfo {
+      endCursor
+      hasNextPage
+      hasPreviousPage
+      startCursor
+    }
+    edges {
+      node {
+        _id
+        name
+        flag
+      }
+    }
+  }
+}`);
+export { countryQuery };

package/dist/components/country-picker/index.d.ts

@@ -0,0 +1 @@
+export { default as CountryPicker } from "./ui/CountryPicker";

package/dist/components/country-picker/index.js

@@ -0,0 +1,2 @@
+import CountryPicker from "./ui/CountryPicker.js";
+export { CountryPicker };

package/dist/components/country-picker/model/useContry.d.ts

@@ -0,0 +1,26 @@
+import { _CountryFilterKeys } from "../../../shared/graphql/graphql";
+type Props = {
+    skip?: boolean;
+    first?: number;
+    query?: string | null;
+    filterKeys?: _CountryFilterKeys | null;
+};
+export declare const useCountry: (props?: Props) => {
+    countries: {
+        __typename: "_Country";
+        _id?: string | null;
+        name?: string | null;
+        flag?: string | null;
+    }[];
+    pageInfo: {
+        __typename: "PageInfo";
+        endCursor?: string | null;
+        hasNextPage?: boolean | null;
+        hasPreviousPage?: boolean | null;
+        startCursor?: string | null;
+    } | null | undefined;
+    isLoadingCountry: boolean;
+    error: import("@apollo/client").ErrorLike | undefined;
+    fetchMoreCountries: () => void;
+};
+export {};

package/dist/components/country-picker/model/useContry.js

@@ -0,0 +1,48 @@
+import { useQuery } from "@apollo/client/react";
+import { useRef } from "react";
+import { countryQuery } from "../api/query.js";
+const useCountry = (props = {})=>{
+    const { skip, first, query, filterKeys } = props;
+    const refArray = useRef([]);
+    const { data, loading: isLoadingCountry, error, fetchMore } = useQuery(countryQuery, {
+        skip,
+        variables: {
+            first,
+            query,
+            filterKeys
+        }
+    });
+    const countries = data?._countries?.edges?.map((edge)=>edge?.node).filter((node)=>null != node) ?? refArray.current;
+    const pageInfo = data?._countries?.pageInfo;
+    const fetchMoreCountries = ()=>{
+        if (!pageInfo?.hasNextPage) return;
+        fetchMore({
+            variables: {
+                first,
+                query,
+                after: pageInfo.endCursor,
+                filterKeys
+            },
+            updateQuery (prev, { fetchMoreResult }) {
+                if (!fetchMoreResult._countries?.edges || !prev._countries?.edges) return prev;
+                return {
+                    _countries: {
+                        ...fetchMoreResult._countries,
+                        edges: [
+                            ...prev._countries.edges,
+                            ...fetchMoreResult._countries.edges
+                        ]
+                    }
+                };
+            }
+        });
+    };
+    return {
+        countries,
+        pageInfo,
+        isLoadingCountry,
+        error,
+        fetchMoreCountries
+    };
+};
+export { useCountry };

package/dist/components/country-picker/ui/CountryPicker.d.ts

@@ -0,0 +1,9 @@
+type Props = {
+    title?: string;
+    initialIds?: string[];
+    limit?: number;
+    onClose?: () => void;
+    onOk?: (countries: string[]) => void;
+};
+declare const CountryPicker: ({ title, initialIds, limit, onClose, onOk }: Props) => import("react/jsx-runtime").JSX.Element;
+export default CountryPicker;

package/dist/components/country-picker/ui/CountryPicker.js

@@ -0,0 +1,114 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { InfinityScroll } from "../../infinity-scroll/index.js";
+import { useFilterQuery } from "../../../shared/lib/index.js";
+import { BlockStack, Box, Button, Checkbox, Image, InlineStack, Input, Modal, Spinner, Text } from "@soppiya/elementus";
+import classnames from "classnames";
+import lodash from "lodash";
+import { useState } from "react";
+import { useCountry } from "../model/useContry.js";
+const CountryPicker = ({ title = "Countries", initialIds = [], limit = 1 / 0, onClose, onOk })=>{
+    const [selectedCustomer, setSelectedCustomer] = useState(initialIds);
+    const { query, debounceQuery, onChangeQuery } = useFilterQuery();
+    const { countries, pageInfo, isLoadingCountry, fetchMoreCountries } = useCountry({
+        first: 20,
+        query: debounceQuery
+    });
+    const isReached = limit !== 1 / 0 && selectedCustomer.length >= limit;
+    const isDisabled = limit !== 1 / 0 && selectedCustomer.length > limit;
+    const handleSelectCustomer = (customerId)=>{
+        if (selectedCustomer.includes(customerId)) return void setSelectedCustomer((prev)=>prev.filter((id)=>customerId !== id));
+        if (isReached) return;
+        setSelectedCustomer((prev)=>[
+                ...prev,
+                customerId
+            ]);
+    };
+    const handleOk = ()=>{
+        if (lodash.isFunction(onOk)) onOk(selectedCustomer);
+    };
+    const buttonsJSX = /*#__PURE__*/ jsx(InlineStack, {
+        gap: 50,
+        justifyContent: "end",
+        children: /*#__PURE__*/ jsx(Button, {
+            disabled: lodash.isEmpty(selectedCustomer) || isDisabled,
+            onClick: handleOk,
+            children: "Add"
+        })
+    });
+    return /*#__PURE__*/ jsx(Modal, {
+        open: true,
+        title: title,
+        bodyPadding: 0,
+        buttons: buttonsJSX,
+        onClose: onClose,
+        children: /*#__PURE__*/ jsxs(BlockStack, {
+            children: [
+                /*#__PURE__*/ jsx(Box, {
+                    padding: 60,
+                    children: /*#__PURE__*/ jsx(Input, {
+                        size: "sm",
+                        type: "search",
+                        value: query ?? "",
+                        onChange: (event)=>onChangeQuery(event.target.value)
+                    })
+                }),
+                isLoadingCountry ? /*#__PURE__*/ jsx(InlineStack, {
+                    justifyContent: "center",
+                    padding: 80,
+                    children: /*#__PURE__*/ jsx(Spinner, {
+                        size: "md"
+                    })
+                }) : /*#__PURE__*/ jsxs(BlockStack, {
+                    children: [
+                        countries.map((country)=>/*#__PURE__*/ jsx(InlineStack, {
+                                stack: "full",
+                                className: classnames('lg:cursor-pointer border-t border-t-[#ebebeb]!', {
+                                    'bg-[#f1f1f1ab] cursor-default!': !selectedCustomer.includes(country._id) && isReached
+                                }),
+                                gapX: 60,
+                                padding: 60,
+                                onClick: ()=>handleSelectCustomer(String(country._id)),
+                                children: /*#__PURE__*/ jsx(BlockStack, {
+                                    children: /*#__PURE__*/ jsxs(InlineStack, {
+                                        alignItems: "center",
+                                        gapX: 70,
+                                        children: [
+                                            /*#__PURE__*/ jsx(Box, {
+                                                children: /*#__PURE__*/ jsx(Checkbox, {
+                                                    disabled: !selectedCustomer.includes(country._id) && isReached,
+                                                    checked: selectedCustomer.includes(String(country._id)),
+                                                    onChange: ()=>{}
+                                                })
+                                            }),
+                                            /*#__PURE__*/ jsxs(InlineStack, {
+                                                gapX: 50,
+                                                children: [
+                                                    /*#__PURE__*/ jsx(Box, {
+                                                        children: /*#__PURE__*/ jsx(Image, {
+                                                            url: country.flag || "",
+                                                            className: "w-[30px]! h-5!"
+                                                        })
+                                                    }),
+                                                    /*#__PURE__*/ jsx(Text, {
+                                                        size: "md",
+                                                        weight: "medium",
+                                                        className: "capitalize!",
+                                                        children: country.name
+                                                    })
+                                                ]
+                                            })
+                                        ]
+                                    })
+                                })
+                            })),
+                        pageInfo?.hasNextPage && /*#__PURE__*/ jsx(InfinityScroll, {
+                            onFetch: fetchMoreCountries
+                        })
+                    ]
+                })
+            ]
+        })
+    });
+};
+const ui_CountryPicker = CountryPicker;
+export { ui_CountryPicker as default };

package/dist/components/country-picker/ui/CountryPicker.stories.d.ts

@@ -0,0 +1,12 @@
+declare const meta: {
+    title: string;
+    component: ({ title, initialIds, limit, onClose, onOk }: {
+        title?: string;
+        initialIds?: string[];
+        limit?: number;
+        onClose?: () => void;
+        onOk?: (countries: string[]) => void;
+    }) => import("react/jsx-runtime").JSX.Element;
+};
+export default meta;
+export declare const Default: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/country-picker/ui/CountryPicker.stories.js

@@ -0,0 +1,11 @@
+import { jsx } from "react/jsx-runtime";
+import CountryPicker from "./CountryPicker.js";
+const meta = {
+    title: "Example/CountryPicker",
+    component: CountryPicker
+};
+const CountryPicker_stories = meta;
+const Default = ()=>/*#__PURE__*/ jsx(CountryPicker, {
+        title: "Select Countries"
+    });
+export { Default, CountryPicker_stories as default };

package/dist/components/customers-picker/api/query.d.ts

@@ -0,0 +1,8 @@
+export declare const customersQuery: import("@graphql-typed-document-node/core").TypedDocumentNode<import("../../../shared/graphql/graphql").CustomersQuery, import("../../../shared/graphql/graphql").Exact<{
+    after?: import("../../../shared/graphql/graphql").InputMaybe<import("../../../shared/graphql/graphql").Scalars["ID"]["input"]>;
+    before?: import("../../../shared/graphql/graphql").InputMaybe<import("../../../shared/graphql/graphql").Scalars["ID"]["input"]>;
+    first?: import("../../../shared/graphql/graphql").InputMaybe<import("../../../shared/graphql/graphql").Scalars["Int"]["input"]>;
+    last?: import("../../../shared/graphql/graphql").InputMaybe<import("../../../shared/graphql/graphql").Scalars["Int"]["input"]>;
+    query?: import("../../../shared/graphql/graphql").InputMaybe<import("../../../shared/graphql/graphql").Scalars["String"]["input"]>;
+    filterKeys?: import("../../../shared/graphql/graphql").InputMaybe<import("../../../shared/graphql/graphql").CustomerFilterKeys>;
+}>>;

package/dist/components/customers-picker/api/query.js

@@ -0,0 +1,22 @@
+import { graphql } from "../../../shared/graphql/index.js";
+const customersQuery = graphql(`query Customers($after: ID, $before: ID, $first: Int, $last: Int, $query: String, $filterKeys: CustomerFilterKeys) {
+  customers(after: $after, before: $before, first: $first, last: $last, query: $query, filterKeys: $filterKeys) {
+    pageInfo {
+      endCursor
+      hasNextPage
+      hasPreviousPage
+      startCursor
+    }
+    edges {
+      node {
+        _id
+        first_name
+        last_name
+        email {
+          address
+        }
+      }
+    }
+  }
+}`);
+export { customersQuery };

package/dist/components/customers-picker/index.d.ts

@@ -0,0 +1 @@
+export { default as CustomersPicker } from "./ui/CustomersPicker";

package/dist/components/customers-picker/index.js

@@ -0,0 +1,2 @@
+import CustomersPicker from "./ui/CustomersPicker.js";
+export { CustomersPicker };

package/dist/components/customers-picker/model/useCustomers.d.ts

@@ -0,0 +1,30 @@
+import { CustomerFilterKeys } from "../../../shared/graphql/graphql";
+type Props = {
+    skip?: boolean;
+    first?: number;
+    query?: string | null;
+    filterKeys?: CustomerFilterKeys | null;
+};
+export declare const useCustomers: (props?: Props) => {
+    customers: {
+        __typename: "Customer";
+        _id?: string | null;
+        first_name?: string | null;
+        last_name?: string | null;
+        email?: {
+            __typename: "CustomerEmail";
+            address?: string | null;
+        } | null;
+    }[];
+    pageInfo: {
+        __typename: "PageInfo";
+        endCursor?: string | null;
+        hasNextPage?: boolean | null;
+        hasPreviousPage?: boolean | null;
+        startCursor?: string | null;
+    } | null | undefined;
+    isLoadingCustomers: boolean;
+    error: import("@apollo/client").ErrorLike | undefined;
+    fetchMoreCustomers: () => void;
+};
+export {};

package/dist/components/customers-picker/model/useCustomers.js

@@ -0,0 +1,48 @@
+import { useQuery } from "@apollo/client/react";
+import { useRef } from "react";
+import { customersQuery } from "../api/query.js";
+const useCustomers = (props = {})=>{
+    const { skip, first, query, filterKeys } = props;
+    const refArray = useRef([]);
+    const { data, loading: isLoadingCustomers, error, fetchMore } = useQuery(customersQuery, {
+        skip,
+        variables: {
+            first,
+            query,
+            filterKeys
+        }
+    });
+    const pageInfo = data?.customers?.pageInfo;
+    const customers = data?.customers?.edges?.map((edge)=>edge?.node).filter((node)=>null != node) ?? refArray.current;
+    const fetchMoreCustomers = ()=>{
+        if (!pageInfo?.hasNextPage) return;
+        fetchMore({
+            variables: {
+                first,
+                query,
+                after: pageInfo.endCursor,
+                filterKeys
+            },
+            updateQuery (prev, { fetchMoreResult }) {
+                if (!fetchMoreResult.customers?.edges || !prev.customers?.edges) return prev;
+                return {
+                    customers: {
+                        ...fetchMoreResult.customers,
+                        edges: [
+                            ...prev.customers.edges,
+                            ...fetchMoreResult.customers.edges
+                        ]
+                    }
+                };
+            }
+        });
+    };
+    return {
+        customers,
+        pageInfo,
+        isLoadingCustomers,
+        error,
+        fetchMoreCustomers
+    };
+};
+export { useCustomers };

package/dist/components/customers-picker/ui/CustomersPicker.d.ts

@@ -0,0 +1,9 @@
+type Props = {
+    title?: string;
+    initialIds?: string[];
+    limit?: number;
+    onClose?: () => void;
+    onOk?: (customers: string[]) => void;
+};
+declare const CustomersPicker: ({ title, initialIds, limit, onClose, onOk }: Props) => import("react/jsx-runtime").JSX.Element;
+export default CustomersPicker;

package/dist/components/customers-picker/ui/CustomersPicker.js

@@ -0,0 +1,113 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { InfinityScroll } from "../../infinity-scroll/index.js";
+import { useFilterQuery } from "../../../shared/lib/index.js";
+import { BlockStack, Box, Button, Checkbox, InlineStack, Input, Modal, Spinner, Text } from "@soppiya/elementus";
+import classnames from "classnames";
+import lodash from "lodash";
+import { useState } from "react";
+import { useCustomers } from "../model/useCustomers.js";
+const CustomersPicker = ({ title = "Customers", initialIds = [], limit = 1 / 0, onClose, onOk })=>{
+    const [selectedCustomer, setSelectedCustomer] = useState(initialIds);
+    const { query, debounceQuery, onChangeQuery } = useFilterQuery();
+    const { customers, pageInfo, isLoadingCustomers, fetchMoreCustomers } = useCustomers({
+        first: 20,
+        query: debounceQuery
+    });
+    const isReached = limit !== 1 / 0 && selectedCustomer.length >= limit;
+    const isDisabled = limit !== 1 / 0 && selectedCustomer.length > limit;
+    const handleSelectCustomer = (customerId)=>{
+        if (selectedCustomer.includes(customerId)) return void setSelectedCustomer((prev)=>prev.filter((id)=>customerId !== id));
+        if (isReached) return;
+        setSelectedCustomer((prev)=>[
+                ...prev,
+                customerId
+            ]);
+    };
+    const handleOk = ()=>{
+        if (lodash.isFunction(onOk)) onOk(selectedCustomer);
+    };
+    const buttonsJSX = /*#__PURE__*/ jsx(InlineStack, {
+        gap: 50,
+        justifyContent: "end",
+        children: /*#__PURE__*/ jsx(Button, {
+            disabled: lodash.isEmpty(selectedCustomer) || isDisabled,
+            onClick: handleOk,
+            children: "Add"
+        })
+    });
+    return /*#__PURE__*/ jsx(Modal, {
+        open: true,
+        title: title,
+        bodyPadding: 0,
+        buttons: buttonsJSX,
+        onClose: onClose,
+        children: /*#__PURE__*/ jsxs(BlockStack, {
+            children: [
+                /*#__PURE__*/ jsx(Box, {
+                    padding: 60,
+                    children: /*#__PURE__*/ jsx(Input, {
+                        size: "sm",
+                        type: "search",
+                        value: query ?? "",
+                        onChange: (event)=>onChangeQuery(event.target.value)
+                    })
+                }),
+                isLoadingCustomers ? /*#__PURE__*/ jsx(InlineStack, {
+                    justifyContent: "center",
+                    padding: 80,
+                    children: /*#__PURE__*/ jsx(Spinner, {
+                        size: "md"
+                    })
+                }) : /*#__PURE__*/ jsxs(BlockStack, {
+                    children: [
+                        customers.map((customer)=>/*#__PURE__*/ jsx(InlineStack, {
+                                stack: "full",
+                                className: classnames('lg:cursor-pointer border-t border-t-[#ebebeb]!', {
+                                    'bg-[#f1f1f1ab] cursor-default!': !selectedCustomer.includes(customer._id) && isReached
+                                }),
+                                gapX: 60,
+                                padding: 60,
+                                onClick: ()=>handleSelectCustomer(String(customer._id)),
+                                children: /*#__PURE__*/ jsx(BlockStack, {
+                                    children: /*#__PURE__*/ jsxs(InlineStack, {
+                                        alignItems: "center",
+                                        gapX: 70,
+                                        children: [
+                                            /*#__PURE__*/ jsx(Box, {
+                                                children: /*#__PURE__*/ jsx(Checkbox, {
+                                                    disabled: !selectedCustomer.includes(customer._id) && isReached,
+                                                    checked: selectedCustomer.includes(String(customer._id)),
+                                                    onChange: ()=>{}
+                                                })
+                                            }),
+                                            /*#__PURE__*/ jsxs(BlockStack, {
+                                                children: [
+                                                    /*#__PURE__*/ jsx(Text, {
+                                                        size: "md",
+                                                        weight: "medium",
+                                                        className: "capitalize!",
+                                                        children: customer.first_name + " " + customer.last_name
+                                                    }),
+                                                    /*#__PURE__*/ jsx(Text, {
+                                                        size: "sm",
+                                                        color: "secondary",
+                                                        truncate: "truncate-1",
+                                                        children: customer.email?.address
+                                                    })
+                                                ]
+                                            })
+                                        ]
+                                    })
+                                })
+                            })),
+                        pageInfo?.hasNextPage && /*#__PURE__*/ jsx(InfinityScroll, {
+                            onFetch: fetchMoreCustomers
+                        })
+                    ]
+                })
+            ]
+        })
+    });
+};
+const ui_CustomersPicker = CustomersPicker;
+export { ui_CustomersPicker as default };

package/dist/components/customers-picker/ui/CustomersPicker.stories.d.ts

@@ -0,0 +1,12 @@
+declare const meta: {
+    title: string;
+    component: ({ title, initialIds, limit, onClose, onOk }: {
+        title?: string;
+        initialIds?: string[];
+        limit?: number;
+        onClose?: () => void;
+        onOk?: (customers: string[]) => void;
+    }) => import("react/jsx-runtime").JSX.Element;
+};
+export default meta;
+export declare const Default: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/customers-picker/ui/CustomersPicker.stories.js

@@ -0,0 +1,11 @@
+import { jsx } from "react/jsx-runtime";
+import CustomersPicker from "./CustomersPicker.js";
+const meta = {
+    title: "Example/CustomersPicker",
+    component: CustomersPicker
+};
+const CustomersPicker_stories = meta;
+const Default = ()=>/*#__PURE__*/ jsx(CustomersPicker, {
+        title: "Select Customer"
+    });
+export { Default, CustomersPicker_stories as default };

package/dist/components/index.d.ts

@@ -1,6 +1,8 @@
 export * from "./articles-picker";
 export * from "./blogs-picker";
 export * from "./collections-pciker";
+export * from "./country-picker";
+export * from "./customers-picker";
 export * from "./link-list-picker";
 export * from "./media";
 export * from "./meta-data";
@@ -9,4 +11,5 @@ export * from "./metaobjects-picker";
 export * from "./pages-picker";
 export * from "./products-picker";
 export * from "./savebar";
+export * from "./segments-picker";
 export * from "./variants-picker";

package/dist/components/index.js

@@ -1,6 +1,8 @@
 export * from "./articles-picker/index.js";
 export * from "./blogs-picker/index.js";
 export * from "./collections-pciker/index.js";
+export * from "./country-picker/index.js";
+export * from "./customers-picker/index.js";
 export * from "./link-list-picker/index.js";
 export * from "./media/index.js";
 export * from "./meta-data/index.js";
@@ -9,4 +11,5 @@ export * from "./metaobjects-picker/index.js";
 export * from "./pages-picker/index.js";
 export * from "./products-picker/index.js";
 export * from "./savebar/index.js";
+export * from "./segments-picker/index.js";
 export * from "./variants-picker/index.js";

package/dist/components/media/Media.js

@@ -262,7 +262,7 @@ const Media_Media = ({ title = "Media", types = [
                                             children: /*#__PURE__*/ jsx(Button, {
                                                 variant: "outline",
                                                 color: "secondary",
-                                                className: "!px-[8px]",
+                                                className: "px-2!",
                                                 disabled: !isMediaSelected,
                                                 loading: isDeletingMedias,
                                                 onClick: handleDeleteMedias,