@verdaccio/ui-components 5.0.0-next-9.23 → 5.0.0-next-9.25

package/build/components/Search/Search.mjs

@@ -1,18 +1,20 @@
 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 { normalizeSearchOption, sortByOrigin } from "./utils.mjs";
+import SearchItem, { ORIGIN_ICONS } from "./SearchItem.mjs";
 import { StyledInputAdornment, StyledTextField } from "./styles.mjs";
 import "../../index.mjs";
-import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import React, { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { useTranslation } from "react-i18next";
-import { jsx } from "react/jsx-runtime";
+import { jsx, jsxs } from "react/jsx-runtime";
 import { debounce } from "lodash-es";
 import { useNavigate } from "react-router";
 import SearchMui from "@mui/icons-material/Search";
+import ListSubheader from "@mui/material/ListSubheader";
 //#region src/components/Search/Search.tsx
 var CONSTANTS = {
 	API_DELAY: 300,
@@ -22,6 +24,9 @@ var Search = () => {
 	const { t } = useTranslation();
 	const navigate = useNavigate();
 	const { searchResults, isLoading, isError, doSearch, resetSearch } = useSearch();
+	const { configOptions } = useConfig();
+	const groupByOrigin = configOptions?.showUplinks === true;
+	const suggestions = useMemo(() => groupByOrigin && searchResults ? sortByOrigin(searchResults) : searchResults, [groupByOrigin, searchResults]);
 	const abortControllerRef = useRef(null);
 	const cancelAllSearchRequests = useCallback(() => {
 		if (abortControllerRef.current) {
@@ -104,19 +109,40 @@ var Search = () => {
 			variant: "standard"
 		});
 	};
+	const getOptionGroup = (option) => normalizeSearchOption(option).origin ?? "";
+	const renderGroup = ({ key, group, children }) => {
+		if (!group) return /* @__PURE__ */ jsx(React.Fragment, { children }, key);
+		const OriginIcon = ORIGIN_ICONS[group];
+		return /* @__PURE__ */ jsxs("li", { children: [/* @__PURE__ */ jsxs(ListSubheader, {
+			component: "div",
+			"data-testid": `search-group-${group}`,
+			sx: {
+				display: "flex",
+				alignItems: "center",
+				gap: 1,
+				lineHeight: "36px"
+			},
+			children: [OriginIcon && /* @__PURE__ */ jsx(OriginIcon, { fontSize: "small" }), t(`search.group.${group}`, { count: React.Children.count(children) })]
+		}), /* @__PURE__ */ jsx("ul", {
+			style: { padding: 0 },
+			children
+		})] }, key);
+	};
 	const getOptionLabel = (option) => {
 		return normalizeSearchOption(option).name;
 	};
 	return /* @__PURE__ */ jsx(AutoComplete, {
 		getOptionLabel,
+		groupBy: groupByOrigin ? getOptionGroup : void 0,
 		hasError: isError,
 		onCleanSuggestions: handleOnBlur,
 		onSelectItem: handleClickSearch,
 		onSuggestionsFetch: handleSuggestionsFetch,
 		placeholder: t("search.packages"),
+		renderGroup: groupByOrigin ? renderGroup : void 0,
 		renderInput,
 		renderOption,
-		suggestions: searchResults,
+		suggestions,
 		suggestionsLoading: isLoading || isDebouncing
 	});
 };

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

@@ -1 +1 @@
-{"version":3,"file":"Search.mjs","names":["Route"],"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, useState } 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, isError, doSearch, resetSearch } = 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  // shows the dropdown as loading during the debounce window; without it the\n  // immediate reset below reads as \"no results found\" on every keystroke\n  const [isDebouncing, setIsDebouncing] = useState(false);\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      setIsDebouncing(false);\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  // clear the previous query's results right away so the dropdown never lists\n  // stale suggestions under the new input while the debounce timer runs\n  const handleSuggestionsFetch = useCallback(\n    ({ value }: { value: string }) => {\n      resetSearch?.();\n      if (value?.trim() !== '') {\n        setIsDebouncing(true);\n      }\n      debouncedFetch({ value });\n    },\n    [resetSearch, debouncedFetch]\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      hasError={isError}\n      onCleanSuggestions={handleOnBlur}\n      onSelectItem={handleClickSearch}\n      onSuggestionsFetch={handleSuggestionsFetch}\n      placeholder={t('search.packages')}\n      renderInput={renderInput}\n      renderOption={renderOption}\n      suggestions={searchResults}\n      suggestionsLoading={isLoading || isDebouncing}\n    />\n  );\n};\n\nexport default Search;\n"],"mappings":";;;;;;;;;;;;;;;;AAaA,IAAM,YAAY;CAChB,WAAW;CACX,aAAa;AACf;AAEA,IAAM,eAAyB;CAC7B,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,WAAW,YAAY;CAC7B,MAAM,EAAE,eAAe,WAAW,SAAS,UAAU,gBAAgB,UAAU;CAE/E,MAAM,qBAAqB,OAA+B,IAAI;CAE9D,MAAM,0BAA0B,kBAAkB;EAChD,IAAI,mBAAmB,SAAS;GAC9B,mBAAmB,QAAQ,MAAM;GACjC,mBAAmB,UAAU;EAC/B;CACF,GAAG,CAAC,CAAC;CAEL,MAAM,eAAe,aAClB,UAAgC;EAC/B,MAAM,gBAAgB;EACtB,wBAAwB;CAC1B,GACA,CAAC,uBAAuB,CAC1B;CAEA,MAAM,oBAAoB,aACvB,OAA6B,OAAY,WAAyB;EACjE,MAAM,gBAAgB;EACtB,IAAI,WAAW,gBAAgB;GAC7B,MAAM,EAAE,SAAS,sBAAsB,KAAK;GAC5C,IAAI,MACF,SAAS,GAAGA,QAAM,SAAS,MAAM;EAErC;CACF,GACA,CAAC,QAAQ,CACX;CAGA,MAAM,cAAc,OAAO,QAAQ;CACnC,YAAY,UAAU;CAItB,MAAM,CAAC,cAAc,mBAAmB,SAAS,KAAK;;;;;CAMtD,MAAM,sBAAsB,YAC1B,OAAO,EAAE,YAA+B;EACtC,gBAAgB,KAAK;EACrB,IAAI,OAAO,KAAK,MAAM,IAAI;GAExB,wBAAwB;GAGxB,MAAM,aAAa,IAAI,gBAAgB;GACvC,mBAAmB,UAAU;GAE7B,IAAI;IACF,MAAM,YAAY,UAAU;KAC1B,MAAM;KACN,QAAQ,WAAW;IACrB,CAAC;GACH,SAAS,KAAU;IACjB,IAAI,IAAI,SAAS,UAAU,aACzB,QAAQ,KAAK,wBAAwB;SAErC,QAAQ,MAAM,iBAAiB,GAAG;GAEtC;EACF;CACF,GACA,CAAC,uBAAuB,CAC1B;CAIA,MAAM,iBAAiB,cACf,SAAS,qBAAqB,UAAU,SAAS,GACvD,CAAC,mBAAmB,CACtB;CAIA,MAAM,yBAAyB,aAC5B,EAAE,YAA+B;EAChC,cAAc;EACd,IAAI,OAAO,KAAK,MAAM,IACpB,gBAAgB,IAAI;EAEtB,eAAe,EAAE,MAAM,CAAC;CAC1B,GACA,CAAC,aAAa,cAAc,CAC9B;CAEA,gBAAgB;EACd,aAAa;GACX,eAAe,SAAS;GACxB,wBAAwB;EAC1B;CACF,GAAG,CAAC,gBAAgB,uBAAuB,CAAC;CAE5C,MAAM,gBAAgB,OAAO,WAAW;EACtC,MAAM,EAAE,KAAK,GAAG,eAAe;EAC/B,MAAM,EAAE,MAAM,SAAS,aAAa,WAAW,UAAU,aACvD,sBAAsB,MAAM;EAC9B,OACE,oBAAC,YAAD;GAEE,GAAI;GACS;GACH;GACC;GACD;GACJ;GACG;EACV,GARM,GAQN;CAEL;CAEA,MAAM,eAAe,WAAW;EAC9B,OACE,oBAAC,iBAAD;GACE,GAAI;GACJ,YAAY;IACV,GAAG,OAAO;IACV,gBACE,oBAAC,sBAAD;KAAsB,UAAS;KAC7B,UAAA,oBAAC,WAAD,CAAY,CAAA;IACQ,CAAA;GAE1B;GACA,OAAM;GACN,aAAa,EAAE,iBAAiB;GAChC,SAAQ;EACT,CAAA;CAEL;CAEA,MAAM,kBAAkB,WAAW;EACjC,OAAO,sBAAsB,MAAM,CAAC,CAAC;CACvC;CAEA,OACE,oBAAC,cAAD;EACkB;EAChB,UAAU;EACV,oBAAoB;EACpB,cAAc;EACd,oBAAoB;EACpB,aAAa,EAAE,iBAAiB;EACnB;EACC;EACd,aAAa;EACb,oBAAoB,aAAa;CAClC,CAAA;AAEL"}
+{"version":3,"file":"Search.mjs","names":["Route"],"sources":["../../../src/components/Search/Search.tsx"],"sourcesContent":["import SearchMui from '@mui/icons-material/Search';\nimport type { AutocompleteRenderGroupParams } from '@mui/material/Autocomplete';\nimport ListSubheader from '@mui/material/ListSubheader';\nimport { debounce } from 'lodash-es';\nimport React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { useNavigate } from 'react-router';\n\nimport { useConfig, useSearch } from '../../';\nimport { Route } from '../../utils';\nimport AutoComplete from './AutoComplete';\nimport SearchItem, { ORIGIN_ICONS } from './SearchItem';\nimport { StyledInputAdornment, StyledTextField } from './styles';\nimport type { SearchOrigin } from './utils';\nimport { normalizeSearchOption, sortByOrigin } 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, isError, doSearch, resetSearch } = useSearch();\n  const { configOptions } = useConfig();\n  const groupByOrigin = configOptions?.showUplinks === true;\n  const suggestions = useMemo(\n    () => (groupByOrigin && searchResults ? sortByOrigin(searchResults) : searchResults),\n    [groupByOrigin, searchResults]\n  );\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  // shows the dropdown as loading during the debounce window; without it the\n  // immediate reset below reads as \"no results found\" on every keystroke\n  const [isDebouncing, setIsDebouncing] = useState(false);\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      setIsDebouncing(false);\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  // clear the previous query's results right away so the dropdown never lists\n  // stale suggestions under the new input while the debounce timer runs\n  const handleSuggestionsFetch = useCallback(\n    ({ value }: { value: string }) => {\n      resetSearch?.();\n      if (value?.trim() !== '') {\n        setIsDebouncing(true);\n      }\n      debouncedFetch({ value });\n    },\n    [resetSearch, debouncedFetch]\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 getOptionGroup = (option) => normalizeSearchOption(option).origin ?? '';\n\n  const renderGroup = ({ key, group, children }: AutocompleteRenderGroupParams) => {\n    if (!group) {\n      return <React.Fragment key={key}>{children}</React.Fragment>;\n    }\n    const OriginIcon = ORIGIN_ICONS[group as SearchOrigin];\n    return (\n      <li key={key}>\n        {/* a div: the default <li> would nest a list item inside the group's <li> */}\n        <ListSubheader\n          component=\"div\"\n          data-testid={`search-group-${group}`}\n          sx={{ display: 'flex', alignItems: 'center', gap: 1, lineHeight: '36px' }}\n        >\n          {OriginIcon && <OriginIcon fontSize=\"small\" />}\n          {t(`search.group.${group}`, { count: React.Children.count(children) })}\n        </ListSubheader>\n        <ul style={{ padding: 0 }}>{children}</ul>\n      </li>\n    );\n  };\n\n  const getOptionLabel = (option) => {\n    return normalizeSearchOption(option).name;\n  };\n\n  return (\n    <AutoComplete\n      getOptionLabel={getOptionLabel}\n      groupBy={groupByOrigin ? getOptionGroup : undefined}\n      hasError={isError}\n      onCleanSuggestions={handleOnBlur}\n      onSelectItem={handleClickSearch}\n      onSuggestionsFetch={handleSuggestionsFetch}\n      placeholder={t('search.packages')}\n      renderGroup={groupByOrigin ? renderGroup : undefined}\n      renderInput={renderInput}\n      renderOption={renderOption}\n      suggestions={suggestions}\n      suggestionsLoading={isLoading || isDebouncing}\n    />\n  );\n};\n\nexport default Search;\n"],"mappings":"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"}

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

@@ -8,11 +8,22 @@ type SearchItemProps = {
     isCached?: boolean;
     isRemote?: boolean;
 };
+export declare const ORIGIN_ICONS: {
+    private: import("@mui/material/OverridableComponent").OverridableComponent<import("@mui/material").SvgIconTypeMap<{}, "svg">> & {
+        muiName: string;
+    };
+    cached: import("@mui/material/OverridableComponent").OverridableComponent<import("@mui/material").SvgIconTypeMap<{}, "svg">> & {
+        muiName: string;
+    };
+    remote: import("@mui/material/OverridableComponent").OverridableComponent<import("@mui/material").SvgIconTypeMap<{}, "svg">> & {
+        muiName: string;
+    };
+};
 export declare const Description: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
 } & {
     theme?: Theme;
-}, React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+}, React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
 declare const SearchItem: React.FC<SearchItemProps>;
 export default SearchItem;

