@synerise/ds-manageable-list 1.7.11 → 1.7.13

package/dist/Item/Item.styles.d.ts

@@ -1,14 +1,14 @@
-export declare const ItemLabel: import("styled-components").StyledComponent<"span", any, {}, never>;
-export declare const ItemTagList: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const ItemLabelWrapper: import("styled-components").StyledComponent<"div", any, {
+export declare const ItemLabel: import('styled-components').StyledComponent<"span", any, {}, never>;
+export declare const ItemTagList: import('styled-components').StyledComponent<"div", any, {}, never>;
+export declare const ItemLabelWrapper: import('styled-components').StyledComponent<"div", any, {
     largeSize?: boolean;
 }, never>;
-export declare const ItemContainer: import("styled-components").StyledComponent<"div", any, {
+export declare const ItemContainer: import('styled-components').StyledComponent<"div", any, {
     isSelected: boolean;
     isDisabled: boolean;
 }, never>;
-export declare const DescriptionIcon: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@synerise/ds-icon").BaseIconProps & Omit<import("react").HTMLAttributes<HTMLDivElement>, keyof import("@synerise/ds-icon").BaseIconProps> & import("@synerise/ds-utils").DataAttributes & import("react").RefAttributes<HTMLDivElement>>, any, {}, never>;
-export declare const ItemLabelWithIcon: import("styled-components").StyledComponent<"span", any, {}, never>;
-export declare const ItemDescription: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const ItemUniqueKey: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const ItemLabelTop: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const DescriptionIcon: import('styled-components').StyledComponent<import('react').ForwardRefExoticComponent<import('@synerise/ds-icon').BaseIconProps & Omit<import('react').HTMLAttributes<HTMLDivElement>, keyof import('@synerise/ds-icon').BaseIconProps> & import('@synerise/ds-utils').DataAttributes & import('react').RefAttributes<HTMLDivElement>>, any, {}, never>;
+export declare const ItemLabelWithIcon: import('styled-components').StyledComponent<"span", any, {}, never>;
+export declare const ItemDescription: import('styled-components').StyledComponent<"div", any, {}, never>;
+export declare const ItemUniqueKey: import('styled-components').StyledComponent<"div", any, {}, never>;
+export declare const ItemLabelTop: import('styled-components').StyledComponent<"div", any, {}, never>;

package/dist/Item/Item.styles.js

@@ -1,71 +1,73 @@
-import styled, { css } from 'styled-components';
-import Icon from '@synerise/ds-icon';
-import { macro } from '@synerise/ds-typography';
-import { ItemActionsWrapper } from './ItemActions/ItemActions.styles';
-export var ItemLabel = styled.span.withConfig({
+import styled, { css } from "styled-components";
+import Icon from "@synerise/ds-icon";
+import { macro } from "@synerise/ds-typography";
+import { ItemActionsWrapper } from "./ItemActions/ItemActions.styles.js";
+const ItemLabel = /* @__PURE__ */ styled.span.withConfig({
   displayName: "Itemstyles__ItemLabel",
   componentId: "sc-1an9szf-0"
-})(["", ";color:", ";height:24px;display:inline-block;align-items:center;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;line-height:24px;user-select:none;flex-shrink:0;max-width:100%;&.full-width{max-width:unset;}.search-highlight{font-weight:500;color:", ";}"], macro.h300, function (_ref) {
-  var theme = _ref.theme;
-  return theme.palette['grey-600'];
-}, function (props) {
-  return props.theme.palette['grey-800'];
-});
-export var ItemTagList = styled.div.withConfig({
+})(["", ";color:", ";height:24px;display:inline-block;align-items:center;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;line-height:24px;user-select:none;flex-shrink:0;max-width:100%;&.full-width{max-width:unset;}.search-highlight{font-weight:500;color:", ";}"], macro.h300, ({
+  theme
+}) => theme.palette["grey-600"], (props) => props.theme.palette["grey-800"]);
+const ItemTagList = /* @__PURE__ */ styled.div.withConfig({
   displayName: "Itemstyles__ItemTagList",
   componentId: "sc-1an9szf-1"
 })(["margin-left:8px;max-width:100%;overflow:hidden;position:relative;flex-grow:1;&:after{content:'';position:absolute;right:0;top:0;bottom:0;width:20px;background:linear-gradient( 90deg,rgba(0,0,0,0) 0%,rgba(255,255,255,1) 100% );}"]);
-export var ItemLabelWrapper = styled.div.withConfig({
+const ItemLabelWrapper = /* @__PURE__ */ styled.div.withConfig({
   displayName: "Itemstyles__ItemLabelWrapper",
   componentId: "sc-1an9szf-2"
-})(["flex:1;display:flex;flex-grow:1;min-width:0;.ant-tooltip-inner{max-width:164px;padding:16px 16px 19px;}", ""], function (props) {
-  return props.largeSize ? css(["flex-direction:column;gap:10px;overflow-y:visible;", "{margin-left:24px;}"], ItemTagList) : css(["flex-direction:row;align-items:center;overflow:hidden;height:24px;justify-content:flex-start;"]);
-});
-export var ItemContainer = styled.div.withConfig({
+})(["flex:1;display:flex;flex-grow:1;min-width:0;.ant-tooltip-inner{max-width:164px;padding:16px 16px 19px;}", ""], (props) => props.largeSize ? css(["flex-direction:column;gap:10px;overflow-y:visible;", "{margin-left:24px;}"], ItemTagList) : css(["flex-direction:row;align-items:center;overflow:hidden;height:24px;justify-content:flex-start;"]));
+const ItemContainer = /* @__PURE__ */ styled.div.withConfig({
   displayName: "Itemstyles__ItemContainer",
   componentId: "sc-1an9szf-3"
-})(["width:100%;display:flex;flex-direction:row;align-items:center;justify-content:stretch;", " background-color:", ";li{width:100%;.title{color:", ";}& > div{height:24px;&:nth-child(2){overflow:hidden;}}}.ds-manageable-list-item-icon{svg{color:", ";fill:", ";}}&:hover{", "{display:flex;}.ds-manageable-list-item-icon{svg{color:", ";fill:", ";}}}"], function (props) {
-  return props.isDisabled && "\n    opacity: 0.4;\n    cursor: default;\n    pointer-events: none;\n  ";
-}, function (_ref2) {
-  var theme = _ref2.theme,
-    isSelected = _ref2.isSelected;
-  return isSelected ? theme.palette['blue-050'] : theme.palette.white;
-}, function (_ref3) {
-  var theme = _ref3.theme,
-    isSelected = _ref3.isSelected;
-  return isSelected ? theme.palette['blue-600'] : theme.palette['grey-600'];
-}, function (_ref4) {
-  var theme = _ref4.theme,
-    isSelected = _ref4.isSelected;
-  return isSelected ? theme.palette['blue-600'] : theme.palette['grey-600'];
-}, function (_ref5) {
-  var theme = _ref5.theme,
-    isSelected = _ref5.isSelected;
-  return isSelected ? theme.palette['blue-600'] : theme.palette['grey-600'];
-}, ItemActionsWrapper, function (_ref6) {
-  var theme = _ref6.theme;
-  return theme.palette['blue-600'];
-}, function (_ref7) {
-  var theme = _ref7.theme;
-  return theme.palette['blue-600'];
-});
-export var DescriptionIcon = styled(Icon).withConfig({
+})(["width:100%;display:flex;flex-direction:row;align-items:center;justify-content:stretch;", " background-color:", ";li{width:100%;.title{color:", ";}& > div{height:24px;&:nth-child(2){overflow:hidden;}}}.ds-manageable-list-item-icon{svg{color:", ";fill:", ";}}&:hover{", "{display:flex;}.ds-manageable-list-item-icon{svg{color:", ";fill:", ";}}}"], (props) => props.isDisabled && `
+    opacity: 0.4;
+    cursor: default;
+    pointer-events: none;
+  `, ({
+  theme,
+  isSelected
+}) => isSelected ? theme.palette["blue-050"] : theme.palette.white, ({
+  theme,
+  isSelected
+}) => isSelected ? theme.palette["blue-600"] : theme.palette["grey-600"], ({
+  theme,
+  isSelected
+}) => isSelected ? theme.palette["blue-600"] : theme.palette["grey-600"], ({
+  theme,
+  isSelected
+}) => isSelected ? theme.palette["blue-600"] : theme.palette["grey-600"], ItemActionsWrapper, ({
+  theme
+}) => theme.palette["blue-600"], ({
+  theme
+}) => theme.palette["blue-600"]);
+const DescriptionIcon = /* @__PURE__ */ styled(Icon).withConfig({
   displayName: "Itemstyles__DescriptionIcon",
   componentId: "sc-1an9szf-4"
 })(["margin-left:2px;"]);
-export var ItemLabelWithIcon = styled.span.withConfig({
+const ItemLabelWithIcon = /* @__PURE__ */ styled.span.withConfig({
   displayName: "Itemstyles__ItemLabelWithIcon",
   componentId: "sc-1an9szf-5"
 })(["display:flex;flex-direction:row;align-items:center;justify-content:flex-start;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;flex-grow:1;"]);
-export var ItemDescription = styled.div.withConfig({
+const ItemDescription = /* @__PURE__ */ styled.div.withConfig({
   displayName: "Itemstyles__ItemDescription",
   componentId: "sc-1an9szf-6"
 })(["overflow-wrap:break-word;min-width:0;"]);
-export var ItemUniqueKey = styled.div.withConfig({
+const ItemUniqueKey = /* @__PURE__ */ styled.div.withConfig({
   displayName: "Itemstyles__ItemUniqueKey",
   componentId: "sc-1an9szf-7"
 })([""]);
-export var ItemLabelTop = styled.div.withConfig({
+const ItemLabelTop = /* @__PURE__ */ styled.div.withConfig({
   displayName: "Itemstyles__ItemLabelTop",
   componentId: "sc-1an9szf-8"
-})(["display:flex;line-height:12px;height:12px;align-items:center;gap:8px;"]);
+})(["display:flex;line-height:12px;height:12px;align-items:center;gap:8px;"]);
+export {
+  DescriptionIcon,
+  ItemContainer,
+  ItemDescription,
+  ItemLabel,
+  ItemLabelTop,
+  ItemLabelWithIcon,
+  ItemLabelWrapper,
+  ItemTagList,
+  ItemUniqueKey
+};

package/dist/Item/Item.types.d.ts

@@ -1,3 +1,3 @@
-import type { ManageableListItemProps } from '../ManageableList.types';
+import { ManageableListItemProps } from '../ManageableList.types';
 /** @deprecated - import ManageableListItemProps from package index instead */
 export type Props = ManageableListItemProps;

package/dist/Item/Item.types.js

@@ -1 +1 @@
-export {};
+

package/dist/Item/ItemActions/ItemActions.d.ts

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

package/dist/Item/ItemActions/ItemActions.js

@@ -1,57 +1,55 @@
-import React from 'react';
-import { theme } from '@synerise/ds-core';
-import Icon, { CloseS, DuplicateS, EditS } from '@synerise/ds-icon';
-import Tooltip from '@synerise/ds-tooltip';
-import * as S from './ItemActions.styles';
-var DEFAULT_COLOR = theme.palette['grey-500'];
-var ItemActions = function ItemActions(_ref) {
-  var item = _ref.item,
-    duplicateAction = _ref.duplicateAction,
-    duplicateActionTooltip = _ref.duplicateActionTooltip,
-    editAction = _ref.editAction,
-    editActionTooltip = _ref.editActionTooltip,
-    removeAction = _ref.removeAction,
-    removeActionTooltip = _ref.removeActionTooltip,
-    additionalActions = _ref.additionalActions;
-  var handleDuplicate = React.useCallback(function (event) {
+import { jsx, jsxs } from "react/jsx-runtime";
+import React from "react";
+import { theme } from "@synerise/ds-core";
+import Icon, { EditS, DuplicateS, CloseS } from "@synerise/ds-icon";
+import Tooltip from "@synerise/ds-tooltip";
+import { ItemActionsWrapper } from "./ItemActions.styles.js";
+const DEFAULT_COLOR = theme.palette["grey-500"];
+const ItemActions = ({
+  item,
+  duplicateAction,
+  duplicateActionTooltip,
+  editAction,
+  editActionTooltip,
+  removeAction,
+  removeActionTooltip,
+  additionalActions
+}) => {
+  const handleDuplicate = React.useCallback((event) => {
     event.stopPropagation();
-    var id = item.id;
+    const {
+      id
+    } = item;
     duplicateAction && duplicateAction({
-      id: id
+      id
     });
   }, [item, duplicateAction]);
-  var handleRemove = React.useCallback(function (event) {
+  const handleRemove = React.useCallback((event) => {
     event.stopPropagation();
-    var id = item.id;
+    const {
+      id
+    } = item;
     removeAction && removeAction({
-      id: id
+      id
     });
   }, [item, removeAction]);
-  var handleEdit = React.useCallback(function (event) {
+  const handleEdit = React.useCallback((event) => {
     event.stopPropagation();
     editAction && editAction();
   }, [editAction]);
-  var renderIcon = React.useCallback(function (condition, icon, color, handleClick, testId, tooltip) {
-    return condition && /*#__PURE__*/React.createElement(Tooltip, {
-      type: "default",
-      trigger: "hover",
-      title: tooltip
-    }, /*#__PURE__*/React.createElement("div", {
-      "data-testid": testId
-    }, /*#__PURE__*/React.createElement(Icon, {
-      component: icon,
-      size: 24,
-      color: color,
-      onClick: handleClick
-    })));
+  const renderIcon = React.useCallback((condition, icon, color, handleClick, testId, tooltip) => {
+    return condition && /* @__PURE__ */ jsx(Tooltip, { type: "default", trigger: "hover", title: tooltip, children: /* @__PURE__ */ jsx("div", { "data-testid": testId, children: /* @__PURE__ */ jsx(Icon, { component: icon, size: 24, color, onClick: handleClick }) }) });
   }, []);
-  var renderAdditionalActions = React.useMemo(function () {
-    return additionalActions && additionalActions.map(function (action, index) {
-      return renderIcon(true, action.icon, action.color || DEFAULT_COLOR, function () {
-        return action.onClick(item);
-      }, "additional-action-" + index, action.tooltip);
-    });
+  const renderAdditionalActions = React.useMemo(() => {
+    return additionalActions && additionalActions.map((action, index) => renderIcon(true, action.icon, action.color || DEFAULT_COLOR, () => action.onClick(item), `additional-action-${index}`, action.tooltip));
   }, [additionalActions, item, renderIcon]);
-  return /*#__PURE__*/React.createElement(S.ItemActionsWrapper, null, additionalActions && renderAdditionalActions, renderIcon(Boolean(item.canUpdate), /*#__PURE__*/React.createElement(EditS, null), DEFAULT_COLOR, handleEdit, 'list-item-edit', editActionTooltip), renderIcon(Boolean(item.canDuplicate), /*#__PURE__*/React.createElement(DuplicateS, null), DEFAULT_COLOR, handleDuplicate, 'list-item-duplicate', duplicateActionTooltip), renderIcon(Boolean(item.canDelete), /*#__PURE__*/React.createElement(CloseS, null), theme.palette['red-600'], handleRemove, 'list-item-remove', removeActionTooltip));
+  return /* @__PURE__ */ jsxs(ItemActionsWrapper, { children: [
+    additionalActions && renderAdditionalActions,
+    renderIcon(Boolean(item.canUpdate), /* @__PURE__ */ jsx(EditS, {}), DEFAULT_COLOR, handleEdit, "list-item-edit", editActionTooltip),
+    renderIcon(Boolean(item.canDuplicate), /* @__PURE__ */ jsx(DuplicateS, {}), DEFAULT_COLOR, handleDuplicate, "list-item-duplicate", duplicateActionTooltip),
+    renderIcon(Boolean(item.canDelete), /* @__PURE__ */ jsx(CloseS, {}), theme.palette["red-600"], handleRemove, "list-item-remove", removeActionTooltip)
+  ] });
+};
+export {
+  ItemActions as default
 };
-export default ItemActions;

package/dist/Item/ItemActions/ItemActions.styles.d.ts

@@ -1 +1 @@
-export declare const ItemActionsWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const ItemActionsWrapper: import('styled-components').StyledComponent<"div", any, {}, never>;

package/dist/Item/ItemActions/ItemActions.styles.js

@@ -1,9 +1,11 @@
-import styled from 'styled-components';
-import { IconContainer } from '@synerise/ds-icon';
-export var ItemActionsWrapper = styled.div.withConfig({
+import styled from "styled-components";
+import { IconContainer } from "@synerise/ds-icon";
+const ItemActionsWrapper = /* @__PURE__ */ styled.div.withConfig({
   displayName: "ItemActionsstyles__ItemActionsWrapper",
   componentId: "sc-1n2bgbl-0"
-})(["display:none;flex-direction:row;align-items:center;justify-content:flex-end;span{margin:0 0 0 8px;}", ":hover{svg{fill:", ";}}"], IconContainer, function (_ref) {
-  var theme = _ref.theme;
-  return theme.palette['blue-600'];
-});
+})(["display:none;flex-direction:row;align-items:center;justify-content:flex-end;span{margin:0 0 0 8px;}", ":hover{svg{fill:", ";}}"], IconContainer, ({
+  theme
+}) => theme.palette["blue-600"]);
+export {
+  ItemActionsWrapper
+};

package/dist/Item/ItemActions/ItemActions.types.d.ts

@@ -1,5 +1,5 @@
-import type React from 'react';
-import { type AdditionalAction, type ItemProps } from '../../ManageableList.types';
+import { default as React } from 'react';
+import { AdditionalAction, ItemProps } from '../../ManageableList.types';
 export type ItemActionsProps = {
     item: ItemProps;
     removeAction?: (removeParams: {

package/dist/Item/ItemActions/ItemActions.types.js

@@ -1 +1 @@
-export {};
+

package/dist/Item/ItemMeta/ItemMeta.d.ts

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

package/dist/Item/ItemMeta/ItemMeta.js

@@ -1,24 +1,29 @@
-import moment from 'moment';
-import React from 'react';
-import { UserAvatar } from '@synerise/ds-avatar';
-import * as S from './ItemMeta.styles';
-export var ItemMeta = function ItemMeta(_ref) {
-  var user = _ref.user,
-    created = _ref.created;
-  var _ref2 = user || {},
-    firstName = _ref2.firstname,
-    lastName = _ref2.lastname,
-    avatar = _ref2.avatar_url,
-    email = _ref2.email;
-  var userData = {
-    firstName: firstName,
-    lastName: lastName,
-    avatar: avatar,
-    email: email
+import { jsxs, jsx } from "react/jsx-runtime";
+import moment from "moment";
+import { UserAvatar } from "@synerise/ds-avatar";
+import { ItemMeta as ItemMeta$1, ItemMetaCreated } from "./ItemMeta.styles.js";
+const ItemMeta = ({
+  user,
+  created
+}) => {
+  const {
+    firstname: firstName,
+    lastname: lastName,
+    avatar_url: avatar,
+    email
+  } = user || {};
+  const userData = {
+    firstName,
+    lastName,
+    avatar,
+    email
   };
-  return /*#__PURE__*/React.createElement(S.ItemMeta, null, created && /*#__PURE__*/React.createElement(S.ItemMetaCreated, null, moment.utc(created).fromNow()), user && /*#__PURE__*/React.createElement(UserAvatar, {
-    size: "small",
-    user: userData
-  }));
+  return /* @__PURE__ */ jsxs(ItemMeta$1, { children: [
+    created && /* @__PURE__ */ jsx(ItemMetaCreated, { children: moment.utc(created).fromNow() }),
+    user && /* @__PURE__ */ jsx(UserAvatar, { size: "small", user: userData })
+  ] });
+};
+export {
+  ItemMeta,
+  ItemMeta as default
 };
-export default ItemMeta;

package/dist/Item/ItemMeta/ItemMeta.styles.d.ts

@@ -1,2 +1,2 @@
-export declare const ItemMetaCreated: import("styled-components").StyledComponent<"span", any, {}, never>;
-export declare const ItemMeta: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const ItemMetaCreated: import('styled-components').StyledComponent<"span", any, {}, never>;
+export declare const ItemMeta: import('styled-components').StyledComponent<"div", any, {}, never>;

package/dist/Item/ItemMeta/ItemMeta.styles.js

@@ -1,11 +1,13 @@
-import styled from 'styled-components';
-export var ItemMetaCreated = styled.span.withConfig({
+import styled from "styled-components";
+const ItemMetaCreated = /* @__PURE__ */ styled.span.withConfig({
   displayName: "ItemMetastyles__ItemMetaCreated",
   componentId: "sc-1jx08et-0"
-})(["color:", ";font-size:13px;line-height:18px;"], function (props) {
-  return props.theme.palette['grey-500'];
-});
-export var ItemMeta = styled.div.withConfig({
+})(["color:", ";font-size:13px;line-height:18px;"], (props) => props.theme.palette["grey-500"]);
+const ItemMeta = /* @__PURE__ */ styled.div.withConfig({
   displayName: "ItemMetastyles__ItemMeta",
   componentId: "sc-1jx08et-1"
-})(["display:flex;flex-direction:row;align-items:center;justify-content:flex-end;height:100%;padding-left:16px;.ds-avatar{margin-left:12px;}"]);
+})(["display:flex;flex-direction:row;align-items:center;justify-content:flex-end;height:100%;padding-left:16px;.ds-avatar{margin-left:12px;}"]);
+export {
+  ItemMeta,
+  ItemMetaCreated
+};

package/dist/Item/ItemMeta/ItemMeta.types.js

@@ -1 +1 @@
-export {};
+

package/dist/Item/ItemName/ItemName.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
-import { type ItemLabelProps } from './ItemName.types';
+import { default as React } from 'react';
+import { ItemLabelProps } from './ItemName.types';
 declare const ItemName: ({ item, onUpdate, editMode, searchQuery, }: ItemLabelProps) => React.JSX.Element;
 export default ItemName;

package/dist/Item/ItemName/ItemName.js

@@ -1,78 +1,59 @@
-import React, { useCallback, useEffect, useMemo, useState } from 'react';
-import { InfoFillS } from '@synerise/ds-icon';
-import InlineEdit from '@synerise/ds-inline-edit/dist/InlineEdit';
-import Tooltip from '@synerise/ds-tooltip';
-import { escapeRegEx } from '@synerise/ds-utils';
-import * as S from '../Item.styles';
-var ItemName = function ItemName(_ref) {
-  var _item$nameWrapperClas;
-  var item = _ref.item,
-    onUpdate = _ref.onUpdate,
-    editMode = _ref.editMode,
-    searchQuery = _ref.searchQuery;
-  var _useState = useState(item.name),
-    editedName = _useState[0],
-    setEditedName = _useState[1];
-  var updateName = useCallback(function () {
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useState, useCallback, useEffect, useMemo } from "react";
+import { InfoFillS } from "@synerise/ds-icon";
+import InlineEdit from "@synerise/ds-inline-edit/dist/InlineEdit";
+import Tooltip from "@synerise/ds-tooltip";
+import { escapeRegEx } from "@synerise/ds-utils";
+import { ItemLabelWrapper, ItemLabelWithIcon, ItemLabel, DescriptionIcon, ItemTagList } from "../Item.styles.js";
+const ItemName = ({
+  item,
+  onUpdate,
+  editMode,
+  searchQuery
+}) => {
+  const [editedName, setEditedName] = useState(item.name);
+  const updateName = useCallback(() => {
     onUpdate && onUpdate({
       id: item.id,
       name: editedName
     });
   }, [editedName, onUpdate, item.id]);
-  var editName = useCallback(function (event) {
+  const editName = useCallback((event) => {
     setEditedName(event.target.value);
   }, []);
-  useEffect(function () {
+  useEffect(() => {
     if (item.name !== editedName) {
       setEditedName(item.name);
     }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [editMode]);
-  var inputProps = useMemo(function () {
+  const inputProps = useMemo(() => {
     return {
-      name: 'list-item-name-input',
+      name: "list-item-name-input",
       value: editedName,
       onBlur: updateName,
       onChange: editName
     };
   }, [editedName, updateName, editName]);
-  var name = useMemo(function () {
+  const name = useMemo(() => {
     if (searchQuery) {
-      var escapedQuery = escapeRegEx(searchQuery);
-      var startOfQuery = item.name.toLowerCase().search(escapedQuery.toLowerCase());
-      var endOfQuery = startOfQuery + searchQuery.length;
-      var resultArray = [item.name.substring(0, startOfQuery), /*#__PURE__*/React.createElement("span", {
-        key: item.id,
-        className: "search-highlight"
-      }, item.name.substring(startOfQuery, endOfQuery)), item.name.substring(endOfQuery, item.name.length)];
+      const escapedQuery = escapeRegEx(searchQuery);
+      const startOfQuery = item.name.toLowerCase().search(escapedQuery.toLowerCase());
+      const endOfQuery = startOfQuery + searchQuery.length;
+      const resultArray = [item.name.substring(0, startOfQuery), /* @__PURE__ */ jsx("span", { className: "search-highlight", children: item.name.substring(startOfQuery, endOfQuery) }, item.id), item.name.substring(endOfQuery, item.name.length)];
       return resultArray;
     }
     return item.name;
   }, [item.id, item.name, searchQuery]);
-  var classes = (_item$nameWrapperClas = item.nameWrapperClassNames) != null && _item$nameWrapperClas.length ? ['title'].concat(item.nameWrapperClassNames) : ['title'];
-  return /*#__PURE__*/React.createElement(S.ItemLabelWrapper, {
-    "data-testid": item.description && 'item-description-icon'
-  }, editMode ? /*#__PURE__*/React.createElement(InlineEdit, {
-    size: "small",
-    hideIcon: true,
-    style: {
-      maxWidth: '100%',
-      lineHeight: '24px'
-    },
-    input: inputProps,
-    "data-testid": "list-item-name-input",
-    autoFocus: true
-  }) : /*#__PURE__*/React.createElement(S.ItemLabelWithIcon, null, /*#__PURE__*/React.createElement(S.ItemLabel, {
-    "data-testid": "list-item-name",
-    className: classes.join(' ')
-  }, name), item.description && /*#__PURE__*/React.createElement(Tooltip, {
-    description: item.description,
-    placement: "top",
-    trigger: "hover",
-    type: "largeSimple"
-  }, /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement(S.DescriptionIcon, {
-    component: /*#__PURE__*/React.createElement(InfoFillS, null),
-    color: "#b5bdc3"
-  }))), item.tags && /*#__PURE__*/React.createElement(S.ItemTagList, null, item.tags)));
+  const classes = item.nameWrapperClassNames?.length ? ["title", ...item.nameWrapperClassNames] : ["title"];
+  return /* @__PURE__ */ jsx(ItemLabelWrapper, { "data-testid": item.description && "item-description-icon", children: editMode ? /* @__PURE__ */ jsx(InlineEdit, { size: "small", hideIcon: true, style: {
+    maxWidth: "100%",
+    lineHeight: "24px"
+  }, input: inputProps, "data-testid": "list-item-name-input", autoFocus: true }) : /* @__PURE__ */ jsxs(ItemLabelWithIcon, { children: [
+    /* @__PURE__ */ jsx(ItemLabel, { "data-testid": "list-item-name", className: classes.join(" "), children: name }),
+    item.description && /* @__PURE__ */ jsx(Tooltip, { description: item.description, placement: "top", trigger: "hover", type: "largeSimple", children: /* @__PURE__ */ jsx("span", { children: /* @__PURE__ */ jsx(DescriptionIcon, { component: /* @__PURE__ */ jsx(InfoFillS, {}), color: "#b5bdc3" }) }) }),
+    item.tags && /* @__PURE__ */ jsx(ItemTagList, { children: item.tags })
+  ] }) });
+};
+export {
+  ItemName as default
 };
-export default ItemName;

package/dist/Item/ItemName/ItemName.types.d.ts

@@ -1,5 +1,5 @@
-import type React from 'react';
-import { type ItemProps } from '../../ManageableList.types';
+import { default as React } from 'react';
+import { ItemProps } from '../../ManageableList.types';
 export type ItemLabelProps = {
     item: ItemProps;
     onUpdate?: (updateParams: {

package/dist/Item/ItemName/ItemName.types.js

@@ -1 +1 @@
-export {};
+

package/dist/Item/ItemNameLarge/ItemNameLarge.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
-import { type ItemNameLargeProps } from './ItemNameLarge.types';
+import { default as React } from 'react';
+import { ItemNameLargeProps } from './ItemNameLarge.types';
 declare const ItemNameLarge: ({ item }: ItemNameLargeProps) => React.JSX.Element;
 export default ItemNameLarge;

package/dist/Item/ItemNameLarge/ItemNameLarge.js

@@ -1,14 +1,18 @@
-import React from 'react';
-import * as S from '../Item.styles';
-var ItemNameLarge = function ItemNameLarge(_ref) {
-  var _item$nameWrapperClas;
-  var item = _ref.item;
-  var classes = (_item$nameWrapperClas = item.nameWrapperClassNames) != null && _item$nameWrapperClas.length ? ['title'].concat(item.nameWrapperClassNames) : ['title'];
-  return /*#__PURE__*/React.createElement(S.ItemLabelWrapper, {
-    largeSize: true
-  }, /*#__PURE__*/React.createElement(S.ItemLabelTop, null, /*#__PURE__*/React.createElement(S.ItemLabel, {
-    "data-testid": "list-item-name",
-    className: classes.join(' ')
-  }, item.name), item.uniqueKey && /*#__PURE__*/React.createElement(S.ItemUniqueKey, null, item.uniqueKey), item.tags && /*#__PURE__*/React.createElement(S.ItemTagList, null, item.tags)), item.description && /*#__PURE__*/React.createElement(S.ItemDescription, null, item.description));
+import { jsxs, jsx } from "react/jsx-runtime";
+import { ItemLabelWrapper, ItemLabelTop, ItemLabel, ItemUniqueKey, ItemTagList, ItemDescription } from "../Item.styles.js";
+const ItemNameLarge = ({
+  item
+}) => {
+  const classes = item.nameWrapperClassNames?.length ? ["title", ...item.nameWrapperClassNames] : ["title"];
+  return /* @__PURE__ */ jsxs(ItemLabelWrapper, { largeSize: true, children: [
+    /* @__PURE__ */ jsxs(ItemLabelTop, { children: [
+      /* @__PURE__ */ jsx(ItemLabel, { "data-testid": "list-item-name", className: classes.join(" "), children: item.name }),
+      item.uniqueKey && /* @__PURE__ */ jsx(ItemUniqueKey, { children: item.uniqueKey }),
+      item.tags && /* @__PURE__ */ jsx(ItemTagList, { children: item.tags })
+    ] }),
+    item.description && /* @__PURE__ */ jsx(ItemDescription, { children: item.description })
+  ] });
+};
+export {
+  ItemNameLarge as default
 };
-export default ItemNameLarge;

package/dist/Item/ItemNameLarge/ItemNameLarge.types.d.ts

@@ -1,4 +1,4 @@
-import type { ItemProps } from '../../ManageableList.types';
+import { ItemProps } from '../../ManageableList.types';
 export type ItemNameLargeProps = {
     item: ItemProps;
 };

package/dist/Item/ItemNameLarge/ItemNameLarge.types.js

@@ -1 +1 @@
-export {};
+