npm - @verdaccio/ui-components - Versions diffs - 5.0.0-next-9.7 → 5.0.0-next-9.9 - Mend

@verdaccio/ui-components 5.0.0-next-9.7 → 5.0.0-next-9.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (261) hide show

package/build/components/Readme/hljs-github-dark.css ADDED Viewed

@@ -0,0 +1,117 @@
+[data-theme='dark'] pre code.hljs {
+  display: block;
+  overflow-x: auto;
+  padding: 1em;
+}
+[data-theme='dark'] code.hljs {
+  padding: 3px 5px;
+}
+/*!
+  Theme: GitHub Dark
+  Description: Dark theme as seen on github.com
+  Author: github.com
+  Maintainer: @Hirse
+  Updated: 2021-05-15
+  Outdated base version: https://github.com/primer/github-syntax-dark
+  Current colors taken from GitHub's CSS
+*/
+[data-theme='dark'] .hljs {
+  color: #c9d1d9;
+  background: #0d1117;
+}
+[data-theme='dark'] .hljs-doctag,
+[data-theme='dark'] .hljs-keyword,
+[data-theme='dark'] .hljs-meta .hljs-keyword,
+[data-theme='dark'] .hljs-template-tag,
+[data-theme='dark'] .hljs-template-variable,
+[data-theme='dark'] .hljs-type,
+[data-theme='dark'] .hljs-variable.language_ {
+  /* prettylights-syntax-keyword */
+  color: #ff7b72;
+}
+[data-theme='dark'] .hljs-title,
+[data-theme='dark'] .hljs-title.class_,
+[data-theme='dark'] .hljs-title.class_.inherited__,
+[data-theme='dark'] .hljs-title.function_ {
+  /* prettylights-syntax-entity */
+  color: #d2a8ff;
+}
+[data-theme='dark'] .hljs-attr,
+[data-theme='dark'] .hljs-attribute,
+[data-theme='dark'] .hljs-literal,
+[data-theme='dark'] .hljs-meta,
+[data-theme='dark'] .hljs-number,
+[data-theme='dark'] .hljs-operator,
+[data-theme='dark'] .hljs-variable,
+[data-theme='dark'] .hljs-selector-attr,
+[data-theme='dark'] .hljs-selector-class,
+[data-theme='dark'] .hljs-selector-id {
+  /* prettylights-syntax-constant */
+  color: #79c0ff;
+}
+[data-theme='dark'] .hljs-regexp,
+[data-theme='dark'] .hljs-string,
+[data-theme='dark'] .hljs-meta .hljs-string {
+  /* prettylights-syntax-string */
+  color: #a5d6ff;
+}
+[data-theme='dark'] .hljs-built_in,
+[data-theme='dark'] .hljs-symbol {
+  /* prettylights-syntax-variable */
+  color: #ffa657;
+}
+[data-theme='dark'] .hljs-comment,
+[data-theme='dark'] .hljs-code,
+[data-theme='dark'] .hljs-formula {
+  /* prettylights-syntax-comment */
+  color: #8b949e;
+}
+[data-theme='dark'] .hljs-name,
+[data-theme='dark'] .hljs-quote,
+[data-theme='dark'] .hljs-selector-tag,
+[data-theme='dark'] .hljs-selector-pseudo {
+  /* prettylights-syntax-entity-tag */
+  color: #7ee787;
+}
+[data-theme='dark'] .hljs-subst {
+  /* prettylights-syntax-storage-modifier-import */
+  color: #c9d1d9;
+}
+[data-theme='dark'] .hljs-section {
+  /* prettylights-syntax-markup-heading */
+  color: #1f6feb;
+  font-weight: bold;
+}
+[data-theme='dark'] .hljs-bullet {
+  /* prettylights-syntax-markup-list */
+  color: #f2cc60;
+}
+[data-theme='dark'] .hljs-emphasis {
+  /* prettylights-syntax-markup-italic */
+  color: #c9d1d9;
+  font-style: italic;
+}
+[data-theme='dark'] .hljs-strong {
+  /* prettylights-syntax-markup-bold */
+  color: #c9d1d9;
+  font-weight: bold;
+}
+[data-theme='dark'] .hljs-addition {
+  /* prettylights-syntax-markup-inserted */
+  color: #aff5b4;
+  background-color: #033a16;
+}
+[data-theme='dark'] .hljs-deletion {
+  /* prettylights-syntax-markup-deleted */
+  color: #ffdcd7;
+  background-color: #67060c;
+}
+[data-theme='dark'] .hljs-char.escape_,
+[data-theme='dark'] .hljs-link,
+[data-theme='dark'] .hljs-params,
+[data-theme='dark'] .hljs-property,
+[data-theme='dark'] .hljs-punctuation,
+[data-theme='dark'] .hljs-tag {
+  /* purposely ignored */
+}

package/build/components/Readme/hljs-github-light.css ADDED Viewed

@@ -0,0 +1,117 @@
+[data-theme='light'] pre code.hljs {
+  display: block;
+  overflow-x: auto;
+  padding: 1em;
+}
+[data-theme='light'] code.hljs {
+  padding: 3px 5px;
+}
+/*!
+  Theme: GitHub
+  Description: Light theme as seen on github.com
+  Author: github.com
+  Maintainer: @Hirse
+  Updated: 2021-05-15
+  Outdated base version: https://github.com/primer/github-syntax-light
+  Current colors taken from GitHub's CSS
+*/
+[data-theme='light'] .hljs {
+  color: #24292e;
+  background: #ffffff;
+}
+[data-theme='light'] .hljs-doctag,
+[data-theme='light'] .hljs-keyword,
+[data-theme='light'] .hljs-meta .hljs-keyword,
+[data-theme='light'] .hljs-template-tag,
+[data-theme='light'] .hljs-template-variable,
+[data-theme='light'] .hljs-type,
+[data-theme='light'] .hljs-variable.language_ {
+  /* prettylights-syntax-keyword */
+  color: #d73a49;
+}
+[data-theme='light'] .hljs-title,
+[data-theme='light'] .hljs-title.class_,
+[data-theme='light'] .hljs-title.class_.inherited__,
+[data-theme='light'] .hljs-title.function_ {
+  /* prettylights-syntax-entity */
+  color: #6f42c1;
+}
+[data-theme='light'] .hljs-attr,
+[data-theme='light'] .hljs-attribute,
+[data-theme='light'] .hljs-literal,
+[data-theme='light'] .hljs-meta,
+[data-theme='light'] .hljs-number,
+[data-theme='light'] .hljs-operator,
+[data-theme='light'] .hljs-variable,
+[data-theme='light'] .hljs-selector-attr,
+[data-theme='light'] .hljs-selector-class,
+[data-theme='light'] .hljs-selector-id {
+  /* prettylights-syntax-constant */
+  color: #0064d6;
+}
+[data-theme='light'] .hljs-regexp,
+[data-theme='light'] .hljs-string,
+[data-theme='light'] .hljs-meta .hljs-string {
+  /* prettylights-syntax-string */
+  color: #032f62;
+}
+[data-theme='light'] .hljs-built_in,
+[data-theme='light'] .hljs-symbol {
+  /* prettylights-syntax-variable */
+  color: #e36209;
+}
+[data-theme='light'] .hljs-comment,
+[data-theme='light'] .hljs-code,
+[data-theme='light'] .hljs-formula {
+  /* prettylights-syntax-comment */
+  color: #6a737d;
+}
+[data-theme='light'] .hljs-name,
+[data-theme='light'] .hljs-quote,
+[data-theme='light'] .hljs-selector-tag,
+[data-theme='light'] .hljs-selector-pseudo {
+  /* prettylights-syntax-entity-tag */
+  color: #22863a;
+}
+[data-theme='light'] .hljs-subst {
+  /* prettylights-syntax-storage-modifier-import */
+  color: #24292e;
+}
+[data-theme='light'] .hljs-section {
+  /* prettylights-syntax-markup-heading */
+  color: #005cc5;
+  font-weight: bold;
+}
+[data-theme='light'] .hljs-bullet {
+  /* prettylights-syntax-markup-list */
+  color: #735c0f;
+}
+[data-theme='light'] .hljs-emphasis {
+  /* prettylights-syntax-markup-italic */
+  color: #24292e;
+  font-style: italic;
+}
+[data-theme='light'] .hljs-strong {
+  /* prettylights-syntax-markup-bold */
+  color: #24292e;
+  font-weight: bold;
+}
+[data-theme='light'] .hljs-addition {
+  /* prettylights-syntax-markup-inserted */
+  color: #22863a;
+  background-color: #f0fff4;
+}
+[data-theme='light'] .hljs-deletion {
+  /* prettylights-syntax-markup-deleted */
+  color: #b31d28;
+  background-color: #ffeef0;
+}
+[data-theme='light'] .hljs-char.escape_,
+[data-theme='light'] .hljs-link,
+[data-theme='light'] .hljs-params,
+[data-theme='light'] .hljs-property,
+[data-theme='light'] .hljs-punctuation,
+[data-theme='light'] .hljs-tag {
+  /* purposely ignored */
+}