package/build/components/Search/SearchItem.js

@@ -8,92 +8,75 @@ let react = require("react");
 react = require_runtime.__toESM(react);
 let react_i18next = require("react-i18next");
 let react_jsx_runtime = require("react/jsx-runtime");
-let _mui_material_Stack = require("@mui/material/Stack");
-_mui_material_Stack = require_runtime.__toESM(_mui_material_Stack);
-let _mui_material_Chip = require("@mui/material/Chip");
-_mui_material_Chip = require_runtime.__toESM(_mui_material_Chip);
-let _mui_icons_material_Cached = require("@mui/icons-material/Cached");
-_mui_icons_material_Cached = require_runtime.__toESM(_mui_icons_material_Cached);
-let _mui_icons_material_Https = require("@mui/icons-material/Https");
-_mui_icons_material_Https = require_runtime.__toESM(_mui_icons_material_Https);
-let _mui_icons_material_SyncAlt = require("@mui/icons-material/SyncAlt");
-_mui_icons_material_SyncAlt = require_runtime.__toESM(_mui_icons_material_SyncAlt);
+let _mui_icons_material_LockOutlined = require("@mui/icons-material/LockOutlined");
+_mui_icons_material_LockOutlined = require_runtime.__toESM(_mui_icons_material_LockOutlined);
+let _mui_icons_material_CloudOutlined = require("@mui/icons-material/CloudOutlined");
+_mui_icons_material_CloudOutlined = require_runtime.__toESM(_mui_icons_material_CloudOutlined);
+let _mui_icons_material_Inventory2Outlined = require("@mui/icons-material/Inventory2Outlined");
+_mui_icons_material_Inventory2Outlined = require_runtime.__toESM(_mui_icons_material_Inventory2Outlined);
 //#region src/components/Search/SearchItem.tsx
