@balena/ui-shared-components 15.4.1-build-replace-lodash-with-es-toolkit-366e2166c19de2abc07d1f183588d670fe585847-1 → 15.5.0-build-revert-consolidate-fomrats-2ee7e5a82a73723817c8fdc34cef5f22f8b78626-1

package/dist/components/DownloadImageDialog/index.js

@@ -5,7 +5,8 @@ import { FALLBACK_LOGO_UNKNOWN_DEVICE, isUrlAccessible, stripVersionBuild, } fro
 import { GENERIC_X86_MINIMUM_SUPPORTED_SECUREBOOT_VERSION, GENERIC_X86_SLUG, ImageForm, } from './ImageForm';
 import { ApplicationInstructions } from './ApplicationInstructions';
 import { DropDownButton } from '../DropDownButton';
-import { pickBy, debounce } from 'es-toolkit';
+import pickBy from 'lodash/pickBy';
+import debounce from 'lodash/debounce';
 import { OsTypesEnum } from './models';
 import { uniq } from '../../utils/arrays';
 import { enqueueSnackbar } from 'notistack';
@@ -82,7 +83,10 @@ const debounceDownloadSize = debounce(async (getDownloadSize, deviceType, rawVer
     catch (_b) {
         setDownloadSize(null);
     }
-}, 200);
+}, 200, {
+    trailing: true,
+    leading: false,
+});
 export const DownloadImageDialog = ({ open, applicationId, releaseId, compatibleDeviceTypes, initialDeviceType, initialOsVersions, isInitialDefault, downloadUrl, onDownloadStart, getSupportedOsVersions, getSupportedOsTypes, downloadConfig, getDownloadSize, getDockerArtifact, hasEsrVersions, onClose, onFieldChange, dialogActions, authToken, }) => {
     var _a, _b, _c, _d;
     const formElement = useRef(null);
@@ -184,7 +188,7 @@ export const DownloadImageDialog = ({ open, applicationId, releaseId, compatible
             return;
         }
         // Debounce as the version changes right after the devicetype does, resulting in multiple requests.
-        debounceDownloadSize(getDownloadSize, formModel.deviceType, formModel.version, setDownloadSize);
+        void debounceDownloadSize(getDownloadSize, formModel.deviceType, formModel.version, setDownloadSize);
     }, [formModel.deviceType, getDownloadSize, formModel.version]);
     useEffect(() => {
         if (!compatibleDeviceTypes || !getSupportedOsVersions) {

package/dist/components/DownloadImageDialog/utils.js

@@ -1,3 +1,4 @@
+import template from 'lodash/template';
 import { OsTypesEnum } from './models';
 // TODO: find a way to no release to a link but also not duplicate
 export const FALLBACK_LOGO_UNKNOWN_DEVICE = 'https://dashboard.balena-cloud.com/img/unknown-device.svg';
@@ -7,12 +8,8 @@ export const OS_VARIANT_FULL_DISPLAY_TEXT_MAP = {
 };
 export const getExpanded = (obj) => { var _a; return (_a = (Array.isArray(obj) && obj[0])) !== null && _a !== void 0 ? _a : undefined; };
 export const stripVersionBuild = (version) => version.replace(/(\.dev|\.prod)/, '');
-// Simulate moustache templating
-export const interpolateMustache = (data, tpl) => tpl.replace(/{{([\s\S]+?)}}/g, (_match, key) => {
-    var _a;
-    const trimmedKey = key.trim();
-    return (_a = data[trimmedKey]) !== null && _a !== void 0 ? _a : '';
-});
+// Use lodash templates to simulate moustache templating
+export const interpolateMustache = (data, tpl) => template(tpl, { interpolate: /{{([\s\S]+?)}}/g })(data);
 export const getOsTypeName = (osTypeSlug) => {
     switch (osTypeSlug) {
         case OsTypesEnum.DEFAULT:

package/dist/components/DownloadImageDialog/version.js

@@ -1,5 +1,5 @@
 import { uniq } from '../../utils/arrays';
-import { partition } from 'es-toolkit';
+import partition from 'lodash/partition';
 export const transformVersions = (versions) => {
     const optsByVersion = {};
     versions.forEach((version) => {
@@ -29,7 +29,7 @@ export const getPreferredVersionOpts = (versionOpts) => {
         // TODO: check if worth installing semver on ui-shared-components;
         // const major = semver.major(v.strippedVersion);
         const major = (_a = v.value.match(/\d+/)) === null || _a === void 0 ? void 0 : _a.join();
-        return !!major && parseInt(major, 10) > LEGACY_OS_VERSION_MAJOR;
+        return major && parseInt(major, 10) > LEGACY_OS_VERSION_MAJOR;
     });
     const opts = supportedVersions.length ? supportedVersions : legacyVersions;
     const lines = uniq(opts.map((option) => option.line));

package/dist/components/DropDownButton/index.js

@@ -4,7 +4,7 @@ import { useMemo, useState } from 'react';
 import { Button, ButtonGroup, MenuItem, Menu } from '@mui/material';
 import { ButtonWithTracking } from '../ButtonWithTracking';
 import { useAnalyticsContext } from '../../contexts/AnalyticsContext';
-import { groupBy } from 'es-toolkit';
+import groupBy from 'lodash/groupBy';
 import { Tooltip } from '../Tooltip';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { faCaretDown, faCaretUp, faChevronDown, faChevronUp, } from '@fortawesome/free-solid-svg-icons';
@@ -25,7 +25,7 @@ export const DropDownButton = (_a) => {
         if (!groupByProp) {
             return items;
         }
-        const grouped = groupBy(items, (item) => String(item[groupByProp]));
+        const grouped = groupBy(items, (item) => item[groupByProp]);
         const entries = Object.entries(grouped);
         const lastKey = (_a = entries.at(-1)) === null || _a === void 0 ? void 0 : _a[0];
         return entries

package/dist/components/Form/Widgets/SelectWidget.js

@@ -1,7 +1,8 @@
 import { __rest } from "tslib";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Autocomplete, Chip, TextField, FormControl, InputLabel, Typography, } from '@mui/material';
-import { omit, isEqual } from 'es-toolkit';
+import omit from 'lodash/omit';
+import isEqual from 'lodash/isEqual';
 import { token } from '../../../utils/token';
 const noneOption = {
     disabled: false,
@@ -52,7 +53,7 @@ export const SelectWidget = ({ id, label, value, disabled, name, placeholder, on
                     return (
                     // eslint-disable-next-line react/jsx-key -- `key` is provided by getTagProps
                     _jsx(Chip, Object.assign({ label: option.label }, (((_a = option.schema) === null || _a === void 0 ? void 0 : _a.disabled)
-                        ? omit(tagProps, ['onDelete'])
+                        ? omit(tagProps, 'onDelete')
                         : tagProps))));
                 }), isOptionEqualToValue: (option, val) => isEqual(option, val), getOptionLabel: (option) => Array.isArray(option)
                     ? option.map((o) => o.label).join(', ')

package/dist/components/HighlightedName/index.d.ts

@@ -1,7 +1,5 @@
 import type { TypographyProps } from '@mui/material';
-export declare const generateHexColorFromString: ((text: string) => string) & {
-    cache: import("es-toolkit").MemoizeCache<any, string>;
-};
+export declare const generateHexColorFromString: ((text: string) => string) & import("lodash").MemoizedFunction;
 export declare const isLight: (color?: string) => boolean;
 type HighlightedNameProps = Omit<TypographyProps, 'children'> & {
     children: string;

package/dist/components/HighlightedName/index.js

@@ -3,7 +3,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { useMemo } from 'react';
 import Color from 'color';
 import ColorHash from 'color-hash';
-import { memoize } from 'es-toolkit';
+import memoize from 'lodash/memoize';
 import { Typography } from '@mui/material';
 import { token } from '../../utils/token';
 const colorHash = new ColorHash();

package/dist/components/RJST/Actions/Tags.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import React from 'react';
 import { parseDescriptionProperty } from '../schemaOps';
-import { get } from '../../../utils/objects';
+import get from 'lodash/get';
 import { useTranslation } from '../../../hooks/useTranslations';
 import { closeSnackbar, enqueueSnackbar } from 'notistack';
 import { useQuery } from '@tanstack/react-query';

package/dist/components/RJST/DataTypes/enum.js

@@ -1,4 +1,4 @@
-import { isEqual } from 'es-toolkit';
+import isEqual from 'lodash/isEqual';
 import { FULL_TEXT_SLUG } from '../components/Filters/SchemaSieve';
 import { getDataTypeSchema, regexEscape } from './utils';
 export const operators = () => ({

package/dist/components/RJST/DataTypes/object.js

@@ -1,7 +1,8 @@
 import { getDataTypeSchema, regexEscape } from './utils';
 import { FULL_TEXT_SLUG, createModelFilter, } from '../components/Filters/SchemaSieve';
 import { isJSONSchema, getRefSchema } from '../schemaOps';
-import { pick, mapValues } from 'es-toolkit';
+import pick from 'lodash/pick';
+import mapValues from 'lodash/mapValues';
 const findValueByDescription = (obj, description) => {
     return Object.values(obj !== null && obj !== void 0 ? obj : {}).find((property) => typeof property === 'object' &&
         'description' in property &&
@@ -87,7 +88,7 @@ const getValueForOperation = (operator, schema, value) => {
     return schemaProperty
         ? typeof value === 'string'
             ? { type: 'string', [schemaProperty]: value }
-            : pick(value, [schemaProperty])
+            : pick(value, schemaProperty)
         : value;
 };
 const getTitleForOperation = (operator, schema, value) => {

package/dist/components/RJST/DataTypes/utils.d.ts

@@ -7,7 +7,5 @@ export type CreateFilter<TOperatorSlugs> = (field: string, operator: TOperatorSl
     enumNames?: string[];
 }) => Schema | JSONSchema;
 export declare const getDefaultDate: () => string;
-export declare const normalizeDateTime: ((timestamp: string | number) => string | number | null) & {
-    cache: import("es-toolkit").MemoizeCache<any, string | number | null>;
-};
+export declare const normalizeDateTime: ((timestamp: string | number) => string | number | null) & import("lodash").MemoizedFunction;
 export declare const getDataTypeSchema: (schemaField: Partial<JSONSchema>, index: number, operators: Record<string, string>, valueSchema: Partial<JSONSchema>) => JSONSchema;

package/dist/components/RJST/DataTypes/utils.js

@@ -1,4 +1,4 @@
-import { memoize } from 'es-toolkit';
+import memoize from 'lodash/memoize';
 const matchOperatorsRe = /[|\\{}()[\]^$+*?]/g;
 const unescapeRegexRe = /\\([|\\{}()[\]^$+*?])/g;
 export const regexEscape = (str) => str.replace(matchOperatorsRe, '\\$&');

package/dist/components/RJST/Filters/Filters.js

@@ -3,10 +3,10 @@ import React from 'react';
 import { PersistentFilters } from './PersistentFilters';
 import { Filters as FiltersComponent, } from '../components/Filters';
 import { modifySchemaWithRefSchemes, removeFieldsWithNoFilter, removeRefSchemeSeparatorsFromFilters, } from './utils';
-import { useUiSharedComponentsContext } from '../../../hooks/useUiSharedComponentsContext';
+import { useNavigate } from '../../../hooks/useNavigate';
 const DEFAULT_RENDER_MODE = ['add', 'search', 'views'].slice();
 export const Filters = ({ schema, filters, views, changeFilters, changeViews, viewsRestorationKey, renderMode, onSearch, persistFilters, }) => {
-    const { navigate } = useUiSharedComponentsContext();
+    const navigate = useNavigate();
     const filteredSchema = React.useMemo(() => removeFieldsWithNoFilter(schema), [schema]);
     // This is the function that will rework the schema taking in consideration x-ref-scheme and x-foreign-key-scheme.
     const reworkedSchema = React.useMemo(() => modifySchemaWithRefSchemes(filteredSchema), [filteredSchema]);

package/dist/components/RJST/Filters/utils.js

@@ -1,5 +1,6 @@
 import { convertRefSchemeToSchemaPath, getRefSchemeTitle, getRefSchemePrefix, isJSONSchema, parseDescription, parseDescriptionProperty, } from '../schemaOps';
-import { get, isObjectEmpty } from '../../../utils/objects';
+import get from 'lodash/get';
+import { isObjectEmpty } from '../../../utils/objects';
 const X_FOREIGN_KEY_SCHEMA_SEPARATOR = '___ref_scheme_separator_';
 export const removeFieldsWithNoFilter = (schema) => {
     const processProperties = (properties, parentXNoFilterSet) => {

package/dist/components/RJST/components/Filters/FilterDescription.js

@@ -3,7 +3,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import * as React from 'react';
 import { FULL_TEXT_SLUG, parseFilterDescription, } from './SchemaSieve';
 import { isDateTimeFormat } from '../../DataTypes';
-import { isEqual } from 'es-toolkit';
+import isEqual from 'lodash/isEqual';
 import { findInObject } from '../../utils';
 import { isJSONSchema } from '../../schemaOps';
 import { Tag } from '../../../Tag';

package/dist/components/RJST/components/Filters/FocusSearch.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import React from 'react';
-import { debounce } from 'es-toolkit';
-import { useUiSharedComponentsContext } from '../../../../hooks/useUiSharedComponentsContext';
+import debounce from 'lodash/debounce';
+import { useNavigate } from '../../../../hooks/useNavigate';
 import { ajvFilter, createFullTextSearchFilter } from './SchemaSieve';
 import { Box, styled, Typography } from '@mui/material';
 import { convertToPineClientFilter } from '../../oData/jsonToOData';
@@ -34,7 +34,7 @@ const FocusItem = styled(Box)(({ hasGetBaseUrl }) => ({
 }));
 export const FocusSearch = ({ searchTerm, filtered, rjstContext, model, rowKey = 'id', }) => {
     var _a;
-    const { navigate } = useUiSharedComponentsContext();
+    const navigate = useNavigate();
     const [searchResults, setSearchResults] = React.useState(null);
     const [isLoading, setIsLoading] = React.useState(false);
     const inputSearch = (_a = rjstContext.sdk) === null || _a === void 0 ? void 0 : _a.inputSearch;
@@ -63,7 +63,7 @@ export const FocusSearch = ({ searchTerm, filtered, rjstContext, model, rowKey =
     }, 300), [inputSearch, filtered]);
     React.useEffect(() => {
         const filter = createFullTextSearchFilter(model.schema, searchTerm);
-        debouncedSearch(filter);
+        void debouncedSearch(filter);
         return () => {
             debouncedSearch.cancel();
         };

package/dist/components/RJST/components/Filters/SchemaSieve.js

@@ -1,7 +1,7 @@
 import { getAllOperators, getDataModel, isDateTimeFormat, } from '../../DataTypes';
 import ajvKeywords from 'ajv-keywords';
 import addFormats from 'ajv-formats';
-import { pickBy } from 'es-toolkit';
+import pickBy from 'lodash/pickBy';
 import Ajv from 'ajv';
 import { enqueueSnackbar } from 'notistack';
 import { isObjectEmpty } from '../../../../utils/objects';

package/dist/components/RJST/components/Widget/Formats/TxtWidget.js

@@ -1,5 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { get } from '../../../../../utils/objects';
+import get from 'lodash/get';
+import invokeMap from 'lodash/invokeMap';
 import { UiOption, JsonTypes, widgetFactory, formatTimestamp } from '../utils';
 import { Truncate } from '../../../../Truncate';
 import { Typography } from '@mui/material';
@@ -10,10 +11,7 @@ const getArrayValue = (value, uiSchema) => {
     if (typeof maxItems !== 'number') {
         return '';
     }
-    let arrayString = value
-        .slice(0, maxItems)
-        .map((item) => item === null || item === void 0 ? void 0 : item.toString())
-        .join(', ');
+    let arrayString = invokeMap(value.slice(0, maxItems), 'toString').join(', ');
     if (maxItems && maxItems < value.length) {
         arrayString += ` and ${value.length - maxItems} more...`;
     }

package/dist/components/RJST/components/Widget/utils.js

@@ -1,4 +1,4 @@
-import { get } from '../../../../utils/objects';
+import get from 'lodash/get';
 import { format, formatDistance } from 'date-fns';
 const DATE_FORMAT = 'MMM do yyyy';
 const TIME_FORMAT = 'h:mm a';

package/dist/components/RJST/index.d.ts

@@ -6,6 +6,7 @@ import { rjstDefaultPermissions, rjstGetModelForCollection, rjstRunTransformers
 import { rjstGetDisabledReason } from './utils';
 import type { LensTemplate } from './Lenses';
 import type { BoxProps } from '@mui/material';
+import type { Format } from './components/Widget/utils';
 import type { Pagination } from './components/Table/utils';
 export interface NoDataInfo {
     title?: string | React.ReactElement;
@@ -20,6 +21,8 @@ export interface RJSTProps<T> extends Omit<BoxProps, 'onChange'> {
     model: RJSTModel<T>;
     /** Array of data or data entity to display */
     data: T[] | undefined;
+    /** Formats are custom widgets to render in the table cell. The type of format to display is described in the model. */
+    formats?: Format[];
     /** Actions is an array of actions applicable on the selected items */
     actions?: Array<RJSTAction<T>>;
     /** The sdk is used to pass the method to handle tags when added removed or updated */
@@ -54,5 +57,5 @@ export interface RJSTProps<T> extends Omit<BoxProps, 'onChange'> {
     noDataInfo?: NoDataInfo;
     persistFilters?: boolean;
 }
-export declare const RJST: <T extends RJSTBaseResource<T>>({ model: modelRaw, data, actions, sdk, customSort, refresh, getBaseUrl, onEntityClick, onChange, pagination, customLenses, loading, rowKey, noDataInfo, persistFilters, ...boxProps }: RJSTProps<T>) => import("react/jsx-runtime").JSX.Element;
+export declare const RJST: <T extends RJSTBaseResource<T>>({ model: modelRaw, data, formats, actions, sdk, customSort, refresh, getBaseUrl, onEntityClick, onChange, pagination, customLenses, loading, rowKey, noDataInfo, persistFilters, ...boxProps }: RJSTProps<T>) => import("react/jsx-runtime").JSX.Element;
 export { rjstRunTransformers, rjstDefaultPermissions, rjstGetModelForCollection, rjstAddToSchema, type RJSTAction, type RJSTBaseResource, type RJSTRawModel, type RJSTModel, rjstJsonSchemaPick, rjstGetDisabledReason, getPropertyScheme, getSubSchemaFromRefScheme, parseDescription, parseDescriptionProperty, generateSchemaFromRefScheme, };

package/dist/components/RJST/index.js

@@ -3,7 +3,7 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 import React from 'react';
 import { getFieldForFormat, rjstJsonSchemaPick, rjstAdaptRefScheme, rjstAddToSchema, generateSchemaFromRefScheme, getHeaderLink, getPropertyScheme, getSubSchemaFromRefScheme, parseDescription, parseDescriptionProperty, isJSONSchema, } from './schemaOps';
 import { LensSelection } from './Lenses/LensSelection';
-import { isEqual, pickBy } from 'es-toolkit';
+import isEqual from 'lodash/isEqual';
 import { Filters } from './Filters/Filters';
 import { Tags } from './Actions/Tags';
 import { Update } from './Actions/Update';
@@ -12,11 +12,12 @@ import { rjstDefaultPermissions, rjstGetModelForCollection, rjstRunTransformers,
 import { rjstGetDisabledReason, getFromLocalStorage, getTagsDisabledReason, setToLocalStorage, getSortingFunction, DEFAULT_ITEMS_PER_PAGE, } from './utils';
 import { getLenses } from './Lenses';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
+import pickBy from 'lodash/pickBy';
 import { NoRecordsFoundView } from './NoRecordsFoundView';
 import { Box, Link, styled } from '@mui/material';
 import { useTranslation } from '../../hooks/useTranslations';
 import { useAnalyticsContext } from '../../contexts/AnalyticsContext';
-import { useUiSharedComponentsContext } from '../../hooks/useUiSharedComponentsContext';
+import { useNavigate } from '../../hooks/useNavigate';
 import { convertToPineClientFilter, orderbyBuilder } from './oData/jsonToOData';
 import { ajvFilter } from './components/Filters/SchemaSieve';
 import { Spinner } from '../Spinner';
@@ -36,10 +37,10 @@ const HeaderGrid = styled(Box)(({ theme }) => ({
 // any typing we have in lenses today.
 export const RJST = (_a) => {
     var _b, _c, _d, _e, _f;
-    var { model: modelRaw, data, actions, sdk, customSort, refresh, getBaseUrl, onEntityClick, onChange, pagination, customLenses, loading = false, rowKey, noDataInfo, persistFilters = true } = _a, boxProps = __rest(_a, ["model", "data", "actions", "sdk", "customSort", "refresh", "getBaseUrl", "onEntityClick", "onChange", "pagination", "customLenses", "loading", "rowKey", "noDataInfo", "persistFilters"]);
+    var { model: modelRaw, data, formats, actions, sdk, customSort, refresh, getBaseUrl, onEntityClick, onChange, pagination, customLenses, loading = false, rowKey, noDataInfo, persistFilters = true } = _a, boxProps = __rest(_a, ["model", "data", "formats", "actions", "sdk", "customSort", "refresh", "getBaseUrl", "onEntityClick", "onChange", "pagination", "customLenses", "loading", "rowKey", "noDataInfo", "persistFilters"]);
     const { t } = useTranslation();
     const { state: analytics } = useAnalyticsContext();
-    const { navigate, RJSTFormats: formats } = useUiSharedComponentsContext();
+    const navigate = useNavigate();
     const modelRef = React.useRef(modelRaw);
     // This allows the component to work even if
     // consumers are passing a new model object every time.

package/dist/components/RJST/schemaOps.js

@@ -1,6 +1,7 @@
-import { pick } from 'es-toolkit';
+import get from 'lodash/get';
+import pick from 'lodash/pick';
 import { findInObject } from './utils';
-import { get, isObjectEmpty, pickDeep } from '../../utils/objects';
+import { isObjectEmpty } from '../../utils/objects';
 export const isJson = (str) => {
     try {
         JSON.parse(str);
@@ -85,7 +86,7 @@ export const getRefSchemaPrefix = (propertySchema) => {
     return propertySchema.type === 'array' ? `items.properties.` : `properties.`;
 };
 export const generateSchemaFromRefScheme = (schema, parentProperty, refScheme) => {
-    var _a, _b, _c;
+    var _a, _b, _c, _d;
     const propertySchema = (_b = (_a = schema.properties) === null || _a === void 0 ? void 0 : _a[parentProperty]) !== null && _b !== void 0 ? _b : schema;
     if (!refScheme) {
         return propertySchema;
@@ -102,7 +103,7 @@ export const generateSchemaFromRefScheme = (schema, parentProperty, refScheme) =
     if (ongoingIncrementalPath.length) {
         typePaths.push(ongoingIncrementalPath);
     }
-    return Object.assign(Object.assign(Object.assign({}, propertySchema), { description: JSON.stringify({ 'x-ref-scheme': [refScheme] }), title: (_c = get(propertySchema, convertedRefScheme).title) !== null && _c !== void 0 ? _c : propertySchema.title }), pickDeep(propertySchema, typePaths));
+    return Object.assign(Object.assign(Object.assign({}, propertySchema), { description: JSON.stringify({ 'x-ref-scheme': [refScheme] }), title: (_d = (_c = get(propertySchema, convertedRefScheme)) === null || _c === void 0 ? void 0 : _c.title) !== null && _d !== void 0 ? _d : propertySchema.title }), pick(propertySchema, typePaths));
 };
 export const getRefSchema = (schema, refSchemePrefix) => {
     var _a;

package/dist/components/RJST/utils.js

@@ -1,6 +1,6 @@
 import { getPropertyScheme } from './schemaOps';
 import { toArray } from '../../utils/arrays';
-import { get } from '../../utils/objects';
+import get from 'lodash/get';
 import { JsonTypes } from './components/Widget/utils';
 export const DEFAULT_ITEMS_PER_PAGE = 50;
 export const diff = (a, b) => {

package/dist/components/TagManagementDialog/index.js

@@ -4,9 +4,10 @@ import { faTrashAlt } from '@fortawesome/free-solid-svg-icons/faTrashAlt';
 import { faUndo } from '@fortawesome/free-solid-svg-icons/faUndo';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { AddTagForm } from './AddTagForm';
-import { sortBy, partition } from 'es-toolkit';
+import sortBy from 'lodash/sortBy';
 import { faPencilAlt } from '@fortawesome/free-solid-svg-icons/faPencilAlt';
 import { getResourceTagSubmitInfo, groupResourcesByTags, } from './tag-management-service';
+import partition from 'lodash/partition';
 import { Button, DialogActions, DialogContent, Stack, styled, Table, TableBody, TableCell, TableHead, TableRow, TextField, Typography, } from '@mui/material';
 import { useTranslation } from '../../hooks/useTranslations';
 import { CollectionSummary } from '../CollectionSummary';
@@ -130,7 +131,7 @@ export const TagManagementDialog = ({ items, itemType, titleField, tagField, can
                 state: 'added',
             };
             slicedTags.push(newTag);
-            slicedTags = sortBy(slicedTags, ['tag_key']);
+            slicedTags = sortBy(slicedTags, 'tag_key');
         }
         setEditingTag(undefined);
         setTags(slicedTags);

package/dist/components/TagManagementDialog/tag-management-service.js

@@ -1,4 +1,4 @@
-import { groupBy } from 'es-toolkit';
+import groupBy from 'lodash/groupBy';
 export const TAGS_COLUMN_KEY = 'Tags';
 export const getTagKeyValueComposite = (tagKey, value) => `${tagKey}: ${value}`;
 export const getResourceTags = (item, tagField) => { var _a; return ((_a = (tagField in item ? item[tagField] : null)) !== null && _a !== void 0 ? _a : []); };
@@ -12,7 +12,7 @@ export const groupResourcesByTags = (items, tagField) => {
             item,
         }));
     });
-    const tagsByTagKeyValue = groupBy(resourceTagInfos, (item) => item.tag_key_value);
+    const tagsByTagKeyValue = groupBy(resourceTagInfos, 'tag_key_value');
     const tagsWithItems = Object.keys(tagsByTagKeyValue)
         .sort()
         .map((tagKeyValue) => {

package/dist/components/VirtualizedAutocomplete/index.js

@@ -2,7 +2,7 @@ import { __rest } from "tslib";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { createElement as _createElement } from "react";
 import { Autocomplete, Box, ListItemButton, Stack } from '@mui/material';
-import { throttle } from 'es-toolkit';
+import throttle from 'lodash/throttle';
 import * as React from 'react';
 import { forwardRef } from 'react';
 import { VList } from 'virtua';
@@ -104,10 +104,10 @@ const VirtualizedAutocompleteBase = (_a, ref) => {
         }), ListboxProps: {
             isNextPageLoading,
             pagination,
-        }, ListboxComponent: ListboxComponent, onInputChange: (event, input) => {
+        }, ListboxComponent: ListboxComponent, onInputChange: async (event, input) => {
             // input change
             if ((event === null || event === void 0 ? void 0 : event.type) === 'change') {
-                debouncedInputChange(input, []);
+                await debouncedInputChange(input, []);
             }
         }, getOptionLabel: getOptionLabel, value: value }, (loadNext === undefined ? {} : { filterOptions: (o) => o }))));
 };

package/dist/contexts/UiSharedComponentsContextProvider.d.ts

@@ -1,11 +1,9 @@
 import type { TFunction } from '../hooks/useTranslations';
 import type { NavigateFunction } from 'react-router-dom';
-import type { Format } from '../components/RJST/components/Widget/utils';
 export interface UiSharedComponentsContextProviderInterface {
     navigate?: NavigateFunction;
     t?: TFunction;
     externalTranslationMap?: Dictionary<string>;
-    RJSTFormats?: Format[];
 }
 export declare const UiSharedComponentsContextProvider: import("react").Context<UiSharedComponentsContextProviderInterface>;
 export declare const UiSharedComponentsProvider: ({ children, ...otherProps }: UiSharedComponentsContextProviderInterface & {

package/dist/hooks/useNavigate.d.ts

@@ -0,0 +1 @@
+export declare const useNavigate: () => import("react-router").NavigateFunction | undefined;

package/dist/hooks/useNavigate.js

@@ -0,0 +1,6 @@
+import React from 'react';
+import { UiSharedComponentsContextProvider } from '../contexts/UiSharedComponentsContextProvider';
+export const useNavigate = () => {
+    const { navigate } = React.useContext(UiSharedComponentsContextProvider);
+    return navigate;
+};

package/dist/hooks/useTranslations.js

@@ -1,4 +1,5 @@
 import React from 'react';
+import template from 'lodash/template';
 import { UiSharedComponentsContextProvider } from '../contexts/UiSharedComponentsContextProvider';
 const translationMap = {
     // TagManagement
@@ -85,12 +86,8 @@ const getTranslation = (str, opts) => {
         translation =
             (_a = translationMap[pluralKey]) !== null && _a !== void 0 ? _a : translationMap[str];
     }
-    return translation.replace(/{{([\s\S]+?)}}/g, (_match, key) => {
-        const trimmedKey = key.trim();
-        // Look up the value in opts. If null/undefined, return empty string.
-        const value = opts[trimmedKey];
-        return value != null ? String(value) : '';
-    });
+    const compiled = template(translation, { interpolate: /{{([\s\S]+?)}}/g });
+    return compiled(opts);
 };
 export const useTranslation = () => {
     const { t: externalT } = React.useContext(UiSharedComponentsContextProvider);

package/dist/utils/objects.d.ts

@@ -1,7 +1 @@
 export declare const isObjectEmpty: (obj: Record<string, unknown> | object) => boolean;
-/**
- * Native replacement for Lodash's deep pick.
- * Accepts an object and an array of paths (string arrays).
- */
-export declare const pickDeep: (source: any, paths: string[][]) => any;
-export declare const get: <T = any>(obj: any, path: string | string[], defaultValue?: T) => T | undefined;

package/dist/utils/objects.js

@@ -1,46 +1,3 @@
 export const isObjectEmpty = (obj) => {
     return Object.keys(obj).length === 0;
 };
-/**
- * Native replacement for Lodash's deep pick.
- * Accepts an object and an array of paths (string arrays).
- */
-export const pickDeep = (source, paths) => {
-    const result = {};
-    for (const path of paths) {
-        // 1. Get the value deep inside the source
-        //    (Using reduce to walk down the tree: source.prop.nested.val)
-        const value = path.reduce((acc, key) => acc === null || acc === void 0 ? void 0 : acc[key], source);
-        // 2. If found, rebuild that path in the 'result' object
-        if (value !== undefined) {
-            let current = result;
-            path.forEach((key, index) => {
-                var _a;
-                // If it's the last key, set the value
-                if (index === path.length - 1) {
-                    current[key] = value;
-                }
-                else {
-                    // Otherwise, ensure the container object exists
-                    (_a = current[key]) !== null && _a !== void 0 ? _a : (current[key] = {});
-                    current = current[key];
-                }
-            });
-        }
-    }
-    return result;
-};
-export const get = (obj, path, defaultValue) => {
-    let result;
-    // 1. Handle array path ['a', 'b'] directly
-    if (Array.isArray(path)) {
-        result = path.reduce((acc, key) => acc === null || acc === void 0 ? void 0 : acc[key], obj);
-        return result !== undefined ? result : defaultValue;
-    }
-    // 2. Handle string path 'a[0].b' -> 'a.0.b'
-    //    This regex converts brackets to dots so we can split easily
-    const normalizedPath = path.replace(/\[(\d+)\]/g, '.$1');
-    // 3. Traverse
-    result = normalizedPath.split('.').reduce((acc, key) => acc === null || acc === void 0 ? void 0 : acc[key], obj);
-    return result !== undefined ? result : defaultValue;
-};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@balena/ui-shared-components",
-  "version": "15.4.1-build-replace-lodash-with-es-toolkit-366e2166c19de2abc07d1f183588d670fe585847-1",
+  "version": "15.5.0-build-revert-consolidate-fomrats-2ee7e5a82a73723817c8fdc34cef5f22f8b78626-1",
   "main": "./dist/index.js",
   "sideEffects": false,
   "files": [
@@ -39,8 +39,8 @@
     "color-hash": "^2.0.2",
     "date-fns": "^4.1.0",
     "dayjs": "^1.11.19",
-    "es-toolkit": "^1.43.0",
     "jest": "^29.7.0",
+    "lodash": "^4.17.21",
     "notistack": "^3.0.1",
     "qs": "^6.14.0",
     "react": "^18.2.0",
@@ -67,6 +67,7 @@
     "@storybook/react-webpack5": "^10.0.1",
     "@types/color": "^4.2.0",
     "@types/color-hash": "^2.0.0",
+    "@types/lodash": "^4.17.14",
     "@types/node": "^22.18.13",
     "@types/qs": "^6.9.18",
     "@types/react": "^18.0.35",
@@ -136,7 +137,7 @@
   },
   "homepage": "https://github.com/balena-io/ui-shared-components#readme",
   "versionist": {
-    "publishedAt": "2025-12-23T22:44:14.082Z"
+    "publishedAt": "2025-12-29T09:18:17.698Z"
   },
   "overrides": {
     "storybook": "$storybook",

package/dist/hooks/useUiSharedComponentsContext.d.ts

@@ -1 +0,0 @@
-export declare const useUiSharedComponentsContext: () => import("../contexts/UiSharedComponentsContextProvider").UiSharedComponentsContextProviderInterface;

package/dist/hooks/useUiSharedComponentsContext.js

@@ -1,6 +0,0 @@
-import React from 'react';
-import { UiSharedComponentsContextProvider } from '../contexts/UiSharedComponentsContextProvider';
-export const useUiSharedComponentsContext = () => {
-    const context = React.useContext(UiSharedComponentsContextProvider);
-    return context;
-};