ag-common 0.0.418 → 0.0.419

package/dist/ui/components/ProgressBar/index.js

@@ -1,36 +1,7 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ProgressBar = void 0;
-const styled_1 = __importDefault(require("@emotion/styled"));
-const react_1 = __importStar(require("react"));
-const styles_1 = require("../../styles");
-const Base = styled_1.default.div `
+import styled from '@emotion/styled';
+import React, { useEffect, useState } from 'react';
+import { colours } from '../../styles';
+const Base = styled.div `
   position: relative;
   min-width: 5rem;
   width: 100%;
@@ -38,13 +9,13 @@ const Base = styled_1.default.div `
   border-radius: 1rem;
   overflow: hidden;
 `;
-const Bar = styled_1.default.div `
+const Bar = styled.div `
   position: absolute;
   top: 0;
   bottom: 0;
   left: 0;
 `;
-const Dot = styled_1.default.div `
+const Dot = styled.div `
   position: absolute;
   top: calc(50% - 0.25rem);
   width: 0.5rem;
@@ -56,30 +27,29 @@ const Dot = styled_1.default.div `
     background-color: #333;
   }
 `;
-const ProgressBar = (p) => {
-    const { transitionToMs = 200, frontColour = styles_1.colours.notificationBlue, backColour = '#eee', dotPercentages = [25, 50, 75], } = p;
-    const [barWidth, setBarWidth] = (0, react_1.useState)((p.min / p.max) * 100);
-    (0, react_1.useEffect)(() => {
+export const ProgressBar = (p) => {
+    const { transitionToMs = 200, frontColour = colours.notificationBlue, backColour = '#eee', dotPercentages = [25, 50, 75], } = p;
+    const [barWidth, setBarWidth] = useState((p.min / p.max) * 100);
+    useEffect(() => {
         const newbw = (p.min / p.max) * 100;
         if (barWidth !== newbw) {
             setBarWidth(newbw);
         }
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [p.min, p.max]);
-    (0, react_1.useEffect)(() => {
+    useEffect(() => {
         if (transitionToMs) {
             setBarWidth(p.max);
         }
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, []);
-    return (react_1.default.createElement(Base, { style: {
+    return (React.createElement(Base, { style: {
             backgroundColor: backColour,
         }, className: p.className },
-        react_1.default.createElement(Bar, { style: {
+        React.createElement(Bar, { style: {
                 width: `${barWidth}%`,
                 backgroundColor: frontColour,
                 transition: `width ${transitionToMs}ms linear`,
-            } }), dotPercentages === null || dotPercentages === void 0 ? void 0 :
-        dotPercentages.map((v) => (react_1.default.createElement(Dot, { key: v, style: { left: `calc(${v}% - 0.25rem)` }, "data-invert": v > barWidth })))));
+            } }),
+        dotPercentages?.map((v) => (React.createElement(Dot, { key: v, style: { left: `calc(${v}% - 0.25rem)` }, "data-invert": v > barWidth })))));
 };
-exports.ProgressBar = ProgressBar;

package/dist/ui/components/Prompt/Dialog.js

@@ -1,26 +1,10 @@
-"use strict";
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.PromptDialog = void 0;
-const react_1 = __importDefault(require("react"));
-const client_1 = require("react-dom/client");
-const Modal_1 = require("./Modal");
-const PromptDialog = (p) => __awaiter(void 0, void 0, void 0, function* () {
+import React from 'react';
+import { createRoot } from 'react-dom/client';
+import { PromptModal } from './Modal';
+export const PromptDialog = async (p) => {
     return new Promise((res) => {
         const wrapper = document.body.appendChild(document.createElement('div'));
-        const root = (0, client_1.createRoot)(wrapper);
-        root.render(react_1.default.createElement(Modal_1.PromptModal, Object.assign({}, p, { res: res, root: root, wrapper: wrapper })));
+        const root = createRoot(wrapper);
+        root.render(React.createElement(PromptModal, { ...p, res: res, root: root, wrapper: wrapper }));
     });
-});
-exports.PromptDialog = PromptDialog;
+};

package/dist/ui/components/Prompt/Modal.js

@@ -1,84 +1,55 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.PromptModal = void 0;
-const styled_1 = __importDefault(require("@emotion/styled"));
-const react_1 = __importStar(require("react"));
-const Button_1 = require("../Button");
-const FlexColumn_1 = require("../FlexColumn");
-const FlexRow_1 = require("../FlexRow");
-const Modal_1 = require("../Modal/Modal");
-const TextEdit_1 = require("../TextEdit");
-const Base = styled_1.default.div `
+import styled from '@emotion/styled';
+import React, { useState } from 'react';
+import { Button } from '../Button';
+import { FlexColumn } from '../FlexColumn';
+import { FlexRow } from '../FlexRow';
+import { Modal } from '../Modal/Modal';
+import { TextEdit } from '../TextEdit';
+const Base = styled.div `
   width: 95vw;
   max-width: 30rem;
   height: 50vh;
   max-height: 15rem;
   padding: 1rem;
 `;