-var Wrapper = _emotion_styled.default.div({
+var ORIGIN_ICONS = {
+	[require_utils.SearchOrigin.PRIVATE]: _mui_icons_material_LockOutlined.default,
+	[require_utils.SearchOrigin.CACHED]: _mui_icons_material_Inventory2Outlined.default,
+	[require_utils.SearchOrigin.REMOTE]: _mui_icons_material_CloudOutlined.default
+};
+var Row = (0, _emotion_styled.default)("div")({
 	display: "flex",
 	alignItems: "center",
-	width: "100%"
+	gap: 12,
+	width: "100%",
+	minWidth: 0
 });
-var Description = (0, _emotion_styled.default)("div")(({ theme }) => ({
-	display: "none",
-	color: theme.palette.greyLight2,
-	lineHeight: "1.5rem",
-	whiteSpace: "nowrap",
-	textOverflow: "ellipsis",
-	alignItems: "center",
-	overflow: "hidden",
-	paddingLeft: theme.spacing(),
-	fontSize: theme.fontSize.ssm,
-	[`@media (min-width: ${theme.breakPoints.medium}px)`]: {
-		display: "block",
-		width: "300px"
-	},
-	[`@media (min-width: ${theme.breakPoints.large}px)`]: {
-		display: "block",
-		width: "500px"
-	},
-	[`@media (min-width: 1440px)`]: {
-		display: "block",
-		width: "600px"
-	}
-}));
-var NameGroup = _emotion_styled.default.span({
+var Text = (0, _emotion_styled.default)("div")({
+	display: "flex",
+	flexDirection: "column",
+	flex: 1,
+	minWidth: 0
+});
+var TitleLine = (0, _emotion_styled.default)("div")({
 	display: "flex",
-	flex: "1"
+	alignItems: "baseline",
+	gap: 8
 });
 var Name = (0, _emotion_styled.default)("span")(({ theme }) => ({
-	fontWeight: "700",
-	fontSize: theme.fontSize.sm
+	fontWeight: 700,
+	fontSize: theme.fontSize.sm,
+	overflow: "hidden",
+	textOverflow: "ellipsis",
+	whiteSpace: "nowrap"
+}));
+var Version = (0, _emotion_styled.default)("span")(({ theme }) => ({
+	marginLeft: "auto",
+	flexShrink: 0,
+	fontSize: theme.fontSize.ssm,
+	color: theme.palette.text.secondary
+}));
+var Description = (0, _emotion_styled.default)("span")(({ theme }) => ({
+	color: theme.palette.text.secondary,
+	fontSize: theme.fontSize.ssm,
+	lineHeight: 1.5,
+	overflow: "hidden",
+	textOverflow: "ellipsis",
+	whiteSpace: "nowrap"
 }));
-var Version = (0, _emotion_styled.default)("span")(({ theme }) => ({ fontSize: theme.fontSize.ssm }));
 var SearchItem = ({ name, description, isPrivate = false, isRemote = false, isCached = false, version, ...props }) => {
 	const { t } = (0, react_i18next.useTranslation)();
 	const { configOptions } = require_AppConfigurationProvider.useConfig();
-	const handleDelete = () => {};
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("li", {
+	const origin = isPrivate ? require_utils.SearchOrigin.PRIVATE : isCached ? require_utils.SearchOrigin.CACHED : isRemote ? require_utils.SearchOrigin.REMOTE : void 0;
+	const OriginIcon = configOptions?.showUplinks && origin ? ORIGIN_ICONS[origin] : void 0;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("li", {
 		...props,
-		style: { flexDirection: "column" },
-		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Wrapper, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(NameGroup, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Name, { children: name }), description && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Description, { children: require_utils.cleanDescription(description) })] }), version && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Version, { children: version })] }), configOptions?.showUplinks && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Wrapper, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_mui_material_Stack.default, {
-			direction: "row",
-			spacing: 1,
-			children: [
-				isPrivate && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_mui_material_Chip.default, {
-					color: "primary",
-					deleteIcon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_mui_icons_material_Https.default, {}),
-					label: t("search.isPrivate"),
-					onDelete: handleDelete,
-					size: "small"
-				}),
-				isRemote && !isPrivate && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_mui_material_Chip.default, {
-					deleteIcon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_mui_icons_material_SyncAlt.default, {}),
-					label: t("search.isRemote"),
-					onDelete: handleDelete,
-					size: "small",
-					variant: "outlined"
-				}),
-				isCached && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_mui_material_Chip.default, {
-					deleteIcon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_mui_icons_material_Cached.default, {}),
-					label: t("search.isCached"),
-					onDelete: handleDelete,
-					size: "small",
-					variant: "outlined"
-				})
-			]
-		}) })]
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Row, { children: [OriginIcon && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(OriginIcon, {
+			color: origin === require_utils.SearchOrigin.PRIVATE ? "primary" : "action",
+			"data-testid": `search-origin-${origin}`,
+			fontSize: "small",
+			titleAccess: t(`search.origin.${origin}`)
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Text, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(TitleLine, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Name, { children: name }), version && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Version, { children: version })] }), description && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Description, { children: require_utils.cleanDescription(description) })] })] })
 	});
 };
 //#endregion
 exports.Description = Description;
+exports.ORIGIN_ICONS = ORIGIN_ICONS;
 exports.default = SearchItem;
 
 //# sourceMappingURL=SearchItem.js.map

