ag-common 0.0.657 → 0.0.659

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

@@ -66,10 +66,8 @@ const ListItemStyle = styled_1.default.div `
   padding-left: 0.5rem;
   flex-grow: 1;
   padding: 1rem;
-  height: calc(100% - 2rem);
   cursor: pointer;
   display: flex;
-  overflow: hidden;
   justify-content: center;
   align-items: center;
   &[data-default='false'] {
@@ -93,7 +91,7 @@ const ListItemStyle = styled_1.default.div `
     background-color: rgba(0, 0, 0, 0.2);
   }
 `;
-const ListItem = ({ render, onChange, selected, defaultV = false, }) => (react_1.default.createElement(ListItemStyle, { "data-selected": selected, "data-default": defaultV, onClick: (e) => {
+const ListItem = ({ render, onChange, selected, defaultV = false, }) => (react_1.default.createElement(ListItemStyle, { "data-type": "ddl-item", "data-selected": selected, "data-default": defaultV, onClick: (e) => {
         if (!selected) {
             onChange === null || onChange === void 0 ? void 0 : onChange();
         }
@@ -107,8 +105,10 @@ function DropdownList(p) {
     const [open, setOpen] = (0, react_1.useState)(p.open);
     const [bounced, setBounced] = (0, react_1.useState)(false);
     (0, useOnClickOutside_1.useOnClickOutside)({ disabled: !open, ref, moveMouseOutside: false }, () => {
+        var _a;
         setOpen(false);
         setBounced(false);
+        (_a = p.onClose) === null || _a === void 0 ? void 0 : _a.call(p);
     });
     (0, react_1.useEffect)(() => {
         const newv = p.value;
@@ -124,6 +124,7 @@ function DropdownList(p) {
             minWidth: `calc(${maxLen}ch + 2rem)`,
             filter: `drop-shadow(1px 1px 0.5rem ${shadow})`,
             maxHeight,
+            width: 'fit-content',
         };
         const minPx = (0, dom_1.convertRemToPixels)(2 + maxLen / 2);
         const offsetLeft = (_b = (_a = ref === null || ref === void 0 ? void 0 : ref.current) === null || _a === void 0 ? void 0 : _a.offsetLeft) !== null && _b !== void 0 ? _b : 0;
@@ -154,9 +155,13 @@ function DropdownList(p) {
         }
     }, [bounced, open]);
     return (react_1.default.createElement(Base, { className: p.className, ref: ref, title: p.placeholder, onClick: (e) => {
+            var _a;
             e.stopPropagation();
             e.preventDefault();
             setOpen(!open);
+            if (open) {
+                (_a = p.onClose) === null || _a === void 0 ? void 0 : _a.call(p);
+            }
         } },
         react_1.default.createElement(DropItems, { "data-open": open, style: style, "data-bounced": bounced }, open &&
             p.options.map((s, i) => (react_1.default.createElement(ListItem, { key: typeof s === 'string' ? s : p.renderF(s, i).key, render: p.renderF(s, i), onChange: () => p.onChange(s, i), selected: s === state })))),

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

@@ -19,8 +19,8 @@ const index_1 = require("./index");
 const DropdownListDialog = (p) => __awaiter(void 0, void 0, void 0, function* () {
     return new Promise((res) => {
         const id = 'ag-common-ddld';
+        //already open
         if (document.querySelectorAll('#' + id).length) {
-            res(undefined);
             return;
         }
         const wrapper = document.body.appendChild(document.createElement('div'));
@@ -29,7 +29,10 @@ const DropdownListDialog = (p) => __awaiter(void 0, void 0, void 0, function* ()
         wrapper.style.top = `${p.position.y}px`;
         wrapper.style.left = `${p.position.x}px`;
         const root = (0, client_1.createRoot)(wrapper);
-        root.render(react_1.default.createElement(index_1.DropdownList, Object.assign({}, p, { open: true, onChange: (v, i) => {
+        root.render(react_1.default.createElement(index_1.DropdownList, Object.assign({}, p, { open: true, onClose: () => {
+                root.unmount();
+                wrapper.remove();
+            }, onChange: (v, i) => {
                 root.unmount();
                 wrapper.remove();
                 res(!v ? undefined : [v, i]);

package/dist/ui/components/DropdownList/types.d.ts

@@ -9,6 +9,8 @@ export interface IDropdownList<T> {
      */
     value?: T;
     onChange: (v: T | undefined, index: number) => void;
+    /** will call on close/click outside */
+    onClose?: () => void;
     /**
      * placeholder title for list
      */

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

@@ -100,13 +100,14 @@ const LineChart = (p) => {
             });
         } }, points.map((p2) => {
         var _a, _b, _c;
+        const isSelected = p2.origX === ((_c = (_b = (_a = UT.pos) === null || _a === void 0 ? void 0 : _a.data.selectedXs) === null || _b === void 0 ? void 0 : _b[0]) === null || _c === void 0 ? void 0 : _c.x);
         return (react_1.default.createElement(react_1.default.Fragment, { key: JSON.stringify(p2) },
             //mouse selected
-            (p2.origX === ((_c = (_b = (_a = UT.pos) === null || _a === void 0 ? void 0 : _a.data.selectedXs) === null || _b === void 0 ? void 0 : _b[0]) === null || _c === void 0 ? void 0 : _c.x) ||
+            (isSelected ||
                 //only single date point
                 p2.x1 === p2.x2 ||
                 //is the last point
-                p2.isLast) && (react_1.default.createElement("circle", Object.assign({ cx: `${p2.x2}%`, cy: `${p2.y2}%`, r: "8px", style: { zIndex: 1 } }, (p2.isToday && p2.isLast
+                p2.isLast) && (react_1.default.createElement("circle", Object.assign({ cx: `${p2.x2}%`, cy: `${p2.y2}%`, r: "8px", style: { zIndex: 1 } }, (p2.isToday && p2.isLast && !isSelected
                 ? { stroke: p.colours[p2.name], fill: 'transparent' }
                 : { fill: p.colours[p2.name] })))),
             p2.x1 !== p2.x2 && (react_1.default.createElement("line", { strokeOpacity: legendItems.part.find((f) => f.name === p2.name) ? 1 : 0.3, x1: `${p2.x1}%`, x2: `${p2.x2}%`, y1: `${p2.y1}%`, y2: `${p2.y2}%`, style: Object.assign({ stroke: p.colours[p2.name] }, (p2.isToday && {

package/dist/ui/styles/common.js

@@ -21,7 +21,7 @@ const HardOutlineFilter = (outlineColour = 'white', sizePx = 1) => {
     return `drop-shadow(${px} ${px} 0px ${outlineColour})
   drop-shadow(-${px} ${px} 0px ${outlineColour})
   drop-shadow(${px} -${px} 0px ${outlineColour})
-  drop-shadow(-${px} -${px} 0px ${outlineColour});`;
+  drop-shadow(-${px} -${px} 0px ${outlineColour})`;
 };
 exports.HardOutlineFilter = HardOutlineFilter;
 /** disable user text selection */

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "0.0.657",
+  "version": "0.0.659",
   "name": "ag-common",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",