lino-react 26.3.3__tar.gz → 26.4.0__tar.gz

{lino_react-26.3.3 → lino_react-26.4.0}/PKG-INFO

@@ -1,6 +1,6 @@
 Metadata-Version: 2.4
 Name: lino_react
-Version: 26.3.3
+Version: 26.4.0
 Summary: The React front end for Lino
 Project-URL: Homepage, https://react.lino-framework.org
 Project-URL: Repository, https://gitlab.com/lino-framework/react

{lino_react-26.3.3 → lino_react-26.4.0}/lino_react/__init__.py

@@ -3,7 +3,7 @@
 # License: GNU Affero General Public License v3 (see file COPYING for details)
 # Source documentation see https://react.lino-framework.org/dev
 
-__version__ = '26.3.3'
+__version__ = '26.4.0'
 
 srcref_url = 'https://gitlab.com/lino-framework/react/blob/master/%s'
 # doc_trees = []

{lino_react-26.3.3 → lino_react-26.4.0}/lino_react/react/components/App.jsx

@@ -1024,6 +1024,9 @@ class App extends Component {
         //     url.searchParams.set(constants.URL_PARAM_SUBST_USER, su_id);
         //     window.history.replaceState({}, '', url);
         // }
+        const url = new URL(window.location.href);
+        url.searchParams.set("timestamp", Date.now().toString());
+        window.history.replaceState({}, '', url);
         window.location.reload();
     }
 

{lino_react-26.3.3 → lino_react-26.4.0}/lino_react/react/components/AutoComplete.tsx

@@ -32,6 +32,29 @@ export class AutoComplete extends LeafComponentInput {
     controller: any;
     state: t.ObjectAny & {textSelected: boolean; initialHang?: boolean;};
 
+    getDynamicDropdownWidthCh = (): number => {
+        const rowTexts = (this.state.rows || []).map(row => {
+            if (!row) return "";
+            if (typeof row === "string") return row;
+            return row.text || "";
+        });
+        const longestText = Math.max(
+            0,
+            this.state.value?.text?.length || 0,
+            ...rowTexts.map(text => text.length)
+        );
+        return Math.min(Math.max(longestText + 4, 30), 120);
+    }
+
+    getDynamicDropdownStyle = (): React.CSSProperties => {
+        const widthCh = this.getDynamicDropdownWidthCh();
+        return {
+            minWidth: '30ch',
+            width: `${widthCh}ch`,
+            maxWidth: '90vw',
+        };
+    }
+
     constructor(props: t.LeafInputProps) {
         super(props);
         this.state = {
@@ -162,6 +185,7 @@ export class AutoComplete extends LeafComponentInput {
                 }
             }}
             ref={this.onInputRef}
+            panelStyle={this.getDynamicDropdownStyle()}
             scrollHeight="200px"
             suggestions={this.state.rows}
             tabIndex={this.props.tabIndex}
@@ -182,7 +206,7 @@ export class AutoComplete extends LeafComponentInput {
                 },
                 ref: el => this.scroller = el,
                 scrollHeight: "195px",
-                style: {minWidth: '30ch'},
+                style: this.getDynamicDropdownStyle(),
             }}
             {...customProps}/>
             {this.hasClearButton && this.props.elem.field_options.allowBlank

{lino_react-26.3.3 → lino_react-26.4.0}/lino_react/react/components/LinoBody.jsx

@@ -314,7 +314,7 @@ export class LinoBody extends Component {
                         maxWidth: '40px',
                         background: '#2255AA40',
                         borderRadius: '3px',
-                        zIndex: 999999
+                        zIndex: 999
                     }}>
                     <LinoToolbar
                         ref={ref => this.sideToolbar = ref}

{lino_react-26.3.3 → lino_react-26.4.0}/lino_react/react/components/LinoComponentUtils.jsx