package/build/components/Search/SearchItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"SearchItem.js","names":["styled","useTranslation","useConfig","cleanDescription","Stack","Chip","HttpsIcon","SyncAlt","Cached"],"sources":["../../../src/components/Search/SearchItem.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport Cached from '@mui/icons-material/Cached';\nimport HttpsIcon from '@mui/icons-material/Https';\nimport SyncAlt from '@mui/icons-material/SyncAlt';\nimport type { Theme } from '@mui/material';\nimport Chip from '@mui/material/Chip';\nimport Stack from '@mui/material/Stack';\nimport React from 'react';\nimport { useTranslation } from 'react-i18next';\n\nimport { useConfig } from '../../';\nimport { cleanDescription } from './utils';\n\ntype SearchItemProps = {\n  name: string;\n  version?: string;\n  description?: string;\n  isPrivate?: boolean;\n  isCached?: boolean;\n  isRemote?: boolean;\n};\n\nconst Wrapper = styled.div({\n  display: 'flex',\n  alignItems: 'center',\n  width: '100%',\n});\n\nexport const Description = styled('div')<{ theme?: Theme }>(({ theme }) => ({\n  display: 'none',\n  color: theme.palette.greyLight2,\n  lineHeight: '1.5rem',\n  whiteSpace: 'nowrap',\n  textOverflow: 'ellipsis',\n  alignItems: 'center',\n  overflow: 'hidden',\n  paddingLeft: theme.spacing(),\n  fontSize: theme.fontSize.ssm,\n  [`@media (min-width: ${theme.breakPoints.medium}px)`]: {\n    display: 'block',\n    width: '300px',\n  },\n  [`@media (min-width: ${theme.breakPoints.large}px)`]: {\n    display: 'block',\n    width: '500px',\n  },\n  [`@media (min-width: 1440px)`]: {\n    display: 'block',\n    width: '600px',\n  },\n}));\n\nconst NameGroup = styled.span({\n  display: 'flex',\n  flex: '1',\n});\n\nconst Name = styled('span')<{ theme?: Theme }>(({ theme }) => ({\n  fontWeight: '700',\n  fontSize: theme.fontSize.sm,\n}));\n\nconst Version = styled('span')<{ theme?: Theme }>(({ theme }) => ({\n  fontSize: theme.fontSize.ssm,\n}));\n\nconst SearchItem: React.FC<SearchItemProps> = ({\n  name,\n  description,\n  isPrivate = false,\n  isRemote = false,\n  isCached = false,\n  version,\n  ...props\n}) => {\n  const { t } = useTranslation();\n  const { configOptions } = useConfig();\n  const handleDelete = () => {\n    // no action assigned by default\n  };\n  return (\n    <li {...props} style={{ flexDirection: 'column' }}>\n      <Wrapper>\n        <NameGroup>\n          <Name>{name}</Name>\n          {description && <Description>{cleanDescription(description)}</Description>}\n        </NameGroup>\n        {version && <Version>{version}</Version>}\n      </Wrapper>\n      {configOptions?.showUplinks && (\n        <Wrapper>\n          <Stack direction=\"row\" spacing={1}>\n            {isPrivate && (\n              <Chip\n                color=\"primary\"\n                deleteIcon={<HttpsIcon />}\n                label={t('search.isPrivate')}\n                onDelete={handleDelete}\n                size=\"small\"\n              />\n            )}\n            {isRemote && !isPrivate && (\n              <Chip\n                deleteIcon={<SyncAlt />}\n                label={t('search.isRemote')}\n                onDelete={handleDelete}\n                size=\"small\"\n                variant=\"outlined\"\n              />\n            )}\n            {isCached && (\n              <Chip\n                deleteIcon={<Cached />}\n                label={t('search.isCached')}\n                onDelete={handleDelete}\n                size=\"small\"\n                variant=\"outlined\"\n              />\n            )}\n          </Stack>\n        </Wrapper>\n      )}\n    </li>\n  );\n};\n\nexport default SearchItem;\n"],"mappings":"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"}
+{"version":3,"file":"SearchItem.js","names":["SearchOrigin","LockOutlined","Inventory2Outlined","CloudOutlined","styled","useTranslation","useConfig","cleanDescription"],"sources":["../../../src/components/Search/SearchItem.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport CloudOutlined from '@mui/icons-material/CloudOutlined';\nimport Inventory2Outlined from '@mui/icons-material/Inventory2Outlined';\nimport LockOutlined from '@mui/icons-material/LockOutlined';\nimport type { Theme } from '@mui/material';\nimport React from 'react';\nimport { useTranslation } from 'react-i18next';\n\nimport { useConfig } from '../../';\nimport { SearchOrigin, cleanDescription } from './utils';\n\ntype SearchItemProps = {\n  name: string;\n  version?: string;\n  description?: string;\n  isPrivate?: boolean;\n  isCached?: boolean;\n  isRemote?: boolean;\n};\n\nexport const ORIGIN_ICONS = {\n  [SearchOrigin.PRIVATE]: LockOutlined,\n  [SearchOrigin.CACHED]: Inventory2Outlined,\n  [SearchOrigin.REMOTE]: CloudOutlined,\n};\n\nconst Row = styled('div')({\n  display: 'flex',\n  alignItems: 'center',\n  gap: 12,\n  width: '100%',\n  minWidth: 0,\n});\n\nconst Text = styled('div')({\n  display: 'flex',\n  flexDirection: 'column',\n  flex: 1,\n  minWidth: 0,\n});\n\nconst TitleLine = styled('div')({\n  display: 'flex',\n  alignItems: 'baseline',\n  gap: 8,\n});\n\nconst Name = styled('span')<{ theme?: Theme }>(({ theme }) => ({\n  fontWeight: 700,\n  fontSize: theme.fontSize.sm,\n  overflow: 'hidden',\n  textOverflow: 'ellipsis',\n  whiteSpace: 'nowrap',\n}));\n\nconst Version = styled('span')<{ theme?: Theme }>(({ theme }) => ({\n  marginLeft: 'auto',\n  flexShrink: 0,\n  fontSize: theme.fontSize.ssm,\n  color: theme.palette.text.secondary,\n}));\n\nexport const Description = styled('span')<{ theme?: Theme }>(({ theme }) => ({\n  color: theme.palette.text.secondary,\n  fontSize: theme.fontSize.ssm,\n  lineHeight: 1.5,\n  overflow: 'hidden',\n  textOverflow: 'ellipsis',\n  whiteSpace: 'nowrap',\n}));\n\nconst SearchItem: React.FC<SearchItemProps> = ({\n  name,\n  description,\n  isPrivate = false,\n  isRemote = false,\n  isCached = false,\n  version,\n  ...props\n}) => {\n  const { t } = useTranslation();\n  const { configOptions } = useConfig();\n  const origin = isPrivate\n    ? SearchOrigin.PRIVATE\n    : isCached\n      ? SearchOrigin.CACHED\n      : isRemote\n        ? SearchOrigin.REMOTE\n        : undefined;\n  const OriginIcon = configOptions?.showUplinks && origin ? ORIGIN_ICONS[origin] : undefined;\n\n  return (\n    <li {...props}>\n      <Row>\n        {OriginIcon && (\n          <OriginIcon\n            color={origin === SearchOrigin.PRIVATE ? 'primary' : 'action'}\n            data-testid={`search-origin-${origin}`}\n            fontSize=\"small\"\n            titleAccess={t(`search.origin.${origin}`)}\n          />\n        )}\n        <Text>\n          <TitleLine>\n            <Name>{name}</Name>\n            {version && <Version>{version}</Version>}\n          </TitleLine>\n          {description && <Description>{cleanDescription(description)}</Description>}\n        </Text>\n      </Row>\n    </li>\n  );\n};\n\nexport default SearchItem;\n"],"mappings":";;;;;;;;;;;;;;;;;AAoBA,IAAa,eAAe;EACzBA,cAAAA,aAAa,UAAUC,iCAAAA;EACvBD,cAAAA,aAAa,SAASE,uCAAAA;EACtBF,cAAAA,aAAa,SAASG,kCAAAA;AACzB;AAEA,IAAM,OAAA,GAAMC,gBAAAA,QAAAA,CAAO,KAAK,CAAC,CAAC;CACxB,SAAS;CACT,YAAY;CACZ,KAAK;CACL,OAAO;CACP,UAAU;AACZ,CAAC;AAED,IAAM,QAAA,GAAOA,gBAAAA,QAAAA,CAAO,KAAK,CAAC,CAAC;CACzB,SAAS;CACT,eAAe;CACf,MAAM;CACN,UAAU;AACZ,CAAC;AAED,IAAM,aAAA,GAAYA,gBAAAA,QAAAA,CAAO,KAAK,CAAC,CAAC;CAC9B,SAAS;CACT,YAAY;CACZ,KAAK;AACP,CAAC;AAED,IAAM,QAAA,GAAOA,gBAAAA,QAAAA,CAAO,MAAM,CAAC,EAAqB,EAAE,aAAa;CAC7D,YAAY;CACZ,UAAU,MAAM,SAAS;CACzB,UAAU;CACV,cAAc;CACd,YAAY;AACd,EAAE;AAEF,IAAM,WAAA,GAAUA,gBAAAA,QAAAA,CAAO,MAAM,CAAC,EAAqB,EAAE,aAAa;CAChE,YAAY;CACZ,YAAY;CACZ,UAAU,MAAM,SAAS;CACzB,OAAO,MAAM,QAAQ,KAAK;AAC5B,EAAE;AAEF,IAAa,eAAA,GAAcA,gBAAAA,QAAAA,CAAO,MAAM,CAAC,EAAqB,EAAE,aAAa;CAC3E,OAAO,MAAM,QAAQ,KAAK;CAC1B,UAAU,MAAM,SAAS;CACzB,YAAY;CACZ,UAAU;CACV,cAAc;CACd,YAAY;AACd,EAAE;AAEF,IAAM,cAAyC,EAC7C,MACA,aACA,YAAY,OACZ,WAAW,OACX,WAAW,OACX,SACA,GAAG,YACC;CACJ,MAAM,EAAE,OAAA,GAAMC,cAAAA,eAAAA,CAAe;CAC7B,MAAM,EAAE,kBAAkBC,iCAAAA,UAAU;CACpC,MAAM,SAAS,YACXN,cAAAA,aAAa,UACb,WACEA,cAAAA,aAAa,SACb,WACEA,cAAAA,aAAa,SACb,KAAA;CACR,MAAM,aAAa,eAAe,eAAe,SAAS,aAAa,UAAU,KAAA;CAEjF,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,MAAD;EAAI,GAAI;EACN,UAAA,iBAAA,GAAA,kBAAA,KAAA,CAAC,KAAD,EAAA,UAAA,CACG,cACC,iBAAA,GAAA,kBAAA,IAAA,CAAC,YAAD;GACE,OAAO,WAAWA,cAAAA,aAAa,UAAU,YAAY;GACrD,eAAa,iBAAiB;GAC9B,UAAS;GACT,aAAa,EAAE,iBAAiB,QAAQ;EACzC,CAAA,GAEH,iBAAA,GAAA,kBAAA,KAAA,CAAC,MAAD,EAAA,UAAA,CACE,iBAAA,GAAA,kBAAA,KAAA,CAAC,WAAD,EAAA,UAAA,CACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,MAAD,EAAA,UAAO,KAAW,CAAA,GACjB,WAAW,iBAAA,GAAA,kBAAA,IAAA,CAAC,SAAD,EAAA,UAAU,QAAiB,CAAA,CAC9B,EAAA,CAAA,GACV,eAAe,iBAAA,GAAA,kBAAA,IAAA,CAAC,aAAD,EAAA,UAAcO,cAAAA,iBAAiB,WAAW,EAAe,CAAA,CACrE,EAAA,CAAA,CACH,EAAA,CAAA;CACH,CAAA;AAER"}

package/build/components/Search/SearchItem.mjs

@@ -1,90 +1,74 @@
 import { useConfig } from "../../providers/AppConfigurationProvider/AppConfigurationProvider.mjs";
-import { cleanDescription } from "./utils.mjs";
+import { SearchOrigin, cleanDescription } from "./utils.mjs";
 import "../../index.mjs";
 import styled from "@emotion/styled";
 import "react";
 import { useTranslation } from "react-i18next";
 import { jsx, jsxs } from "react/jsx-runtime";
