ag-common 0.0.418 → 0.0.419

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

@@ -1,27 +1,20 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.SearchModal = void 0;
-const styled_1 = __importDefault(require("@emotion/styled"));
-const react_1 = __importDefault(require("react"));
-const styles_1 = require("../../styles");
-const Modal_1 = require("../Modal/Modal");
-const Base_1 = require("./Base");
-const ModalStyled = (0, styled_1.default)(Modal_1.Modal) `
+import styled from '@emotion/styled';
+import React from 'react';
+import { bigScreen, smallScreen } from '../../styles';
+import { Modal } from '../Modal/Modal';
+import { SearchBase } from './Base';
+const ModalStyled = styled(Modal) `
   display: flex;
   flex-flow: column;
   top: 10rem;
-  @media ${styles_1.bigScreen} {
+  @media ${bigScreen} {
     width: 50vw;
     max-width: 60rem;
   }
-  @media ${styles_1.smallScreen} {
+  @media ${smallScreen} {
     width: 100%;
     max-width: 95vw;
   }
 `;
-const SearchModal = (p) => (react_1.default.createElement(ModalStyled, { position: "center", topPosition: "center", open: true, setOpen: () => p.onSelectItem(undefined), showCloseButton: false, closeOnClickOutside: true },
-    react_1.default.createElement(Base_1.SearchBase, Object.assign({}, p))));
-exports.SearchModal = SearchModal;
+export const SearchModal = (p) => (React.createElement(ModalStyled, { position: "center", topPosition: "center", open: true, setOpen: () => p.onSelectItem(undefined), showCloseButton: false, closeOnClickOutside: true },
+    React.createElement(SearchBase, { ...p })));

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

@@ -1,40 +1,11 @@
-"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.SearchBox = void 0;
-const styled_1 = __importDefault(require("@emotion/styled"));
-const react_1 = __importStar(require("react"));
-const debounce_1 = require("../../helpers/debounce");
-const dom_1 = require("../../helpers/dom");
-const icons_1 = require("../../icons");
-const styles_1 = require("../../styles");
-const TextEdit_1 = require("../TextEdit");
-const Base = styled_1.default.div `
+import styled from '@emotion/styled';
+import React, { createRef, forwardRef, useEffect, useImperativeHandle, } from 'react';
+import { debounce } from '../../helpers/debounce';
+import { filterDataProps } from '../../helpers/dom';
+import { CrossIcon, Magnify } from '../../icons';
+import { bigScreen, smallScreen } from '../../styles';
+import { TextEdit } from '../TextEdit';
+const Base = styled.div `
   padding: 1rem;
   display: flex;
   flex-flow: row;
@@ -44,52 +15,49 @@ const Base = styled_1.default.div `
   margin: auto;
   position: relative;
 
-  @media ${styles_1.smallScreen} {
+  @media ${smallScreen} {
     margin: 0;
     padding: 0;
     padding-top: 0.5rem;
     width: 100%;
   }
 `;
-const MagnifyIcon = styled_1.default.div `
+const MagnifyIcon = styled.div `
   width: 1.5rem;
   height: 1.5rem;
   margin-right: 0.5rem;
   cursor: pointer;
 `;
-const CrossIconStyled = (0, styled_1.default)(icons_1.CrossIcon) `
+const CrossIconStyled = styled(CrossIcon) `
   position: absolute;
   right: 1rem;
-  @media ${styles_1.bigScreen} {
+  @media ${bigScreen} {
     right: 2rem;
   }
 `;
-exports.SearchBox = (0, react_1.forwardRef)((p, ref) => {
-    const textEditRef = (0, react_1.createRef)();
-    (0, react_1.useImperativeHandle)(ref, () => ({
+export const SearchBox = forwardRef((p, ref) => {
+    const textEditRef = createRef();
+    useImperativeHandle(ref, () => ({
         setValue: (v) => {
-            var _a, _b;
-            const value = (_a = textEditRef.current) === null || _a === void 0 ? void 0 : _a.getValue();
+            const value = textEditRef.current?.getValue();
             if (v === value) {
                 return;
             }
-            (_b = textEditRef.current) === null || _b === void 0 ? void 0 : _b.setValue(v);
+            textEditRef.current?.setValue(v);
         },
-        focus: () => { var _a; return (_a = textEditRef.current) === null || _a === void 0 ? void 0 : _a.focus(); },
-        getValue: () => { var _a; return (_a = textEditRef.current) === null || _a === void 0 ? void 0 : _a.getValue(); },
+        focus: () => textEditRef.current?.focus(),
+        getValue: () => textEditRef.current?.getValue(),
     }));
-    (0, react_1.useEffect)(() => {
-        var _a;
-        (_a = textEditRef === null || textEditRef === void 0 ? void 0 : textEditRef.current) === null || _a === void 0 ? void 0 : _a.setValue(p.searchText);
+    useEffect(() => {
+        textEditRef?.current?.setValue(p.searchText);
     }, [p.searchText, textEditRef]);
-    return (react_1.default.createElement(Base, Object.assign({ "data-type": "search", className: p.className }, (0, dom_1.filterDataProps)(p)),
-        react_1.default.createElement(TextEdit_1.TextEdit, { ref: textEditRef, placeholder: p.placeholderText, defaultEditing: { focus: true }, singleLine: true, leftContent: react_1.default.createElement(MagnifyIcon, { onClick: () => { var _a; return p.setSearchText(((_a = textEditRef === null || textEditRef === void 0 ? void 0 : textEditRef.current) === null || _a === void 0 ? void 0 : _a.getValue()) || '', true); } },
-                react_1.default.createElement(icons_1.Magnify, null)), noGrow: true, allowUndo: false, onClickOutsideWithNoValue: null, onSubmit: (v, enterPressed) => (0, debounce_1.debounce)(() => {
+    return (React.createElement(Base, { "data-type": "search", className: p.className, ...filterDataProps(p) },
+        React.createElement(TextEdit, { ref: textEditRef, placeholder: p.placeholderText, defaultEditing: { focus: true }, singleLine: true, leftContent: React.createElement(MagnifyIcon, { onClick: () => p.setSearchText(textEditRef?.current?.getValue() || '', true) },
+                React.createElement(Magnify, null)), noGrow: true, allowUndo: false, onClickOutsideWithNoValue: null, onSubmit: (v, enterPressed) => debounce(() => {
                 p.setSearchText(v, enterPressed);
             }, { key: 'pagesearch', time: 200 }), defaultValue: p.defaultValue }),
-        p.searchText && (react_1.default.createElement(CrossIconStyled, { onClick: () => {
-                var _a;
-                (_a = textEditRef.current) === null || _a === void 0 ? void 0 : _a.setValue('');
+        p.searchText && (React.createElement(CrossIconStyled, { onClick: () => {
+                textEditRef.current?.setValue('');
                 p.setSearchText('', true);
             } }))));
 });

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

@@ -1,23 +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 __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("./AutoHideSearchBox"), exports);
-__exportStar(require("./Base"), exports);
-__exportStar(require("./Dialog"), exports);
-__exportStar(require("./Inline"), exports);
-__exportStar(require("./Modal"), exports);
-__exportStar(require("./SearchBox"), exports);
-__exportStar(require("./types"), exports);
+export * from './AutoHideSearchBox';
+export * from './Base';
+export * from './Dialog';
+export * from './Inline';
+export * from './Modal';
+export * from './SearchBox';
+export * from './types';

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

@@ -1,2 +1 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
+export {};

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

@@ -1,15 +1,9 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Sidebar = void 0;
-const styled_1 = __importDefault(require("@emotion/styled"));
-const react_1 = __importDefault(require("react"));
-const use_1 = require("../../helpers/cookie/use");
-const common_1 = require("../../styles/common");
-const Chevron_1 = require("../Chevron");
-const Base = styled_1.default.div `
+import styled from '@emotion/styled';
+import React from 'react';
+import { useCookieBoolean } from '../../helpers/cookie/use';
+import { NoTextSelect } from '../../styles/common';
+import { Chevron } from '../Chevron';
+const Base = styled.div `
   position: relative;
   transition: all 200ms;
   border-right: solid 1px #ccc;
@@ -28,7 +22,7 @@ const Base = styled_1.default.div `
       border-right: solid 1px #999;
     }
   }
-  ${common_1.NoTextSelect};
+  ${NoTextSelect};
 
   &:hover {
     [data-content] {
@@ -36,7 +30,7 @@ const Base = styled_1.default.div `
     }
   }
 `;
-const ContentBlock = styled_1.default.div `
+const ContentBlock = styled.div `
   left: -18rem;
   transition: left 200ms;
   &[data-open='false'] {
@@ -46,7 +40,7 @@ const ContentBlock = styled_1.default.div `
     //width set in style
   }
 `;
-const Content = styled_1.default.div `
+const Content = styled.div `
   display: flex;
   flex-flow: column;
   width: 100%;
@@ -60,7 +54,7 @@ const Content = styled_1.default.div `
     border-radius: 1rem;
   }
 `;
-const Hamburger = styled_1.default.div `
+const Hamburger = styled.div `
   position: absolute;
   transition: all 200ms;
   &[data-open='false'] {
@@ -84,23 +78,22 @@ const Hamburger = styled_1.default.div `
   border: solid 1px rgba(0, 0, 0, 0.5);
   cursor: pointer;
 `;
-const ChevronStyled = (0, styled_1.default)(Chevron_1.Chevron) `
+const ChevronStyled = styled(Chevron) `
   svg {
     fill: #555;
   }
 `;
-const Sidebar = ({ children, className, key = 'sidebar', cookieDocument, width = '15rem', }) => {
-    const [open, setOpen] = (0, use_1.useCookieBoolean)({
+export const Sidebar = ({ children, className, key = 'sidebar', cookieDocument, width = '15rem', }) => {
+    const [open, setOpen] = useCookieBoolean({
         name: key,
         defaultValue: false,
         cookieDocument: cookieDocument,
     });
-    return (react_1.default.createElement(Base, { className: className, "data-open": open, onClick: () => !open && setOpen(true), "data-hover": true, style: { width: !open ? '0.5rem' : width } },
-        react_1.default.createElement(Hamburger, { "data-open": open, onClick: () => setOpen(!open), "data-hover": true },
-            react_1.default.createElement(ChevronStyled, { point: open ? 'left' : 'right', width: "100%" })),
-        react_1.default.createElement(ContentBlock, { "data-content": true, "data-open": open, style: { width: !open ? width : undefined } },
-            react_1.default.createElement(Content, { "data-open": open, onClick: (e) => {
+    return (React.createElement(Base, { className: className, "data-open": open, onClick: () => !open && setOpen(true), "data-hover": true, style: { width: !open ? '0.5rem' : width } },
+        React.createElement(Hamburger, { "data-open": open, onClick: () => setOpen(!open), "data-hover": true },
+            React.createElement(ChevronStyled, { point: open ? 'left' : 'right', width: "100%" })),
+        React.createElement(ContentBlock, { "data-content": true, "data-open": open, style: { width: !open ? width : undefined } },
+            React.createElement(Content, { "data-open": open, onClick: (e) => {
                     e.stopPropagation();
                 } }, children))));
 };
-exports.Sidebar = Sidebar;

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

@@ -1,60 +1,50 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.SparkLine = void 0;
-const styled_1 = __importDefault(require("@emotion/styled"));
-const react_1 = __importDefault(require("react"));
-const math_1 = require("../../../common/helpers/math");
-const Base = styled_1.default.div `
+import styled from '@emotion/styled';
+import React from 'react';
+import { rangePercentage } from '../../../common/helpers/math';
+const Base = styled.div `
   width: calc(100% - 2px - 1rem);
   height: 100%;
   border: solid 1px #666;
   border-radius: 0.5rem;
   padding: 0.5rem;
 `;
-const Points = styled_1.default.div `
+const Points = styled.div `
   position: relative;
 
   width: 100%;
   height: 100%;
 `;
-const Point = styled_1.default.div `
+const Point = styled.div `
   position: absolute;
   border-width: 2px;
   border-style: solid;
   width: 1px;
 `;
-const SparkLine = (p) => {
+export const SparkLine = (p) => {
     const { data: raw, pointColour = '#4d76ff' } = p;
     const xMin = Math.min(...raw.map((d) => d.x));
     const xMax = Math.max(...raw.map((d) => d.x));
     const yMin = Math.min(...raw.map((d) => d.y));
     const yMax = Math.max(...raw.map((d) => d.y));
     const data = raw.map((orig) => ({
-        x: (0, math_1.rangePercentage)({
+        x: rangePercentage({
             value: orig.x,
             min: xMin,
             max: xMax,
         }) * 100,
-        y: (0, math_1.rangePercentage)({
+        y: rangePercentage({
             value: orig.y,
             min: yMin,
             max: yMax,
         }) * 100,
         orig,
     }));
-    return (react_1.default.createElement(Base, { className: p.className, title: p.title },
-        react_1.default.createElement(Points, null, data.map((pt) => {
-            var _a, _b;
-            return (react_1.default.createElement(Point, { title: (_b = (_a = p.pointTitleF) === null || _a === void 0 ? void 0 : _a.call(p, pt.orig)) !== null && _b !== void 0 ? _b : '', key: pt.x + ' ' + pt.y, style: {
-                    backgroundColor: pointColour,
-                    borderColor: pointColour,
-                    left: pt.x + '%',
-                    bottom: 0,
-                    height: pt.y + '%',
-                } }));
-        }))));
+    return (React.createElement(Base, { className: p.className, title: p.title },
+        React.createElement(Points, null, data.map((pt) => (React.createElement(Point, { title: p.pointTitleF?.(pt.orig) ?? '', key: pt.x + ' ' + pt.y, style: {
+                backgroundColor: pointColour,
+                borderColor: pointColour,
+                left: pt.x + '%',
+                bottom: 0,
+                height: pt.y + '%',
+            } }))))));
 };
-exports.SparkLine = SparkLine;

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

@@ -1,18 +1,12 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Table = void 0;
-const styled_1 = __importDefault(require("@emotion/styled"));
-const react_1 = __importDefault(require("react"));
-const groupBy_1 = require("../../../common/helpers/groupBy");
-const Base = styled_1.default.div `
+import styled from '@emotion/styled';
+import React from 'react';
+import { groupByList } from '../../../common/helpers/groupBy';
+const Base = styled.div `
   display: flex;
   flex-flow: column;
   width: 100%;
 `;
-const TableRow = styled_1.default.div `
+const TableRow = styled.div `
   display: flex;
   border: solid 1px #ccc;
   &[data-header='true'] {
@@ -22,24 +16,23 @@ const TableRow = styled_1.default.div `
     border-top: 0;
   }
 `;
-const Group = styled_1.default.div `
+const Group = styled.div `
   display: flex;
   flex-flow: column;
   width: 100%;
 `;
-const GroupTitle = styled_1.default.div `
+const GroupTitle = styled.div `
   font-size: 1.5rem;
 `;
-const GroupWrap = styled_1.default.div `
+const GroupWrap = styled.div `
   display: flex;
   flex-flow: column;
 `;
-const Table = ({ children, className, headerRow }) => {
-    const grouped = (0, groupBy_1.groupByList)(children, (s) => s.groupTitle);
-    return (react_1.default.createElement(Base, { className: className }, grouped.map((group) => (react_1.default.createElement(GroupWrap, { key: 'gk' + group.key },
-        group.key && (react_1.default.createElement(GroupTitle, { key: `gt${group.key}` }, group.key)),
-        react_1.default.createElement(Group, { key: `g${group.key}` },
-            headerRow && (react_1.default.createElement(TableRow, { "data-header": "true", key: `headrow${group.key}` }, headerRow)),
-            group.items.map((item) => (react_1.default.createElement(TableRow, { key: item.content.key }, item.content)))))))));
+export const Table = ({ children, className, headerRow }) => {
+    const grouped = groupByList(children, (s) => s.groupTitle);
+    return (React.createElement(Base, { className: className }, grouped.map((group) => (React.createElement(GroupWrap, { key: 'gk' + group.key },
+        group.key && (React.createElement(GroupTitle, { key: `gt${group.key}` }, group.key)),
+        React.createElement(Group, { key: `g${group.key}` },
+            headerRow && (React.createElement(TableRow, { "data-header": "true", key: `headrow${group.key}` }, headerRow)),
+            group.items.map((item) => (React.createElement(TableRow, { key: item.content.key }, item.content)))))))));
 };
-exports.Table = Table;

package/dist/ui/components/TextEdit/CheckboxEdit.js

@@ -1,59 +1,30 @@
-"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.CheckboxEdit = void 0;
-const styled_1 = __importDefault(require("@emotion/styled"));
-const react_1 = __importStar(require("react"));
-const useOnClickOutside_1 = require("../../helpers/useOnClickOutside");
-const Save_1 = require("../../icons/Save");
-const Undo_1 = require("../../icons/Undo");
-const common_1 = require("../../styles/common");
-const FlexRow_1 = require("../FlexRow");
-const common_2 = require("./common");
-const Icons = (0, styled_1.default)(FlexRow_1.FlexRow) `
+import styled from '@emotion/styled';
+import React, { useEffect, useRef, useState } from 'react';
+import { useOnClickOutside } from '../../helpers/useOnClickOutside';
+import { Save } from '../../icons/Save';
+import { Undo } from '../../icons/Undo';
+import { noDrag } from '../../styles/common';
+import { FlexRow } from '../FlexRow';
+import { IconD as Icon, iconLeft, iconRight, ValueBox, ValueInputCB, } from './common';
+const Icons = styled(FlexRow) `
   position: absolute;
   top: 0;
   right: -2rem;
 `;
-const CheckboxEdit = ({ defaultValue, onSubmit, noGrow = false, allowUndo = true, }) => {
-    const ref = (0, react_1.useRef)(null);
-    const [value, setValue] = (0, react_1.useState)(defaultValue);
-    (0, react_1.useEffect)(() => {
+export const CheckboxEdit = ({ defaultValue, onSubmit, noGrow = false, allowUndo = true, }) => {
+    const ref = useRef(null);
+    const [value, setValue] = useState(defaultValue);
+    useEffect(() => {
         setValue(defaultValue);
     }, [defaultValue]);
     const valueChange = value !== defaultValue;
-    (0, useOnClickOutside_1.useOnClickOutside)({ ref, moveMouseOutside: false }, () => {
+    useOnClickOutside({ ref, moveMouseOutside: false }, () => {
         if (valueChange) {
             onSubmit(value);
         }
     });
-    return (react_1.default.createElement(common_2.ValueBox, Object.assign({}, common_1.noDrag, { ref: ref, "data-nogrow": noGrow }),
-        react_1.default.createElement(common_2.ValueInputCB, { type: "checkbox", "data-type": "checkbox", checked: value, onChange: () => {
+    return (React.createElement(ValueBox, { ...noDrag, ref: ref, "data-nogrow": noGrow },
+        React.createElement(ValueInputCB, { type: "checkbox", "data-type": "checkbox", checked: value, onChange: () => {
                 if (allowUndo) {
                     setValue(!value);
                 }
@@ -61,10 +32,9 @@ const CheckboxEdit = ({ defaultValue, onSubmit, noGrow = false, allowUndo = true
                     onSubmit(!value);
                 }
             }, onKeyDown: (e) => e.key === 'Enter' && value !== defaultValue && onSubmit(value) }),
-        allowUndo && value !== defaultValue && (react_1.default.createElement(Icons, { center: true, enableOverflow: true },
-            react_1.default.createElement(common_2.IconD, { style: common_2.iconLeft, onClick: () => value !== defaultValue && onSubmit(value) },
-                react_1.default.createElement(Save_1.Save, null)),
-            react_1.default.createElement(common_2.IconD, { style: common_2.iconRight, onClick: () => setValue(defaultValue) },
-                react_1.default.createElement(Undo_1.Undo, null))))));
+        allowUndo && value !== defaultValue && (React.createElement(Icons, { center: true, enableOverflow: true },
+            React.createElement(Icon, { style: iconLeft, onClick: () => value !== defaultValue && onSubmit(value) },
+                React.createElement(Save, null)),
+            React.createElement(Icon, { style: iconRight, onClick: () => setValue(defaultValue) },
+                React.createElement(Undo, null))))));
 };
-exports.CheckboxEdit = CheckboxEdit;

package/dist/ui/components/TextEdit/ColourEdit.js

@@ -1,52 +1,25 @@
-"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;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ColourEdit = void 0;
-const react_1 = __importStar(require("react"));
-const useOnClickOutside_1 = require("../../helpers/useOnClickOutside");
-const Save_1 = require("../../icons/Save");
-const Undo_1 = require("../../icons/Undo");
-const common_1 = require("../../styles/common");
-const common_2 = require("./common");
-const ColourEdit = ({ defaultValue, onSubmit, }) => {
-    const ref = (0, react_1.useRef)(null);
-    const [value, setValue] = (0, react_1.useState)(defaultValue);
-    (0, react_1.useEffect)(() => {
+import React, { useEffect, useRef, useState } from 'react';
+import { useOnClickOutside } from '../../helpers/useOnClickOutside';
+import { Save } from '../../icons/Save';
+import { Undo } from '../../icons/Undo';
+import { noDrag } from '../../styles/common';
+import { IconD as Icon, iconLeft, iconRight, ValueBox } from './common';
+export const ColourEdit = ({ defaultValue, onSubmit, }) => {
+    const ref = useRef(null);
+    const [value, setValue] = useState(defaultValue);
+    useEffect(() => {
         setValue(defaultValue);
     }, [defaultValue]);
     const valueChange = value !== defaultValue;
-    (0, useOnClickOutside_1.useOnClickOutside)({ ref, moveMouseOutside: false }, () => {
+    useOnClickOutside({ ref, moveMouseOutside: false }, () => {
         if (valueChange) {
             onSubmit(value);
         }
     });
-    return (react_1.default.createElement(common_2.ValueBox, Object.assign({}, common_1.noDrag, { ref: ref }),
-        react_1.default.createElement("input", { type: "color", size: 5, value: value, onChange: (v) => setValue(v.target.value) }),
-        value !== defaultValue && (react_1.default.createElement(common_2.IconD, { style: common_2.iconLeft, onClick: () => valueChange && onSubmit(value.trim()) },
-            react_1.default.createElement(Save_1.Save, null))),
-        valueChange && (react_1.default.createElement(common_2.IconD, { style: common_2.iconRight, onClick: () => setValue(defaultValue) },
-            react_1.default.createElement(Undo_1.Undo, null)))));
+    return (React.createElement(ValueBox, { ...noDrag, ref: ref },
+        React.createElement("input", { type: "color", size: 5, value: value, onChange: (v) => setValue(v.target.value) }),
+        value !== defaultValue && (React.createElement(Icon, { style: iconLeft, onClick: () => valueChange && onSubmit(value.trim()) },
+            React.createElement(Save, null))),
+        valueChange && (React.createElement(Icon, { style: iconRight, onClick: () => setValue(defaultValue) },
+            React.createElement(Undo, null)))));
 };
-exports.ColourEdit = ColourEdit;

package/dist/ui/components/TextEdit/LengthBox.js

@@ -1,17 +1,11 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.TextEditLengthBox = void 0;
-const styled_1 = __importDefault(require("@emotion/styled"));
-const react_1 = __importDefault(require("react"));
-const Base = styled_1.default.div `
+import styled from '@emotion/styled';
+import React from 'react';
+const Base = styled.div `
   /* position: absolute;
   bottom: 0.5rem;
   right: 0.5rem; */
 `;
-const TextEditLengthBox = ({ min, max, }) => {
+export const TextEditLengthBox = ({ min, max, }) => {
     let color = 'black';
     if (min / max > 0.55) {
         color = 'indianred';
@@ -19,9 +13,8 @@ const TextEditLengthBox = ({ min, max, }) => {
     if (min === max) {
         color = 'red';
     }
-    return (react_1.default.createElement(Base, { style: { color } },
+    return (React.createElement(Base, { style: { color } },
         min,
         "/",
         max));
 };
-exports.TextEditLengthBox = TextEditLengthBox;