package/build/components/RegistryInfoDialog/RegistryInfoDialog.d.ts CHANGED Viewed

@@ -1,4 +1,4 @@
-import React from 'react';
-import type { Props } from './types';
+import { default as React } from 'react';
+import { Props } from './types';
 declare const RegistryInfoDialog: React.FC<Props>;
 export default RegistryInfoDialog;

package/build/components/RegistryInfoDialog/styles.d.ts CHANGED Viewed

@@ -1,13 +1,17 @@
-import type { Theme } from '../../';
-export declare const Title: import("@emotion/styled").StyledComponent<any, {}, {}>;
-export declare const Content: import("@emotion/styled").StyledComponent<import("@mui/material/DialogContent").DialogContentProps & {
-    theme?: import("@emotion/react").Theme;
+import { Theme } from '../../';
+export declare const Title: import('@emotion/styled').StyledComponent<import('@mui/material/DialogTitle').DialogTitleOwnProps & import('@mui/material/OverridableComponent').CommonProps & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "children" | "p" | "style" | "zIndex" | "typography" | "fontFamily" | "fontSize" | "fontWeight" | "alignContent" | "alignItems" | "alignSelf" | "bottom" | "boxShadow" | "boxSizing" | "color" | "columnGap" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontStyle" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "lineHeight" | "marginBlockEnd" | "marginBlockStart" | "marginBottom" | "marginInlineEnd" | "marginInlineStart" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "order" | "paddingBlockEnd" | "paddingBlockStart" | "paddingBottom" | "paddingInlineEnd" | "paddingInlineStart" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "rowGap" | "textAlign" | "textOverflow" | "textTransform" | "top" | "visibility" | "whiteSpace" | "width" | "border" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderTop" | "flex" | "gap" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "marginBlock" | "marginInline" | "overflow" | "padding" | "paddingBlock" | "paddingInline" | "className" | "classes" | "sx" | "variant" | "bgcolor" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "displayPrint" | "align" | "gutterBottom" | "noWrap" | "paragraph" | "variantMapping"> & {
+    theme?: import('@emotion/react').Theme;
 } & {
     theme?: Theme;
 }, {}, {}>;
-export declare const TextContent: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme;
+export declare const Content: import('@emotion/styled').StyledComponent<import('@mui/material/DialogContent').DialogContentProps & {
+    theme?: import('@emotion/react').Theme;
+} & {
+    theme?: Theme;
+}, {}, {}>;
+export declare const TextContent: import('@emotion/styled').StyledComponent<{
+    theme?: import('@emotion/react').Theme;
     as?: React.ElementType;
 } & {
     theme?: Theme;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+}, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/build/components/RegistryInfoDialog/types.d.ts CHANGED Viewed

@@ -1,4 +1,4 @@
-import type { ReactNode } from 'react';
+import { ReactNode } from 'react';
 export interface Props {
     children: ReactNode;
     open: boolean;

package/build/components/Repository/Repository.d.ts CHANGED Viewed

@@ -1,4 +1,4 @@
-import React from 'react';
+import { default as React } from 'react';
 declare const Repository: React.FC<{
     packageMeta: any;
 }>;

package/build/components/Repository/Repository.mjs CHANGED Viewed

@@ -13,11 +13,11 @@ import { useTranslation } from "react-i18next";
 import { common } from "@mui/material/colors";
 import List from "@mui/material/List";
 import Avatar from "@mui/material/Avatar";
-import MaterialUITypography from "@mui/material/Typography";
+import Typography from "@mui/material/Typography";
 import ListItem from "@mui/material/ListItem";
-import ListItemText from "@mui/material/ListItemText";
+import MuiListItemText from "@mui/material/ListItemText";
 //#region src/components/Repository/Repository.tsx
-var StyledText = styled(MaterialUITypography)((props) => ({
+var StyledText = styled(Typography)((props) => ({
 	fontWeight: props.theme.fontWeight.bold,
 	textTransform: "capitalize"
 }));
@@ -25,7 +25,7 @@ var RepositoryListItem = styled(ListItem)({
 	padding: 0,
 	":hover": { backgroundColor: "transparent" }
 });
-var RepositoryListItemText = styled(ListItemText)({
+var RepositoryListItemText = styled(MuiListItemText)({
 	padding: "0 0 0 10px",
 	margin: 0
 });

package/build/components/Repository/Repository.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Repository.mjs","names":[],"sources":["../../../src/components/Repository/Repository.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport Avatar from '@mui/material/Avatar';\nimport List from '@mui/material/List';\nimport ListItem from '@mui/material/ListItem';\nimport ListItemText from '@mui/material/ListItemText';\nimport Typography from '@mui/material/Typography';\nimport { common } from '@mui/material/colors';\nimport React from 'react';\nimport { useTranslation } from 'react-i18next';\n\nimport type { Theme } from '../../Theme';\nimport { url as urlUtils } from '../../utils';\nimport CopyClipboard from '../CopyClipboard';\nimport { Git } from '../Icons';\nimport LinkExternal from '../LinkExternal';\n\nconst StyledText = styled(Typography)<{ theme?: Theme }>((props) => ({\n fontWeight: props.theme.fontWeight.bold,\n textTransform: 'capitalize',\n}));\n\nconst RepositoryListItem = styled(ListItem)({\n padding: 0,\n ':hover': {\n backgroundColor: 'transparent',\n },\n});\n\nconst RepositoryListItemText = styled(ListItemText)({\n padding: '0 0 0 10px',\n margin: 0,\n});\n\nconst RepositoryAvatar = styled(Avatar)({\n padding: 0,\n marginLeft: 0,\n backgroundColor: 'transparent',\n});\n\nconst Repository: React.FC<{ packageMeta: any }> = ({ packageMeta }) => {\n const { t } = useTranslation();\n const url = packageMeta?.latest?.repository?.url;\n if (!url \|\| !urlUtils.isURL(url)) {\n return null;\n }\n\n const getCorrectRepositoryURL = (): string => {\n if (!url.includes('git+')) {\n return url;\n }\n\n return url.split('git+')[1];\n };\n\n const repositoryURL = getCorrectRepositoryURL();\n\n return (\n <List\n dense={true}\n subheader={<StyledText variant=\"subtitle1\">{t('sidebar.repository.title')}</StyledText>}\n >\n <RepositoryListItem>\n <RepositoryAvatar sx={{ bgcolor: common.white }}>\n <Git />\n </RepositoryAvatar>\n <RepositoryListItemText\n primary={\n <CopyClipboard dataTestId=\"repositoryID\" text={repositoryURL} title={repositoryURL}>\n <LinkExternal to={repositoryURL} variant=\"outline\">\n {repositoryURL}\n </LinkExternal>\n </CopyClipboard>\n }\n />\n </RepositoryListItem>\n </List>\n );\n};\n\nexport default Repository;\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAgBA,IAAM,aAAa,OAAO,~~qBAAW~~,EAAqB,WAAW;CACnE,YAAY,MAAM,MAAM,WAAW;CACnC,eAAe;CAChB,EAAE;AAEH,IAAM,qBAAqB,OAAO,SAAS,CAAC;CAC1C,SAAS;CACT,UAAU,EACR,iBAAiB,eAClB;CACF,CAAC;AAEF,IAAM,yBAAyB,OAAO,~~aAAa~~,CAAC;CAClD,SAAS;CACT,QAAQ;CACT,CAAC;AAEF,IAAM,mBAAmB,OAAO,OAAO,CAAC;CACtC,SAAS;CACT,YAAY;CACZ,iBAAiB;CAClB,CAAC;AAEF,IAAM,cAA8C,EAAE,kBAAkB;CACtE,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,MAAM,aAAa,QAAQ,YAAY;AAC7C,KAAI,CAAC,OAAO,CAAC,MAAe,IAAI,CAC9B,QAAO;CAGT,MAAM,gCAAwC;AAC5C,MAAI,CAAC,IAAI,SAAS,OAAO,CACvB,QAAO;AAGT,SAAO,IAAI,MAAM,OAAO,CAAC;;CAG3B,MAAM,gBAAgB,yBAAyB;AAE/C,QACE,oBAAC,MAAD;EACE,OAAO;EACP,WAAW,oBAAC,YAAD;GAAY,SAAQ;aAAa,EAAE,2BAA2B;GAAc,CAAA;YAEvF,qBAAC,oBAAD,EAAA,UAAA,CACE,oBAAC,kBAAD;GAAkB,IAAI,EAAE,SAAS,OAAO,OAAO;aAC7C,oBAAC,KAAD,EAAO,CAAA;GACU,CAAA,EACnB,oBAAC,wBAAD,EACE,SACE,oBAAC,iBAAD;GAAe,YAAW;GAAe,MAAM;GAAe,OAAO;aACnE,oBAAC,cAAD;IAAc,IAAI;IAAe,SAAQ;cACtC;IACY,CAAA;GACD,CAAA,EAElB,CAAA,CACiB,EAAA,CAAA;EAChB,CAAA"}
1	+ {"version":3,"file":"Repository.mjs","names":[],"sources":["../../../src/components/Repository/Repository.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport Avatar from '@mui/material/Avatar';\nimport List from '@mui/material/List';\nimport ListItem from '@mui/material/ListItem';\nimport ListItemText from '@mui/material/ListItemText';\nimport Typography from '@mui/material/Typography';\nimport { common } from '@mui/material/colors';\nimport React from 'react';\nimport { useTranslation } from 'react-i18next';\n\nimport type { Theme } from '../../Theme';\nimport { url as urlUtils } from '../../utils';\nimport CopyClipboard from '../CopyClipboard';\nimport { Git } from '../Icons';\nimport LinkExternal from '../LinkExternal';\n\nconst StyledText = styled(Typography)<{ theme?: Theme }>((props) => ({\n fontWeight: props.theme.fontWeight.bold,\n textTransform: 'capitalize',\n}));\n\nconst RepositoryListItem = styled(ListItem)({\n padding: 0,\n ':hover': {\n backgroundColor: 'transparent',\n },\n});\n\nconst RepositoryListItemText = styled(ListItemText)({\n padding: '0 0 0 10px',\n margin: 0,\n});\n\nconst RepositoryAvatar = styled(Avatar)({\n padding: 0,\n marginLeft: 0,\n backgroundColor: 'transparent',\n});\n\nconst Repository: React.FC<{ packageMeta: any }> = ({ packageMeta }) => {\n const { t } = useTranslation();\n const url = packageMeta?.latest?.repository?.url;\n if (!url \|\| !urlUtils.isURL(url)) {\n return null;\n }\n\n const getCorrectRepositoryURL = (): string => {\n if (!url.includes('git+')) {\n return url;\n }\n\n return url.split('git+')[1];\n };\n\n const repositoryURL = getCorrectRepositoryURL();\n\n return (\n <List\n dense={true}\n subheader={<StyledText variant=\"subtitle1\">{t('sidebar.repository.title')}</StyledText>}\n >\n <RepositoryListItem>\n <RepositoryAvatar sx={{ bgcolor: common.white }}>\n <Git />\n </RepositoryAvatar>\n <RepositoryListItemText\n primary={\n <CopyClipboard dataTestId=\"repositoryID\" text={repositoryURL} title={repositoryURL}>\n <LinkExternal to={repositoryURL} variant=\"outline\">\n {repositoryURL}\n </LinkExternal>\n </CopyClipboard>\n }\n />\n </RepositoryListItem>\n </List>\n );\n};\n\nexport default Repository;\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAgBA,IAAM,aAAa,OAAO,WAAW,EAAqB,WAAW;CACnE,YAAY,MAAM,MAAM,WAAW;CACnC,eAAe;CAChB,EAAE;AAEH,IAAM,qBAAqB,OAAO,SAAS,CAAC;CAC1C,SAAS;CACT,UAAU,EACR,iBAAiB,eAClB;CACF,CAAC;AAEF,IAAM,yBAAyB,OAAO,gBAAa,CAAC;CAClD,SAAS;CACT,QAAQ;CACT,CAAC;AAEF,IAAM,mBAAmB,OAAO,OAAO,CAAC;CACtC,SAAS;CACT,YAAY;CACZ,iBAAiB;CAClB,CAAC;AAEF,IAAM,cAA8C,EAAE,kBAAkB;CACtE,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,MAAM,aAAa,QAAQ,YAAY;AAC7C,KAAI,CAAC,OAAO,CAAC,MAAe,IAAI,CAC9B,QAAO;CAGT,MAAM,gCAAwC;AAC5C,MAAI,CAAC,IAAI,SAAS,OAAO,CACvB,QAAO;AAGT,SAAO,IAAI,MAAM,OAAO,CAAC;;CAG3B,MAAM,gBAAgB,yBAAyB;AAE/C,QACE,oBAAC,MAAD;EACE,OAAO;EACP,WAAW,oBAAC,YAAD;GAAY,SAAQ;aAAa,EAAE,2BAA2B;GAAc,CAAA;YAEvF,qBAAC,oBAAD,EAAA,UAAA,CACE,oBAAC,kBAAD;GAAkB,IAAI,EAAE,SAAS,OAAO,OAAO;aAC7C,oBAAC,KAAD,EAAO,CAAA;GACU,CAAA,EACnB,oBAAC,wBAAD,EACE,SACE,oBAAC,iBAAD;GAAe,YAAW;GAAe,MAAM;GAAe,OAAO;aACnE,oBAAC,cAAD;IAAc,IAAI;IAAe,SAAQ;cACtC;IACY,CAAA;GACD,CAAA,EAElB,CAAA,CACiB,EAAA,CAAA;EAChB,CAAA"}

package/build/components/Search/AutoComplete/AutoComplete.d.ts CHANGED Viewed

@@ -1,6 +1,5 @@
-import type { FC } from 'react';
-import React from 'react';
-import type { SearchResultWeb } from '@verdaccio/types';
+import { FC, default as React } from 'react';
+import { SearchResultWeb } from '@verdaccio/types';
 export type OnSelecItem = (event: React.SyntheticEvent, value: SearchResultWeb, reason: string, details?: string) => void;
 interface Props {
     suggestions?: SearchResultWeb[];

package/build/components/Search/AutoComplete/styles.d.ts CHANGED Viewed

@@ -1,4 +1,4 @@
-export declare const Wrapper: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme;
+export declare const Wrapper: import('@emotion/styled').StyledComponent<{
+    theme?: import('@emotion/react').Theme;
     as?: React.ElementType;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+}, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/build/components/Search/Search.d.ts CHANGED Viewed

@@ -1,3 +1,3 @@
-import React from 'react';
+import { default as React } from 'react';
 declare const Search: React.FC;
 export default Search;

package/build/components/Search/Search.js CHANGED Viewed

@@ -1,10 +1,10 @@
 const require_runtime = require("../../_virtual/_rolldown/runtime.js");
 const require_routes = require("../../utils/routes.js");
 require("../../utils/index.js");
-const require_AppConfigurationProvider = require("../../providers/AppConfigurationProvider/AppConfigurationProvider.js");
 const require_SearchProvider = require("../../providers/SearchProvider/SearchProvider.js");
 const require_AutoComplete = require("./AutoComplete/AutoComplete.js");
 require("./AutoComplete/index.js");
+const require_utils = require("./utils.js");
 const require_SearchItem = require("./SearchItem.js");
 const require_styles = require("./styles.js");
 require("../../index.js");
@@ -25,8 +25,6 @@ var Search = () => {
 	const { t } = (0, react_i18next.useTranslation)();
 	const navigate = (0, react_router.useNavigate)();
 	const { searchResults, isLoading, doSearch } = require_SearchProvider.useSearch();
-	const { configOptions: { flags } } = require_AppConfigurationProvider.useConfig();
-	const searchRemote = flags?.searchRemote ?? false;
 	const abortControllerRef = (0, react.useRef)(null);
 	const cancelAllSearchRequests = (0, react.useCallback)(() => {
 		if (abortControllerRef.current) {
@@ -41,10 +39,10 @@ var Search = () => {
 	const handleClickSearch = (0, react.useCallback)((event, value, reason) => {
 		event.stopPropagation();
 		if (reason === "selectOption") {
-			const pkgName = value["package"]?.name ?? value.name;
-			navigate(`${require_routes.Route.DETAIL}${pkgName}`);
+			const { name } = require_utils.normalizeSearchOption(value);
+			if (name) navigate(`${require_routes.Route.DETAIL}${name}`);
 		}
-	}, [navigate, searchRemote]);
+	}, [navigate]);
 	const doSearchRef = (0, react.useRef)(doSearch);
 	doSearchRef.current = doSearch;
 	/**
@@ -76,29 +74,16 @@ var Search = () => {
 	}, [debouncedFetch, cancelAllSearchRequests]);
 	const renderOption = (props, option) => {
 		const { key, ...otherProps } = props;
-		if (searchRemote) {
-			const item = option.package;
-			const isPrivate = option?.verdaccioPrivate;
-			const isCached = option?.verdaccioPkgCached;
-			const isRemote = !isCached && !isPrivate;
-			return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_SearchItem.default, {
-				...otherProps,
-				description: item?.description,
-				isCached,
-				isPrivate,
-				isRemote,
-				name: item?.name,
-				version: item?.version
-			}, key);
-		} else {
-			const item = option.package;
-			return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_SearchItem.default, {
-				...otherProps,
-				description: item?.description,
-				name: item?.name,
-				version: item?.version
-			}, key);
-		}
+		const { name, version, description, isPrivate, isCached, isRemote } = require_utils.normalizeSearchOption(option);
+		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_SearchItem.default, {
+			...otherProps,
+			description,
+			isCached,
+			isPrivate,
+			isRemote,
+			name,
+			version
+		}, key);
 	};
 	const renderInput = (params) => {
 		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_styles.StyledTextField, {
@@ -116,7 +101,7 @@ var Search = () => {
 		});
 	};
 	const getOptionLabel = (option) => {
-		return option?.package?.name;
+		return require_utils.normalizeSearchOption(option).name;
 	};
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_AutoComplete.default, {
 		getOptionLabel,

package/build/components/Search/Search.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Search.js","names":[],"sources":["../../../src/components/Search/Search.tsx"],"sourcesContent":["import SearchMui from '@mui/icons-material/Search';\nimport { debounce } from 'lodash-es';\nimport React, { useCallback, useEffect, useMemo, useRef } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { useNavigate } from 'react-router';\n\nimport ~~type~~ { ~~SearchResultWeb } from '@verdaccio/types';\n\nimport { useConfig,~~ useSearch } from '../../';\nimport { Route } from '../../utils';\nimport AutoComplete from './AutoComplete';\nimport SearchItem from './SearchItem';\nimport { StyledInputAdornment, StyledTextField } from './styles';\n\nconst CONSTANTS = {\n API_DELAY: 300,\n ABORT_ERROR: 'AbortError',\n};\n\nconst Search: React.FC = () => {\n const { t } = useTranslation();\n const navigate = useNavigate();\n const { searchResults, isLoading, doSearch } = useSearch();\n ~~const {~~\n ~~configOptions: { flags },\n~~ ~~} = useConfig();\n~~ const ~~searchRemote = flags?.searchRemote ?? false;\n\n const~~ abortControllerRef = useRef<AbortController \| null>(null);\n\n const cancelAllSearchRequests = useCallback(() => {\n if (abortControllerRef.current) {\n abortControllerRef.current.abort();\n abortControllerRef.current = null;\n }\n }, []);\n\n const handleOnBlur = useCallback(\n (event: React.SyntheticEvent) => {\n event.stopPropagation();\n cancelAllSearchRequests();\n },\n [cancelAllSearchRequests]\n );\n\n const handleClickSearch = useCallback(\n (event: React.SyntheticEvent, value: ~~SearchResultWeb~~, reason: string): void => {\n event.stopPropagation();\n if (reason === 'selectOption') {\n const ~~pkgName~~ ~~= value['package']?.~~name ?? value~~.name~~;\n navigate(`${Route.DETAIL}${~~pkgName~~}`);\n }\n },\n [navigate~~, searchRemote~~]\n );\n\n // Use a ref to always access the latest doSearch without re-creating the debounced function\n const doSearchRef = useRef(doSearch);\n doSearchRef.current = doSearch;\n\n /*\n Stable fetch function that reads the latest doSearch from a ref,\n * avoiding dependency changes that would break the debounce.\n */\n const handleFetchPackages = useCallback(\n async ({ value }: { value: string }) => {\n if (value?.trim() !== '') {\n // Abort any previous pending request before starting a new one\n cancelAllSearchRequests();\n\n // Create a new controller for the current request\n const controller = new AbortController();\n abortControllerRef.current = controller;\n\n try {\n await doSearchRef.current?.({\n text: value,\n signal: controller.signal,\n });\n } catch (err: any) {\n if (err.name === CONSTANTS.ABORT_ERROR) {\n console.warn('Search request aborted');\n } else {\n console.error('Search error:', err);\n }\n }\n }\n },\n [cancelAllSearchRequests]\n );\n\n // Memoize the debounced function so a single instance is reused across renders,\n // ensuring the debounce timer works correctly instead of creating a new timer per render.\n const debouncedFetch = useMemo(\n () => debounce(handleFetchPackages, CONSTANTS.API_DELAY),\n [handleFetchPackages]\n );\n\n useEffect(() => {\n return () => {\n debouncedFetch.cancel?.();\n cancelAllSearchRequests();\n };\n }, [debouncedFetch, cancelAllSearchRequests]);\n\n const renderOption = (props, option) => {\n const { key, ...otherProps } = props;\n\n if ~~(searchRemote)~~ {~~\n const~~ ~~item:~~ ~~SearchResultWeb~~ = ~~option.package;\n const~~ isPrivate = ~~option?.verdaccioPrivate;\n const~~ ~~isCached~~ ~~= option?.verdaccioPkgCached;\~~n ~~const isRemote = !isCached && !isPrivate~~;\n return (\n <SearchItem\n key={key}\n {...otherProps}\n description={~~item?.~~description}\n isCached={isCached}\n isPrivate={isPrivate}\n isRemote={isRemote}\n name={~~item?.~~name}\n version={~~item?.~~version}\n />\n ~~);\n~~ } else {\n const item: SearchResultWeb = option.package;\n return (\n <SearchItem\n key={key}\n {...otherProps}\n description={item?.description}\n name={item?.name}\n version={item?.version}\n />\n );\n ~~}\n~~ };\n\n const renderInput = (params) => {\n return (\n <StyledTextField\n {...params}\n InputProps={{\n ...params.InputProps,\n startAdornment: (\n <StyledInputAdornment position=\"start\">\n <SearchMui />\n </StyledInputAdornment>\n ),\n }}\n label=\"\"\n placeholder={t('search.packages')}\n variant=\"standard\"\n />\n );\n };\n\n const getOptionLabel = (option) => {\n return option~~?.package?.~~name;\n };\n\n return (\n <AutoComplete\n getOptionLabel={getOptionLabel}\n onCleanSuggestions={handleOnBlur}\n onSelectItem={handleClickSearch}\n onSuggestionsFetch={debouncedFetch}\n placeholder={t('search.packages')}\n renderInput={renderInput}\n renderOption={renderOption}\n suggestions={searchResults}\n suggestionsLoading={isLoading}\n />\n );\n};\n\nexport default Search;\n"],"mappings":";;;;;;;;;;;;;;;;;;;~~AAcA~~,IAAM,YAAY;CAChB,WAAW;CACX,aAAa;CACd;AAED,IAAM,eAAyB;CAC7B,MAAM,EAAE,OAAA,GAAA,cAAA,iBAAsB;CAC9B,MAAM,YAAA,GAAA,aAAA,cAAwB;CAC9B,MAAM,EAAE,eAAe,WAAW,aAAa,uBAAA,WAAW;~~CAC1D~~,MAAM,~~EACJ,eAAe,EAAE,YACf,iCAAA,WAAW;CACf,MAAM,eAAe,OAAO,gBAAgB;CAE5C,MAAM,~~sBAAA,GAAA,MAAA,QAAoD,KAAK;CAE/D,MAAM,2BAAA,GAAA,MAAA,mBAA4C;AAChD,MAAI,mBAAmB,SAAS;AAC9B,sBAAmB,QAAQ,OAAO;AAClC,sBAAmB,UAAU;;IAE9B,EAAE,CAAC;CAEN,MAAM,gBAAA,GAAA,MAAA,cACH,UAAgC;AAC/B,QAAM,iBAAiB;AACvB,2BAAyB;IAE3B,CAAC,wBAAwB,CAC1B;CAED,MAAM,qBAAA,GAAA,MAAA,cACH,OAA6B,~~OAAwB~~,WAAyB;~~AAC7E~~,QAAM,iBAAiB;AACvB,MAAI,WAAW,gBAAgB;GAC7B,MAAM,~~UAAU~~,~~MAAM~~,~~YAAY~~,~~QAAQ~~,MAAM;~~AAChD~~,~~YAAS~~,GAAG,eAAA,MAAM,SAAS,~~UAAU~~;;~~IAGzC~~,CAAC,~~UAAU~~,~~aAAa,CACzB~~;CAGD,MAAM,eAAA,GAAA,MAAA,QAAqB,SAAS;AACpC,aAAY,UAAU;;;;;CAMtB,MAAM,uBAAA,GAAA,MAAA,aACJ,OAAO,EAAE,YAA+B;AACtC,MAAI,OAAO,MAAM,KAAK,IAAI;AAExB,4BAAyB;GAGzB,MAAM,aAAa,IAAI,iBAAiB;AACxC,sBAAmB,UAAU;AAE7B,OAAI;AACF,UAAM,YAAY,UAAU;KAC1B,MAAM;KACN,QAAQ,WAAW;KACpB,CAAC;YACK,KAAU;AACjB,QAAI,IAAI,SAAS,UAAU,YACzB,SAAQ,KAAK,yBAAyB;QAEtC,SAAQ,MAAM,iBAAiB,IAAI;;;IAK3C,CAAC,wBAAwB,CAC1B;CAID,MAAM,kBAAA,GAAA,MAAA,gBAAA,GAAA,UAAA,UACW,qBAAqB,UAAU,UAAU,EACxD,CAAC,oBAAoB,CACtB;AAED,EAAA,GAAA,MAAA,iBAAgB;AACd,eAAa;AACX,kBAAe,UAAU;AACzB,4BAAyB;;IAE1B,CAAC,gBAAgB,wBAAwB,CAAC;CAE7C,MAAM,gBAAgB,OAAO,WAAW;EACtC,MAAM,EAAE,KAAK,GAAG,eAAe;~~AAE~~/B,~~MAAI,cAAc;GAChB,~~MAAM,~~OAAwB~~,~~OAAO;GACrC,~~MAAM,~~YAAY~~,~~QAAQ;GAC1B~~,~~MAAM,~~WAAW,~~QAAQ;GACzB~~,~~MAAM~~,~~WAAW~~,~~CAAC~~,~~YAAY,CAAC~~;AAC/B,~~UACE~~,iBAAA,GAAA,kBAAA,KAAC,mBAAA,SAAD;~~IAEE~~,GAAI;~~IACJ,aAAa,MAAM~~;~~IACT~~;~~IACC~~;~~IACD~~;~~IACV,MAAM,MAAM~~;~~IACZ,SAAS,MAAM~~;~~IACf~~,EARK,IAQL~~;SAEC;GACL~~,MAAM,~~OAAwB,OAAO;AACrC,UACE,iBAAA,GAAA,kBAAA,KAAC,mBAAA,SAAD;IAEE,GAAI;IACJ,aAAa,MAAM;IACnB,MAAM,MAAM;IACZ,SAAS,MAAM;IACf,EALK,IAKL;;;CAKR,MAAM,~~eAAe,WAAW;AAC9B,SACE,iBAAA,GAAA,kBAAA,KAAC,eAAA,iBAAD;GACE,GAAI;GACJ,YAAY;IACV,GAAG,OAAO;IACV,gBACE,iBAAA,GAAA,kBAAA,KAAC,eAAA,sBAAD;KAAsB,UAAS;eAC7B,iBAAA,GAAA,kBAAA,KAAC,2BAAA,SAAD,EAAa,CAAA;KACQ,CAAA;IAE1B;GACD,OAAM;GACN,aAAa,EAAE,kBAAkB;GACjC,SAAQ;GACR,CAAA;;CAIN,MAAM,kBAAkB,WAAW;AACjC,SAAO,~~QAAQ~~,~~SAAS~~;;~~AAG1B~~,QACE,iBAAA,GAAA,kBAAA,KAAC,qBAAA,SAAD;EACkB;EAChB,oBAAoB;EACpB,cAAc;EACd,oBAAoB;EACpB,aAAa,EAAE,kBAAkB;EACpB;EACC;EACd,aAAa;EACb,oBAAoB;EACpB,CAAA"}
1	+ {"version":3,"file":"Search.js","names":[],"sources":["../../../src/components/Search/Search.tsx"],"sourcesContent":["import SearchMui from '@mui/icons-material/Search';\nimport { debounce } from 'lodash-es';\nimport React, { useCallback, useEffect, useMemo, useRef } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { useNavigate } from 'react-router';\n\nimport { useSearch } from '../../';\nimport { Route } from '../../utils';\nimport AutoComplete from './AutoComplete';\nimport SearchItem from './SearchItem';\nimport { StyledInputAdornment, StyledTextField } from './styles';\nimport { normalizeSearchOption } from './utils';\n\nconst CONSTANTS = {\n API_DELAY: 300,\n ABORT_ERROR: 'AbortError',\n};\n\nconst Search: React.FC = () => {\n const { t } = useTranslation();\n const navigate = useNavigate();\n const { searchResults, isLoading, doSearch } = useSearch();\n\n const abortControllerRef = useRef<AbortController \| null>(null);\n\n const cancelAllSearchRequests = useCallback(() => {\n if (abortControllerRef.current) {\n abortControllerRef.current.abort();\n abortControllerRef.current = null;\n }\n }, []);\n\n const handleOnBlur = useCallback(\n (event: React.SyntheticEvent) => {\n event.stopPropagation();\n cancelAllSearchRequests();\n },\n [cancelAllSearchRequests]\n );\n\n const handleClickSearch = useCallback(\n (event: React.SyntheticEvent, value: any, reason: string): void => {\n event.stopPropagation();\n if (reason === 'selectOption') {\n const { name } = normalizeSearchOption(value);\n if (name) {\n navigate(`${Route.DETAIL}${name}`);\n }\n }\n },\n [navigate]\n );\n\n // Use a ref to always access the latest doSearch without re-creating the debounced function\n const doSearchRef = useRef(doSearch);\n doSearchRef.current = doSearch;\n\n /*\n Stable fetch function that reads the latest doSearch from a ref,\n * avoiding dependency changes that would break the debounce.\n */\n const handleFetchPackages = useCallback(\n async ({ value }: { value: string }) => {\n if (value?.trim() !== '') {\n // Abort any previous pending request before starting a new one\n cancelAllSearchRequests();\n\n // Create a new controller for the current request\n const controller = new AbortController();\n abortControllerRef.current = controller;\n\n try {\n await doSearchRef.current?.({\n text: value,\n signal: controller.signal,\n });\n } catch (err: any) {\n if (err.name === CONSTANTS.ABORT_ERROR) {\n console.warn('Search request aborted');\n } else {\n console.error('Search error:', err);\n }\n }\n }\n },\n [cancelAllSearchRequests]\n );\n\n // Memoize the debounced function so a single instance is reused across renders,\n // ensuring the debounce timer works correctly instead of creating a new timer per render.\n const debouncedFetch = useMemo(\n () => debounce(handleFetchPackages, CONSTANTS.API_DELAY),\n [handleFetchPackages]\n );\n\n useEffect(() => {\n return () => {\n debouncedFetch.cancel?.();\n cancelAllSearchRequests();\n };\n }, [debouncedFetch, cancelAllSearchRequests]);\n\n const renderOption = (props, option) => {\n const { key, ...otherProps } = props;\n const { name, version, description, isPrivate, isCached, isRemote } =\n normalizeSearchOption(option);\n return (\n <SearchItem\n key={key}\n {...otherProps}\n description={description}\n isCached={isCached}\n isPrivate={isPrivate}\n isRemote={isRemote}\n name={name}\n version={version}\n />\n );\n };\n\n const renderInput = (params) => {\n return (\n <StyledTextField\n {...params}\n InputProps={{\n ...params.InputProps,\n startAdornment: (\n <StyledInputAdornment position=\"start\">\n <SearchMui />\n </StyledInputAdornment>\n ),\n }}\n label=\"\"\n placeholder={t('search.packages')}\n variant=\"standard\"\n />\n );\n };\n\n const getOptionLabel = (option) => {\n return normalizeSearchOption(option).name;\n };\n\n return (\n <AutoComplete\n getOptionLabel={getOptionLabel}\n onCleanSuggestions={handleOnBlur}\n onSelectItem={handleClickSearch}\n onSuggestionsFetch={debouncedFetch}\n placeholder={t('search.packages')}\n renderInput={renderInput}\n renderOption={renderOption}\n suggestions={searchResults}\n suggestionsLoading={isLoading}\n />\n );\n};\n\nexport default Search;\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAaA,IAAM,YAAY;CAChB,WAAW;CACX,aAAa;CACd;AAED,IAAM,eAAyB;CAC7B,MAAM,EAAE,OAAA,GAAA,cAAA,iBAAsB;CAC9B,MAAM,YAAA,GAAA,aAAA,cAAwB;CAC9B,MAAM,EAAE,eAAe,WAAW,aAAa,uBAAA,WAAW;CAE1D,MAAM,sBAAA,GAAA,MAAA,QAAoD,KAAK;CAE/D,MAAM,2BAAA,GAAA,MAAA,mBAA4C;AAChD,MAAI,mBAAmB,SAAS;AAC9B,sBAAmB,QAAQ,OAAO;AAClC,sBAAmB,UAAU;;IAE9B,EAAE,CAAC;CAEN,MAAM,gBAAA,GAAA,MAAA,cACH,UAAgC;AAC/B,QAAM,iBAAiB;AACvB,2BAAyB;IAE3B,CAAC,wBAAwB,CAC1B;CAED,MAAM,qBAAA,GAAA,MAAA,cACH,OAA6B,OAAY,WAAyB;AACjE,QAAM,iBAAiB;AACvB,MAAI,WAAW,gBAAgB;GAC7B,MAAM,EAAE,SAAS,cAAA,sBAAsB,MAAM;AAC7C,OAAI,KACF,UAAS,GAAG,eAAA,MAAM,SAAS,OAAO;;IAIxC,CAAC,SAAS,CACX;CAGD,MAAM,eAAA,GAAA,MAAA,QAAqB,SAAS;AACpC,aAAY,UAAU;;;;;CAMtB,MAAM,uBAAA,GAAA,MAAA,aACJ,OAAO,EAAE,YAA+B;AACtC,MAAI,OAAO,MAAM,KAAK,IAAI;AAExB,4BAAyB;GAGzB,MAAM,aAAa,IAAI,iBAAiB;AACxC,sBAAmB,UAAU;AAE7B,OAAI;AACF,UAAM,YAAY,UAAU;KAC1B,MAAM;KACN,QAAQ,WAAW;KACpB,CAAC;YACK,KAAU;AACjB,QAAI,IAAI,SAAS,UAAU,YACzB,SAAQ,KAAK,yBAAyB;QAEtC,SAAQ,MAAM,iBAAiB,IAAI;;;IAK3C,CAAC,wBAAwB,CAC1B;CAID,MAAM,kBAAA,GAAA,MAAA,gBAAA,GAAA,UAAA,UACW,qBAAqB,UAAU,UAAU,EACxD,CAAC,oBAAoB,CACtB;AAED,EAAA,GAAA,MAAA,iBAAgB;AACd,eAAa;AACX,kBAAe,UAAU;AACzB,4BAAyB;;IAE1B,CAAC,gBAAgB,wBAAwB,CAAC;CAE7C,MAAM,gBAAgB,OAAO,WAAW;EACtC,MAAM,EAAE,KAAK,GAAG,eAAe;EAC/B,MAAM,EAAE,MAAM,SAAS,aAAa,WAAW,UAAU,aACvD,cAAA,sBAAsB,OAAO;AAC/B,SACE,iBAAA,GAAA,kBAAA,KAAC,mBAAA,SAAD;GAEE,GAAI;GACS;GACH;GACC;GACD;GACJ;GACG;GACT,EARK,IAQL;;CAIN,MAAM,eAAe,WAAW;AAC9B,SACE,iBAAA,GAAA,kBAAA,KAAC,eAAA,iBAAD;GACE,GAAI;GACJ,YAAY;IACV,GAAG,OAAO;IACV,gBACE,iBAAA,GAAA,kBAAA,KAAC,eAAA,sBAAD;KAAsB,UAAS;eAC7B,iBAAA,GAAA,kBAAA,KAAC,2BAAA,SAAD,EAAa,CAAA;KACQ,CAAA;IAE1B;GACD,OAAM;GACN,aAAa,EAAE,kBAAkB;GACjC,SAAQ;GACR,CAAA;;CAIN,MAAM,kBAAkB,WAAW;AACjC,SAAO,cAAA,sBAAsB,OAAO,CAAC;;AAGvC,QACE,iBAAA,GAAA,kBAAA,KAAC,qBAAA,SAAD;EACkB;EAChB,oBAAoB;EACpB,cAAc;EACd,oBAAoB;EACpB,aAAa,EAAE,kBAAkB;EACpB;EACC;EACd,aAAa;EACb,oBAAoB;EACpB,CAAA"}

package/build/components/Search/Search.mjs CHANGED Viewed

@@ -1,9 +1,9 @@
 import { Route as Route$1 } from "../../utils/routes.mjs";
 import "../../utils/index.mjs";
-import { useConfig } from "../../providers/AppConfigurationProvider/AppConfigurationProvider.mjs";
 import { useSearch } from "../../providers/SearchProvider/SearchProvider.mjs";
 import AutoComplete from "./AutoComplete/AutoComplete.mjs";
 import "./AutoComplete/index.mjs";
+import { normalizeSearchOption } from "./utils.mjs";
 import SearchItem from "./SearchItem.mjs";
 import { StyledInputAdornment, StyledTextField } from "./styles.mjs";
 import "../../index.mjs";
@@ -22,8 +22,6 @@ var Search = () => {
 	const { t } = useTranslation();
 	const navigate = useNavigate();
 	const { searchResults, isLoading, doSearch } = useSearch();
-	const { configOptions: { flags } } = useConfig();
-	const searchRemote = flags?.searchRemote ?? false;
 	const abortControllerRef = useRef(null);
 	const cancelAllSearchRequests = useCallback(() => {
 		if (abortControllerRef.current) {
@@ -38,10 +36,10 @@ var Search = () => {
 	const handleClickSearch = useCallback((event, value, reason) => {
 		event.stopPropagation();
 		if (reason === "selectOption") {
-			const pkgName = value["package"]?.name ?? value.name;
-			navigate(`${Route$1.DETAIL}${pkgName}`);
+			const { name } = normalizeSearchOption(value);
+			if (name) navigate(`${Route$1.DETAIL}${name}`);
 		}
-	}, [navigate, searchRemote]);
+	}, [navigate]);
 	const doSearchRef = useRef(doSearch);
 	doSearchRef.current = doSearch;
 	/**
@@ -73,29 +71,16 @@ var Search = () => {
 	}, [debouncedFetch, cancelAllSearchRequests]);
 	const renderOption = (props, option) => {
 		const { key, ...otherProps } = props;
-		if (searchRemote) {
-			const item = option.package;
-			const isPrivate = option?.verdaccioPrivate;
-			const isCached = option?.verdaccioPkgCached;
-			const isRemote = !isCached && !isPrivate;
-			return /* @__PURE__ */ jsx(SearchItem, {
-				...otherProps,
-				description: item?.description,
-				isCached,
-				isPrivate,
-				isRemote,
-				name: item?.name,
-				version: item?.version
-			}, key);
-		} else {
-			const item = option.package;
-			return /* @__PURE__ */ jsx(SearchItem, {
-				...otherProps,
-				description: item?.description,
-				name: item?.name,
-				version: item?.version
-			}, key);
-		}
+		const { name, version, description, isPrivate, isCached, isRemote } = normalizeSearchOption(option);
+		return /* @__PURE__ */ jsx(SearchItem, {
+			...otherProps,
+			description,
+			isCached,
+			isPrivate,
+			isRemote,
+			name,
+			version
+		}, key);
 	};
 	const renderInput = (params) => {
 		return /* @__PURE__ */ jsx(StyledTextField, {
@@ -113,7 +98,7 @@ var Search = () => {
 		});
 	};
 	const getOptionLabel = (option) => {
-		return option?.package?.name;
+		return normalizeSearchOption(option).name;
 	};
 	return /* @__PURE__ */ jsx(AutoComplete, {
 		getOptionLabel,

package/build/components/Search/Search.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Search.mjs","names":[],"sources":["../../../src/components/Search/Search.tsx"],"sourcesContent":["import SearchMui from '@mui/icons-material/Search';\nimport { debounce } from 'lodash-es';\nimport React, { useCallback, useEffect, useMemo, useRef } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { useNavigate } from 'react-router';\n\nimport ~~type~~ { ~~SearchResultWeb } from '@verdaccio/types';\n\nimport { useConfig,~~ useSearch } from '../../';\nimport { Route } from '../../utils';\nimport AutoComplete from './AutoComplete';\nimport SearchItem from './SearchItem';\nimport { StyledInputAdornment, StyledTextField } from './styles';\n\nconst CONSTANTS = {\n API_DELAY: 300,\n ABORT_ERROR: 'AbortError',\n};\n\nconst Search: React.FC = () => {\n const { t } = useTranslation();\n const navigate = useNavigate();\n const { searchResults, isLoading, doSearch } = useSearch();\n ~~const {~~\n ~~configOptions: { flags },\n~~ ~~} = useConfig();\n~~ const ~~searchRemote = flags?.searchRemote ?? false;\n\n const~~ abortControllerRef = useRef<AbortController \| null>(null);\n\n const cancelAllSearchRequests = useCallback(() => {\n if (abortControllerRef.current) {\n abortControllerRef.current.abort();\n abortControllerRef.current = null;\n }\n }, []);\n\n const handleOnBlur = useCallback(\n (event: React.SyntheticEvent) => {\n event.stopPropagation();\n cancelAllSearchRequests();\n },\n [cancelAllSearchRequests]\n );\n\n const handleClickSearch = useCallback(\n (event: React.SyntheticEvent, value: ~~SearchResultWeb~~, reason: string): void => {\n event.stopPropagation();\n if (reason === 'selectOption') {\n const ~~pkgName~~ ~~= value['package']?.~~name ?? value~~.name~~;\n navigate(`${Route.DETAIL}${~~pkgName~~}`);\n }\n },\n [navigate~~, searchRemote~~]\n );\n\n // Use a ref to always access the latest doSearch without re-creating the debounced function\n const doSearchRef = useRef(doSearch);\n doSearchRef.current = doSearch;\n\n /*\n Stable fetch function that reads the latest doSearch from a ref,\n * avoiding dependency changes that would break the debounce.\n */\n const handleFetchPackages = useCallback(\n async ({ value }: { value: string }) => {\n if (value?.trim() !== '') {\n // Abort any previous pending request before starting a new one\n cancelAllSearchRequests();\n\n // Create a new controller for the current request\n const controller = new AbortController();\n abortControllerRef.current = controller;\n\n try {\n await doSearchRef.current?.({\n text: value,\n signal: controller.signal,\n });\n } catch (err: any) {\n if (err.name === CONSTANTS.ABORT_ERROR) {\n console.warn('Search request aborted');\n } else {\n console.error('Search error:', err);\n }\n }\n }\n },\n [cancelAllSearchRequests]\n );\n\n // Memoize the debounced function so a single instance is reused across renders,\n // ensuring the debounce timer works correctly instead of creating a new timer per render.\n const debouncedFetch = useMemo(\n () => debounce(handleFetchPackages, CONSTANTS.API_DELAY),\n [handleFetchPackages]\n );\n\n useEffect(() => {\n return () => {\n debouncedFetch.cancel?.();\n cancelAllSearchRequests();\n };\n }, [debouncedFetch, cancelAllSearchRequests]);\n\n const renderOption = (props, option) => {\n const { key, ...otherProps } = props;\n\n if ~~(searchRemote)~~ {~~\n const~~ ~~item:~~ ~~SearchResultWeb~~ = ~~option.package;\n const~~ isPrivate = ~~option?.verdaccioPrivate;\n const~~ ~~isCached~~ ~~= option?.verdaccioPkgCached;\~~n ~~const isRemote = !isCached && !isPrivate~~;\n return (\n <SearchItem\n key={key}\n {...otherProps}\n description={~~item?.~~description}\n isCached={isCached}\n isPrivate={isPrivate}\n isRemote={isRemote}\n name={~~item?.~~name}\n version={~~item?.~~version}\n />\n ~~);\n~~ } else {\n const item: SearchResultWeb = option.package;\n return (\n <SearchItem\n key={key}\n {...otherProps}\n description={item?.description}\n name={item?.name}\n version={item?.version}\n />\n );\n ~~}\n~~ };\n\n const renderInput = (params) => {\n return (\n <StyledTextField\n {...params}\n InputProps={{\n ...params.InputProps,\n startAdornment: (\n <StyledInputAdornment position=\"start\">\n <SearchMui />\n </StyledInputAdornment>\n ),\n }}\n label=\"\"\n placeholder={t('search.packages')}\n variant=\"standard\"\n />\n );\n };\n\n const getOptionLabel = (option) => {\n return option~~?.package?.~~name;\n };\n\n return (\n <AutoComplete\n getOptionLabel={getOptionLabel}\n onCleanSuggestions={handleOnBlur}\n onSelectItem={handleClickSearch}\n onSuggestionsFetch={debouncedFetch}\n placeholder={t('search.packages')}\n renderInput={renderInput}\n renderOption={renderOption}\n suggestions={searchResults}\n suggestionsLoading={isLoading}\n />\n );\n};\n\nexport default Search;\n"],"mappings":";;;;;;;;;;;;;;;;~~AAcA~~,IAAM,YAAY;CAChB,WAAW;CACX,aAAa;CACd;AAED,IAAM,eAAyB;CAC7B,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,WAAW,aAAa;CAC9B,MAAM,EAAE,eAAe,WAAW,aAAa,WAAW;~~CAC1D~~,MAAM,~~EACJ,eAAe,EAAE,YACf,WAAW;CACf,MAAM,eAAe,OAAO,gBAAgB;CAE5C,MAAM,~~qBAAqB,OAA+B,KAAK;CAE/D,MAAM,0BAA0B,kBAAkB;AAChD,MAAI,mBAAmB,SAAS;AAC9B,sBAAmB,QAAQ,OAAO;AAClC,sBAAmB,UAAU;;IAE9B,EAAE,CAAC;CAEN,MAAM,eAAe,aAClB,UAAgC;AAC/B,QAAM,iBAAiB;AACvB,2BAAyB;IAE3B,CAAC,wBAAwB,CAC1B;CAED,MAAM,oBAAoB,aACvB,OAA6B,~~OAAwB~~,WAAyB;~~AAC7E~~,QAAM,iBAAiB;AACvB,MAAI,WAAW,gBAAgB;GAC7B,MAAM,~~UAAU~~,~~MAAM~~,~~YAAY~~,~~QAAQ,~~MAAM;~~AAChD~~,~~YAAS~~,GAAG,QAAM,SAAS,~~UAAU~~;;~~IAGzC~~,CAAC,~~UAAU~~,~~aAAa,CACzB~~;CAGD,MAAM,cAAc,OAAO,SAAS;AACpC,aAAY,UAAU;;;;;CAMtB,MAAM,sBAAsB,YAC1B,OAAO,EAAE,YAA+B;AACtC,MAAI,OAAO,MAAM,KAAK,IAAI;AAExB,4BAAyB;GAGzB,MAAM,aAAa,IAAI,iBAAiB;AACxC,sBAAmB,UAAU;AAE7B,OAAI;AACF,UAAM,YAAY,UAAU;KAC1B,MAAM;KACN,QAAQ,WAAW;KACpB,CAAC;YACK,KAAU;AACjB,QAAI,IAAI,SAAS,UAAU,YACzB,SAAQ,KAAK,yBAAyB;QAEtC,SAAQ,MAAM,iBAAiB,IAAI;;;IAK3C,CAAC,wBAAwB,CAC1B;CAID,MAAM,iBAAiB,cACf,SAAS,qBAAqB,UAAU,UAAU,EACxD,CAAC,oBAAoB,CACtB;AAED,iBAAgB;AACd,eAAa;AACX,kBAAe,UAAU;AACzB,4BAAyB;;IAE1B,CAAC,gBAAgB,wBAAwB,CAAC;CAE7C,MAAM,gBAAgB,OAAO,WAAW;EACtC,MAAM,EAAE,KAAK,GAAG,eAAe;~~AAE~~/B,~~MAAI,cAAc;GAChB,~~MAAM,~~OAAwB~~,~~OAAO;GACrC,~~MAAM,~~YAAY~~,~~QAAQ;GAC1B~~,~~MAAM,~~WAAW,~~QAAQ;GACzB~~,~~MAAM~~,~~WAAW~~,~~CAAC,YAAY,CAAC~~;AAC/B,~~UACE~~,oBAAC,YAAD;~~IAEE~~,GAAI;~~IACJ,aAAa,MAAM~~;~~IACT~~;~~IACC~~;~~IACD~~;~~IACV,MAAM,MAAM~~;~~IACZ,SAAS,MAAM~~;~~IACf~~,EARK,IAQL~~;SAEC;GACL~~,MAAM,~~OAAwB,OAAO;AACrC,UACE,oBAAC,YAAD;IAEE,GAAI;IACJ,aAAa,MAAM;IACnB,MAAM,MAAM;IACZ,SAAS,MAAM;IACf,EALK,IAKL;;;CAKR,MAAM,~~eAAe,WAAW;AAC9B,SACE,oBAAC,iBAAD;GACE,GAAI;GACJ,YAAY;IACV,GAAG,OAAO;IACV,gBACE,oBAAC,sBAAD;KAAsB,UAAS;eAC7B,oBAAC,WAAD,EAAa,CAAA;KACQ,CAAA;IAE1B;GACD,OAAM;GACN,aAAa,EAAE,kBAAkB;GACjC,SAAQ;GACR,CAAA;;CAIN,MAAM,kBAAkB,WAAW;AACjC,SAAO,~~QAAQ~~,~~SAAS~~;;~~AAG1B~~,QACE,oBAAC,cAAD;EACkB;EAChB,oBAAoB;EACpB,cAAc;EACd,oBAAoB;EACpB,aAAa,EAAE,kBAAkB;EACpB;EACC;EACd,aAAa;EACb,oBAAoB;EACpB,CAAA"}
1	+ {"version":3,"file":"Search.mjs","names":[],"sources":["../../../src/components/Search/Search.tsx"],"sourcesContent":["import SearchMui from '@mui/icons-material/Search';\nimport { debounce } from 'lodash-es';\nimport React, { useCallback, useEffect, useMemo, useRef } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { useNavigate } from 'react-router';\n\nimport { useSearch } from '../../';\nimport { Route } from '../../utils';\nimport AutoComplete from './AutoComplete';\nimport SearchItem from './SearchItem';\nimport { StyledInputAdornment, StyledTextField } from './styles';\nimport { normalizeSearchOption } from './utils';\n\nconst CONSTANTS = {\n API_DELAY: 300,\n ABORT_ERROR: 'AbortError',\n};\n\nconst Search: React.FC = () => {\n const { t } = useTranslation();\n const navigate = useNavigate();\n const { searchResults, isLoading, doSearch } = useSearch();\n\n const abortControllerRef = useRef<AbortController \| null>(null);\n\n const cancelAllSearchRequests = useCallback(() => {\n if (abortControllerRef.current) {\n abortControllerRef.current.abort();\n abortControllerRef.current = null;\n }\n }, []);\n\n const handleOnBlur = useCallback(\n (event: React.SyntheticEvent) => {\n event.stopPropagation();\n cancelAllSearchRequests();\n },\n [cancelAllSearchRequests]\n );\n\n const handleClickSearch = useCallback(\n (event: React.SyntheticEvent, value: any, reason: string): void => {\n event.stopPropagation();\n if (reason === 'selectOption') {\n const { name } = normalizeSearchOption(value);\n if (name) {\n navigate(`${Route.DETAIL}${name}`);\n }\n }\n },\n [navigate]\n );\n\n // Use a ref to always access the latest doSearch without re-creating the debounced function\n const doSearchRef = useRef(doSearch);\n doSearchRef.current = doSearch;\n\n /*\n Stable fetch function that reads the latest doSearch from a ref,\n * avoiding dependency changes that would break the debounce.\n */\n const handleFetchPackages = useCallback(\n async ({ value }: { value: string }) => {\n if (value?.trim() !== '') {\n // Abort any previous pending request before starting a new one\n cancelAllSearchRequests();\n\n // Create a new controller for the current request\n const controller = new AbortController();\n abortControllerRef.current = controller;\n\n try {\n await doSearchRef.current?.({\n text: value,\n signal: controller.signal,\n });\n } catch (err: any) {\n if (err.name === CONSTANTS.ABORT_ERROR) {\n console.warn('Search request aborted');\n } else {\n console.error('Search error:', err);\n }\n }\n }\n },\n [cancelAllSearchRequests]\n );\n\n // Memoize the debounced function so a single instance is reused across renders,\n // ensuring the debounce timer works correctly instead of creating a new timer per render.\n const debouncedFetch = useMemo(\n () => debounce(handleFetchPackages, CONSTANTS.API_DELAY),\n [handleFetchPackages]\n );\n\n useEffect(() => {\n return () => {\n debouncedFetch.cancel?.();\n cancelAllSearchRequests();\n };\n }, [debouncedFetch, cancelAllSearchRequests]);\n\n const renderOption = (props, option) => {\n const { key, ...otherProps } = props;\n const { name, version, description, isPrivate, isCached, isRemote } =\n normalizeSearchOption(option);\n return (\n <SearchItem\n key={key}\n {...otherProps}\n description={description}\n isCached={isCached}\n isPrivate={isPrivate}\n isRemote={isRemote}\n name={name}\n version={version}\n />\n );\n };\n\n const renderInput = (params) => {\n return (\n <StyledTextField\n {...params}\n InputProps={{\n ...params.InputProps,\n startAdornment: (\n <StyledInputAdornment position=\"start\">\n <SearchMui />\n </StyledInputAdornment>\n ),\n }}\n label=\"\"\n placeholder={t('search.packages')}\n variant=\"standard\"\n />\n );\n };\n\n const getOptionLabel = (option) => {\n return normalizeSearchOption(option).name;\n };\n\n return (\n <AutoComplete\n getOptionLabel={getOptionLabel}\n onCleanSuggestions={handleOnBlur}\n onSelectItem={handleClickSearch}\n onSuggestionsFetch={debouncedFetch}\n placeholder={t('search.packages')}\n renderInput={renderInput}\n renderOption={renderOption}\n suggestions={searchResults}\n suggestionsLoading={isLoading}\n />\n );\n};\n\nexport default Search;\n"],"mappings":";;;;;;;;;;;;;;;;AAaA,IAAM,YAAY;CAChB,WAAW;CACX,aAAa;CACd;AAED,IAAM,eAAyB;CAC7B,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,WAAW,aAAa;CAC9B,MAAM,EAAE,eAAe,WAAW,aAAa,WAAW;CAE1D,MAAM,qBAAqB,OAA+B,KAAK;CAE/D,MAAM,0BAA0B,kBAAkB;AAChD,MAAI,mBAAmB,SAAS;AAC9B,sBAAmB,QAAQ,OAAO;AAClC,sBAAmB,UAAU;;IAE9B,EAAE,CAAC;CAEN,MAAM,eAAe,aAClB,UAAgC;AAC/B,QAAM,iBAAiB;AACvB,2BAAyB;IAE3B,CAAC,wBAAwB,CAC1B;CAED,MAAM,oBAAoB,aACvB,OAA6B,OAAY,WAAyB;AACjE,QAAM,iBAAiB;AACvB,MAAI,WAAW,gBAAgB;GAC7B,MAAM,EAAE,SAAS,sBAAsB,MAAM;AAC7C,OAAI,KACF,UAAS,GAAG,QAAM,SAAS,OAAO;;IAIxC,CAAC,SAAS,CACX;CAGD,MAAM,cAAc,OAAO,SAAS;AACpC,aAAY,UAAU;;;;;CAMtB,MAAM,sBAAsB,YAC1B,OAAO,EAAE,YAA+B;AACtC,MAAI,OAAO,MAAM,KAAK,IAAI;AAExB,4BAAyB;GAGzB,MAAM,aAAa,IAAI,iBAAiB;AACxC,sBAAmB,UAAU;AAE7B,OAAI;AACF,UAAM,YAAY,UAAU;KAC1B,MAAM;KACN,QAAQ,WAAW;KACpB,CAAC;YACK,KAAU;AACjB,QAAI,IAAI,SAAS,UAAU,YACzB,SAAQ,KAAK,yBAAyB;QAEtC,SAAQ,MAAM,iBAAiB,IAAI;;;IAK3C,CAAC,wBAAwB,CAC1B;CAID,MAAM,iBAAiB,cACf,SAAS,qBAAqB,UAAU,UAAU,EACxD,CAAC,oBAAoB,CACtB;AAED,iBAAgB;AACd,eAAa;AACX,kBAAe,UAAU;AACzB,4BAAyB;;IAE1B,CAAC,gBAAgB,wBAAwB,CAAC;CAE7C,MAAM,gBAAgB,OAAO,WAAW;EACtC,MAAM,EAAE,KAAK,GAAG,eAAe;EAC/B,MAAM,EAAE,MAAM,SAAS,aAAa,WAAW,UAAU,aACvD,sBAAsB,OAAO;AAC/B,SACE,oBAAC,YAAD;GAEE,GAAI;GACS;GACH;GACC;GACD;GACJ;GACG;GACT,EARK,IAQL;;CAIN,MAAM,eAAe,WAAW;AAC9B,SACE,oBAAC,iBAAD;GACE,GAAI;GACJ,YAAY;IACV,GAAG,OAAO;IACV,gBACE,oBAAC,sBAAD;KAAsB,UAAS;eAC7B,oBAAC,WAAD,EAAa,CAAA;KACQ,CAAA;IAE1B;GACD,OAAM;GACN,aAAa,EAAE,kBAAkB;GACjC,SAAQ;GACR,CAAA;;CAIN,MAAM,kBAAkB,WAAW;AACjC,SAAO,sBAAsB,OAAO,CAAC;;AAGvC,QACE,oBAAC,cAAD;EACkB;EAChB,oBAAoB;EACpB,cAAc;EACd,oBAAoB;EACpB,aAAa,EAAE,kBAAkB;EACpB;EACC;EACd,aAAa;EACb,oBAAoB;EACpB,CAAA"}

package/build/components/Search/SearchItem.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
-import type { Theme } from '@mui/material';
-import React from 'react';
+import { Theme } from '@mui/material';
+import { default as React } from 'react';
 type SearchItemProps = {
     name: string;
     version?: string;
@@ -8,8 +8,8 @@ type SearchItemProps = {
     isCached?: boolean;
     isRemote?: boolean;
 };
-export declare const Description: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme;
+export declare const Description: import('@emotion/styled').StyledComponent<{
+    theme?: import('@emotion/react').Theme;
     as?: React.ElementType;
 } & {
     theme?: Theme;