-import Stack from "@mui/material/Stack";
-import Chip from "@mui/material/Chip";
-import Cached from "@mui/icons-material/Cached";
-import HttpsIcon from "@mui/icons-material/Https";
-import SyncAlt from "@mui/icons-material/SyncAlt";
+import LockOutlined from "@mui/icons-material/LockOutlined";
+import CloudOutlined from "@mui/icons-material/CloudOutlined";
+import Inventory2Outlined from "@mui/icons-material/Inventory2Outlined";
 //#region src/components/Search/SearchItem.tsx
-var Wrapper = styled.div({
+var ORIGIN_ICONS = {
+	[SearchOrigin.PRIVATE]: LockOutlined,
+	[SearchOrigin.CACHED]: Inventory2Outlined,
+	[SearchOrigin.REMOTE]: CloudOutlined
+};
+var Row = styled("div")({
 	display: "flex",
 	alignItems: "center",
-	width: "100%"
+	gap: 12,
+	width: "100%",
+	minWidth: 0
 });
-var Description = styled("div")(({ theme }) => ({
-	display: "none",
-	color: theme.palette.greyLight2,
-	lineHeight: "1.5rem",
-	whiteSpace: "nowrap",
-	textOverflow: "ellipsis",
-	alignItems: "center",
-	overflow: "hidden",
-	paddingLeft: theme.spacing(),
-	fontSize: theme.fontSize.ssm,
-	[`@media (min-width: ${theme.breakPoints.medium}px)`]: {
-		display: "block",
-		width: "300px"
-	},
-	[`@media (min-width: ${theme.breakPoints.large}px)`]: {
-		display: "block",
-		width: "500px"
-	},
-	[`@media (min-width: 1440px)`]: {
-		display: "block",
-		width: "600px"
-	}
-}));
-var NameGroup = styled.span({
+var Text = styled("div")({
+	display: "flex",
+	flexDirection: "column",
+	flex: 1,
+	minWidth: 0
+});
+var TitleLine = styled("div")({
 	display: "flex",
-	flex: "1"
+	alignItems: "baseline",
+	gap: 8
 });
 var Name = styled("span")(({ theme }) => ({
-	fontWeight: "700",
-	fontSize: theme.fontSize.sm
+	fontWeight: 700,
+	fontSize: theme.fontSize.sm,
+	overflow: "hidden",
+	textOverflow: "ellipsis",
+	whiteSpace: "nowrap"
+}));
+var Version = styled("span")(({ theme }) => ({
+	marginLeft: "auto",
+	flexShrink: 0,
+	fontSize: theme.fontSize.ssm,
+	color: theme.palette.text.secondary
+}));
+var Description = styled("span")(({ theme }) => ({
+	color: theme.palette.text.secondary,
+	fontSize: theme.fontSize.ssm,
+	lineHeight: 1.5,
+	overflow: "hidden",
+	textOverflow: "ellipsis",
+	whiteSpace: "nowrap"
 }));
-var Version = styled("span")(({ theme }) => ({ fontSize: theme.fontSize.ssm }));
 var SearchItem = ({ name, description, isPrivate = false, isRemote = false, isCached = false, version, ...props }) => {
 	const { t } = useTranslation();
 	const { configOptions } = useConfig();
-	const handleDelete = () => {};
-	return /* @__PURE__ */ jsxs("li", {
+	const origin = isPrivate ? SearchOrigin.PRIVATE : isCached ? SearchOrigin.CACHED : isRemote ? SearchOrigin.REMOTE : void 0;
+	const OriginIcon = configOptions?.showUplinks && origin ? ORIGIN_ICONS[origin] : void 0;
+	return /* @__PURE__ */ jsx("li", {
 		...props,
-		style: { flexDirection: "column" },
-		children: [/* @__PURE__ */ jsxs(Wrapper, { children: [/* @__PURE__ */ jsxs(NameGroup, { children: [/* @__PURE__ */ jsx(Name, { children: name }), description && /* @__PURE__ */ jsx(Description, { children: cleanDescription(description) })] }), version && /* @__PURE__ */ jsx(Version, { children: version })] }), configOptions?.showUplinks && /* @__PURE__ */ jsx(Wrapper, { children: /* @__PURE__ */ jsxs(Stack, {
-			direction: "row",
-			spacing: 1,
-			children: [
-				isPrivate && /* @__PURE__ */ jsx(Chip, {
-					color: "primary",
-					deleteIcon: /* @__PURE__ */ jsx(HttpsIcon, {}),
-					label: t("search.isPrivate"),
-					onDelete: handleDelete,
-					size: "small"
-				}),
-				isRemote && !isPrivate && /* @__PURE__ */ jsx(Chip, {
-					deleteIcon: /* @__PURE__ */ jsx(SyncAlt, {}),
-					label: t("search.isRemote"),
-					onDelete: handleDelete,
-					size: "small",
-					variant: "outlined"
-				}),
-				isCached && /* @__PURE__ */ jsx(Chip, {
-					deleteIcon: /* @__PURE__ */ jsx(Cached, {}),
-					label: t("search.isCached"),
-					onDelete: handleDelete,
-					size: "small",
-					variant: "outlined"
-				})
-			]
-		}) })]
+		children: /* @__PURE__ */ jsxs(Row, { children: [OriginIcon && /* @__PURE__ */ jsx(OriginIcon, {
+			color: origin === SearchOrigin.PRIVATE ? "primary" : "action",
+			"data-testid": `search-origin-${origin}`,
+			fontSize: "small",
+			titleAccess: t(`search.origin.${origin}`)
+		}), /* @__PURE__ */ jsxs(Text, { children: [/* @__PURE__ */ jsxs(TitleLine, { children: [/* @__PURE__ */ jsx(Name, { children: name }), version && /* @__PURE__ */ jsx(Version, { children: version })] }), description && /* @__PURE__ */ jsx(Description, { children: cleanDescription(description) })] })] })
 	});
 };
 //#endregion
-export { Description, SearchItem as default };
+export { Description, ORIGIN_ICONS, SearchItem as default };
 
 //# sourceMappingURL=SearchItem.mjs.map

package/build/components/Search/SearchItem.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"SearchItem.mjs","names":[],"sources":["../../../src/components/Search/SearchItem.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport Cached from '@mui/icons-material/Cached';\nimport HttpsIcon from '@mui/icons-material/Https';\nimport SyncAlt from '@mui/icons-material/SyncAlt';\nimport type { Theme } from '@mui/material';\nimport Chip from '@mui/material/Chip';\nimport Stack from '@mui/material/Stack';\nimport React from 'react';\nimport { useTranslation } from 'react-i18next';\n\nimport { useConfig } from '../../';\nimport { cleanDescription } from './utils';\n\ntype SearchItemProps = {\n  name: string;\n  version?: string;\n  description?: string;\n  isPrivate?: boolean;\n  isCached?: boolean;\n  isRemote?: boolean;\n};\n\nconst Wrapper = styled.div({\n  display: 'flex',\n  alignItems: 'center',\n  width: '100%',\n});\n\nexport const Description = styled('div')<{ theme?: Theme }>(({ theme }) => ({\n  display: 'none',\n  color: theme.palette.greyLight2,\n  lineHeight: '1.5rem',\n  whiteSpace: 'nowrap',\n  textOverflow: 'ellipsis',\n  alignItems: 'center',\n  overflow: 'hidden',\n  paddingLeft: theme.spacing(),\n  fontSize: theme.fontSize.ssm,\n  [`@media (min-width: ${theme.breakPoints.medium}px)`]: {\n    display: 'block',\n    width: '300px',\n  },\n  [`@media (min-width: ${theme.breakPoints.large}px)`]: {\n    display: 'block',\n    width: '500px',\n  },\n  [`@media (min-width: 1440px)`]: {\n    display: 'block',\n    width: '600px',\n  },\n}));\n\nconst NameGroup = styled.span({\n  display: 'flex',\n  flex: '1',\n});\n\nconst Name = styled('span')<{ theme?: Theme }>(({ theme }) => ({\n  fontWeight: '700',\n  fontSize: theme.fontSize.sm,\n}));\n\nconst Version = styled('span')<{ theme?: Theme }>(({ theme }) => ({\n  fontSize: theme.fontSize.ssm,\n}));\n\nconst SearchItem: React.FC<SearchItemProps> = ({\n  name,\n  description,\n  isPrivate = false,\n  isRemote = false,\n  isCached = false,\n  version,\n  ...props\n}) => {\n  const { t } = useTranslation();\n  const { configOptions } = useConfig();\n  const handleDelete = () => {\n    // no action assigned by default\n  };\n  return (\n    <li {...props} style={{ flexDirection: 'column' }}>\n      <Wrapper>\n        <NameGroup>\n          <Name>{name}</Name>\n          {description && <Description>{cleanDescription(description)}</Description>}\n        </NameGroup>\n        {version && <Version>{version}</Version>}\n      </Wrapper>\n      {configOptions?.showUplinks && (\n        <Wrapper>\n          <Stack direction=\"row\" spacing={1}>\n            {isPrivate && (\n              <Chip\n                color=\"primary\"\n                deleteIcon={<HttpsIcon />}\n                label={t('search.isPrivate')}\n                onDelete={handleDelete}\n                size=\"small\"\n              />\n            )}\n            {isRemote && !isPrivate && (\n              <Chip\n                deleteIcon={<SyncAlt />}\n                label={t('search.isRemote')}\n                onDelete={handleDelete}\n                size=\"small\"\n                variant=\"outlined\"\n              />\n            )}\n            {isCached && (\n              <Chip\n                deleteIcon={<Cached />}\n                label={t('search.isCached')}\n                onDelete={handleDelete}\n                size=\"small\"\n                variant=\"outlined\"\n              />\n            )}\n          </Stack>\n        </Wrapper>\n      )}\n    </li>\n  );\n};\n\nexport default SearchItem;\n"],"mappings":";;;;;;;;;;;;;AAsBA,IAAM,UAAU,OAAO,IAAI;CACzB,SAAS;CACT,YAAY;CACZ,OAAO;AACT,CAAC;AAED,IAAa,cAAc,OAAO,KAAK,CAAC,EAAqB,EAAE,aAAa;CAC1E,SAAS;CACT,OAAO,MAAM,QAAQ;CACrB,YAAY;CACZ,YAAY;CACZ,cAAc;CACd,YAAY;CACZ,UAAU;CACV,aAAa,MAAM,QAAQ;CAC3B,UAAU,MAAM,SAAS;EACxB,sBAAsB,MAAM,YAAY,OAAO,OAAO;EACrD,SAAS;EACT,OAAO;CACT;EACC,sBAAsB,MAAM,YAAY,MAAM,OAAO;EACpD,SAAS;EACT,OAAO;CACT;EACC,+BAA+B;EAC9B,SAAS;EACT,OAAO;CACT;AACF,EAAE;AAEF,IAAM,YAAY,OAAO,KAAK;CAC5B,SAAS;CACT,MAAM;AACR,CAAC;AAED,IAAM,OAAO,OAAO,MAAM,CAAC,EAAqB,EAAE,aAAa;CAC7D,YAAY;CACZ,UAAU,MAAM,SAAS;AAC3B,EAAE;AAEF,IAAM,UAAU,OAAO,MAAM,CAAC,EAAqB,EAAE,aAAa,EAChE,UAAU,MAAM,SAAS,IAC3B,EAAE;AAEF,IAAM,cAAyC,EAC7C,MACA,aACA,YAAY,OACZ,WAAW,OACX,WAAW,OACX,SACA,GAAG,YACC;CACJ,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,EAAE,kBAAkB,UAAU;CACpC,MAAM,qBAAqB,CAE3B;CACA,OACE,qBAAC,MAAD;EAAI,GAAI;EAAO,OAAO,EAAE,eAAe,SAAS;EAAhD,UAAA,CACE,qBAAC,SAAD,EAAA,UAAA,CACE,qBAAC,WAAD,EAAA,UAAA,CACE,oBAAC,MAAD,EAAA,UAAO,KAAW,CAAA,GACjB,eAAe,oBAAC,aAAD,EAAA,UAAc,iBAAiB,WAAW,EAAe,CAAA,CAChE,EAAA,CAAA,GACV,WAAW,oBAAC,SAAD,EAAA,UAAU,QAAiB,CAAA,CAChC,EAAA,CAAA,GACR,eAAe,eACd,oBAAC,SAAD,EAAA,UACE,qBAAC,OAAD;GAAO,WAAU;GAAM,SAAS;GAAhC,UAAA;IACG,aACC,oBAAC,MAAD;KACE,OAAM;KACN,YAAY,oBAAC,WAAD,CAAY,CAAA;KACxB,OAAO,EAAE,kBAAkB;KAC3B,UAAU;KACV,MAAK;IACN,CAAA;IAEF,YAAY,CAAC,aACZ,oBAAC,MAAD;KACE,YAAY,oBAAC,SAAD,CAAU,CAAA;KACtB,OAAO,EAAE,iBAAiB;KAC1B,UAAU;KACV,MAAK;KACL,SAAQ;IACT,CAAA;IAEF,YACC,oBAAC,MAAD;KACE,YAAY,oBAAC,QAAD,CAAS,CAAA;KACrB,OAAO,EAAE,iBAAiB;KAC1B,UAAU;KACV,MAAK;KACL,SAAQ;IACT,CAAA;GAEE;EACA,CAAA,EAAA,CAAA,CAET;;AAER"}
+{"version":3,"file":"SearchItem.mjs","names":[],"sources":["../../../src/components/Search/SearchItem.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport CloudOutlined from '@mui/icons-material/CloudOutlined';\nimport Inventory2Outlined from '@mui/icons-material/Inventory2Outlined';\nimport LockOutlined from '@mui/icons-material/LockOutlined';\nimport type { Theme } from '@mui/material';\nimport React from 'react';\nimport { useTranslation } from 'react-i18next';\n\nimport { useConfig } from '../../';\nimport { SearchOrigin, cleanDescription } from './utils';\n\ntype SearchItemProps = {\n  name: string;\n  version?: string;\n  description?: string;\n  isPrivate?: boolean;\n  isCached?: boolean;\n  isRemote?: boolean;\n};\n\nexport const ORIGIN_ICONS = {\n  [SearchOrigin.PRIVATE]: LockOutlined,\n  [SearchOrigin.CACHED]: Inventory2Outlined,\n  [SearchOrigin.REMOTE]: CloudOutlined,\n};\n\nconst Row = styled('div')({\n  display: 'flex',\n  alignItems: 'center',\n  gap: 12,\n  width: '100%',\n  minWidth: 0,\n});\n\nconst Text = styled('div')({\n  display: 'flex',\n  flexDirection: 'column',\n  flex: 1,\n  minWidth: 0,\n});\n\nconst TitleLine = styled('div')({\n  display: 'flex',\n  alignItems: 'baseline',\n  gap: 8,\n});\n\nconst Name = styled('span')<{ theme?: Theme }>(({ theme }) => ({\n  fontWeight: 700,\n  fontSize: theme.fontSize.sm,\n  overflow: 'hidden',\n  textOverflow: 'ellipsis',\n  whiteSpace: 'nowrap',\n}));\n\nconst Version = styled('span')<{ theme?: Theme }>(({ theme }) => ({\n  marginLeft: 'auto',\n  flexShrink: 0,\n  fontSize: theme.fontSize.ssm,\n  color: theme.palette.text.secondary,\n}));\n\nexport const Description = styled('span')<{ theme?: Theme }>(({ theme }) => ({\n  color: theme.palette.text.secondary,\n  fontSize: theme.fontSize.ssm,\n  lineHeight: 1.5,\n  overflow: 'hidden',\n  textOverflow: 'ellipsis',\n  whiteSpace: 'nowrap',\n}));\n\nconst SearchItem: React.FC<SearchItemProps> = ({\n  name,\n  description,\n  isPrivate = false,\n  isRemote = false,\n  isCached = false,\n  version,\n  ...props\n}) => {\n  const { t } = useTranslation();\n  const { configOptions } = useConfig();\n  const origin = isPrivate\n    ? SearchOrigin.PRIVATE\n    : isCached\n      ? SearchOrigin.CACHED\n      : isRemote\n        ? SearchOrigin.REMOTE\n        : undefined;\n  const OriginIcon = configOptions?.showUplinks && origin ? ORIGIN_ICONS[origin] : undefined;\n\n  return (\n    <li {...props}>\n      <Row>\n        {OriginIcon && (\n          <OriginIcon\n            color={origin === SearchOrigin.PRIVATE ? 'primary' : 'action'}\n            data-testid={`search-origin-${origin}`}\n            fontSize=\"small\"\n            titleAccess={t(`search.origin.${origin}`)}\n          />\n        )}\n        <Text>\n          <TitleLine>\n            <Name>{name}</Name>\n            {version && <Version>{version}</Version>}\n          </TitleLine>\n          {description && <Description>{cleanDescription(description)}</Description>}\n        </Text>\n      </Row>\n    </li>\n  );\n};\n\nexport default SearchItem;\n"],"mappings":";;;;;;;;;;;AAoBA,IAAa,eAAe;EACzB,aAAa,UAAU;EACvB,aAAa,SAAS;EACtB,aAAa,SAAS;AACzB;AAEA,IAAM,MAAM,OAAO,KAAK,CAAC,CAAC;CACxB,SAAS;CACT,YAAY;CACZ,KAAK;CACL,OAAO;CACP,UAAU;AACZ,CAAC;AAED,IAAM,OAAO,OAAO,KAAK,CAAC,CAAC;CACzB,SAAS;CACT,eAAe;CACf,MAAM;CACN,UAAU;AACZ,CAAC;AAED,IAAM,YAAY,OAAO,KAAK,CAAC,CAAC;CAC9B,SAAS;CACT,YAAY;CACZ,KAAK;AACP,CAAC;AAED,IAAM,OAAO,OAAO,MAAM,CAAC,EAAqB,EAAE,aAAa;CAC7D,YAAY;CACZ,UAAU,MAAM,SAAS;CACzB,UAAU;CACV,cAAc;CACd,YAAY;AACd,EAAE;AAEF,IAAM,UAAU,OAAO,MAAM,CAAC,EAAqB,EAAE,aAAa;CAChE,YAAY;CACZ,YAAY;CACZ,UAAU,MAAM,SAAS;CACzB,OAAO,MAAM,QAAQ,KAAK;AAC5B,EAAE;AAEF,IAAa,cAAc,OAAO,MAAM,CAAC,EAAqB,EAAE,aAAa;CAC3E,OAAO,MAAM,QAAQ,KAAK;CAC1B,UAAU,MAAM,SAAS;CACzB,YAAY;CACZ,UAAU;CACV,cAAc;CACd,YAAY;AACd,EAAE;AAEF,IAAM,cAAyC,EAC7C,MACA,aACA,YAAY,OACZ,WAAW,OACX,WAAW,OACX,SACA,GAAG,YACC;CACJ,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,EAAE,kBAAkB,UAAU;CACpC,MAAM,SAAS,YACX,aAAa,UACb,WACE,aAAa,SACb,WACE,aAAa,SACb,KAAA;CACR,MAAM,aAAa,eAAe,eAAe,SAAS,aAAa,UAAU,KAAA;CAEjF,OACE,oBAAC,MAAD;EAAI,GAAI;EACN,UAAA,qBAAC,KAAD,EAAA,UAAA,CACG,cACC,oBAAC,YAAD;GACE,OAAO,WAAW,aAAa,UAAU,YAAY;GACrD,eAAa,iBAAiB;GAC9B,UAAS;GACT,aAAa,EAAE,iBAAiB,QAAQ;EACzC,CAAA,GAEH,qBAAC,MAAD,EAAA,UAAA,CACE,qBAAC,WAAD,EAAA,UAAA,CACE,oBAAC,MAAD,EAAA,UAAO,KAAW,CAAA,GACjB,WAAW,oBAAC,SAAD,EAAA,UAAU,QAAiB,CAAA,CAC9B,EAAA,CAAA,GACV,eAAe,oBAAC,aAAD,EAAA,UAAc,iBAAiB,WAAW,EAAe,CAAA,CACrE,EAAA,CAAA,CACH,EAAA,CAAA;CACH,CAAA;AAER"}

package/build/components/Search/utils.d.ts

@@ -1,3 +1,10 @@
+/** Where a search result lives: published here, cached from an uplink, or only on an uplink. */
+export declare enum SearchOrigin {
+    PRIVATE = "private",
+    CACHED = "cached",
+    REMOTE = "remote"
+}
+export declare const SEARCH_ORIGIN_ORDER: SearchOrigin[];
 export type NormalizedSearchOption = {
     name: string;
     version?: string;
@@ -5,6 +12,7 @@ export type NormalizedSearchOption = {
     isPrivate: boolean;
     isCached: boolean;
     isRemote: boolean;
+    origin?: SearchOrigin;
 };
 /**
  * Normalize a raw search result into a unified shape the UI can render,
@@ -19,4 +27,6 @@ export type NormalizedSearchOption = {
  * default to `false` and the UI simply omits the corresponding badges.
  */
 export declare function normalizeSearchOption(option: any): NormalizedSearchOption;
+/** Orders results private, cached, remote (stable inside each group), as grouping requires. */
+export declare function sortByOrigin<T>(options: T[]): T[];
 export declare function cleanDescription(description: string): string;

package/build/components/Search/utils.js

@@ -1,4 +1,16 @@
 //#region src/components/Search/utils.ts
+/** Where a search result lives: published here, cached from an uplink, or only on an uplink. */
+var SearchOrigin = /* @__PURE__ */ function(SearchOrigin) {
+	SearchOrigin["PRIVATE"] = "private";
+	SearchOrigin["CACHED"] = "cached";
+	SearchOrigin["REMOTE"] = "remote";
+	return SearchOrigin;
+}({});
+var SEARCH_ORIGIN_ORDER = [
+	"private",
+	"cached",
+	"remote"
+];
 /**
 * Normalize a raw search result into a unified shape the UI can render,
 * regardless of which backend response format was returned:
@@ -22,7 +34,8 @@ function normalizeSearchOption(option) {
 			description: pkg.description,
 			isPrivate,
 			isCached,
-			isRemote: !isCached && !isPrivate
+			isRemote: !isCached && !isPrivate,
+			origin: isPrivate ? "private" : isCached ? "cached" : "remote"
 		};
 	}
 	const flat = option ?? {};
@@ -35,6 +48,17 @@ function normalizeSearchOption(option) {
 		isRemote: false
 	};
 }
+/** Orders results private, cached, remote (stable inside each group), as grouping requires. */
+function sortByOrigin(options) {
+	const rank = (option) => {
+		const origin = normalizeSearchOption(option).origin;
+		return origin ? SEARCH_ORIGIN_ORDER.indexOf(origin) : SEARCH_ORIGIN_ORDER.length;
+	};
+	return options.map((option, index) => ({
+		option,
+		index
+	})).sort((a, b) => rank(a.option) - rank(b.option) || a.index - b.index).map(({ option }) => option);
+}
 function removeHtmlTags(input) {
 	let previous;
 	do {
@@ -50,7 +74,10 @@ function cleanDescription(description) {
 	return output;
 }
 //#endregion
+exports.SEARCH_ORIGIN_ORDER = SEARCH_ORIGIN_ORDER;
+exports.SearchOrigin = SearchOrigin;
 exports.cleanDescription = cleanDescription;
 exports.normalizeSearchOption = normalizeSearchOption;
+exports.sortByOrigin = sortByOrigin;
 
 //# sourceMappingURL=utils.js.map

package/build/components/Search/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","names":[],"sources":["../../../src/components/Search/utils.ts"],"sourcesContent":["export type NormalizedSearchOption = {\n  name: string;\n  version?: string;\n  description?: string;\n  isPrivate: boolean;\n  isCached: boolean;\n  isRemote: boolean;\n};\n\n/**\n * Normalize a raw search result into a unified shape the UI can render,\n * regardless of which backend response format was returned:\n *\n * 1) npm-style \"search objects\" response where each entry is wrapped in\n *    `{ package: { name, version, description, ... }, verdaccioPrivate, verdaccioPkgCached }`.\n * 2) Flat packument-style response where each entry exposes `name`, `version`,\n *    `description`, `dist`, etc. directly at the top level.\n *\n * The second shape carries no uplink metadata, so private/remote/cached flags\n * default to `false` and the UI simply omits the corresponding badges.\n */\nexport function normalizeSearchOption(option: any): NormalizedSearchOption {\n  if (option && typeof option === 'object' && option.package) {\n    const pkg = option.package ?? {};\n    const isPrivate = Boolean(option.verdaccioPrivate);\n    const isCached = Boolean(option.verdaccioPkgCached);\n    return {\n      name: pkg.name,\n      version: pkg.version,\n      description: pkg.description,\n      isPrivate,\n      isCached,\n      isRemote: !isCached && !isPrivate,\n    };\n  }\n\n  const flat = option ?? {};\n  return {\n    name: flat.name,\n    version: flat.version,\n    description: flat.description,\n    isPrivate: false,\n    isCached: false,\n    isRemote: false,\n  };\n}\n\nfunction removeHtmlTags(input: string): string {\n  let previous;\n  do {\n    previous = input;\n    input = input.replace(/<[^>]*>?/gm, '');\n  } while (input !== previous);\n  return input;\n}\n\nexport function cleanDescription(description: string): string {\n  let output = description;\n  // remove html tags from description (e.g. <h1...>)\n  output = removeHtmlTags(output);\n  // remove markdown links from description (e.g. [link](url))\n  output = output.replace(/\\(.*?\\)/gm, '').replace(/(\\[!?|\\])/gm, '');\n  return output;\n}\n"],"mappings":";;;;;;;;;;;;;AAqBA,SAAgB,sBAAsB,QAAqC;CACzE,IAAI,UAAU,OAAO,WAAW,YAAY,OAAO,SAAS;EAC1D,MAAM,MAAM,OAAO,WAAW,CAAC;EAC/B,MAAM,YAAY,QAAQ,OAAO,gBAAgB;EACjD,MAAM,WAAW,QAAQ,OAAO,kBAAkB;EAClD,OAAO;GACL,MAAM,IAAI;GACV,SAAS,IAAI;GACb,aAAa,IAAI;GACjB;GACA;GACA,UAAU,CAAC,YAAY,CAAC;EAC1B;CACF;CAEA,MAAM,OAAO,UAAU,CAAC;CACxB,OAAO;EACL,MAAM,KAAK;EACX,SAAS,KAAK;EACd,aAAa,KAAK;EAClB,WAAW;EACX,UAAU;EACV,UAAU;CACZ;AACF;AAEA,SAAS,eAAe,OAAuB;CAC7C,IAAI;CACJ,GAAG;EACD,WAAW;EACX,QAAQ,MAAM,QAAQ,cAAc,EAAE;CACxC,SAAS,UAAU;CACnB,OAAO;AACT;AAEA,SAAgB,iBAAiB,aAA6B;CAC5D,IAAI,SAAS;CAEb,SAAS,eAAe,MAAM;CAE9B,SAAS,OAAO,QAAQ,aAAa,EAAE,CAAC,CAAC,QAAQ,eAAe,EAAE;CAClE,OAAO;AACT"}
+{"version":3,"file":"utils.js","names":[],"sources":["../../../src/components/Search/utils.ts"],"sourcesContent":["/** Where a search result lives: published here, cached from an uplink, or only on an uplink. */\nexport enum SearchOrigin {\n  PRIVATE = 'private',\n  CACHED = 'cached',\n  REMOTE = 'remote',\n}\n\nexport const SEARCH_ORIGIN_ORDER = [SearchOrigin.PRIVATE, SearchOrigin.CACHED, SearchOrigin.REMOTE];\n\nexport type NormalizedSearchOption = {\n  name: string;\n  version?: string;\n  description?: string;\n  isPrivate: boolean;\n  isCached: boolean;\n  isRemote: boolean;\n  origin?: SearchOrigin;\n};\n\n/**\n * Normalize a raw search result into a unified shape the UI can render,\n * regardless of which backend response format was returned:\n *\n * 1) npm-style \"search objects\" response where each entry is wrapped in\n *    `{ package: { name, version, description, ... }, verdaccioPrivate, verdaccioPkgCached }`.\n * 2) Flat packument-style response where each entry exposes `name`, `version`,\n *    `description`, `dist`, etc. directly at the top level.\n *\n * The second shape carries no uplink metadata, so private/remote/cached flags\n * default to `false` and the UI simply omits the corresponding badges.\n */\nexport function normalizeSearchOption(option: any): NormalizedSearchOption {\n  if (option && typeof option === 'object' && option.package) {\n    const pkg = option.package ?? {};\n    const isPrivate = Boolean(option.verdaccioPrivate);\n    const isCached = Boolean(option.verdaccioPkgCached);\n    return {\n      name: pkg.name,\n      version: pkg.version,\n      description: pkg.description,\n      isPrivate,\n      isCached,\n      isRemote: !isCached && !isPrivate,\n      origin: isPrivate\n        ? SearchOrigin.PRIVATE\n        : isCached\n          ? SearchOrigin.CACHED\n          : SearchOrigin.REMOTE,\n    };\n  }\n\n  const flat = option ?? {};\n  return {\n    name: flat.name,\n    version: flat.version,\n    description: flat.description,\n    isPrivate: false,\n    isCached: false,\n    isRemote: false,\n  };\n}\n\n/** Orders results private, cached, remote (stable inside each group), as grouping requires. */\nexport function sortByOrigin<T>(options: T[]): T[] {\n  const rank = (option: T) => {\n    const origin = normalizeSearchOption(option).origin;\n    return origin ? SEARCH_ORIGIN_ORDER.indexOf(origin) : SEARCH_ORIGIN_ORDER.length;\n  };\n  return options\n    .map((option, index) => ({ option, index }))\n    .sort((a, b) => rank(a.option) - rank(b.option) || a.index - b.index)\n    .map(({ option }) => option);\n}\n\nfunction removeHtmlTags(input: string): string {\n  let previous;\n  do {\n    previous = input;\n    input = input.replace(/<[^>]*>?/gm, '');\n  } while (input !== previous);\n  return input;\n}\n\nexport function cleanDescription(description: string): string {\n  let output = description;\n  // remove html tags from description (e.g. <h1...>)\n  output = removeHtmlTags(output);\n  // remove markdown links from description (e.g. [link](url))\n  output = output.replace(/\\(.*?\\)/gm, '').replace(/(\\[!?|\\])/gm, '');\n  return output;\n}\n"],"mappings":";;AACA,IAAY,eAAL,yBAAA,cAAA;CACL,aAAA,aAAA;CACA,aAAA,YAAA;CACA,aAAA,YAAA;;AACF,EAAA,CAAA,CAAA;AAEA,IAAa,sBAAsB;;;;AAA+D;;;;;;;;;;;;;AAwBlG,SAAgB,sBAAsB,QAAqC;CACzE,IAAI,UAAU,OAAO,WAAW,YAAY,OAAO,SAAS;EAC1D,MAAM,MAAM,OAAO,WAAW,CAAC;EAC/B,MAAM,YAAY,QAAQ,OAAO,gBAAgB;EACjD,MAAM,WAAW,QAAQ,OAAO,kBAAkB;EAClD,OAAO;GACL,MAAM,IAAI;GACV,SAAS,IAAI;GACb,aAAa,IAAI;GACjB;GACA;GACA,UAAU,CAAC,YAAY,CAAC;GACxB,QAAQ,YAAA,YAEJ,WAAA,WAAA;EAGN;CACF;CAEA,MAAM,OAAO,UAAU,CAAC;CACxB,OAAO;EACL,MAAM,KAAK;EACX,SAAS,KAAK;EACd,aAAa,KAAK;EAClB,WAAW;EACX,UAAU;EACV,UAAU;CACZ;AACF;;AAGA,SAAgB,aAAgB,SAAmB;CACjD,MAAM,QAAQ,WAAc;EAC1B,MAAM,SAAS,sBAAsB,MAAM,CAAC,CAAC;EAC7C,OAAO,SAAS,oBAAoB,QAAQ,MAAM,IAAI,oBAAoB;CAC5E;CACA,OAAO,QACJ,KAAK,QAAQ,WAAW;EAAE;EAAQ;CAAM,EAAE,CAAC,CAC3C,MAAM,GAAG,MAAM,KAAK,EAAE,MAAM,IAAI,KAAK,EAAE,MAAM,KAAK,EAAE,QAAQ,EAAE,KAAK,CAAC,CACpE,KAAK,EAAE,aAAa,MAAM;AAC/B;AAEA,SAAS,eAAe,OAAuB;CAC7C,IAAI;CACJ,GAAG;EACD,WAAW;EACX,QAAQ,MAAM,QAAQ,cAAc,EAAE;CACxC,SAAS,UAAU;CACnB,OAAO;AACT;AAEA,SAAgB,iBAAiB,aAA6B;CAC5D,IAAI,SAAS;CAEb,SAAS,eAAe,MAAM;CAE9B,SAAS,OAAO,QAAQ,aAAa,EAAE,CAAC,CAAC,QAAQ,eAAe,EAAE;CAClE,OAAO;AACT"}