@etsoo/react 1.4.71 → 1.4.75

package/lib/index.d.ts

@@ -64,6 +64,7 @@ export * from './mu/ScrollTopFab';
 export * from './mu/SearchBar';
 export * from './mu/SearchField';
 export * from './mu/SearchOptionGroup';
+export * from './mu/SelectBool';
 export * from './mu/SelectEx';
 export * from './mu/Switch';
 export * from './mu/SwitchAnt';

package/lib/index.js

@@ -67,6 +67,7 @@ export * from './mu/ScrollTopFab';
 export * from './mu/SearchBar';
 export * from './mu/SearchField';
 export * from './mu/SearchOptionGroup';
+export * from './mu/SelectBool';
 export * from './mu/SelectEx';
 export * from './mu/Switch';
 export * from './mu/SwitchAnt';

package/lib/mu/DnDList.js

@@ -102,12 +102,12 @@ export function DnDList(props) {
     // Layout
     return (React.createElement(React.Fragment, null,
         sideRenderer && sideRenderer(true, addItem, addItems, reloadItems),
-        React.createElement(Component, { ...componentProps }, disabled ? (React.createElement("div", null, items.map((item, index) => {
+        React.createElement(Component, { ...componentProps }, disabled ? (React.createElement("div", { style: getListStyle(false) }, items.map((item, index) => {
             // Id
             const id = DataTypes.convert(item[labelField], 'string');
             if (id == null)
                 return;
-            return (React.createElement("div", null, children(item, index, deleteItem, editItem)));
+            return (React.createElement("div", { key: id, style: getItemStyle(false, index) }, children(item, index, deleteItem, editItem)));
         }))) : (React.createElement(DragDropContext, { onDragEnd: onDragEndLocal },
             React.createElement(Droppable, { droppableId: name }, (provided, snapshot) => (React.createElement("div", { ...provided.droppableProps, ref: provided.innerRef, style: getListStyle(snapshot.isDraggingOver) },
                 items.map((item, index) => {

package/lib/mu/MobileListItemRenderer.js

@@ -22,7 +22,6 @@ export function MobileListItemRenderer({ data, itemHeight, margins }, renderer)
     // Loading
     if (data == null)
         return React.createElement(LinearProgress, null);
-    console.log('margins', margins);
     // Elements
     const [title, subheader, actions, children, cardActions] = renderer(data);
     return (React.createElement(Card, { sx: {

package/lib/mu/SelectBool.d.ts

@@ -0,0 +1,14 @@
+/// <reference types="react" />
+import { IdLabelDto } from '@etsoo/appscript';
+import { SelectExProps } from './SelectEx';
+/**
+ * SelectBool props
+ */
+export interface SelectBoolProps extends Omit<SelectExProps<IdLabelDto<string>>, 'options' | 'loadData'> {
+}
+/**
+ * SelectBool (yes/no)
+ * @param props Props
+ * @returns Component
+ */
+export declare function SelectBool(props: SelectBoolProps): JSX.Element;

package/lib/mu/SelectBool.js

@@ -0,0 +1,21 @@
+import React from 'react';
+import { globalApp } from '..';
+import { SelectEx } from './SelectEx';
+/**
+ * SelectBool (yes/no)
+ * @param props Props
+ * @returns Component
+ */
+export function SelectBool(props) {
+    // Destruct
+    const { search = true, ...rest } = props;
+    // Options
+    const options = [
+        { id: 'false', label: globalApp.get('no') },
+        { id: 'true', label: globalApp.get('yes') }
+    ];
+    if (search)
+        options.unshift({ id: '', label: '---' });
+    // Layout
+    return React.createElement(SelectEx, { options: options, search: search, ...rest });
+}

package/lib/mu/Tiplist.js

@@ -10,6 +10,7 @@ import { SearchField } from './SearchField';
  * @returns Component
  */
 export function Tiplist(props) {
+    var _a;
     // Destruct
     const { search = false, idField = 'id', idValue, inputAutoComplete = 'off', inputError, inputHelperText, inputMargin, inputOnChange, inputRequired, inputVariant, label, loadData, defaultValue, value, name, readOnly, onChange, openOnFocus = true, sx = { minWidth: '180px' }, ...rest } = props;
     // Value input ref
@@ -133,7 +134,7 @@ export function Tiplist(props) {
     }, []);
     // Layout
     return (React.createElement("div", null,
-        React.createElement("input", { ref: inputRef, "data-reset": "true", type: "text", style: { display: 'none' }, name: name, value: localIdValue !== null && localIdValue !== void 0 ? localIdValue : '', readOnly: true, onChange: inputOnChange }),
+        React.createElement("input", { ref: inputRef, "data-reset": "true", type: "text", style: { display: 'none' }, name: name, value: (_a = (states.value && Reflect.get(states.value, idField))) !== null && _a !== void 0 ? _a : '', readOnly: true, onChange: inputOnChange }),
         React.createElement(Autocomplete, { filterOptions: (options, _state) => options, value: states.value, options: states.options, onChange: (event, value, reason, details) => {
                 // Set value
                 setInputValue(value);

package/lib/mu/pages/ViewPage.js

@@ -86,6 +86,6 @@ export function ViewPage(props) {
                     ":"),
                 React.createElement(Typography, { variant: "subtitle2" }, itemData)));
         })),
-        actions != null && (React.createElement(Stack, { className: "ET-ViewPage-Actions", direction: "row", width: "100%", flexWrap: "wrap", paddingTop: paddings, paddingBottom: paddings, gap: paddings }, Utils.getResult(actions, data))),
+        actions != null && (React.createElement(Stack, { className: "ET-ViewPage-Actions", direction: "row", width: "100%", flexWrap: "wrap", justifyContent: "flex-end", paddingTop: paddings, paddingBottom: paddings, gap: paddings }, Utils.getResult(actions, data))),
         Utils.getResult(children, data)))));
 }

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@etsoo/react",
-    "version": "1.4.71",
+    "version": "1.4.75",
     "description": "TypeScript ReactJs framework",
     "main": "lib/index.js",
     "types": "lib/index.d.ts",
@@ -50,7 +50,7 @@
         "@emotion/react": "^11.7.1",
         "@emotion/style": "^0.8.0",
         "@emotion/styled": "^11.6.0",
-        "@etsoo/appscript": "^1.2.27",
+        "@etsoo/appscript": "^1.2.28",
         "@etsoo/notificationbase": "^1.1.0",
         "@etsoo/shared": "^1.1.6",
         "@mui/icons-material": "^5.3.1",

package/src/index.ts

@@ -71,6 +71,7 @@ export * from './mu/ScrollTopFab';
 export * from './mu/SearchBar';
 export * from './mu/SearchField';
 export * from './mu/SearchOptionGroup';
+export * from './mu/SelectBool';
 export * from './mu/SelectEx';
 export * from './mu/Switch';
 export * from './mu/SwitchAnt';

package/src/mu/DnDList.tsx

@@ -234,7 +234,7 @@ export function DnDList<
             {sideRenderer && sideRenderer(true, addItem, addItems, reloadItems)}
             <Component {...componentProps}>
                 {disabled ? (
-                    <div>
+                    <div style={getListStyle(false)}>
                         {items.map((item, index) => {
                             // Id
                             const id = DataTypes.convert(
@@ -244,7 +244,10 @@ export function DnDList<
                             if (id == null) return;
 
                             return (
-                                <div>
+                                <div
+                                    key={id}
+                                    style={getItemStyle(false, index)}
+                                >
                                     {children(
                                         item,
                                         index,

package/src/mu/MobileListItemRenderer.tsx

@@ -36,8 +36,6 @@ export function MobileListItemRenderer<T>(
     // Loading
     if (data == null) return <LinearProgress />;
 
-    console.log('margins', margins);
-
     // Elements
     const [title, subheader, actions, children, cardActions] = renderer(data);
 

package/src/mu/SelectBool.tsx

@@ -0,0 +1,31 @@
+import { IdLabelDto } from '@etsoo/appscript';
+import React from 'react';
+import { globalApp } from '..';
+import { SelectEx, SelectExProps } from './SelectEx';
+
+/**
+ * SelectBool props
+ */
+export interface SelectBoolProps
+    extends Omit<SelectExProps<IdLabelDto<string>>, 'options' | 'loadData'> {}
+
+/**
+ * SelectBool (yes/no)
+ * @param props Props
+ * @returns Component
+ */
+export function SelectBool(props: SelectBoolProps) {
+    // Destruct
+    const { search = true, ...rest } = props;
+
+    // Options
+    const options: IdLabelDto<string>[] = [
+        { id: 'false', label: globalApp.get('no')! },
+        { id: 'true', label: globalApp.get('yes')! }
+    ];
+
+    if (search) options.unshift({ id: '', label: '---' });
+
+    // Layout
+    return <SelectEx options={options} search={search} {...rest} />;
+}

package/src/mu/Tiplist.tsx

@@ -219,7 +219,9 @@ export function Tiplist<T extends {} = IdLabelDto>(props: TiplistProps<T>) {
                 type="text"
                 style={{ display: 'none' }}
                 name={name}
-                value={localIdValue ?? ''}
+                value={
+                    (states.value && Reflect.get(states.value, idField)) ?? ''
+                }
                 readOnly
                 onChange={inputOnChange}
             />

package/src/mu/pages/ViewPage.tsx

@@ -222,6 +222,7 @@ export function ViewPage<T extends {}>(props: ViewPageProps<T>) {
                             direction="row"
                             width="100%"
                             flexWrap="wrap"
+                            justifyContent="flex-end"
                             paddingTop={paddings}
                             paddingBottom={paddings}
                             gap={paddings}