@darajs/components 1.9.2 → 1.9.3

package/dist/common/button/button.d.ts

@@ -1,5 +1,8 @@
 import { Action, ComponentInstance, Condition, StyledComponentProps, Variable } from '@darajs/core';
-interface ButtonProps extends StyledComponentProps {
+type OmitFromMappedType<Type, ToOmit> = {
+    [Property in keyof Type as Exclude<Property, ToOmit>]: Type[Property];
+};
+interface ButtonProps extends OmitFromMappedType<StyledComponentProps, 'children'> {
     children: Array<ComponentInstance> | string;
     /** Passthrough the className property */
     className: string;

package/dist/common/button/button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../js/common/button/button.tsx"],"names":[],"mappings":"AAAA,OAAO,EACH,MAAM,EACN,iBAAiB,EACjB,SAAS,EAGT,oBAAoB,EACpB,QAAQ,EAOX,MAAM,cAAc,CAAC;AAOtB,UAAU,WAAY,SAAQ,oBAAoB;IAC9C,QAAQ,EAAE,KAAK,CAAC,iBAAiB,CAAC,GAAG,MAAM,CAAC;IAC5C,yCAAyC;IACzC,SAAS,EAAE,MAAM,CAAC;IAClB,oCAAoC;IACpC,QAAQ,EAAE,OAAO,GAAG,SAAS,CAAC,GAAG,CAAC,GAAG,QAAQ,CAAC,OAAO,CAAC,CAAC;IACvD,6CAA6C;IAC7C,IAAI,EAAE,MAAM,CAAC;IACb,yDAAyD;IACzD,OAAO,EAAE,MAAM,CAAC;IAChB,oGAAoG;IACpG,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,6CAA6C;IAC7C,OAAO,EAAE,SAAS,GAAG,WAAW,GAAG,OAAO,GAAG,OAAO,GAAG,OAAO,CAAC;CAClE;AA8BD;;;;GAIG;AACH,iBAAS,MAAM,CAAC,KAAK,EAAE,WAAW,GAAG,GAAG,CAAC,OAAO,CAwC/C;AAED,eAAe,MAAM,CAAC"}
+{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../js/common/button/button.tsx"],"names":[],"mappings":"AAAA,OAAO,EACH,MAAM,EACN,iBAAiB,EACjB,SAAS,EAGT,oBAAoB,EACpB,QAAQ,EAOX,MAAM,cAAc,CAAC;AAOtB,KAAK,kBAAkB,CAAC,IAAI,EAAE,MAAM,IAAI;KACnC,QAAQ,IAAI,MAAM,IAAI,IAAI,OAAO,CAAC,QAAQ,EAAE,MAAM,CAAC,GAAG,IAAI,CAAC,QAAQ,CAAC;CACxE,CAAC;AAEF,UAAU,WAAY,SAAQ,kBAAkB,CAAC,oBAAoB,EAAE,UAAU,CAAC;IAC9E,QAAQ,EAAE,KAAK,CAAC,iBAAiB,CAAC,GAAG,MAAM,CAAC;IAC5C,yCAAyC;IACzC,SAAS,EAAE,MAAM,CAAC;IAClB,oCAAoC;IACpC,QAAQ,EAAE,OAAO,GAAG,SAAS,CAAC,GAAG,CAAC,GAAG,QAAQ,CAAC,OAAO,CAAC,CAAC;IACvD,6CAA6C;IAC7C,IAAI,EAAE,MAAM,CAAC;IACb,yDAAyD;IACzD,OAAO,EAAE,MAAM,CAAC;IAChB,oGAAoG;IACpG,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,6CAA6C;IAC7C,OAAO,EAAE,SAAS,GAAG,WAAW,GAAG,OAAO,GAAG,OAAO,GAAG,OAAO,CAAC;CAClE;AA8BD;;;;GAIG;AACH,iBAAS,MAAM,CAAC,KAAK,EAAE,WAAW,GAAG,GAAG,CAAC,OAAO,CAwC/C;AAED,eAAe,MAAM,CAAC"}

package/dist/common/button/button.js

@@ -29,7 +29,7 @@ const StyledButton = injectCss(styled(UiButton) `
  */
 function Button(props) {
     var _a, _b, _c, _d;
-    const [style, css] = useComponentStyles(props);
+    const [style, css] = useComponentStyles(props); // the styles hook doesn't care about children though here it's wider, includes string
     const onClick = useAction(props.onclick);
     const loading = useActionIsLoading(props.onclick);
     const disabled = useConditionOrVariable(props.disabled);

package/dist/common/button/button.js.map

@@ -1 +1 @@
-{"version":3,"file":"button.js","sourceRoot":"","sources":["../../../js/common/button/button.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"button.js","sourceRoot":"","sources":["../../../js/common/button/button.tsx"],"names":[],"mappings":"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"}

package/dist/umd/dara.components.umd.js

@@ -6330,7 +6330,7 @@
       }
     };
   };
-  const flip$3 = function(options) {
+  const flip$4 = function(options) {
     if (options === void 0) {
       options = {};
     }
@@ -6640,7 +6640,7 @@
       y: crossAxis * crossAxisMulti
     };
   }
-  const offset$3 = function(options) {
+  const offset$4 = function(options) {
     if (options === void 0) {
       options = 0;
     }
@@ -6670,7 +6670,7 @@
       }
     };
   };
-  const shift$2 = function(options) {
+  const shift$3 = function(options) {
     if (options === void 0) {
       options = {};
     }
@@ -6803,7 +6803,7 @@
       }
     };
   };
-  const size$2 = function(options) {
+  const size$3 = function(options) {
     if (options === void 0) {
       options = {};
     }
@@ -7427,11 +7427,11 @@
       }
     };
   }
-  const offset$2 = offset$3;
+  const offset$3 = offset$4;
   autoPlacement;
-  const shift$1 = shift$2;
-  const flip$2 = flip$3;
-  const size$1 = size$2;
+  const shift$2 = shift$3;
+  const flip$3 = flip$4;
+  const size$2 = size$3;
   hide$2;
   arrow$2;
   inline;
@@ -7666,6 +7666,22 @@
       floatingStyles
     }), [data2, update2, refs, elements, floatingStyles]);
   }
+  const offset$2 = (options, deps) => ({
+    ...offset$3(options),
+    options: [options, deps]
+  });
+  const shift$1 = (options, deps) => ({
+    ...shift$2(options),
+    options: [options, deps]
+  });
+  const flip$2 = (options, deps) => ({
+    ...flip$3(options),
+    options: [options, deps]
+  });
+  const size$1 = (options, deps) => ({
+    ...size$2(options),
+    options: [options, deps]
+  });
   const SafeReact = {
     ...React__namespace
   };
@@ -37006,16 +37022,10 @@
     });
     const role = useRole(context2, { role: "combobox" });
     const { getReferenceProps, getFloatingProps } = useInteractions([role]);
-    const menuProps = getMenuProps();
-    const setMenuRef = menuProps.ref;
-    const setFloatingRef = refs.setFloating;
-    const mergedRefs = React.useCallback((node2) => {
-      setFloatingRef(node2);
-      setMenuRef(node2);
-    }, [setFloatingRef, setMenuRef]);
+    const menuProps = React.useMemo(() => getMenuProps({ ref: refs.setFloating }), [refs.setFloating, getMenuProps]);
     return jsxRuntime.exports.jsx(Tooltip$1, { content: props.errorMsg, disabled: !props.errorMsg, styling: "error", children: jsxRuntime.exports.jsxs(Wrapper$a, { className: props.className, isDisabled: props.disabled, isErrored: !!props.errorMsg, isOpen, style: props.style, children: [jsxRuntime.exports.jsxs(InputWrapper$4, { disabled: props.disabled, isOpen, ref: refs.setReference, children: [jsxRuntime.exports.jsx(Input$2, Object.assign({}, getInputProps({
       disabled: props.disabled
-    }), getReferenceProps(), { placeholder: (_f = selectedItem === null ? props.placeholder : selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.label) !== null && _f !== void 0 ? _f : props.placeholder, size: props.size })), jsxRuntime.exports.jsx(ChevronButton$1, Object.assign({}, getToggleButtonProps(), { children: jsxRuntime.exports.jsx(Chevron$2, { disabled: props.disabled, isOpen }) }))] }), ReactDOM__default.default.createPortal(jsxRuntime.exports.jsxs(DropdownList$3, Object.assign({}, menuProps, getFloatingProps(), { ref: mergedRefs, isOpen, style: Object.assign(Object.assign({}, floatingStyles), { zIndex: 9999 }), children: [filteredItems.length > 0 && filteredItems.map((item, index2) => React.createElement(ListItem, Object.assign({}, getItemProps({ index: index2, item }), { hovered: index2 === highlightedIndex, key: `item-${index2}`, size: props.size, title: item.label }), item.label)), filteredItems.length === 0 && jsxRuntime.exports.jsx(NoItemsLabel$1, { children: "No Items" })] })), document.body)] }) });
+    }), getReferenceProps(), { placeholder: (_f = selectedItem === null ? props.placeholder : selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.label) !== null && _f !== void 0 ? _f : props.placeholder, size: props.size })), jsxRuntime.exports.jsx(ChevronButton$1, Object.assign({}, getToggleButtonProps(), { children: jsxRuntime.exports.jsx(Chevron$2, { disabled: props.disabled, isOpen }) }))] }), ReactDOM__default.default.createPortal(jsxRuntime.exports.jsxs(DropdownList$3, Object.assign({}, menuProps, getFloatingProps(), { isOpen, style: Object.assign(Object.assign({}, floatingStyles), { zIndex: 9999 }), children: [filteredItems.length > 0 && filteredItems.map((item, index2) => React.createElement(ListItem, Object.assign({}, getItemProps({ index: index2, item }), { hovered: index2 === highlightedIndex, key: `item-${index2}`, size: props.size, title: item.label }), item.label)), filteredItems.length === 0 && jsxRuntime.exports.jsx(NoItemsLabel$1, { children: "No Items" })] })), document.body)] }) });
   }
   styled__default.default(List)`
     overflow-y: auto;
@@ -45682,17 +45692,12 @@
     });
     const role = useRole(context2, { role: "listbox" });
     const { getReferenceProps, getFloatingProps } = useInteractions([role]);
-    const menuProps = getMenuProps();
-    const setMenuRef = menuProps.ref;
-    const setFloatingRef = refs.setFloating;
-    const mergedRefs = React.useCallback((node2) => {
-      setFloatingRef(node2);
-      setMenuRef(node2);
-    }, [setFloatingRef, setMenuRef]);
+    const menuProps = React.useMemo(() => getMenuProps({ ref: refs.setFloating }), [getMenuProps, refs.setFloating]);
+    const toggleProps = React.useMemo(() => getToggleButtonProps(), [getToggleButtonProps]);
     return jsxRuntime.exports.jsxs(Wrapper$7, { className: props.className, isDisabled: props.disabled, isOpen, maxRows, maxWidth, style: props.style, children: [jsxRuntime.exports.jsx(Tooltip$1, { content: props.errorMsg, disabled: !props.errorMsg, styling: "error", children: jsxRuntime.exports.jsxs(InputWrapper$3, { isDisabled: props.disabled, isOpen, ref: refs.setReference, children: [jsxRuntime.exports.jsxs(TagWrapper, { maxRows, children: [selectedItems.map((selectedItem, index2) => jsxRuntime.exports.jsxs(Tag$1, Object.assign({ disabled: props.disabled }, getSelectedItemProps({ index: index2, selectedItem }), { children: [jsxRuntime.exports.jsx(TagText, { children: selectedItem.label }), jsxRuntime.exports.jsx(Cross$1, { asButton: true, onClick: (e3) => {
       e3.stopPropagation();
       return removeSelectedItem(selectedItem);
-    } })] }), selectedItem.value)), jsxRuntime.exports.jsx(Input$1, Object.assign({}, getInputProps(getDropdownProps({ preventKeyAction: isOpen })), getReferenceProps(), { disabled: props.disabled, placeholder: props.placeholder, size: props.size, style: { flex: "1 1 5ch" } }))] }), jsxRuntime.exports.jsx(ChevronButton, Object.assign({}, getToggleButtonProps(), { children: jsxRuntime.exports.jsx(Chevron$2, { disabled: props.disabled, isOpen }) }))] }) }), ReactDOM__default.default.createPortal(jsxRuntime.exports.jsxs(DropdownList$1, Object.assign({}, menuProps, getFloatingProps(), { ref: mergedRefs, isOpen, style: Object.assign(Object.assign({}, floatingStyles), { zIndex: 9999 }), children: [filteredItems.length > 0 && filteredItems.map((item, index2) => React.createElement(ListItem, Object.assign({}, getItemProps({ index: index2, item }), { hovered: index2 === highlightedIndex, key: `item-${index2}`, size: props.size, title: item.label }), item.label)), filteredItems.length === 0 && jsxRuntime.exports.jsx(NoItemsLabel, { children: "No Items" })] })), document.body)] });
+    } })] }), selectedItem.value)), jsxRuntime.exports.jsx(Input$1, Object.assign({}, getInputProps(getDropdownProps({ preventKeyAction: isOpen })), getReferenceProps(), { disabled: props.disabled, placeholder: props.placeholder, size: props.size, style: { flex: "1 1 5ch" } }))] }), jsxRuntime.exports.jsx(ChevronButton, Object.assign({}, toggleProps, { children: jsxRuntime.exports.jsx(Chevron$2, { disabled: props.disabled, isOpen }) }))] }) }), ReactDOM__default.default.createPortal(jsxRuntime.exports.jsxs(DropdownList$1, Object.assign({}, menuProps, getFloatingProps(), { isOpen, style: Object.assign(Object.assign({}, floatingStyles), { zIndex: 9999 }), children: [filteredItems.length > 0 && filteredItems.map((item, index2) => React.createElement(ListItem, Object.assign({}, getItemProps({ index: index2, item }), { hovered: index2 === highlightedIndex, key: `item-${index2}`, size: props.size, title: item.label }), item.label)), filteredItems.length === 0 && jsxRuntime.exports.jsx(NoItemsLabel, { children: "No Items" })] })), document.body)] });
   }
   var __rest$8 = globalThis && globalThis.__rest || function(s2, e3) {
     var t2 = {};
@@ -45809,16 +45814,15 @@
     });
     const role = useRole(context2, { role: "listbox" });
     const { getReferenceProps, getFloatingProps } = useInteractions([role]);