-const Content = (0, styled_1.default)(FlexColumn_1.FlexColumn) `
+const Content = styled(FlexColumn) `
   height: 100%;
 `;
-const TopText = styled_1.default.div `
+const TopText = styled.div `
   font-weight: bold;
   border-bottom: solid 1px #ccc;
   padding-bottom: 0.25rem;
   font-size: 1.5rem;
   margin-bottom: 1rem;
 `;
-const BottomText = styled_1.default.div `
+const BottomText = styled.div `
   padding-bottom: 0.25rem;
   font-size: 1.1rem;
 `;
-const Bottom = (0, styled_1.default)(FlexRow_1.FlexRow) `
+const Bottom = styled(FlexRow) `
   margin-top: auto;
   justify-content: flex-end;
   > button:first-of-type {
     margin-right: 1rem;
   }
 `;
-const PromptModal = ({ root, wrapper, res, bottomText, topText, okText = 'OK', cancelText = 'Cancel', defaultValue, placeholder, }) => {
-    const [text, setText] = (0, react_1.useState)(defaultValue || '');
+export const PromptModal = ({ root, wrapper, res, bottomText, topText, okText = 'OK', cancelText = 'Cancel', defaultValue, placeholder, }) => {
+    const [text, setText] = useState(defaultValue || '');
     const ret = (v) => {
         try {
             res(v);
         }
         finally {
-            root === null || root === void 0 ? void 0 : root.unmount();
-            wrapper === null || wrapper === void 0 ? void 0 : wrapper.remove();
+            root?.unmount();
+            wrapper?.remove();
         }
     };
-    return (react_1.default.createElement(Modal_1.Modal, { position: "center", topPosition: "center", open: true, setOpen: () => ret(undefined), showCloseButton: false, closeOnClickOutside: false },
-        react_1.default.createElement(Base, null,
-            react_1.default.createElement(Content, null,
-                topText && react_1.default.createElement(TopText, null, topText),
-                react_1.default.createElement(BottomText, null, bottomText),
-                react_1.default.createElement(TextEdit_1.TextEdit, { defaultValue: text, onSubmit: (c, enter) => {
+    return (React.createElement(Modal, { position: "center", topPosition: "center", open: true, setOpen: () => ret(undefined), showCloseButton: false, closeOnClickOutside: false },
+        React.createElement(Base, null,
+            React.createElement(Content, null,
+                topText && React.createElement(TopText, null, topText),
+                React.createElement(BottomText, null, bottomText),
+                React.createElement(TextEdit, { defaultValue: text, onSubmit: (c, enter) => {
                         if (enter) {
                             ret(c);
                         }
@@ -86,8 +57,7 @@ const PromptModal = ({ root, wrapper, res, bottomText, topText, okText = 'OK', c
                             setText(c);
                         }
                     }, placeholder: placeholder, defaultEditing: { focus: true }, singleLine: true, noGrow: true, allowUndo: false }),
-                react_1.default.createElement(Bottom, { noGrow: true },
-                    react_1.default.createElement(Button_1.Button, { onClick: () => ret(text) }, okText),
-                    react_1.default.createElement(Button_1.Button, { invert: true, onClick: () => ret(undefined) }, cancelText))))));
+                React.createElement(Bottom, { noGrow: true },
+                    React.createElement(Button, { onClick: () => ret(text) }, okText),
+                    React.createElement(Button, { invert: true, onClick: () => ret(undefined) }, cancelText))))));
 };
-exports.PromptModal = PromptModal;

package/dist/ui/components/Prompt/index.js

@@ -1,18 +1,2 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-__exportStar(require("./Dialog"), exports);
-__exportStar(require("./Modal"), exports);
+export * from './Dialog';
+export * from './Modal';

package/dist/ui/components/RowOrColumn/index.js

@@ -1,24 +1,18 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.RowOrColumn = void 0;
-const styled_1 = __importDefault(require("@emotion/styled"));
-const react_1 = __importDefault(require("react"));
-const media_1 = require("../../styles/media");
-const Base = styled_1.default.div `
+import styled from '@emotion/styled';
+import React from 'react';
+import { bigScreen, smallScreen } from '../../styles/media';
+const Base = styled.div `
   display: flex;
   flex-flow: row wrap;
   flex-grow: 1;
   width: 100%;
-  @media ${media_1.bigScreen} {
+  @media ${bigScreen} {
     &[data-nowrap='true'] {
       flex-flow: row;
     }
   }
 
-  @media ${media_1.smallScreen} {
+  @media ${smallScreen} {
     flex-flow: column;
     overflow: unset;
   }
@@ -35,8 +29,4 @@ const Base = styled_1.default.div `
     overflow: visible;
   }
 `;
-const RowOrColumn = (props) => {
-    var _a, _b, _c, _d;
-    return (react_1.default.createElement(Base, Object.assign({ title: props.title, "data-nogrow": (_a = props.noGrow) !== null && _a !== void 0 ? _a : false, "data-center": (_b = props.center) !== null && _b !== void 0 ? _b : false, "data-nowrap": (_c = props.noWrap) !== null && _c !== void 0 ? _c : false, "data-enableoverflow": (_d = props.enableOverflow) !== null && _d !== void 0 ? _d : false }, props), props.children));
-};
-exports.RowOrColumn = RowOrColumn;
+export const RowOrColumn = (props) => (React.createElement(Base, { title: props.title, "data-nogrow": props.noGrow ?? false, "data-center": props.center ?? false, "data-nowrap": props.noWrap ?? false, "data-enableoverflow": props.enableOverflow ?? false, ...props }, props.children));

package/dist/ui/components/Search/AutoHideSearchBox.js

@@ -1,49 +1,20 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.AutoHideSearchBox = void 0;
-const styled_1 = __importDefault(require("@emotion/styled"));
-const react_1 = __importStar(require("react"));
-const useGranularHook_1 = require("../../helpers/useGranularHook");
-const icons_1 = require("../../icons");
-const styles_1 = require("../../styles");
-const SearchBox_1 = require("./SearchBox");
-const Base = styled_1.default.div `
+import styled from '@emotion/styled';
+import React, { createRef, useState } from 'react';
+import { useGranularEffect } from '../../helpers/useGranularHook';
+import { CrossIcon, Magnify } from '../../icons';
+import { bigScreen, smallScreen } from '../../styles';
+import { SearchBox } from './SearchBox';
+const Base = styled.div `
   display: flex;
   flex-flow: row;
   align-items: center;
   margin-left: 1rem;
 
-  @media ${styles_1.bigScreen} {
+  @media ${bigScreen} {
     width: 20rem;
   }
 `;
-const Icon = styled_1.default.div `
+const Icon = styled.div `
   display: flex;
   margin-right: 0.5rem;
   > svg {
@@ -52,7 +23,7 @@ const Icon = styled_1.default.div `
     fill: white;
   }
 `;
-const SearchBoxStyled = (0, styled_1.default)(SearchBox_1.SearchBox) `
+const SearchBoxStyled = styled(SearchBox) `
   transition: width 200ms ease-in-out;
 
   overflow: hidden;
@@ -61,36 +32,34 @@ const SearchBoxStyled = (0, styled_1.default)(SearchBox_1.SearchBox) `
     width: 0;
     padding: 0;
   }
-  @media ${styles_1.smallScreen} {
+  @media ${smallScreen} {
     padding: 0;
   }
 `;
-const AutoHideSearchBox = (p) => {
-    const [open, setOpen] = (0, react_1.useState)(!!p.searchText);
-    const textEditRef = (0, react_1.createRef)();
-    (0, useGranularHook_1.useGranularEffect)(() => {
-        var _a;
+export const AutoHideSearchBox = (p) => {
+    const [open, setOpen] = useState(!!p.searchText);
+    const textEditRef = createRef();
+    useGranularEffect(() => {
         const newOpen = !!p.searchText;
         if (newOpen !== open) {
             setOpen(!open);
-            (_a = p.onOpenToggle) === null || _a === void 0 ? void 0 : _a.call(p, !open);
+            p.onOpenToggle?.(!open);
         }
     }, [p.searchText], [open]);
-    return (react_1.default.createElement(Base, { className: p.className, "data-open": open },
-        react_1.default.createElement(Icon, { style: { cursor: 'pointer' }, onClick: () => {
-                var _a, _b;
+    return (React.createElement(Base, { className: p.className, "data-open": open },
+        React.createElement(Icon, { style: { cursor: 'pointer' }, onClick: () => {
                 if (open) {
                     p.setSearchText('', false);
                 }
                 setOpen(!open);
-                (_a = p.onOpenToggle) === null || _a === void 0 ? void 0 : _a.call(p, !open);
+                p.onOpenToggle?.(!open);
                 if (!open) {
-                    (_b = textEditRef.current) === null || _b === void 0 ? void 0 : _b.focus();
+                    textEditRef.current?.focus();
                 }
             } },
-            open && react_1.default.createElement(icons_1.CrossIcon, null),
-            !open && react_1.default.createElement(icons_1.Magnify, { colour: "white" })),
-        react_1.default.createElement(SearchBoxStyled, Object.assign({ ref: textEditRef }, p, { className: "", "data-open": open, defaultValue: p.searchText, setSearchText: (val, enter) => {
+            open && React.createElement(CrossIcon, null),
+            !open && React.createElement(Magnify, { colour: "white" })),
+        React.createElement(SearchBoxStyled, { ref: textEditRef, ...p, className: "", "data-open": open, defaultValue: p.searchText, setSearchText: (val, enter) => {
                 //we dont want empty enters to do anything
                 if (val === '' && enter) {
                     p.setSearchText(val, false);
@@ -98,6 +67,5 @@ const AutoHideSearchBox = (p) => {
                 else {
                     p.setSearchText(val, enter);
                 }
-            } }))));
+            } })));
 };
-exports.AutoHideSearchBox = AutoHideSearchBox;

package/dist/ui/components/Search/Base.js

@@ -1,44 +1,15 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.SearchBase = void 0;
-const styled_1 = __importDefault(require("@emotion/styled"));
-const react_1 = __importStar(require("react"));
-const array_1 = require("../../../common/helpers/array");
-const styles_1 = require("../../styles");
-const SearchBox_1 = require("./SearchBox");
-const Base = styled_1.default.div `
+import styled from '@emotion/styled';
+import React, { useState } from 'react';
+import { take } from '../../../common/helpers/array';
+import { smallScreen } from '../../styles';
+import { SearchBox } from './SearchBox';
+const Base = styled.div `
   display: flex;
   flex-flow: column;
   flex-grow: 1;
   width: 100%;
 `;
-const Content = styled_1.default.div `
+const Content = styled.div `
   width: calc(100% - 2rem);
   margin: auto;
   display: flex;
@@ -53,37 +24,35 @@ const Content = styled_1.default.div `
   &[data-hasitems='true'] {
     padding-bottom: 0.5rem;
   }
-  @media ${styles_1.smallScreen} {
+  @media ${smallScreen} {
     margin: 0;
     width: 100%;
     margin-top: 1rem;
   }
 `;
-const Row = styled_1.default.div `
+const Row = styled.div `
   width: 100%;
   cursor: pointer;
 `;
-const SearchBase = (p) => {
-    var _a, _b, _c, _d;
+export const SearchBase = (p) => {
     const { maxDisplayItems = 20 } = p;
-    const [searchText, setSearchText] = (0, react_1.useState)((_a = p.defaultValue) !== null && _a !== void 0 ? _a : '');
+    const [searchText, setSearchText] = useState(p.defaultValue ?? '');
     const resWrap = (foundItem) => {
-        var _a, _b;
         if (!foundItem) {
-            (_a = p.onSelectItem) === null || _a === void 0 ? void 0 : _a.call(p, undefined);
+            p.onSelectItem?.(undefined);
         }
         else {
-            (_b = p.onSelectItem) === null || _b === void 0 ? void 0 : _b.call(p, { foundItem, searchText });
+            p.onSelectItem?.({ foundItem, searchText });
         }
     };
     const filteredItemsRaw = p.displayItems.filter((i) => p.willDisplayItem(searchText, i));
-    const { part: filteredItems } = (0, array_1.take)(filteredItemsRaw, maxDisplayItems);
-    const showText = (_d = (_c = (_b = p.texts) === null || _b === void 0 ? void 0 : _b.totalItems) === null || _c === void 0 ? void 0 : _c.call(_b, filteredItems.length, p.displayItems.length)) !== null && _d !== void 0 ? _d : `Showing ${filteredItems.length} out of ${p.displayItems.length} total
+    const { part: filteredItems } = take(filteredItemsRaw, maxDisplayItems);
+    const showText = p.texts?.totalItems?.(filteredItems.length, p.displayItems.length) ??
+        `Showing ${filteredItems.length} out of ${p.displayItems.length} total
   items`;
-    return (react_1.default.createElement(Base, { className: p.className },
-        react_1.default.createElement(SearchBox_1.SearchBox, Object.assign({}, p, { searchText: searchText, setSearchText: setSearchText })),
-        react_1.default.createElement(Content, { "data-hasitems": !!filteredItems.length, "data-type": "content" },
-            filteredItems.map((item, index) => (react_1.default.createElement(Row, { key: p.getKeyF(item), onClick: () => resWrap(item) }, p.renderItem({ searchText, item, index })))),
-            searchText && react_1.default.createElement(Row, null, showText))));
+    return (React.createElement(Base, { className: p.className },
+        React.createElement(SearchBox, { ...p, searchText: searchText, setSearchText: setSearchText }),
+        React.createElement(Content, { "data-hasitems": !!filteredItems.length, "data-type": "content" },
+            filteredItems.map((item, index) => (React.createElement(Row, { key: p.getKeyF(item), onClick: () => resWrap(item) }, p.renderItem({ searchText, item, index })))),
+            searchText && React.createElement(Row, null, showText))));
 };
-exports.SearchBase = SearchBase;

package/dist/ui/components/Search/Dialog.js

@@ -1,34 +1,19 @@
-"use strict";
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.SearchDialog = void 0;
-const react_1 = __importDefault(require("react"));
-const client_1 = require("react-dom/client");
-const log_1 = require("../../../common/helpers/log");
-const Modal_1 = require("./Modal");
+import React from 'react';
+import { createRoot } from 'react-dom/client';
+import { error } from '../../../common/helpers/log';
+import { SearchModal } from './Modal';
 /**
  * opens a searchmodal programatically, and resolves to either undefined, or the selected item
  * @param p
  * @returns
  */
-const SearchDialog = (p) => __awaiter(void 0, void 0, void 0, function* () {
+export const SearchDialog = async (p) => {
     const placeholderText = p.placeholderText || '';
     let originalStyle;
     return new Promise((res) => {
         const idName = 'ag-search-dialog';
         if (document.body.querySelectorAll('#' + idName).length !== 0) {
-            (0, log_1.error)('searchDialog already open');
+            error('searchDialog already open');
             res(undefined);
             return;
         }
@@ -38,8 +23,8 @@ const SearchDialog = (p) => __awaiter(void 0, void 0, void 0, function* () {
             originalStyle = window.getComputedStyle(document.body).overflow || '';
             document.body.style.overflow = 'hidden';
         }
-        const root = (0, client_1.createRoot)(wrapper);
-        root.render(react_1.default.createElement(Modal_1.SearchModal, Object.assign({}, p, { placeholderText: placeholderText, onSelectItem: (f) => {
+        const root = createRoot(wrapper);
+        root.render(React.createElement(SearchModal, { ...p, placeholderText: placeholderText, onSelectItem: (f) => {
                 try {
                     document.body.style.overflow = originalStyle || '';
                     res(f);
@@ -48,7 +33,6 @@ const SearchDialog = (p) => __awaiter(void 0, void 0, void 0, function* () {
                     root.unmount();
                     wrapper.remove();
                 }
-            } })));
+            } }));
     });
-});
-exports.SearchDialog = SearchDialog;
+};

package/dist/ui/components/Search/Inline.js

@@ -1,10 +1,3 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.SearchInline = void 0;
-const react_1 = __importDefault(require("react"));
-const Base_1 = require("./Base");
-const SearchInline = (p) => react_1.default.createElement(Base_1.SearchBase, Object.assign({}, p));
-exports.SearchInline = SearchInline;
+import React from 'react';
+import { SearchBase } from './Base';
+export const SearchInline = (p) => React.createElement(SearchBase, { ...p });