@@ -489,6 +489,7 @@ export class LeafComponentInput extends LeafComponentBase {
             autoFocus={!this.props.urlParams.controller.globals.isMobile && this.leafIndexMatch()}
             // disabled={this.state.initialHang}
             onChange={(e) => {
+                constants.debugMessage("LeafComponentInput onChange", e);
                 if (!this.inputState.onChangeUpdateAssert(e)) return;
                 this.onChangeUpdate(e);
                 this.inputState.postOnChange(e);
@@ -727,7 +728,7 @@ export class LeafComponentInputChoices extends LeafComponentInput {
             }}
             optionLabel="text"
             options={this.options}
-            // panelStyle={{zIndex: "99999"}}
+            // panelStyle={{zIndex: "999"}}
             // ref={this.onInputRef}
             ref={ref => this.inputEl = ref}
             showClear={this.props.elem.field_options.allowBlank}

{lino_react-26.3.3 → lino_react-26.4.0}/lino_react/react/components/LinoComponents.jsx

@@ -355,23 +355,25 @@ const LinoComponents = {
         static iPool = Object.assign(ex, LeafComponentInput.iPool.copy());
         async prepare() {
             await super.prepare();
+
+            const { locale } = this.props.urlParams.controller.APP.state.user_settings;
+            const normalizedLocale = locale ? locale.replace(/_/g, '-') : undefined;
+            // Switch to English locale for Bengali, as InputNumber fails with
+            // inserting the first character as "1" (a bug in primereact).
+            const inputNumberLocale = /^bn($|-)/.test(normalizedLocale || "")
+                ? "en"
+                : normalizedLocale;
+
             this.inputState = {
                 ...this.inputState,
                 inputComponent: this.ex.prInputNumber.InputNumber,
-                inputProps: {maxFractionDigits: 20, allowEmpty: true},
+                inputProps: {
+                    maxFractionDigits: 20,
+                    allowEmpty: true,
+                    locale: inputNumberLocale,
+                },
                 getValueFromEvent: (e) => e.value,
             }
-
-            // const { locale } = this.props.urlParams.controller.APP.state.user_settings;
-            // const numerals = [
-            //     ...new Intl.NumberFormat(
-            //         locale, { useGrouping: false }
-            //     ).format(9876543210)
-            // ].reverse();
-            // const numerals_exp = new RegExp(`[${numerals.join('')}]`, 'g');
-            // this.decimal_sep = new Intl.NumberFormat(
-            //     locale, { useGrouping: false }
-            // ).format(1.1).trim().replace(numerals_exp, '');
         }
 
         getValue() {
@@ -399,10 +401,13 @@ const LinoComponents = {
 
         formatValue(v) {
             const { controller } = this.props.urlParams;
+            constants.debugMessage("DecimalFieldElement.formatValue", v);
             if (!controller.filled(v)) return v;
-            return new Intl.NumberFormat(
+            const formattedNumber = new Intl.NumberFormat(
                 controller.APP.state.user_settings.locale
             ).format(v);
+            constants.debugMessage("DecimalFieldElement.formatValue", v, formattedNumber);
+            return formattedNumber
         }
     },
 

{lino_react-26.3.3 → lino_react-26.4.0}/lino_react/react/components/LinoDialog.jsx

@@ -325,6 +325,7 @@ function LinoWebCamDialog(props) {
         modal={true}
         onHide={e => props.factory.remove(props.id)}
         resizable={false}
+        style={{zIndex: 1000}}
         visible={true}>
         {dim.height === null ? <div ref={ref => {if (ref) {setDim({
                 height: ref.parentElement.offsetHeight,
@@ -373,6 +374,7 @@ function LinoCallbackDialog({
         modal={true}
         onHide={e => factory.removeCallback(id)}
         ref={dialogRef}
+        style={{zIndex: 1000}}
         visible={true}>
         <div
             dangerouslySetInnerHTML={{__html: message}}
@@ -514,10 +516,13 @@ class LinoDialog extends Component {
                     }
                     header={this.state.context.title}
                     maximizable={true}
-                    modal={false}
+                    modal={true}
                     onHide={this.close}
                     ref={this.dialogRef}
-                    style={this.renderDialogStyle(this.state.actionMeta.windowSize)}
+                    style={Object.assign(
+                        this.renderDialogStyle(this.state.actionMeta.windowSize),
+                        {zIndex: 1000}
+                    )}
                     visible={true}>
                     {
                         // this.state.beforeContent && <div dangerouslySetInnerHTML={{__html: this.state.beforeContent}}/>
@@ -596,8 +601,10 @@ const LinoInputDialog = React.forwardRef(
                     footer={<ConfirmButtons
                         agree={agree} agreeLabel={agreeLabel} disagree={close}/>}
                     header={title}
+                    modal={true}
                     onHide={close}
                     onKeyDown={(event) => {if(event.key == "Enter") agree()} }
+                    style={{zIndex: 1000}}
                     visible={true}>
                     <localEx.lc.LinoLayout
                         editing_mode={true}

{lino_react-26.3.3 → lino_react-26.4.0}/lino_react/react/components/LinoToolbar.jsx

@@ -380,7 +380,7 @@ export class LinoToolbar extends Component {
                         }
                     )}
                     panelStyle={{
-                        zIndex: "99999",
+                        zIndex: "999",
                         height: "auto",
                         width: "auto",
                         position: "absolute",
@@ -413,7 +413,7 @@ export class LinoToolbar extends Component {
 
     render() {
         if (!this.state.ready) return null;
-        let ad = this.context.controller.static.actorData;
+        const ad = this.context.controller.static.actorData;
         return <React.Fragment key={this.state.key}>
             {!this.props.side && this.context.toolbarState == constants.TOOLBAR_STATE_VISIBLE ? <React.Fragment>
                 <div className={"table-header"}>

{lino_react-26.3.3 → lino_react-26.4.0}/lino_react/react/components/constants.js

@@ -142,13 +142,15 @@ export const FIXED_WIDTH_FONTS = 'ui-monospace, "SFMono-Regular", Menlo, Monaco,
 
 export const LOGLEVEL_INFO = 1;
 export const LOGLEVEL_DEBUG = 2;
+export const ANDROID_WEBVIEW_DEBUG_FLAG = '__ANDROID_WEBVIEW_DEBUG__';
 
 
 export function debugMessage(...args) {
+	const hasInjectedDebugFlag = typeof window !== 'undefined' && window[ANDROID_WEBVIEW_DEBUG_FLAG] === true;
 	if (
 		// eslint-disable-next-line no-undef
 		(typeof LINO_LOGLEVEL !== "undefined" && LINO_LOGLEVEL >= LOGLEVEL_DEBUG)
-		|| typeof window.AndroidBridge !== 'undefined'  // isAndroidWebView
+		|| hasInjectedDebugFlag
 	) {
 		console.debug(...args);
 	}

{lino_react-26.3.3 → lino_react-26.4.0}/lino_react/react/components/index.html

@@ -45,16 +45,14 @@
         users_color_scheme: "{{ users_color_scheme }}",
     });
 
-    // Remove the "timestamp" query parameter from the URL if it exists.
+    // Keep the URL clean by removing parameters that are only needed for the initial page load and should not persist during navigation.
     const url = new URL(window.location.href);
-    if (url.searchParams.has("timestamp")) {
-        url.searchParams.delete("timestamp");
-        window.history.replaceState({}, "", url);
-    }
-    if (url.searchParams.has("su")) {
-        url.searchParams.delete("su");
-        window.history.replaceState({}, "", url);
-    }
+    ["timestamp", "su", "color_scheme"].forEach(param => {
+        if (url.searchParams.has(param)) {
+            url.searchParams.delete(param);
+        }
+    });
+    window.history.replaceState({}, "", url);
 </script>
 
 

lino_react-26.4.0/lino_react/react/components/quillmodules.css

@@ -0,0 +1,153 @@
+.l-editor .ql-container {
+    font-family: inherit;
+    font-size: inherit;
+}
+
+/* TextBox Blot Styles */
+.ql-textbox {
+    border: 2px solid #ccc;
+    padding: 10px;
+    margin: 10px 0;
+    min-height: 60px;
+    background: #fafafa;
+    border-radius: 4px;
+    box-sizing: border-box;
+    position: relative;
+    transition: border-color 0.2s;
+}
+
+.ql-textbox:hover {
+    border-color: #4285f4;
+}
+
+.ql-textbox:focus-within {
+    border-color: #4285f4;
+    background: white;
+    outline: none;
+}
+
+/* TextBox child elements */
+.ql-textbox-block {
+    margin: 0;
+    padding: 0;
+    min-height: 1em;
+}
+
+.ql-textbox-soft-break {
+    /* Inherits from soft-break */
+}
+
+.ql-textbox-break {
+    /* Custom break styling within textbox */
+    display: block;
+}
+
+/* Alignment classes */
+.ql-textbox-align-left {
+    float: left;
+    margin-left: 0;
+    margin-right: 10px;
+    margin-bottom: 10px;
+}
+
+.ql-textbox-align-center {
+    display: block;
+    margin-left: auto;
+    margin-right: auto;
+    margin-bottom: 10px;
+    clear: both;
+}
+
+.ql-textbox-align-right {
+    float: right;
+    margin-left: 10px;
+    margin-right: 0;
+    margin-bottom: 10px;
+}
+
+/* Overlay styles */
+.ql-textbox-overlay {
+    pointer-events: none;
+}
+
+.ql-textbox-overlay .ql-textbox-handle {
+    pointer-events: auto;
+}
+
+/* Toolbar styles */
+.ql-textbox-toolbar {
+    display: flex;
+    gap: 2px;
+}
+
+.ql-textbox-toolbar-button {
+    font-size: 14px;
+    transition: all 0.2s;
+}
+
+.ql-textbox-toolbar-button:hover {
+    background: #f0f0f0 !important;
+    transform: scale(1.05);
+}
+
+.ql-textbox-toolbar-button:active {
+    transform: scale(0.95);
+}
+
+/* Quill toolbar theme integration */
+.l-editor .ql-toolbar.ql-snow {
+    background: var(--bg-color-lino, #f0f0f0);
+}
+
+.l-editor .ql-toolbar.ql-snow button,
+.l-editor .ql-toolbar.ql-snow .ql-picker-label {
+    background: var(--quill-button-bg, var(--bg-color-lino, #f0f0f0));
+    color: var(--quill-button-color, var(--text-color-lino, #000000));
+}
+
+.l-editor .ql-toolbar.ql-snow button:hover,
+.l-editor .ql-toolbar.ql-snow button:focus,
+.l-editor .ql-toolbar.ql-snow .ql-picker-label:hover,
+.l-editor .ql-toolbar.ql-snow .ql-picker-label.ql-active {
+    background: var(--quill-button-hover-bg, #e9ecef);
+}
+
+.l-editor .ql-toolbar.ql-snow button.ql-active,
+.l-editor .ql-toolbar.ql-snow .ql-picker-item.ql-selected,
+.l-editor .ql-toolbar.ql-snow .ql-picker-label.ql-active {
+    background: var(--quill-button-active-bg, #d7e8ff);
+}
+
+.l-editor .ql-toolbar.ql-snow .ql-picker,
+.l-editor .ql-toolbar.ql-snow .ql-picker-options,
+.l-editor .ql-toolbar.ql-snow .ql-picker-item {
+    color: var(--quill-button-color, var(--text-color-lino, #000000));
+}
+
+.l-editor .ql-toolbar.ql-snow .ql-stroke {
+    stroke: var(--quill-button-color, var(--text-color-lino, #000000));
+}
+
+.l-editor .ql-toolbar.ql-snow .ql-fill {
+    fill: var(--quill-button-color, var(--text-color-lino, #000000));
+}
+
+.l-editor .ql-toolbar.ql-snow .ql-picker-item.ql-selected .ql-stroke,
+.l-editor .ql-toolbar.ql-snow .ql-picker-item:hover .ql-stroke,
+.l-editor .ql-toolbar.ql-snow .ql-picker-label:hover .ql-stroke,
+.l-editor .ql-toolbar.ql-snow .ql-picker-label.ql-active .ql-stroke,
+.l-editor .ql-toolbar.ql-snow button:hover .ql-stroke,
+.l-editor .ql-toolbar.ql-snow button:focus .ql-stroke,
+.l-editor .ql-toolbar.ql-snow button.ql-active .ql-stroke {
+    stroke: var(--quill-button-color, var(--text-color-lino, #000000));
+}
+
+.l-editor .ql-toolbar.ql-snow .ql-picker-item.ql-selected .ql-fill,
+.l-editor .ql-toolbar.ql-snow .ql-picker-item:hover .ql-fill,
+.l-editor .ql-toolbar.ql-snow .ql-picker-label:hover .ql-fill,
+.l-editor .ql-toolbar.ql-snow .ql-picker-label.ql-active .ql-fill,
+.l-editor .ql-toolbar.ql-snow button:hover .ql-fill,
+.l-editor .ql-toolbar.ql-snow button:focus .ql-fill,
+.l-editor .ql-toolbar.ql-snow button.ql-active .ql-fill {
+    fill: var(--quill-button-color, var(--text-color-lino, #000000));
+}

{lino_react-26.3.3 → lino_react-26.4.0}/lino_react/react/config/react/main.html

@@ -83,8 +83,8 @@
 </script>
 {%- endif -%}
 
-<script defer src="{{site.build_static_url('react/main.runtime.0d6a586d3afef394223d.js')}}"></script>
-<script defer src="{{site.build_static_url('react/main.dca792f167d5a2a721cc.js')}}"></script>
+<script defer src="{{site.build_static_url('react/main.runtime.b6ba791b476c3be77755.js')}}"></script>
+<script defer src="{{site.build_static_url('react/main.e5da7bca814d0bb84b31.js')}}"></script>
 
 <script type="text/javascript">
     if ('serviceWorker' in navigator) {