-    const menuProps = getMenuProps();
-    const setMenuRef = menuProps.ref;
     const setFloatingRef = refs.setFloating;
     const { dropdownRef } = props;
     const mergedDropdownRef = React__namespace.useCallback((node2) => {
       setFloatingRef(node2);
-      setMenuRef(node2);
       dropdownRef === null || dropdownRef === void 0 ? void 0 : dropdownRef(node2);
-    }, [setFloatingRef, setMenuRef, dropdownRef]);
-    return jsxRuntime.exports.jsx(Tooltip$1, { content: props.errorMsg, disabled: !props.errorMsg, styling: "error", children: jsxRuntime.exports.jsxs(Wrapper$6, { className: props.className, isDisabled: props.disabled, isErrored: !!props.errorMsg, isOpen, onClick: props.onClick, style: props.style, children: [jsxRuntime.exports.jsxs(SelectButton, Object.assign({ disabled: props.disabled, isOpen }, getToggleButtonProps({ disabled: props.disabled, ref: refs.setReference }), getReferenceProps(), { type: "button", children: [jsxRuntime.exports.jsx(SelectedItem, { size: props.size, children: (_b = (_a3 = selectedItem === null ? props.placeholder : selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.label) !== null && _a3 !== void 0 ? _a3 : props.placeholder) !== null && _b !== void 0 ? _b : "Select" }), jsxRuntime.exports.jsx(Chevron$2, { disabled: props.disabled, isOpen })] })), ReactDOM__default.default.createPortal(jsxRuntime.exports.jsx(DropdownList, Object.assign({}, menuProps, getFloatingProps(), { ref: mergedDropdownRef, className: `${(_c = menuProps === null || menuProps === void 0 ? void 0 : menuProps.className) !== null && _c !== void 0 ? _c : ""} ${props.itemClass}`, isOpen, maxItems: props.maxItems, style: Object.assign(Object.assign({}, floatingStyles), { zIndex: 9999 }), children: props.items.map((item, index2) => {
+    }, [setFloatingRef, dropdownRef]);
+    const menuProps = React__namespace.useMemo(() => getMenuProps({ ref: mergedDropdownRef }), [mergedDropdownRef, getMenuProps]);
+    const toggleButtonProps = React__namespace.useMemo(() => getToggleButtonProps({ disabled: props.disabled, ref: refs.setReference }), [props.disabled, refs.setReference, getToggleButtonProps]);
+    return jsxRuntime.exports.jsx(Tooltip$1, { content: props.errorMsg, disabled: !props.errorMsg, styling: "error", children: jsxRuntime.exports.jsxs(Wrapper$6, { className: props.className, isDisabled: props.disabled, isErrored: !!props.errorMsg, isOpen, onClick: props.onClick, style: props.style, children: [jsxRuntime.exports.jsxs(SelectButton, Object.assign({ disabled: props.disabled, isOpen }, toggleButtonProps, getReferenceProps(), { type: "button", children: [jsxRuntime.exports.jsx(SelectedItem, { size: props.size, children: (_b = (_a3 = selectedItem === null ? props.placeholder : selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.label) !== null && _a3 !== void 0 ? _a3 : props.placeholder) !== null && _b !== void 0 ? _b : "Select" }), jsxRuntime.exports.jsx(Chevron$2, { disabled: props.disabled, isOpen })] })), ReactDOM__default.default.createPortal(jsxRuntime.exports.jsx(DropdownList, Object.assign({}, menuProps, getFloatingProps(), { className: `${(_c = menuProps === null || menuProps === void 0 ? void 0 : menuProps.className) !== null && _c !== void 0 ? _c : ""} ${props.itemClass}`, isOpen, maxItems: props.maxItems, style: Object.assign(Object.assign({}, floatingStyles), { zIndex: 9999 }), children: props.items.map((item, index2) => {
       const _a4 = getItemProps({ index: index2, item }), { itemClassName } = _a4, itemProps = __rest$8(_a4, ["itemClassName"]);
       return React.createElement(ListItem, Object.assign({}, itemProps, { className: `${itemClassName} ${props.itemClass}`, hovered: index2 === highlightedIndex, key: `item-${index2}`, size: props.size, title: item.label }), item.label);
     }) })), document.body)] }) });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@darajs/components",
-  "version": "1.9.2",
+  "version": "1.9.3",
   "description": "Components for the Dara framework",
   "main": "dist/index.js",
   "module": "dist/index.js",
@@ -54,14 +54,14 @@
   },
   "dependencies": {
     "@bokeh/bokehjs": "~3.1.1",
-    "@darajs/core": "1.9.2",
-    "@darajs/styled-components": "~1.9.4",
-    "@darajs/ui-causal-graph-editor": "~1.9.4",
-    "@darajs/ui-code-editor": "~1.9.4",
-    "@darajs/ui-components": "~1.9.4",
-    "@darajs/ui-hierarchy-viewer": "~1.9.4",
-    "@darajs/ui-icons": "~1.9.4",
-    "@darajs/ui-utils": "~1.9.4",
+    "@darajs/core": "1.9.3",
+    "@darajs/styled-components": "~1.9.5",
+    "@darajs/ui-causal-graph-editor": "~1.9.5",
+    "@darajs/ui-code-editor": "~1.9.5",
+    "@darajs/ui-components": "~1.9.5",
+    "@darajs/ui-hierarchy-viewer": "~1.9.5",
+    "@darajs/ui-icons": "~1.9.5",
+    "@darajs/ui-utils": "~1.9.5",
     "@popperjs/core": "2.4.0",
     "date-fns": "2.9.0",
     "immer": "^10.0.0",
@@ -83,5 +83,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "1292fb6a764c0c3e3f0f920042fc1ebd1120f34c"
+  "gitHead": "923fdf4404f440e753b87a0b5f10dc39b58b5653"
 }