@soppiya/app-bridge 1.0.7 → 1.0.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.
- package/dist/components/articles-picker/api/query.d.ts +8 -0
- package/dist/components/articles-picker/api/query.js +22 -0
- package/dist/components/articles-picker/model/useArticles.d.ts +30 -0
- package/dist/components/articles-picker/model/useArticles.js +46 -0
- package/dist/components/articles-picker/ui/ArticlesPicker.d.ts +9 -0
- package/dist/components/articles-picker/ui/ArticlesPicker.js +107 -0
- package/dist/components/articles-picker/ui/ProductPicker.stories.d.ts +17 -0
- package/dist/components/articles-picker/ui/ProductPicker.stories.js +13 -0
- package/dist/components/blogs-picker/api/query.d.ts +8 -0
- package/dist/components/blogs-picker/api/query.js +22 -0
- package/dist/components/blogs-picker/model/useBlogs.d.ts +30 -0
- package/dist/components/blogs-picker/model/useBlogs.js +46 -0
- package/dist/components/blogs-picker/ui/BlogsPicker.d.ts +9 -0
- package/dist/components/blogs-picker/ui/BlogsPicker.js +107 -0
- package/dist/components/blogs-picker/ui/BlogsPicker.stories.d.ts +17 -0
- package/dist/components/blogs-picker/ui/BlogsPicker.stories.js +13 -0
- package/dist/components/collections-pciker/api/query.d.ts +5 -0
- package/dist/components/collections-pciker/api/query.js +22 -0
- package/dist/components/collections-pciker/model/useCollections.d.ts +29 -0
- package/dist/components/collections-pciker/model/useCollections.js +32 -0
- package/dist/components/collections-pciker/ui/CollectionPicker.d.ts +9 -0
- package/dist/components/collections-pciker/ui/CollectionPicker.js +105 -0
- package/dist/components/collections-pciker/ui/CollectionPicker.stories.d.ts +17 -0
- package/dist/components/collections-pciker/ui/CollectionPicker.stories.js +13 -0
- package/dist/components/index.d.ts +4 -3
- package/dist/components/index.js +4 -4
- package/dist/components/meta-data/api/query.d.ts +4 -0
- package/dist/components/meta-data/api/query.js +14 -0
- package/dist/components/meta-data/index.d.ts +0 -0
- package/dist/components/meta-data/index.js +0 -0
- package/dist/components/meta-data/model/meta.types.d.ts +7 -0
- package/dist/components/meta-data/model/meta.types.js +33 -0
- package/dist/components/meta-data/model/schema.d.ts +0 -0
- package/dist/components/meta-data/model/schema.js +0 -0
- package/dist/components/meta-data/model/useGetMetaFields.d.ts +12 -0
- package/dist/components/meta-data/model/useGetMetaFields.js +18 -0
- package/dist/components/meta-data/ui/ArticleRefMetaField.d.ts +3 -0
- package/dist/components/meta-data/ui/ArticleRefMetaField.js +37 -0
- package/dist/components/meta-data/ui/BlogRefMetaField.d.ts +3 -0
- package/dist/components/meta-data/ui/BlogRefMetaField.js +37 -0
- package/dist/components/meta-data/ui/BooleanMetaField.d.ts +3 -0
- package/dist/components/meta-data/ui/BooleanMetaField.js +27 -0
- package/dist/components/meta-data/ui/CollectionRefMetaField.d.ts +3 -0
- package/dist/components/meta-data/ui/CollectionRefMetaField.js +36 -0
- package/dist/components/meta-data/ui/ColorMetaField.d.ts +3 -0
- package/dist/components/meta-data/ui/ColorMetaField.js +17 -0
- package/dist/components/meta-data/ui/DateAndTimeMetaField.d.ts +3 -0
- package/dist/components/meta-data/ui/DateAndTimeMetaField.js +34 -0
- package/dist/components/meta-data/ui/DateMetaField.d.ts +3 -0
- package/dist/components/meta-data/ui/DateMetaField.js +33 -0
- package/dist/components/meta-data/ui/FloatMetaField.d.ts +3 -0
- package/dist/components/meta-data/ui/FloatMetaField.js +23 -0
- package/dist/components/meta-data/ui/MetaData.d.ts +13 -0
- package/dist/components/meta-data/ui/MetaData.js +45 -0
- package/dist/components/meta-data/ui/MetaData.stories.d.ts +10 -0
- package/dist/components/meta-data/ui/MetaData.stories.js +136 -0
- package/dist/components/meta-data/ui/MetaDataItem.d.ts +16 -0
- package/dist/components/meta-data/ui/MetaDataItem.js +247 -0
- package/dist/components/meta-data/ui/MetaDataTypePopup.d.ts +11 -0
- package/dist/components/meta-data/ui/MetaDataTypePopup.js +62 -0
- package/dist/components/meta-data/ui/MultilineTextMetaField.d.ts +3 -0
- package/dist/components/meta-data/ui/MultilineTextMetaField.js +15 -0
- package/dist/components/meta-data/ui/NumberMetaField.d.ts +3 -0
- package/dist/components/meta-data/ui/NumberMetaField.js +19 -0
- package/dist/components/meta-data/ui/PageRefMetaField.d.ts +3 -0
- package/dist/components/meta-data/ui/PageRefMetaField.js +6 -0
- package/dist/components/meta-data/ui/ProductRefMetaField.d.ts +3 -0
- package/dist/components/meta-data/ui/ProductRefMetaField.js +37 -0
- package/dist/components/meta-data/ui/SingleLineTextMetaField.d.ts +3 -0
- package/dist/components/meta-data/ui/SingleLineTextMetaField.js +18 -0
- package/dist/components/meta-data/ui/VariantRefMetaField.d.ts +3 -0
- package/dist/components/meta-data/ui/VariantRefMetaField.js +45 -0
- package/dist/components/products-picker/api/query.d.ts +8 -0
- package/dist/components/products-picker/api/query.js +24 -0
- package/dist/components/products-picker/index.d.ts +1 -0
- package/dist/components/products-picker/index.js +2 -0
- package/dist/components/products-picker/model/useProducts.d.ts +30 -0
- package/dist/components/products-picker/model/useProducts.js +46 -0
- package/dist/components/products-picker/ui/ProductPicker.d.ts +9 -0
- package/dist/components/products-picker/ui/ProductPicker.js +107 -0
- package/dist/components/products-picker/ui/ProductsPicker.stories.d.ts +17 -0
- package/dist/components/products-picker/ui/ProductsPicker.stories.js +13 -0
- package/dist/components/savebar/SaveBar.d.ts +2 -1
- package/dist/components/savebar/SaveBar.js +2 -1
- package/dist/components/variants-picker/api/query.d.ts +1 -0
- package/dist/components/variants-picker/api/query.js +2 -2
- package/dist/components/variants-picker/model/useVariants.d.ts +3 -0
- package/dist/components/variants-picker/model/useVariants.js +6 -3
- package/dist/components/variants-picker/ui/VariantsPicker.d.ts +2 -1
- package/dist/components/variants-picker/ui/VariantsPicker.js +3 -2
- package/dist/components/variants-picker/ui/VariantsPicker.stories.d.ts +2 -1
- package/dist/index.d.ts +2 -2
- package/dist/shared/graphql/gql.d.ts +27 -2
- package/dist/shared/graphql/gql.js +7 -2
- package/dist/shared/graphql/graphql.d.ts +2270 -108
- package/dist/shared/graphql/graphql.js +2058 -297
- package/dist/shared/loading/Loading.d.ts +2 -0
- package/dist/shared/loading/Loading.js +11 -0
- package/dist/shared/loading/index.d.ts +1 -0
- package/dist/shared/loading/index.js +2 -0
- package/dist/styles.css +85 -0
- package/package.json +4 -2
|
@@ -0,0 +1,105 @@
|
|
|
1
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { InfinityScroll } from "../../infinity-scroll/index.js";
|
|
3
|
+
import { useFilterQuery } from "../../../shared/lib/index.js";
|
|
4
|
+
import { BlockStack, Box, Button, Checkbox, Image, InlineStack, Input, Modal, Spinner, Text } from "@soppiya/elementus";
|
|
5
|
+
import lodash from "lodash";
|
|
6
|
+
import { useState } from "react";
|
|
7
|
+
import { useCollections } from "../model/useCollections.js";
|
|
8
|
+
const CollectionPicker = ({ title, initialIds = [], limit = 1 / 0, onClose, onOk })=>{
|
|
9
|
+
const [selectedVariant, setSelectedVariant] = useState(initialIds);
|
|
10
|
+
const { query, debounceQuery, onChangeQuery } = useFilterQuery();
|
|
11
|
+
const { collections, isLoadingCollections, fetchMoreCollections, pageInfo } = useCollections({
|
|
12
|
+
query: debounceQuery
|
|
13
|
+
});
|
|
14
|
+
const isSelected = limit === 1 / 0 ? true : 1 === limit ? 1 === selectedVariant.length : selectedVariant.length >= limit;
|
|
15
|
+
const handleSelectVariant = (productId)=>{
|
|
16
|
+
selectedVariant.includes(productId) ? setSelectedVariant((prev)=>prev.filter((id)=>productId !== id)) : setSelectedVariant((prev)=>[
|
|
17
|
+
...prev,
|
|
18
|
+
productId
|
|
19
|
+
]);
|
|
20
|
+
};
|
|
21
|
+
const handleOk = ()=>{
|
|
22
|
+
if (lodash.isFunction(onOk)) onOk(selectedVariant);
|
|
23
|
+
};
|
|
24
|
+
const ButtonJSX = /*#__PURE__*/ jsx(InlineStack, {
|
|
25
|
+
justifyContent: "end",
|
|
26
|
+
children: /*#__PURE__*/ jsx(Button, {
|
|
27
|
+
disabled: lodash.isEmpty(selectedVariant) || !isSelected,
|
|
28
|
+
onClick: handleOk,
|
|
29
|
+
children: "Add"
|
|
30
|
+
})
|
|
31
|
+
});
|
|
32
|
+
return /*#__PURE__*/ jsx(Modal, {
|
|
33
|
+
open: true,
|
|
34
|
+
title: title || "Collections",
|
|
35
|
+
bodyPadding: 0,
|
|
36
|
+
buttons: ButtonJSX,
|
|
37
|
+
onClose: onClose,
|
|
38
|
+
children: /*#__PURE__*/ jsxs(BlockStack, {
|
|
39
|
+
children: [
|
|
40
|
+
/*#__PURE__*/ jsx(Box, {
|
|
41
|
+
className: "border-b border-b-[#ebebeb]! h",
|
|
42
|
+
padding: 60,
|
|
43
|
+
children: /*#__PURE__*/ jsx(Input, {
|
|
44
|
+
size: "sm",
|
|
45
|
+
type: "search",
|
|
46
|
+
value: query ?? "",
|
|
47
|
+
onChange: (event)=>onChangeQuery(event.target.value)
|
|
48
|
+
})
|
|
49
|
+
}),
|
|
50
|
+
isLoadingCollections ? /*#__PURE__*/ jsx(InlineStack, {
|
|
51
|
+
justifyContent: "center",
|
|
52
|
+
padding: 80,
|
|
53
|
+
children: /*#__PURE__*/ jsx(Spinner, {
|
|
54
|
+
size: "md"
|
|
55
|
+
})
|
|
56
|
+
}) : /*#__PURE__*/ jsxs(BlockStack, {
|
|
57
|
+
children: [
|
|
58
|
+
collections?.map((collection)=>/*#__PURE__*/ jsxs(InlineStack, {
|
|
59
|
+
stack: "full",
|
|
60
|
+
className: "lg:cursor-pointer border-b border-b-[#ebebeb]!",
|
|
61
|
+
gapX: 60,
|
|
62
|
+
padding: 60,
|
|
63
|
+
onClick: ()=>handleSelectVariant(String(collection._id)),
|
|
64
|
+
children: [
|
|
65
|
+
/*#__PURE__*/ jsxs(InlineStack, {
|
|
66
|
+
alignItems: "center",
|
|
67
|
+
gapX: 60,
|
|
68
|
+
children: [
|
|
69
|
+
/*#__PURE__*/ jsx(Box, {
|
|
70
|
+
children: /*#__PURE__*/ jsx(Checkbox, {
|
|
71
|
+
checked: selectedVariant.includes(String(collection._id)),
|
|
72
|
+
onChange: ()=>{}
|
|
73
|
+
})
|
|
74
|
+
}),
|
|
75
|
+
/*#__PURE__*/ jsx(Box, {
|
|
76
|
+
children: /*#__PURE__*/ jsx(Image, {
|
|
77
|
+
size: "xs",
|
|
78
|
+
url: String(collection.image?.url)
|
|
79
|
+
})
|
|
80
|
+
})
|
|
81
|
+
]
|
|
82
|
+
}),
|
|
83
|
+
/*#__PURE__*/ jsx(BlockStack, {
|
|
84
|
+
gapY: 30,
|
|
85
|
+
justifyContent: "center",
|
|
86
|
+
children: /*#__PURE__*/ jsx(Text, {
|
|
87
|
+
size: "sm",
|
|
88
|
+
color: "secondary",
|
|
89
|
+
truncate: "truncate-1",
|
|
90
|
+
children: collection.title
|
|
91
|
+
})
|
|
92
|
+
})
|
|
93
|
+
]
|
|
94
|
+
}, collection._id)),
|
|
95
|
+
pageInfo?.hasNextPage && /*#__PURE__*/ jsx(InfinityScroll, {
|
|
96
|
+
onFetch: fetchMoreCollections
|
|
97
|
+
})
|
|
98
|
+
]
|
|
99
|
+
})
|
|
100
|
+
]
|
|
101
|
+
})
|
|
102
|
+
});
|
|
103
|
+
};
|
|
104
|
+
const ui_CollectionPicker = CollectionPicker;
|
|
105
|
+
export { ui_CollectionPicker as default };
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
declare const meta: {
|
|
2
|
+
title: string;
|
|
3
|
+
component: ({ title, initialIds, limit, onClose, onOk }: {
|
|
4
|
+
title?: string;
|
|
5
|
+
initialIds?: string[];
|
|
6
|
+
limit?: number;
|
|
7
|
+
onClose?: () => void;
|
|
8
|
+
onOk?: (collections: string[]) => void;
|
|
9
|
+
}) => import("react/jsx-runtime").JSX.Element;
|
|
10
|
+
};
|
|
11
|
+
export default meta;
|
|
12
|
+
export declare const Default: {
|
|
13
|
+
args: {
|
|
14
|
+
primary: boolean;
|
|
15
|
+
label: string;
|
|
16
|
+
};
|
|
17
|
+
};
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import CollectionPicker from "./CollectionPicker.js";
|
|
2
|
+
const meta = {
|
|
3
|
+
title: "Example/CollectionPicker",
|
|
4
|
+
component: CollectionPicker
|
|
5
|
+
};
|
|
6
|
+
const CollectionPicker_stories = meta;
|
|
7
|
+
const Default = {
|
|
8
|
+
args: {
|
|
9
|
+
primary: true,
|
|
10
|
+
label: "Button"
|
|
11
|
+
}
|
|
12
|
+
};
|
|
13
|
+
export { Default, CollectionPicker_stories as default };
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
-
export
|
|
2
|
-
export
|
|
3
|
-
export
|
|
1
|
+
export * from "./media";
|
|
2
|
+
export * from "./products-picker";
|
|
3
|
+
export * from "./savebar";
|
|
4
|
+
export * from "./variants-picker";
|
package/dist/components/index.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
export
|
|
1
|
+
export * from "./media/index.js";
|
|
2
|
+
export * from "./products-picker/index.js";
|
|
3
|
+
export * from "./savebar/index.js";
|
|
4
|
+
export * from "./variants-picker/index.js";
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
export declare const getMetaFields: import("@graphql-typed-document-node/core").TypedDocumentNode<import("../../../shared/graphql/graphql").MetafieldsQuery, import("../../../shared/graphql/graphql").Exact<{
|
|
2
|
+
filterKeys?: import("../../../shared/graphql/graphql").InputMaybe<import("../../../shared/graphql/graphql").MetafieldFilterKeys>;
|
|
3
|
+
first?: import("../../../shared/graphql/graphql").InputMaybe<import("../../../shared/graphql/graphql").Scalars["Int"]["input"]>;
|
|
4
|
+
}>>;
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { graphql } from "../../../shared/graphql/index.js";
|
|
2
|
+
const getMetaFields = graphql(`query Metafields($filterKeys: MetafieldFilterKeys, $first: Int) {
|
|
3
|
+
metafields(filterKeys: $filterKeys, first: $first) {
|
|
4
|
+
edges {
|
|
5
|
+
node {
|
|
6
|
+
_id
|
|
7
|
+
entry
|
|
8
|
+
name
|
|
9
|
+
type
|
|
10
|
+
}
|
|
11
|
+
}
|
|
12
|
+
}
|
|
13
|
+
}`);
|
|
14
|
+
export { getMetaFields };
|
|
File without changes
|
|
File without changes
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
class Meta {
|
|
2
|
+
metaTypeAliasName;
|
|
3
|
+
constructor(){
|
|
4
|
+
this.metaTypeAliasName = {
|
|
5
|
+
article_ref: "Articles",
|
|
6
|
+
product_ref: "Products",
|
|
7
|
+
collection_ref: "Collections",
|
|
8
|
+
variant_ref: "Variants",
|
|
9
|
+
page_ref: "Pages",
|
|
10
|
+
blog_ref: "Blogs",
|
|
11
|
+
single_line_text: "Text",
|
|
12
|
+
multiline_text: "Multiline text",
|
|
13
|
+
boolean: "Boolean",
|
|
14
|
+
number: "Number",
|
|
15
|
+
date: "Date",
|
|
16
|
+
date_time: "Date time",
|
|
17
|
+
color: "Color"
|
|
18
|
+
};
|
|
19
|
+
}
|
|
20
|
+
isRefType(type) {
|
|
21
|
+
const refTypes = [
|
|
22
|
+
"product_ref",
|
|
23
|
+
"collection_ref",
|
|
24
|
+
"variant_ref",
|
|
25
|
+
"page_ref",
|
|
26
|
+
"article_ref",
|
|
27
|
+
"blog_ref"
|
|
28
|
+
];
|
|
29
|
+
return refTypes.includes(type);
|
|
30
|
+
}
|
|
31
|
+
}
|
|
32
|
+
const meta_types = new Meta();
|
|
33
|
+
export { meta_types as default };
|
|
File without changes
|
|
File without changes
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { MetafieldScope } from "../../../shared/graphql/graphql";
|
|
2
|
+
export declare const useGetMetaFields: (scope?: MetafieldScope[]) => {
|
|
3
|
+
metafields: ({
|
|
4
|
+
__typename: "Metafield";
|
|
5
|
+
_id?: string | null;
|
|
6
|
+
entry?: import("../../../shared/graphql/graphql").MetafieldEntryType | null;
|
|
7
|
+
name?: string | null;
|
|
8
|
+
type?: import("../../../shared/graphql/graphql").MetafieldType | null;
|
|
9
|
+
} | null | undefined)[];
|
|
10
|
+
loading: boolean;
|
|
11
|
+
metaFieldsError: import("@apollo/client").ErrorLike | undefined;
|
|
12
|
+
};
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import { useQuery } from "@apollo/client/react";
|
|
2
|
+
import { getMetaFields } from "../api/query.js";
|
|
3
|
+
const useGetMetaFields = (scope)=>{
|
|
4
|
+
const { data, loading, error } = useQuery(getMetaFields, {
|
|
5
|
+
variables: {
|
|
6
|
+
filterKeys: {
|
|
7
|
+
scopes: scope
|
|
8
|
+
}
|
|
9
|
+
}
|
|
10
|
+
});
|
|
11
|
+
const nodes = data?.metafields?.edges?.filter((m)=>null != m).map((edge)=>edge.node) ?? [];
|
|
12
|
+
return {
|
|
13
|
+
metafields: nodes,
|
|
14
|
+
loading,
|
|
15
|
+
metaFieldsError: error
|
|
16
|
+
};
|
|
17
|
+
};
|
|
18
|
+
export { useGetMetaFields };
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { userArticles } from "../../articles-picker/model/useArticles.js";
|
|
3
|
+
import { Loading } from "../../../shared/loading/index.js";
|
|
4
|
+
import { Image, InlineStack, Text } from "@soppiya/elementus";
|
|
5
|
+
const ArticleRefMetaField = ({ value, children })=>{
|
|
6
|
+
const { articles, isLoadingArticles } = userArticles({
|
|
7
|
+
skip: !value,
|
|
8
|
+
filterKeys: {
|
|
9
|
+
cursors: value?.split(", ")
|
|
10
|
+
}
|
|
11
|
+
});
|
|
12
|
+
if (isLoadingArticles) return /*#__PURE__*/ jsx(Loading, {});
|
|
13
|
+
return articles?.map((article)=>/*#__PURE__*/ jsxs(InlineStack, {
|
|
14
|
+
justifyContent: "space-between",
|
|
15
|
+
children: [
|
|
16
|
+
/*#__PURE__*/ jsxs(InlineStack, {
|
|
17
|
+
gapX: 70,
|
|
18
|
+
alignItems: "center",
|
|
19
|
+
children: [
|
|
20
|
+
/*#__PURE__*/ jsx(Image, {
|
|
21
|
+
size: "xs",
|
|
22
|
+
url: article.image?.url ?? ""
|
|
23
|
+
}),
|
|
24
|
+
/*#__PURE__*/ jsx(Text, {
|
|
25
|
+
size: "md",
|
|
26
|
+
weight: "regular",
|
|
27
|
+
color: "blue",
|
|
28
|
+
children: article.title
|
|
29
|
+
})
|
|
30
|
+
]
|
|
31
|
+
}),
|
|
32
|
+
children
|
|
33
|
+
]
|
|
34
|
+
}, article._id));
|
|
35
|
+
};
|
|
36
|
+
const ui_ArticleRefMetaField = ArticleRefMetaField;
|
|
37
|
+
export { ui_ArticleRefMetaField as default };
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { useBlogs } from "../../blogs-picker/model/useBlogs.js";
|
|
3
|
+
import { Loading } from "../../../shared/loading/index.js";
|
|
4
|
+
import { Image, InlineStack, Text } from "@soppiya/elementus";
|
|
5
|
+
const BlogRefMetaField_BlogRefMetaField = ({ value, children })=>{
|
|
6
|
+
const { blogs, isLoadingBlogs } = useBlogs({
|
|
7
|
+
skip: !value,
|
|
8
|
+
filterKeys: {
|
|
9
|
+
cursors: value?.split(", ")
|
|
10
|
+
}
|
|
11
|
+
});
|
|
12
|
+
if (isLoadingBlogs) return /*#__PURE__*/ jsx(Loading, {});
|
|
13
|
+
return blogs?.map((blog)=>/*#__PURE__*/ jsxs(InlineStack, {
|
|
14
|
+
justifyContent: "space-between",
|
|
15
|
+
children: [
|
|
16
|
+
/*#__PURE__*/ jsxs(InlineStack, {
|
|
17
|
+
gapX: 70,
|
|
18
|
+
alignItems: "center",
|
|
19
|
+
children: [
|
|
20
|
+
/*#__PURE__*/ jsx(Image, {
|
|
21
|
+
size: "xs",
|
|
22
|
+
url: blog.image?.url ?? ""
|
|
23
|
+
}),
|
|
24
|
+
/*#__PURE__*/ jsx(Text, {
|
|
25
|
+
size: "md",
|
|
26
|
+
weight: "regular",
|
|
27
|
+
color: "blue",
|
|
28
|
+
children: blog.title
|
|
29
|
+
})
|
|
30
|
+
]
|
|
31
|
+
}),
|
|
32
|
+
children
|
|
33
|
+
]
|
|
34
|
+
}, blog._id));
|
|
35
|
+
};
|
|
36
|
+
const BlogRefMetaField = BlogRefMetaField_BlogRefMetaField;
|
|
37
|
+
export { BlogRefMetaField as default };
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { Radio } from "@soppiya/elementus";
|
|
3
|
+
const BooleanMetaField = ({ entry, value, children, onChange })=>/*#__PURE__*/ jsxs("div", {
|
|
4
|
+
children: [
|
|
5
|
+
/*#__PURE__*/ jsxs("div", {
|
|
6
|
+
children: [
|
|
7
|
+
/*#__PURE__*/ jsx(Radio, {
|
|
8
|
+
label: "True",
|
|
9
|
+
name: "boolean",
|
|
10
|
+
checked: "true" === value,
|
|
11
|
+
value: value,
|
|
12
|
+
onChange: (e)=>onChange(e.target.value)
|
|
13
|
+
}),
|
|
14
|
+
/*#__PURE__*/ jsx(Radio, {
|
|
15
|
+
label: "False",
|
|
16
|
+
name: "boolean",
|
|
17
|
+
checked: "false" === value,
|
|
18
|
+
value: value,
|
|
19
|
+
onChange: (e)=>onChange(e.target.value)
|
|
20
|
+
})
|
|
21
|
+
]
|
|
22
|
+
}),
|
|
23
|
+
"multiple" === entry && children
|
|
24
|
+
]
|
|
25
|
+
});
|
|
26
|
+
const ui_BooleanMetaField = BooleanMetaField;
|
|
27
|
+
export { ui_BooleanMetaField as default };
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { useCollections } from "../../collections-pciker/model/useCollections.js";
|
|
3
|
+
import { Loading } from "../../../shared/loading/index.js";
|
|
4
|
+
import { Image, InlineStack, Text } from "@soppiya/elementus";
|
|
5
|
+
const CollectionRefMetaField_CollectionRefMetaField = ({ value, children })=>{
|
|
6
|
+
const { collections, isLoadingCollections } = useCollections({
|
|
7
|
+
filterKeys: {
|
|
8
|
+
cursors: value?.split(", ")
|
|
9
|
+
}
|
|
10
|
+
});
|
|
11
|
+
if (isLoadingCollections) return /*#__PURE__*/ jsx(Loading, {});
|
|
12
|
+
return collections?.map((collection)=>/*#__PURE__*/ jsxs(InlineStack, {
|
|
13
|
+
justifyContent: "space-between",
|
|
14
|
+
children: [
|
|
15
|
+
/*#__PURE__*/ jsxs(InlineStack, {
|
|
16
|
+
gapX: 70,
|
|
17
|
+
alignItems: "center",
|
|
18
|
+
children: [
|
|
19
|
+
/*#__PURE__*/ jsx(Image, {
|
|
20
|
+
size: "xs",
|
|
21
|
+
url: collection.image?.url ?? ""
|
|
22
|
+
}),
|
|
23
|
+
/*#__PURE__*/ jsx(Text, {
|
|
24
|
+
size: "md",
|
|
25
|
+
weight: "regular",
|
|
26
|
+
color: "blue",
|
|
27
|
+
children: collection.title
|
|
28
|
+
})
|
|
29
|
+
]
|
|
30
|
+
}),
|
|
31
|
+
children
|
|
32
|
+
]
|
|
33
|
+
}, collection._id));
|
|
34
|
+
};
|
|
35
|
+
const CollectionRefMetaField = CollectionRefMetaField_CollectionRefMetaField;
|
|
36
|
+
export { CollectionRefMetaField as default };
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
+
const ColorMetaField = ({ entry, value, children, onChange })=>/*#__PURE__*/ jsxs("div", {
|
|
3
|
+
children: [
|
|
4
|
+
/*#__PURE__*/ jsx("div", {
|
|
5
|
+
children: /*#__PURE__*/ jsx("div", {
|
|
6
|
+
children: /*#__PURE__*/ jsx("input", {
|
|
7
|
+
type: "color",
|
|
8
|
+
value: value,
|
|
9
|
+
onChange: (e)=>onChange(e.target.value)
|
|
10
|
+
})
|
|
11
|
+
})
|
|
12
|
+
}),
|
|
13
|
+
"multiple" === entry && children
|
|
14
|
+
]
|
|
15
|
+
});
|
|
16
|
+
const ui_ColorMetaField = ColorMetaField;
|
|
17
|
+
export { ui_ColorMetaField as default };
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { BlockStack, DatePicker, InlineStack } from "@soppiya/elementus";
|
|
3
|
+
import moment from "moment";
|
|
4
|
+
const DateAndTimeMetaField = ({ entry, value, children, onChange })=>{
|
|
5
|
+
const handleChangeDate = (event)=>{
|
|
6
|
+
const { value } = event.target;
|
|
7
|
+
const date = new Date(value);
|
|
8
|
+
onChange(String(date.getTime()));
|
|
9
|
+
};
|
|
10
|
+
const transformValue = ()=>{
|
|
11
|
+
if (!value) return "";
|
|
12
|
+
const date = moment(Number(value)).format("YYYY-MM-DDThh:mm");
|
|
13
|
+
console.log(date);
|
|
14
|
+
return date ? date : "";
|
|
15
|
+
};
|
|
16
|
+
return /*#__PURE__*/ jsxs(InlineStack, {
|
|
17
|
+
gapX: 60,
|
|
18
|
+
children: [
|
|
19
|
+
/*#__PURE__*/ jsx(BlockStack, {
|
|
20
|
+
children: /*#__PURE__*/ jsx(DatePicker, {
|
|
21
|
+
isDateTime: true,
|
|
22
|
+
size: "sm",
|
|
23
|
+
name: "date",
|
|
24
|
+
isCloseButton: false,
|
|
25
|
+
value: transformValue(),
|
|
26
|
+
onChange: handleChangeDate
|
|
27
|
+
})
|
|
28
|
+
}),
|
|
29
|
+
"multiple" === entry && children
|
|
30
|
+
]
|
|
31
|
+
});
|
|
32
|
+
};
|
|
33
|
+
const ui_DateAndTimeMetaField = DateAndTimeMetaField;
|
|
34
|
+
export { ui_DateAndTimeMetaField as default };
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { BlockStack, DatePicker, InlineStack } from "@soppiya/elementus";
|
|
3
|
+
import moment from "moment";
|
|
4
|
+
const DateMetaField = ({ entry, value, children, onChange })=>{
|
|
5
|
+
const handleChangeDate = (event)=>{
|
|
6
|
+
const { value } = event.target;
|
|
7
|
+
const date = new Date(value);
|
|
8
|
+
onChange(String(date.getTime()));
|
|
9
|
+
};
|
|
10
|
+
const transformValue = ()=>{
|
|
11
|
+
if (!value) return "";
|
|
12
|
+
const date = moment(Number(value)).format("YYYY-MM-DD");
|
|
13
|
+
return date ? date : "";
|
|
14
|
+
};
|
|
15
|
+
console.log(transformValue());
|
|
16
|
+
return /*#__PURE__*/ jsxs(InlineStack, {
|
|
17
|
+
gapX: 60,
|
|
18
|
+
children: [
|
|
19
|
+
/*#__PURE__*/ jsx(BlockStack, {
|
|
20
|
+
children: /*#__PURE__*/ jsx(DatePicker, {
|
|
21
|
+
size: "sm",
|
|
22
|
+
name: "date",
|
|
23
|
+
isCloseButton: false,
|
|
24
|
+
value: transformValue(),
|
|
25
|
+
onChange: handleChangeDate
|
|
26
|
+
})
|
|
27
|
+
}),
|
|
28
|
+
"multiple" === entry && children
|
|
29
|
+
]
|
|
30
|
+
});
|
|
31
|
+
};
|
|
32
|
+
const ui_DateMetaField = DateMetaField;
|
|
33
|
+
export { ui_DateMetaField as default };
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
+
import float_metafield from "@/shared/scss/atoms/float_metafield.css";
|
|
3
|
+
import { Input } from "@soppiya/elementus";
|
|
4
|
+
const FloatMetaField_FloatMetaField = ({ entry, value, children, onChange })=>/*#__PURE__*/ jsxs("div", {
|
|
5
|
+
className: float_metafield.wrapper,
|
|
6
|
+
children: [
|
|
7
|
+
/*#__PURE__*/ jsx("div", {
|
|
8
|
+
className: float_metafield.input_row,
|
|
9
|
+
children: /*#__PURE__*/ jsx("div", {
|
|
10
|
+
className: float_metafield.input,
|
|
11
|
+
children: /*#__PURE__*/ jsx(Input, {
|
|
12
|
+
size: "sm",
|
|
13
|
+
type: "number",
|
|
14
|
+
value: value,
|
|
15
|
+
onChange: (e)=>onChange(e.target.value)
|
|
16
|
+
})
|
|
17
|
+
})
|
|
18
|
+
}),
|
|
19
|
+
"multiple" === entry && children
|
|
20
|
+
]
|
|
21
|
+
});
|
|
22
|
+
const FloatMetaField = FloatMetaField_FloatMetaField;
|
|
23
|
+
export { FloatMetaField as default };
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
interface Props {
|
|
2
|
+
scope: string;
|
|
3
|
+
value?: {
|
|
4
|
+
metafield: string;
|
|
5
|
+
value: string[];
|
|
6
|
+
}[];
|
|
7
|
+
onChange?: (value: {
|
|
8
|
+
metafield: string;
|
|
9
|
+
value: string[];
|
|
10
|
+
}) => void;
|
|
11
|
+
}
|
|
12
|
+
declare const MetaData: ({ scope, value, onChange }: Props) => import("react/jsx-runtime").JSX.Element;
|
|
13
|
+
export default MetaData;
|
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { Loading } from "../../../shared/loading/index.js";
|
|
3
|
+
import { BlockStack, Card, Text } from "@soppiya/elementus";
|
|
4
|
+
import { isFunction } from "lodash";
|
|
5
|
+
import { useGetMetaFields } from "../model/useGetMetaFields.js";
|
|
6
|
+
import MetaDataItem from "./MetaDataItem.js";
|
|
7
|
+
const MetaData_MetaData = ({ scope = "product", value = [], onChange })=>{
|
|
8
|
+
const { metafields, loading } = useGetMetaFields([
|
|
9
|
+
scope
|
|
10
|
+
]);
|
|
11
|
+
const handleChange = (metaFieldID, value)=>{
|
|
12
|
+
isFunction(onChange) && onChange({
|
|
13
|
+
metafield: metaFieldID,
|
|
14
|
+
value
|
|
15
|
+
});
|
|
16
|
+
};
|
|
17
|
+
const getMetaFieldValue = (_id)=>{
|
|
18
|
+
const metaField = value.find((item)=>item.metafield === _id);
|
|
19
|
+
return metaField?.value;
|
|
20
|
+
};
|
|
21
|
+
if (0 === metafields.length) return /*#__PURE__*/ jsx("h1", {
|
|
22
|
+
children: " Not found"
|
|
23
|
+
});
|
|
24
|
+
return /*#__PURE__*/ jsxs(Card, {
|
|
25
|
+
children: [
|
|
26
|
+
/*#__PURE__*/ jsx(BlockStack, {
|
|
27
|
+
padding: 70,
|
|
28
|
+
children: /*#__PURE__*/ jsx("div", {
|
|
29
|
+
children: /*#__PURE__*/ jsx(Text, {
|
|
30
|
+
size: "md",
|
|
31
|
+
weight: "semibold",
|
|
32
|
+
children: "Meta fields"
|
|
33
|
+
})
|
|
34
|
+
})
|
|
35
|
+
}),
|
|
36
|
+
loading && !metafields ? /*#__PURE__*/ jsx(Loading, {}) : metafields.map((metaField)=>/*#__PURE__*/ jsx(MetaDataItem, {
|
|
37
|
+
metaField: metaField,
|
|
38
|
+
value: getMetaFieldValue(metaField?._id ?? ""),
|
|
39
|
+
onChange: (value)=>handleChange(metaField?._id ?? "", value)
|
|
40
|
+
}, metaField?._id))
|
|
41
|
+
]
|
|
42
|
+
});
|
|
43
|
+
};
|
|
44
|
+
const MetaData = MetaData_MetaData;
|
|
45
|
+
export { MetaData as default };
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import MetaData from "./MetaData";
|
|
2
|
+
import type { Meta } from "@storybook/react";
|
|
3
|
+
declare const meta: Meta<typeof MetaData>;
|
|
4
|
+
export default meta;
|
|
5
|
+
export declare const Product: () => import("react/jsx-runtime").JSX.Element;
|
|
6
|
+
export declare const Article: () => import("react/jsx-runtime").JSX.Element;
|
|
7
|
+
export declare const Variant: () => import("react/jsx-runtime").JSX.Element;
|
|
8
|
+
export declare const Blog: () => import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
export declare const Page: () => import("react/jsx-runtime").JSX.Element;
|
|
10
|
+
export declare const Collection: () => import("react/jsx-runtime").JSX.Element;
|