sliftutils 0.54.0 → 0.56.0

package/index.d.ts

@@ -231,7 +231,32 @@ declare module "sliftutils/render-utils/Input" {
 
 declare module "sliftutils/render-utils/InputLabel" {
     import preact from "preact";
-    import { InputProps } from "./Input";
+    type InputProps = (preact.JSX.HTMLAttributes<HTMLInputElement> & {
+        /** ONLY throttles onChangeValue */
+        throttle?: number;
+        flavor?: "large" | "small" | "none";
+        focusOnMount?: boolean;
+        textarea?: boolean;
+        /** Update on key stroke, not on blur (just does onInput = onChange, as onInput already does this) */
+        hot?: boolean;
+        /** Updates arrow keys with modifier behavior to use larger numbers, instead of decimals. */
+        integer?: boolean;
+        /** Only works with number/integer */
+        reverseArrowKeyDirection?: boolean;
+        inputRef?: (x: HTMLInputElement | null) => void;
+        /** Don't blur on enter key */
+        noEnterKeyBlur?: boolean;
+        noFocusSelect?: boolean;
+        inputKey?: string;
+        fillWidth?: boolean;
+        autocompleteValues?: string[];
+        /** Forces the input to update when focused. Usually we hold updates, to prevent the user's
+         *      typing to be interrupted by background updates.
+         *      NOTE: "hot" is usually required when using this.
+         */
+        forceInputValueUpdatesWhenFocused?: boolean;
+        onChangeValue?: (value: string) => void;
+    });
     export type InputLabelProps = Omit<InputProps, "label" | "title"> & {
         label?: preact.ComponentChild;
         number?: boolean;
@@ -266,6 +291,7 @@ declare module "sliftutils/render-utils/InputLabel" {
     }> {
         render(): preact.JSX.Element;
     }
+    export {};
 
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "sliftutils",
-    "version": "0.54.0",
+    "version": "0.56.0",
     "main": "index.js",
     "license": "MIT",
     "files": [
@@ -48,7 +48,7 @@
         "mobx": "^6.13.3",
         "preact": "10.24.3",
         "shell-quote": "^1.8.3",
-        "socket-function": "^0.162.0",
+        "socket-function": "^0.163.0",
         "typenode": "^6.0.0",
         "typesafecss": "*",
         "ws": "^8.18.3",

package/render-utils/Input.tsx

@@ -9,6 +9,7 @@ import { throttleFunction } from "socket-function/src/misc";
 //  This is useful for inputs which you want to run an action on, such as "add new item",
 //      as it allows you to remove a local state value to cache the value, by just
 //      doing the add on "onChangeValue".
+// IMPORTANT! InputProps is in both InputLabel.tsx and Input.tsx, so the types export correctly
 export type InputProps = (
     preact.JSX.HTMLAttributes<HTMLInputElement>
     & {

package/render-utils/InputLabel.d.ts

@@ -1,5 +1,30 @@
 import preact from "preact";
-import { InputProps } from "./Input";
+type InputProps = (preact.JSX.HTMLAttributes<HTMLInputElement> & {
+    /** ONLY throttles onChangeValue */
+    throttle?: number;
+    flavor?: "large" | "small" | "none";
+    focusOnMount?: boolean;
+    textarea?: boolean;
+    /** Update on key stroke, not on blur (just does onInput = onChange, as onInput already does this) */
+    hot?: boolean;
+    /** Updates arrow keys with modifier behavior to use larger numbers, instead of decimals. */
+    integer?: boolean;
+    /** Only works with number/integer */
+    reverseArrowKeyDirection?: boolean;
+    inputRef?: (x: HTMLInputElement | null) => void;
+    /** Don't blur on enter key */
+    noEnterKeyBlur?: boolean;
+    noFocusSelect?: boolean;
+    inputKey?: string;
+    fillWidth?: boolean;
+    autocompleteValues?: string[];
+    /** Forces the input to update when focused. Usually we hold updates, to prevent the user's
+     *      typing to be interrupted by background updates.
+     *      NOTE: "hot" is usually required when using this.
+     */
+    forceInputValueUpdatesWhenFocused?: boolean;
+    onChangeValue?: (value: string) => void;
+});
 export type InputLabelProps = Omit<InputProps, "label" | "title"> & {
     label?: preact.ComponentChild;
     number?: boolean;
@@ -34,3 +59,4 @@ export declare class InputLabelURL extends preact.Component<InputLabelProps & {
 }> {
     render(): preact.JSX.Element;
 }
+export {};

package/render-utils/InputLabel.tsx

@@ -1,10 +1,50 @@
 import preact from "preact";
-import { Input, InputProps } from "./Input";
+import { Input } from "./Input";
 import { css } from "typesafecss";
 import { lazy } from "socket-function/src/caching";
 import { observer } from "./observer";
 import { observable } from "mobx";
 
+// IMPORTANT! InputProps is in both InputLabel.tsx and Input.tsx, so the types export correctly
+type InputProps = (
+    preact.JSX.HTMLAttributes<HTMLInputElement>
+    & {
+        /** ONLY throttles onChangeValue */
+        throttle?: number;
+
+        flavor?: "large" | "small" | "none";
+        focusOnMount?: boolean;
+        textarea?: boolean;
+        /** Update on key stroke, not on blur (just does onInput = onChange, as onInput already does this) */
+        hot?: boolean;
+        /** Updates arrow keys with modifier behavior to use larger numbers, instead of decimals. */
+        integer?: boolean;
+
+        /** Only works with number/integer */
+        reverseArrowKeyDirection?: boolean;
+
+        inputRef?: (x: HTMLInputElement | null) => void;
+        /** Don't blur on enter key */
+        noEnterKeyBlur?: boolean;
+        noFocusSelect?: boolean;
+        inputKey?: string;
+        fillWidth?: boolean;
+
+
+        autocompleteValues?: string[];
+
+        /** Forces the input to update when focused. Usually we hold updates, to prevent the user's
+         *      typing to be interrupted by background updates.
+         *      NOTE: "hot" is usually required when using this.
+         */
+        forceInputValueUpdatesWhenFocused?: boolean;
+
+        // NOTE: We trigger onChange (and onChangeValue) whenever
+        //      e.ctrlKey && (e.code.startsWith("Key") || e.code === "Enter") || e.code === "Enter" && e.shiftKey
+        //  This is because ctrl usually means a hotkey, and hotkeys usually want committed values.
+        onChangeValue?: (value: string) => void;
+    }
+)
 
 export type InputLabelProps = Omit<InputProps, "label" | "title"> & {
     label?: preact.ComponentChild;

package/yarn.lock

@@ -1494,10 +1494,10 @@ slash@^3.0.0:
   resolved "https://registry.yarnpkg.com/slash/-/slash-3.0.0.tgz#6539be870c165adbd5240220dbe361f1bc4d4634"
   integrity sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==
 
-socket-function@^0.162.0:
-  version "0.162.0"
-  resolved "https://registry.yarnpkg.com/socket-function/-/socket-function-0.162.0.tgz#659dcff669a777c765c2d609ce733ee3674bb468"
-  integrity sha512-vBlGEWbYtPIAYSG9qmBuZ1Yec8fetIDzPR6TzKFOHXOlWtwq4W/rHz3aALw+afLNGBpJs4SI21WrS8efOepN/A==
+socket-function@^0.163.0:
+  version "0.163.0"
+  resolved "https://registry.yarnpkg.com/socket-function/-/socket-function-0.163.0.tgz#90f70833a10d6fa2fe2be65713d84a7c9be124d9"
+  integrity sha512-ufJZDIn2ZOpP8cnMh+B9NQZF2NNRS1HJB/bd4JL+9ZKv2E218epdrGmWh6OrQs2+8L1UPB51HJj0uLniHLM7nA==
   dependencies:
     "@types/pako" "^2.0.3"
     "@types/ws" "^8.5.3"