@ndla/video-search 8.0.134-alpha.0 → 8.0.136-alpha.0
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/README.md +1 -1
- package/lib/VideoListItem.js +21 -21
- package/lib/VideoListItem.js.map +1 -1
- package/lib/VideoResultList.js +7 -7
- package/lib/VideoResultList.js.map +1 -1
- package/lib/VideoSearch.js +8 -8
- package/lib/VideoSearch.js.map +1 -1
- package/package.json +7 -7
package/README.md
CHANGED
package/lib/VideoListItem.js
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
let react = require("react");
|
|
2
|
-
let
|
|
3
|
-
let
|
|
4
|
-
let
|
|
5
|
-
let
|
|
2
|
+
let _ndla_icons = require("@ndla/icons");
|
|
3
|
+
let _ndla_primitives = require("@ndla/primitives");
|
|
4
|
+
let _ndla_styled_system_jsx = require("@ndla/styled-system/jsx");
|
|
5
|
+
let _ndla_licenses = require("@ndla/licenses");
|
|
6
6
|
let react_jsx_runtime = require("react/jsx-runtime");
|
|
7
7
|
|
|
8
8
|
//#region src/VideoListItem.tsx
|
|
@@ -13,12 +13,12 @@ let react_jsx_runtime = require("react/jsx-runtime");
|
|
|
13
13
|
* LICENSE file in the root directory of this source tree.
|
|
14
14
|
*
|
|
15
15
|
*/
|
|
16
|
-
const ButtonWrapper = (0,
|
|
16
|
+
const ButtonWrapper = (0, _ndla_styled_system_jsx.styled)("div", { base: {
|
|
17
17
|
display: "flex",
|
|
18
18
|
gap: "small"
|
|
19
19
|
} });
|
|
20
|
-
const PreviewIframe = (0,
|
|
21
|
-
const PreviewWrapper = (0,
|
|
20
|
+
const PreviewIframe = (0, _ndla_styled_system_jsx.styled)("iframe", { base: { minHeight: "surface.xxsmall" } });
|
|
21
|
+
const PreviewWrapper = (0, _ndla_styled_system_jsx.styled)("div", { base: {
|
|
22
22
|
display: "grid",
|
|
23
23
|
gap: "xsmall",
|
|
24
24
|
gridTemplateColumns: "repeat(3,1fr)",
|
|
@@ -26,27 +26,27 @@ const PreviewWrapper = (0, __ndla_styled_system_jsx.styled)("div", { base: {
|
|
|
26
26
|
borderBlockEnd: "1px solid",
|
|
27
27
|
borderColor: "stroke.subtle"
|
|
28
28
|
} });
|
|
29
|
-
const StyledImage = (0,
|
|
29
|
+
const StyledImage = (0, _ndla_styled_system_jsx.styled)(_ndla_primitives.Image, { base: {
|
|
30
30
|
minWidth: "surface.xxsmall",
|
|
31
31
|
height: "surface.4xsmall",
|
|
32
32
|
objectFit: "cover",
|
|
33
33
|
border: "1px solid",
|
|
34
34
|
borderColor: "stroke.subtle"
|
|
35
35
|
} });
|
|
36
|
-
const StyledVideoMeta = (0,
|
|
36
|
+
const StyledVideoMeta = (0, _ndla_styled_system_jsx.styled)("div", { base: {
|
|
37
37
|
display: "flex",
|
|
38
38
|
flexDirection: "column",
|
|
39
39
|
gap: "xxsmall"
|
|
40
40
|
} });
|
|
41
|
-
const StyledListItemContent = (0,
|
|
41
|
+
const StyledListItemContent = (0, _ndla_styled_system_jsx.styled)(_ndla_primitives.ListItemContent, { base: {
|
|
42
42
|
alignItems: "flex-end",
|
|
43
43
|
tabletDown: {
|
|
44
44
|
flexDirection: "column",
|
|
45
45
|
alignItems: "flex-start"
|
|
46
46
|
}
|
|
47
47
|
} });
|
|
48
|
-
const StyledIconButton = (0,
|
|
49
|
-
const StyledListItemRoot = (0,
|
|
48
|
+
const StyledIconButton = (0, _ndla_styled_system_jsx.styled)(_ndla_primitives.IconButton, { base: { marginLeft: "auto" } });
|
|
49
|
+
const StyledListItemRoot = (0, _ndla_styled_system_jsx.styled)(_ndla_primitives.ListItemRoot, { base: {
|
|
50
50
|
paddingBlock: "medium",
|
|
51
51
|
tabletDown: {
|
|
52
52
|
flexDirection: "column",
|
|
@@ -54,17 +54,17 @@ const StyledListItemRoot = (0, __ndla_styled_system_jsx.styled)(__ndla_primitive
|
|
|
54
54
|
}
|
|
55
55
|
} });
|
|
56
56
|
const License = ({ license }) => {
|
|
57
|
-
if (typeof license === "string") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(
|
|
57
|
+
if (typeof license === "string") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ndla_primitives.Text, { children: license });
|
|
58
58
|
if (license.url?.length) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("a", {
|
|
59
59
|
href: license.url,
|
|
60
60
|
rel: "license",
|
|
61
61
|
children: license.abbreviation
|
|
62
62
|
});
|
|
63
|
-
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(
|
|
63
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ndla_primitives.Text, { children: license.abbreviation });
|
|
64
64
|
};
|
|
65
65
|
const VideoListItem = ({ video, onVideoSelect, translations, locale }) => {
|
|
66
66
|
const [isPreviewing, setIsPreviewing] = (0, react.useState)(false);
|
|
67
|
-
const license = video.custom_fields?.license ? (0,
|
|
67
|
+
const license = video.custom_fields?.license ? (0, _ndla_licenses.getLicenseByNBTitle)(video.custom_fields.license, locale) : "";
|
|
68
68
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("li", { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(StyledListItemRoot, {
|
|
69
69
|
nonInteractive: true,
|
|
70
70
|
children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(StyledImage, {
|
|
@@ -72,24 +72,24 @@ const VideoListItem = ({ video, onVideoSelect, translations, locale }) => {
|
|
|
72
72
|
alt: "",
|
|
73
73
|
variant: "rounded"
|
|
74
74
|
}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(StyledListItemContent, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(StyledVideoMeta, { children: [
|
|
75
|
-
/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(
|
|
75
|
+
/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_ndla_primitives.Text, {
|
|
76
76
|
textStyle: "title.medium",
|
|
77
|
-
children: [video.name, video.projection === "equirectangular" && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(
|
|
77
|
+
children: [video.name, video.projection === "equirectangular" && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ndla_icons.PanoramaPhotosphere, {
|
|
78
78
|
"aria-hidden": false,
|
|
79
79
|
"aria-label": translations.is360Video,
|
|
80
80
|
title: translations.is360Video
|
|
81
81
|
})]
|
|
82
82
|
}),
|
|
83
|
-
/* @__PURE__ */ (0, react_jsx_runtime.jsx)(
|
|
83
|
+
/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ndla_primitives.Text, { children: video.custom_fields?.licenseinfo ?? "" }),
|
|
84
84
|
/* @__PURE__ */ (0, react_jsx_runtime.jsx)(License, { license })
|
|
85
|
-
] }), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(ButtonWrapper, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(
|
|
85
|
+
] }), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(ButtonWrapper, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ndla_primitives.Button, {
|
|
86
86
|
variant: "secondary",
|
|
87
87
|
size: "small",
|
|
88
88
|
onClick: () => setIsPreviewing((p) => !p),
|
|
89
89
|
"aria-expanded": isPreviewing,
|
|
90
90
|
"aria-controls": `video-preview-${video.id}`,
|
|
91
91
|
children: translations.previewVideo
|
|
92
|
-
}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(
|
|
92
|
+
}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ndla_primitives.Button, {
|
|
93
93
|
size: "small",
|
|
94
94
|
onClick: () => onVideoSelect(video),
|
|
95
95
|
children: translations.addVideo
|
|
@@ -108,7 +108,7 @@ const VideoListItem = ({ video, onVideoSelect, translations, locale }) => {
|
|
|
108
108
|
"aria-label": translations.close,
|
|
109
109
|
title: translations.close,
|
|
110
110
|
onClick: () => setIsPreviewing(false),
|
|
111
|
-
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(
|
|
111
|
+
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ndla_icons.CloseLine, {})
|
|
112
112
|
})
|
|
113
113
|
]
|
|
114
114
|
})] });
|
package/lib/VideoListItem.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"VideoListItem.js","names":["Image","ListItemContent","IconButton","ListItemRoot","Text","PanoramaPhotosphere","Button","CloseLine"],"sources":["../src/VideoListItem.tsx"],"sourcesContent":["/**\n * Copyright (c) 2024-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { useState } from \"react\";\nimport { CloseLine, PanoramaPhotosphere } from \"@ndla/icons\";\nimport { getLicenseByNBTitle, type LicenseLocaleType } from \"@ndla/licenses\";\nimport { Image, Text, ListItemContent, ListItemRoot, Button, IconButton } from \"@ndla/primitives\";\nimport { styled } from \"@ndla/styled-system/jsx\";\nimport type { BrightcoveApiType } from \"@ndla/types-embed\";\nimport type { VideoTranslations } from \"./VideoSearch\";\n\nconst ButtonWrapper = styled(\"div\", {\n base: {\n display: \"flex\",\n gap: \"small\",\n },\n});\n\nconst PreviewIframe = styled(\"iframe\", {\n base: {\n minHeight: \"surface.xxsmall\",\n },\n});\n\nconst PreviewWrapper = styled(\"div\", {\n base: {\n display: \"grid\",\n gap: \"xsmall\",\n gridTemplateColumns: \"repeat(3,1fr)\",\n padding: \"small\",\n borderBlockEnd: \"1px solid\",\n borderColor: \"stroke.subtle\",\n },\n});\n\nconst StyledImage = styled(Image, {\n base: {\n minWidth: \"surface.xxsmall\",\n height: \"surface.4xsmall\",\n objectFit: \"cover\",\n border: \"1px solid\",\n borderColor: \"stroke.subtle\",\n },\n});\n\nconst StyledVideoMeta = styled(\"div\", {\n base: {\n display: \"flex\",\n flexDirection: \"column\",\n gap: \"xxsmall\",\n },\n});\nconst StyledListItemContent = styled(ListItemContent, {\n base: {\n alignItems: \"flex-end\",\n tabletDown: {\n flexDirection: \"column\",\n alignItems: \"flex-start\",\n },\n },\n});\n\nconst StyledIconButton = styled(IconButton, {\n base: {\n marginLeft: \"auto\",\n },\n});\n\nconst StyledListItemRoot = styled(ListItemRoot, {\n base: {\n paddingBlock: \"medium\",\n tabletDown: {\n flexDirection: \"column\",\n alignItems: \"flex-start\",\n },\n },\n});\n\ninterface LicenseProps {\n license: LicenseLocaleType | string;\n}\nconst License = ({ license }: LicenseProps) => {\n if (typeof license === \"string\") return <Text>{license}</Text>;\n if (license.url?.length) {\n return (\n <a href={license.url} rel=\"license\">\n {license.abbreviation}\n </a>\n );\n }\n return <Text>{license.abbreviation}</Text>;\n};\n\ninterface VideoListItemProps {\n video: BrightcoveApiType;\n translations: VideoTranslations;\n locale: string;\n onVideoSelect: (video: BrightcoveApiType) => void;\n}\n\nexport const VideoListItem = ({ video, onVideoSelect, translations, locale }: VideoListItemProps) => {\n const [isPreviewing, setIsPreviewing] = useState(false);\n const license = video.custom_fields?.license ? getLicenseByNBTitle(video.custom_fields.license, locale) : \"\";\n\n return (\n <li>\n <StyledListItemRoot nonInteractive>\n <StyledImage src={video.images?.thumbnail?.src} alt=\"\" variant=\"rounded\" />\n <StyledListItemContent>\n <StyledVideoMeta>\n <Text textStyle=\"title.medium\">\n {video.name}\n {video.projection === \"equirectangular\" && (\n <PanoramaPhotosphere\n aria-hidden={false}\n aria-label={translations.is360Video}\n title={translations.is360Video}\n />\n )}\n </Text>\n <Text>{video.custom_fields?.licenseinfo ?? \"\"}</Text>\n <License license={license} />\n </StyledVideoMeta>\n <ButtonWrapper>\n <Button\n variant=\"secondary\"\n size=\"small\"\n onClick={() => setIsPreviewing((p) => !p)}\n aria-expanded={isPreviewing}\n aria-controls={`video-preview-${video.id}`}\n >\n {translations.previewVideo}\n </Button>\n <Button size=\"small\" onClick={() => onVideoSelect(video)}>\n {translations.addVideo}\n </Button>\n </ButtonWrapper>\n </StyledListItemContent>\n </StyledListItemRoot>\n {!!isPreviewing && (\n <PreviewWrapper id={`video-preview-${video.id}`}>\n <div />\n <PreviewIframe\n title={video.name}\n src={`//players.brightcove.net/${video.account_id}/BkLm8fT_default/index.html?videoId=${video.id}`}\n allowFullScreen\n />\n <StyledIconButton\n variant=\"secondary\"\n aria-label={translations.close}\n title={translations.close}\n onClick={() => setIsPreviewing(false)}\n >\n <CloseLine />\n </StyledIconButton>\n </PreviewWrapper>\n )}\n </li>\n );\n};\n"],"mappings":";;;;;;;;;;;;;;;AAgBA,MAAM,
|
|
1
|
+
{"version":3,"file":"VideoListItem.js","names":["Image","ListItemContent","IconButton","ListItemRoot","Text","PanoramaPhotosphere","Button","CloseLine"],"sources":["../src/VideoListItem.tsx"],"sourcesContent":["/**\n * Copyright (c) 2024-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { useState } from \"react\";\nimport { CloseLine, PanoramaPhotosphere } from \"@ndla/icons\";\nimport { getLicenseByNBTitle, type LicenseLocaleType } from \"@ndla/licenses\";\nimport { Image, Text, ListItemContent, ListItemRoot, Button, IconButton } from \"@ndla/primitives\";\nimport { styled } from \"@ndla/styled-system/jsx\";\nimport type { BrightcoveApiType } from \"@ndla/types-embed\";\nimport type { VideoTranslations } from \"./VideoSearch\";\n\nconst ButtonWrapper = styled(\"div\", {\n base: {\n display: \"flex\",\n gap: \"small\",\n },\n});\n\nconst PreviewIframe = styled(\"iframe\", {\n base: {\n minHeight: \"surface.xxsmall\",\n },\n});\n\nconst PreviewWrapper = styled(\"div\", {\n base: {\n display: \"grid\",\n gap: \"xsmall\",\n gridTemplateColumns: \"repeat(3,1fr)\",\n padding: \"small\",\n borderBlockEnd: \"1px solid\",\n borderColor: \"stroke.subtle\",\n },\n});\n\nconst StyledImage = styled(Image, {\n base: {\n minWidth: \"surface.xxsmall\",\n height: \"surface.4xsmall\",\n objectFit: \"cover\",\n border: \"1px solid\",\n borderColor: \"stroke.subtle\",\n },\n});\n\nconst StyledVideoMeta = styled(\"div\", {\n base: {\n display: \"flex\",\n flexDirection: \"column\",\n gap: \"xxsmall\",\n },\n});\nconst StyledListItemContent = styled(ListItemContent, {\n base: {\n alignItems: \"flex-end\",\n tabletDown: {\n flexDirection: \"column\",\n alignItems: \"flex-start\",\n },\n },\n});\n\nconst StyledIconButton = styled(IconButton, {\n base: {\n marginLeft: \"auto\",\n },\n});\n\nconst StyledListItemRoot = styled(ListItemRoot, {\n base: {\n paddingBlock: \"medium\",\n tabletDown: {\n flexDirection: \"column\",\n alignItems: \"flex-start\",\n },\n },\n});\n\ninterface LicenseProps {\n license: LicenseLocaleType | string;\n}\nconst License = ({ license }: LicenseProps) => {\n if (typeof license === \"string\") return <Text>{license}</Text>;\n if (license.url?.length) {\n return (\n <a href={license.url} rel=\"license\">\n {license.abbreviation}\n </a>\n );\n }\n return <Text>{license.abbreviation}</Text>;\n};\n\ninterface VideoListItemProps {\n video: BrightcoveApiType;\n translations: VideoTranslations;\n locale: string;\n onVideoSelect: (video: BrightcoveApiType) => void;\n}\n\nexport const VideoListItem = ({ video, onVideoSelect, translations, locale }: VideoListItemProps) => {\n const [isPreviewing, setIsPreviewing] = useState(false);\n const license = video.custom_fields?.license ? getLicenseByNBTitle(video.custom_fields.license, locale) : \"\";\n\n return (\n <li>\n <StyledListItemRoot nonInteractive>\n <StyledImage src={video.images?.thumbnail?.src} alt=\"\" variant=\"rounded\" />\n <StyledListItemContent>\n <StyledVideoMeta>\n <Text textStyle=\"title.medium\">\n {video.name}\n {video.projection === \"equirectangular\" && (\n <PanoramaPhotosphere\n aria-hidden={false}\n aria-label={translations.is360Video}\n title={translations.is360Video}\n />\n )}\n </Text>\n <Text>{video.custom_fields?.licenseinfo ?? \"\"}</Text>\n <License license={license} />\n </StyledVideoMeta>\n <ButtonWrapper>\n <Button\n variant=\"secondary\"\n size=\"small\"\n onClick={() => setIsPreviewing((p) => !p)}\n aria-expanded={isPreviewing}\n aria-controls={`video-preview-${video.id}`}\n >\n {translations.previewVideo}\n </Button>\n <Button size=\"small\" onClick={() => onVideoSelect(video)}>\n {translations.addVideo}\n </Button>\n </ButtonWrapper>\n </StyledListItemContent>\n </StyledListItemRoot>\n {!!isPreviewing && (\n <PreviewWrapper id={`video-preview-${video.id}`}>\n <div />\n <PreviewIframe\n title={video.name}\n src={`//players.brightcove.net/${video.account_id}/BkLm8fT_default/index.html?videoId=${video.id}`}\n allowFullScreen\n />\n <StyledIconButton\n variant=\"secondary\"\n aria-label={translations.close}\n title={translations.close}\n onClick={() => setIsPreviewing(false)}\n >\n <CloseLine />\n </StyledIconButton>\n </PreviewWrapper>\n )}\n </li>\n );\n};\n"],"mappings":";;;;;;;;;;;;;;;AAgBA,MAAM,oDAAuB,OAAO,EAClC,MAAM;CACJ,SAAS;CACT,KAAK;CACN,EACF,CAAC;AAEF,MAAM,oDAAuB,UAAU,EACrC,MAAM,EACJ,WAAW,mBACZ,EACF,CAAC;AAEF,MAAM,qDAAwB,OAAO,EACnC,MAAM;CACJ,SAAS;CACT,KAAK;CACL,qBAAqB;CACrB,SAAS;CACT,gBAAgB;CAChB,aAAa;CACd,EACF,CAAC;AAEF,MAAM,kDAAqBA,wBAAO,EAChC,MAAM;CACJ,UAAU;CACV,QAAQ;CACR,WAAW;CACX,QAAQ;CACR,aAAa;CACd,EACF,CAAC;AAEF,MAAM,sDAAyB,OAAO,EACpC,MAAM;CACJ,SAAS;CACT,eAAe;CACf,KAAK;CACN,EACF,CAAC;AACF,MAAM,4DAA+BC,kCAAiB,EACpD,MAAM;CACJ,YAAY;CACZ,YAAY;EACV,eAAe;EACf,YAAY;EACb;CACF,EACF,CAAC;AAEF,MAAM,uDAA0BC,6BAAY,EAC1C,MAAM,EACJ,YAAY,QACb,EACF,CAAC;AAEF,MAAM,yDAA4BC,+BAAc,EAC9C,MAAM;CACJ,cAAc;CACd,YAAY;EACV,eAAe;EACf,YAAY;EACb;CACF,EACF,CAAC;AAKF,MAAM,WAAW,EAAE,cAA4B;AAC7C,KAAI,OAAO,YAAY,SAAU,QAAO,2CAACC,mCAAM,UAAe;AAC9D,KAAI,QAAQ,KAAK,OACf,QACE,2CAAC;EAAE,MAAM,QAAQ;EAAK,KAAI;YACvB,QAAQ;GACP;AAGR,QAAO,2CAACA,mCAAM,QAAQ,eAAoB;;AAU5C,MAAa,iBAAiB,EAAE,OAAO,eAAe,cAAc,aAAiC;CACnG,MAAM,CAAC,cAAc,uCAA4B,MAAM;CACvD,MAAM,UAAU,MAAM,eAAe,kDAA8B,MAAM,cAAc,SAAS,OAAO,GAAG;AAE1G,QACE,4CAAC,mBACC,4CAAC;EAAmB;aAClB,2CAAC;GAAY,KAAK,MAAM,QAAQ,WAAW;GAAK,KAAI;GAAG,SAAQ;IAAY,EAC3E,4CAAC,oCACC,4CAAC;GACC,4CAACA;IAAK,WAAU;eACb,MAAM,MACN,MAAM,eAAe,qBACpB,2CAACC;KACC,eAAa;KACb,cAAY,aAAa;KACzB,OAAO,aAAa;MACpB;KAEC;GACP,2CAACD,mCAAM,MAAM,eAAe,eAAe,KAAU;GACrD,2CAAC,WAAiB,UAAW;MACb,EAClB,4CAAC,4BACC,2CAACE;GACC,SAAQ;GACR,MAAK;GACL,eAAe,iBAAiB,MAAM,CAAC,EAAE;GACzC,iBAAe;GACf,iBAAe,iBAAiB,MAAM;aAErC,aAAa;IACP,EACT,2CAACA;GAAO,MAAK;GAAQ,eAAe,cAAc,MAAM;aACrD,aAAa;IACP,IACK,IACM;GACL,EACpB,CAAC,CAAC,gBACD,4CAAC;EAAe,IAAI,iBAAiB,MAAM;;GACzC,2CAAC,UAAM;GACP,2CAAC;IACC,OAAO,MAAM;IACb,KAAK,4BAA4B,MAAM,WAAW,sCAAsC,MAAM;IAC9F;KACA;GACF,2CAAC;IACC,SAAQ;IACR,cAAY,aAAa;IACzB,OAAO,aAAa;IACpB,eAAe,gBAAgB,MAAM;cAErC,2CAACC,0BAAY;KACI;;GACJ,IAEhB"}
|
package/lib/VideoResultList.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
const require_VideoListItem = require('./VideoListItem.js');
|
|
2
|
-
let
|
|
3
|
-
let
|
|
2
|
+
let _ndla_primitives = require("@ndla/primitives");
|
|
3
|
+
let _ndla_styled_system_jsx = require("@ndla/styled-system/jsx");
|
|
4
4
|
let react_jsx_runtime = require("react/jsx-runtime");
|
|
5
5
|
|
|
6
6
|
//#region src/VideoResultList.tsx
|
|
@@ -11,14 +11,14 @@ let react_jsx_runtime = require("react/jsx-runtime");
|
|
|
11
11
|
* LICENSE file in the root directory of this source tree.
|
|
12
12
|
*
|
|
13
13
|
*/
|
|
14
|
-
const StyledList = (0,
|
|
14
|
+
const StyledList = (0, _ndla_styled_system_jsx.styled)("ul", { base: {
|
|
15
15
|
display: "flex",
|
|
16
16
|
flexDirection: "column",
|
|
17
17
|
gap: "xxsmall",
|
|
18
18
|
listStyle: "none",
|
|
19
19
|
width: "100%"
|
|
20
20
|
} });
|
|
21
|
-
const StyledVideoResultWrapper = (0,
|
|
21
|
+
const StyledVideoResultWrapper = (0, _ndla_styled_system_jsx.styled)("div", { base: {
|
|
22
22
|
display: "flex",
|
|
23
23
|
flexDirection: "column",
|
|
24
24
|
gap: "medium",
|
|
@@ -26,14 +26,14 @@ const StyledVideoResultWrapper = (0, __ndla_styled_system_jsx.styled)("div", { b
|
|
|
26
26
|
} });
|
|
27
27
|
const VideoResultList = ({ videos, existsMoreVideos, isLoading, translations, locale, onVideoSelect, onShowMore }) => {
|
|
28
28
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(StyledVideoResultWrapper, { children: [
|
|
29
|
-
!videos.length && !isLoading ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(
|
|
29
|
+
!videos.length && !isLoading ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ndla_primitives.Text, { children: translations.noResults }) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(StyledList, { children: videos.map((video, index) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_VideoListItem.VideoListItem, {
|
|
30
30
|
video,
|
|
31
31
|
translations,
|
|
32
32
|
locale,
|
|
33
33
|
onVideoSelect
|
|
34
34
|
}, `${video.id}-${index}`)) }),
|
|
35
|
-
!!isLoading && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(
|
|
36
|
-
!!existsMoreVideos && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(
|
|
35
|
+
!!isLoading && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ndla_primitives.Spinner, {}),
|
|
36
|
+
!!existsMoreVideos && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ndla_primitives.Button, {
|
|
37
37
|
onClick: onShowMore,
|
|
38
38
|
children: translations.loadMoreVideos
|
|
39
39
|
})
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"VideoResultList.js","names":["Text","VideoListItem","Spinner","Button"],"sources":["../src/VideoResultList.tsx"],"sourcesContent":["/**\n * Copyright (c) 2017-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { Text, Button, Spinner } from \"@ndla/primitives\";\nimport { styled } from \"@ndla/styled-system/jsx\";\nimport type { BrightcoveApiType } from \"@ndla/types-embed\";\nimport { VideoListItem } from \"./VideoListItem\";\nimport type { VideoTranslations } from \"./VideoSearch\";\n\nconst StyledList = styled(\"ul\", {\n base: {\n display: \"flex\",\n flexDirection: \"column\",\n gap: \"xxsmall\",\n listStyle: \"none\",\n width: \"100%\",\n },\n});\n\nconst StyledVideoResultWrapper = styled(\"div\", {\n base: {\n display: \"flex\",\n flexDirection: \"column\",\n gap: \"medium\",\n alignItems: \"center\",\n },\n});\n\ninterface Props {\n videos: BrightcoveApiType[];\n existsMoreVideos: boolean;\n isLoading: boolean;\n translations: VideoTranslations;\n locale: string;\n onVideoSelect: (video: BrightcoveApiType) => void;\n onShowMore: () => void;\n}\n\nexport const VideoResultList = ({\n videos,\n existsMoreVideos,\n isLoading,\n translations,\n locale,\n onVideoSelect,\n onShowMore,\n}: Props) => {\n return (\n <StyledVideoResultWrapper>\n {!videos.length && !isLoading ? (\n <Text>{translations.noResults}</Text>\n ) : (\n <StyledList>\n {videos.map((video, index) => (\n <VideoListItem\n key={`${video.id}-${index}`}\n video={video}\n translations={translations}\n locale={locale}\n onVideoSelect={onVideoSelect}\n />\n ))}\n </StyledList>\n )}\n {!!isLoading && <Spinner />}\n {!!existsMoreVideos && <Button onClick={onShowMore}>{translations.loadMoreVideos}</Button>}\n </StyledVideoResultWrapper>\n );\n};\n"],"mappings":";;;;;;;;;;;;;AAcA,MAAM,
|
|
1
|
+
{"version":3,"file":"VideoResultList.js","names":["Text","VideoListItem","Spinner","Button"],"sources":["../src/VideoResultList.tsx"],"sourcesContent":["/**\n * Copyright (c) 2017-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { Text, Button, Spinner } from \"@ndla/primitives\";\nimport { styled } from \"@ndla/styled-system/jsx\";\nimport type { BrightcoveApiType } from \"@ndla/types-embed\";\nimport { VideoListItem } from \"./VideoListItem\";\nimport type { VideoTranslations } from \"./VideoSearch\";\n\nconst StyledList = styled(\"ul\", {\n base: {\n display: \"flex\",\n flexDirection: \"column\",\n gap: \"xxsmall\",\n listStyle: \"none\",\n width: \"100%\",\n },\n});\n\nconst StyledVideoResultWrapper = styled(\"div\", {\n base: {\n display: \"flex\",\n flexDirection: \"column\",\n gap: \"medium\",\n alignItems: \"center\",\n },\n});\n\ninterface Props {\n videos: BrightcoveApiType[];\n existsMoreVideos: boolean;\n isLoading: boolean;\n translations: VideoTranslations;\n locale: string;\n onVideoSelect: (video: BrightcoveApiType) => void;\n onShowMore: () => void;\n}\n\nexport const VideoResultList = ({\n videos,\n existsMoreVideos,\n isLoading,\n translations,\n locale,\n onVideoSelect,\n onShowMore,\n}: Props) => {\n return (\n <StyledVideoResultWrapper>\n {!videos.length && !isLoading ? (\n <Text>{translations.noResults}</Text>\n ) : (\n <StyledList>\n {videos.map((video, index) => (\n <VideoListItem\n key={`${video.id}-${index}`}\n video={video}\n translations={translations}\n locale={locale}\n onVideoSelect={onVideoSelect}\n />\n ))}\n </StyledList>\n )}\n {!!isLoading && <Spinner />}\n {!!existsMoreVideos && <Button onClick={onShowMore}>{translations.loadMoreVideos}</Button>}\n </StyledVideoResultWrapper>\n );\n};\n"],"mappings":";;;;;;;;;;;;;AAcA,MAAM,iDAAoB,MAAM,EAC9B,MAAM;CACJ,SAAS;CACT,eAAe;CACf,KAAK;CACL,WAAW;CACX,OAAO;CACR,EACF,CAAC;AAEF,MAAM,+DAAkC,OAAO,EAC7C,MAAM;CACJ,SAAS;CACT,eAAe;CACf,KAAK;CACL,YAAY;CACb,EACF,CAAC;AAYF,MAAa,mBAAmB,EAC9B,QACA,kBACA,WACA,cACA,QACA,eACA,iBACW;AACX,QACE,4CAAC;EACE,CAAC,OAAO,UAAU,CAAC,YAClB,2CAACA,mCAAM,aAAa,YAAiB,GAErC,2CAAC,wBACE,OAAO,KAAK,OAAO,UAClB,2CAACC;GAEQ;GACO;GACN;GACO;KAJV,GAAG,MAAM,GAAG,GAAG,QAKpB,CACF,GACS;EAEd,CAAC,CAAC,aAAa,2CAACC,6BAAU;EAC1B,CAAC,CAAC,oBAAoB,2CAACC;GAAO,SAAS;aAAa,aAAa;IAAwB;KACjE"}
|
package/lib/VideoSearch.js
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
const require_VideoResultList = require('./VideoResultList.js');
|
|
2
2
|
let react = require("react");
|
|
3
|
-
let
|
|
4
|
-
let
|
|
5
|
-
let
|
|
3
|
+
let _ndla_icons = require("@ndla/icons");
|
|
4
|
+
let _ndla_primitives = require("@ndla/primitives");
|
|
5
|
+
let _ndla_styled_system_jsx = require("@ndla/styled-system/jsx");
|
|
6
6
|
let react_jsx_runtime = require("react/jsx-runtime");
|
|
7
7
|
|
|
8
8
|
//#region src/VideoSearch.tsx
|
|
@@ -13,12 +13,12 @@ let react_jsx_runtime = require("react/jsx-runtime");
|
|
|
13
13
|
* LICENSE file in the root directory of this source tree.
|
|
14
14
|
*
|
|
15
15
|
*/
|
|
16
|
-
const VideoSearchWrapper = (0,
|
|
16
|
+
const VideoSearchWrapper = (0, _ndla_styled_system_jsx.styled)("div", { base: {
|
|
17
17
|
display: "flex",
|
|
18
18
|
flexDirection: "column",
|
|
19
19
|
gap: "xsmall"
|
|
20
20
|
} });
|
|
21
|
-
const InputWrapper = (0,
|
|
21
|
+
const InputWrapper = (0, _ndla_styled_system_jsx.styled)("div", { base: {
|
|
22
22
|
display: "flex",
|
|
23
23
|
gap: "xsmall"
|
|
24
24
|
} });
|
|
@@ -66,20 +66,20 @@ const VideoSearch = ({ onVideoSelect, searchVideos, onError, translations, local
|
|
|
66
66
|
};
|
|
67
67
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(VideoSearchWrapper, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(InputWrapper, {
|
|
68
68
|
role: "search",
|
|
69
|
-
children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(
|
|
69
|
+
children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ndla_primitives.Input, {
|
|
70
70
|
type: "search",
|
|
71
71
|
placeholder: translations.searchPlaceholder,
|
|
72
72
|
value: query,
|
|
73
73
|
onChange: onQueryChange,
|
|
74
74
|
onKeyDown: onEnter
|
|
75
|
-
}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(
|
|
75
|
+
}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ndla_primitives.IconButton, {
|
|
76
76
|
variant: "primary",
|
|
77
77
|
type: "submit",
|
|
78
78
|
"aria-label": translations.searchButtonTitle,
|
|
79
79
|
title: translations.searchButtonTitle,
|
|
80
80
|
onKeyDown: onEnter,
|
|
81
81
|
onClick: onSearch,
|
|
82
|
-
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(
|
|
82
|
+
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ndla_icons.SearchLine, {})
|
|
83
83
|
})]
|
|
84
84
|
}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_VideoResultList.VideoResultList, {
|
|
85
85
|
videos,
|
package/lib/VideoSearch.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"VideoSearch.js","names":["offset","Input","IconButton","SearchLine","VideoResultList"],"sources":["../src/VideoSearch.tsx"],"sourcesContent":["/**\n * Copyright (c) 2017-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { type ChangeEvent, useCallback, useEffect, useState, type KeyboardEvent } from \"react\";\nimport { SearchLine } from \"@ndla/icons\";\nimport { IconButton, Input } from \"@ndla/primitives\";\nimport { styled } from \"@ndla/styled-system/jsx\";\nimport type { BrightcoveApiType } from \"@ndla/types-embed\";\nimport { VideoResultList } from \"./VideoResultList\";\n\nexport interface VideoTranslations {\n searchPlaceholder: string;\n searchButtonTitle: string;\n loadMoreVideos: string;\n noResults: string;\n is360Video: string;\n previewVideo: string;\n addVideo: string;\n close: string;\n}\n\ninterface Props {\n onVideoSelect: (video: BrightcoveApiType) => void;\n searchVideos: (query: VideoQueryType) => Promise<BrightcoveApiType[]>;\n onError: (e: unknown) => void;\n translations: VideoTranslations;\n locale: string;\n}\n\nexport interface VideoQueryType {\n query: string;\n offset: number;\n limit: number;\n}\n\nconst VideoSearchWrapper = styled(\"div\", {\n base: {\n display: \"flex\",\n flexDirection: \"column\",\n gap: \"xsmall\",\n },\n});\n\nconst InputWrapper = styled(\"div\", {\n base: {\n display: \"flex\",\n gap: \"xsmall\",\n },\n});\n\nconst VIDEO_FETCH_LIMIT = 10;\n\nexport const VideoSearch = ({ onVideoSelect, searchVideos, onError, translations, locale }: Props) => {\n const [query, setQuery] = useState(\"\");\n const [offset, setOffset] = useState(0);\n const [videos, setVideos] = useState<BrightcoveApiType[]>([]);\n const [isLoading, setIsLoading] = useState(false);\n\n const fetchVideos = useCallback(\n async (query: string, offset: number, isAppending?: boolean) => {\n setIsLoading(true);\n try {\n const results = await searchVideos({\n query,\n offset: offset,\n limit: VIDEO_FETCH_LIMIT,\n });\n setVideos((prev) => (isAppending ? prev.concat(results) : results));\n } catch (e) {\n onError(e);\n }\n setIsLoading(false);\n },\n [searchVideos, onError],\n );\n\n useEffect(() => {\n fetchVideos(\"\", 0);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n const onSearch = useCallback(() => {\n setOffset(0);\n fetchVideos(query, 0);\n }, [fetchVideos, query]);\n\n const onShowMore = useCallback(() => {\n const newOffset = offset + VIDEO_FETCH_LIMIT;\n setOffset(newOffset);\n fetchVideos(query, newOffset, true);\n }, [fetchVideos, offset, query]);\n\n const onQueryChange = useCallback((e: ChangeEvent<HTMLInputElement>) => {\n setQuery(e.target.value);\n }, []);\n\n const onEnter = (e: KeyboardEvent<HTMLInputElement | HTMLButtonElement>) => {\n if (e.key === \"Enter\") {\n onSearch();\n }\n };\n\n return (\n <VideoSearchWrapper>\n <InputWrapper role=\"search\">\n <Input\n type=\"search\"\n placeholder={translations.searchPlaceholder}\n value={query}\n onChange={onQueryChange}\n onKeyDown={onEnter}\n />\n <IconButton\n variant=\"primary\"\n type=\"submit\"\n aria-label={translations.searchButtonTitle}\n title={translations.searchButtonTitle}\n onKeyDown={onEnter}\n onClick={onSearch}\n >\n <SearchLine />\n </IconButton>\n </InputWrapper>\n <VideoResultList\n videos={videos}\n isLoading={isLoading}\n translations={translations}\n locale={locale}\n onVideoSelect={onVideoSelect}\n onShowMore={onShowMore}\n existsMoreVideos={videos.length === offset + VIDEO_FETCH_LIMIT}\n />\n </VideoSearchWrapper>\n );\n};\n"],"mappings":";;;;;;;;;;;;;;;AAwCA,MAAM,
|
|
1
|
+
{"version":3,"file":"VideoSearch.js","names":["offset","Input","IconButton","SearchLine","VideoResultList"],"sources":["../src/VideoSearch.tsx"],"sourcesContent":["/**\n * Copyright (c) 2017-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { type ChangeEvent, useCallback, useEffect, useState, type KeyboardEvent } from \"react\";\nimport { SearchLine } from \"@ndla/icons\";\nimport { IconButton, Input } from \"@ndla/primitives\";\nimport { styled } from \"@ndla/styled-system/jsx\";\nimport type { BrightcoveApiType } from \"@ndla/types-embed\";\nimport { VideoResultList } from \"./VideoResultList\";\n\nexport interface VideoTranslations {\n searchPlaceholder: string;\n searchButtonTitle: string;\n loadMoreVideos: string;\n noResults: string;\n is360Video: string;\n previewVideo: string;\n addVideo: string;\n close: string;\n}\n\ninterface Props {\n onVideoSelect: (video: BrightcoveApiType) => void;\n searchVideos: (query: VideoQueryType) => Promise<BrightcoveApiType[]>;\n onError: (e: unknown) => void;\n translations: VideoTranslations;\n locale: string;\n}\n\nexport interface VideoQueryType {\n query: string;\n offset: number;\n limit: number;\n}\n\nconst VideoSearchWrapper = styled(\"div\", {\n base: {\n display: \"flex\",\n flexDirection: \"column\",\n gap: \"xsmall\",\n },\n});\n\nconst InputWrapper = styled(\"div\", {\n base: {\n display: \"flex\",\n gap: \"xsmall\",\n },\n});\n\nconst VIDEO_FETCH_LIMIT = 10;\n\nexport const VideoSearch = ({ onVideoSelect, searchVideos, onError, translations, locale }: Props) => {\n const [query, setQuery] = useState(\"\");\n const [offset, setOffset] = useState(0);\n const [videos, setVideos] = useState<BrightcoveApiType[]>([]);\n const [isLoading, setIsLoading] = useState(false);\n\n const fetchVideos = useCallback(\n async (query: string, offset: number, isAppending?: boolean) => {\n setIsLoading(true);\n try {\n const results = await searchVideos({\n query,\n offset: offset,\n limit: VIDEO_FETCH_LIMIT,\n });\n setVideos((prev) => (isAppending ? prev.concat(results) : results));\n } catch (e) {\n onError(e);\n }\n setIsLoading(false);\n },\n [searchVideos, onError],\n );\n\n useEffect(() => {\n fetchVideos(\"\", 0);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n const onSearch = useCallback(() => {\n setOffset(0);\n fetchVideos(query, 0);\n }, [fetchVideos, query]);\n\n const onShowMore = useCallback(() => {\n const newOffset = offset + VIDEO_FETCH_LIMIT;\n setOffset(newOffset);\n fetchVideos(query, newOffset, true);\n }, [fetchVideos, offset, query]);\n\n const onQueryChange = useCallback((e: ChangeEvent<HTMLInputElement>) => {\n setQuery(e.target.value);\n }, []);\n\n const onEnter = (e: KeyboardEvent<HTMLInputElement | HTMLButtonElement>) => {\n if (e.key === \"Enter\") {\n onSearch();\n }\n };\n\n return (\n <VideoSearchWrapper>\n <InputWrapper role=\"search\">\n <Input\n type=\"search\"\n placeholder={translations.searchPlaceholder}\n value={query}\n onChange={onQueryChange}\n onKeyDown={onEnter}\n />\n <IconButton\n variant=\"primary\"\n type=\"submit\"\n aria-label={translations.searchButtonTitle}\n title={translations.searchButtonTitle}\n onKeyDown={onEnter}\n onClick={onSearch}\n >\n <SearchLine />\n </IconButton>\n </InputWrapper>\n <VideoResultList\n videos={videos}\n isLoading={isLoading}\n translations={translations}\n locale={locale}\n onVideoSelect={onVideoSelect}\n onShowMore={onShowMore}\n existsMoreVideos={videos.length === offset + VIDEO_FETCH_LIMIT}\n />\n </VideoSearchWrapper>\n );\n};\n"],"mappings":";;;;;;;;;;;;;;;AAwCA,MAAM,yDAA4B,OAAO,EACvC,MAAM;CACJ,SAAS;CACT,eAAe;CACf,KAAK;CACN,EACF,CAAC;AAEF,MAAM,mDAAsB,OAAO,EACjC,MAAM;CACJ,SAAS;CACT,KAAK;CACN,EACF,CAAC;AAEF,MAAM,oBAAoB;AAE1B,MAAa,eAAe,EAAE,eAAe,cAAc,SAAS,cAAc,aAAoB;CACpG,MAAM,CAAC,OAAO,gCAAqB,GAAG;CACtC,MAAM,CAAC,QAAQ,iCAAsB,EAAE;CACvC,MAAM,CAAC,QAAQ,iCAA2C,EAAE,CAAC;CAC7D,MAAM,CAAC,WAAW,oCAAyB,MAAM;CAEjD,MAAM,qCACJ,OAAO,SAAe,UAAgB,gBAA0B;AAC9D,eAAa,KAAK;AAClB,MAAI;GACF,MAAM,UAAU,MAAM,aAAa;IACjC;IACA,QAAQA;IACR,OAAO;IACR,CAAC;AACF,cAAW,SAAU,cAAc,KAAK,OAAO,QAAQ,GAAG,QAAS;WAC5D,GAAG;AACV,WAAQ,EAAE;;AAEZ,eAAa,MAAM;IAErB,CAAC,cAAc,QAAQ,CACxB;AAED,4BAAgB;AACd,cAAY,IAAI,EAAE;IAEjB,EAAE,CAAC;CAEN,MAAM,wCAA6B;AACjC,YAAU,EAAE;AACZ,cAAY,OAAO,EAAE;IACpB,CAAC,aAAa,MAAM,CAAC;CAExB,MAAM,0CAA+B;EACnC,MAAM,YAAY,SAAS;AAC3B,YAAU,UAAU;AACpB,cAAY,OAAO,WAAW,KAAK;IAClC;EAAC;EAAa;EAAQ;EAAM,CAAC;CAEhC,MAAM,wCAA6B,MAAqC;AACtE,WAAS,EAAE,OAAO,MAAM;IACvB,EAAE,CAAC;CAEN,MAAM,WAAW,MAA2D;AAC1E,MAAI,EAAE,QAAQ,QACZ,WAAU;;AAId,QACE,4CAAC,iCACC,4CAAC;EAAa,MAAK;aACjB,2CAACC;GACC,MAAK;GACL,aAAa,aAAa;GAC1B,OAAO;GACP,UAAU;GACV,WAAW;IACX,EACF,2CAACC;GACC,SAAQ;GACR,MAAK;GACL,cAAY,aAAa;GACzB,OAAO,aAAa;GACpB,WAAW;GACX,SAAS;aAET,2CAACC,2BAAa;IACH;GACA,EACf,2CAACC;EACS;EACG;EACG;EACN;EACO;EACH;EACZ,kBAAkB,OAAO,WAAW,SAAS;GAC7C,IACiB"}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ndla/video-search",
|
|
3
3
|
"type": "module",
|
|
4
|
-
"version": "8.0.
|
|
4
|
+
"version": "8.0.136-alpha.0",
|
|
5
5
|
"description": "A simple library for searching NDLA videos",
|
|
6
6
|
"license": "GPL-3.0",
|
|
7
7
|
"exports": {
|
|
@@ -18,7 +18,7 @@
|
|
|
18
18
|
"repository": {
|
|
19
19
|
"type": "git",
|
|
20
20
|
"url": "https://github.com/NDLANO/frontend-packages.git",
|
|
21
|
-
"directory": "packages/
|
|
21
|
+
"directory": "packages/video-search"
|
|
22
22
|
},
|
|
23
23
|
"keywords": [
|
|
24
24
|
"ndla"
|
|
@@ -30,13 +30,13 @@
|
|
|
30
30
|
"es"
|
|
31
31
|
],
|
|
32
32
|
"dependencies": {
|
|
33
|
-
"@ndla/icons": "^8.0.
|
|
34
|
-
"@ndla/licenses": "^10.0.
|
|
35
|
-
"@ndla/primitives": "^1.0.
|
|
33
|
+
"@ndla/icons": "^8.0.76-alpha.0",
|
|
34
|
+
"@ndla/licenses": "^10.0.9-alpha.0",
|
|
35
|
+
"@ndla/primitives": "^1.0.116-alpha.0",
|
|
36
36
|
"@ndla/styled-system": "^0.0.46"
|
|
37
37
|
},
|
|
38
38
|
"devDependencies": {
|
|
39
|
-
"@ndla/preset-panda": "^0.0.
|
|
39
|
+
"@ndla/preset-panda": "^0.0.69",
|
|
40
40
|
"@ndla/types-embed": "^5.0.20-alpha.0",
|
|
41
41
|
"@pandacss/dev": "^1.7.0"
|
|
42
42
|
},
|
|
@@ -47,5 +47,5 @@
|
|
|
47
47
|
"publishConfig": {
|
|
48
48
|
"access": "public"
|
|
49
49
|
},
|
|
50
|
-
"gitHead": "
|
|
50
|
+
"gitHead": "121f4f2b6e0468246e98b17315ea35a4b2195c15"
|
|
51
51
|
}
|