@etsoo/materialui 1.4.22 → 1.4.24

package/src/TwoFieldInput.tsx

@@ -1,9 +1,9 @@
-import { Input, InputAdornment } from '@mui/material';
-import ArrowRightAltIcon from '@mui/icons-material/ArrowRightAlt';
-import { useDimensions } from '@etsoo/react';
-import React from 'react';
-import { DateUtils, DomUtils } from '@etsoo/shared';
-import { InputField, InputFieldProps } from './InputField';
+import { Input, InputAdornment } from "@mui/material";
+import ArrowRightAltIcon from "@mui/icons-material/ArrowRightAlt";
+import { useDimensions } from "@etsoo/react";
+import React from "react";
+import { DateUtils, DomUtils } from "@etsoo/shared";
+import { InputField, InputFieldProps } from "./InputField";
 
 type ValueType = string | number | Date | null | undefined;
 
@@ -11,20 +11,20 @@ type ValueType = string | number | Date | null | undefined;
  * TwoField Input props
  */
 export type TwoFieldInputProps = Omit<
-    InputFieldProps,
-    'InputProps' | 'value'
+  InputFieldProps,
+  "InputProps" | "value"
 > & {
-    /**
-     * Values
-     */
-    values?: unknown | [ValueType, ValueType];
+  /**
+   * Values
+   */
+  values?: unknown | [ValueType, ValueType];
 
-    /**
-     * On values change, return false to prevent further onChange handler
-     */
-    onValuesChange?: (
-        values: [ValueType, ValueType]
-    ) => boolean | void | Promise<boolean | void>;
+  /**
+   * On values change, return false to prevent further onChange handler
+   */
+  onValuesChange?: (
+    values: [ValueType, ValueType]
+  ) => boolean | void | Promise<boolean | void>;
 };
 
 /**
@@ -33,99 +33,99 @@ export type TwoFieldInputProps = Omit<
  * @returns Component
  */
 export function TwoFieldInput(props: TwoFieldInputProps) {
-    // Destruct
-    const {
-        name,
-        inputProps,
-        type = inputProps?.inputMode,
-        values,
-        onValuesChange,
-        onChange,
-        onInput,
-        ...rest
-    } = props;
+  // Destruct
+  const {
+    name,
+    inputProps,
+    type = inputProps?.inputMode,
+    values,
+    onValuesChange,
+    onChange,
+    onInput,
+    ...rest
+  } = props;
 
-    // Local values
-    const localValues: [ValueType, ValueType] =
-        values == null
-            ? [null, null]
-            : Array.isArray(values)
-            ? (values as [ValueType, ValueType])
-            : [values as ValueType, null];
+  // Local values
+  const localValues: [ValueType, ValueType] =
+    values == null
+      ? [null, null]
+      : Array.isArray(values)
+      ? (values as [ValueType, ValueType])
+      : [values as ValueType, null];
 
-    // Ref
-    const valueRef = React.useRef<[ValueType, ValueType]>(localValues);
+  // Ref
+  const valueRef = React.useRef<[ValueType, ValueType]>(localValues);
 
-    // Watch container
-    const { dimensions } = useDimensions(
-        1,
-        (target, rect) => {
-            const width = (rect.width - 64) / 2;
-            const inputs = target.querySelectorAll('input');
-            inputs[0].style.width = `${width}px`;
-            inputs[1].parentElement!.style.width = `${width}px`;
-        },
-        0
-    );
+  // Watch container
+  const { dimensions } = useDimensions(
+    1,
+    (target, rect) => {
+      const width = (rect.width - 64) / 2;
+      const inputs = target.querySelectorAll("input");
+      inputs[0].style.width = `${width}px`;
+      inputs[1].parentElement!.style.width = `${width}px`;
+    },
+    0
+  );
 
-    // Handle change
-    const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {
-        const value = DomUtils.getInputValue(event.target);
-        const index = event.target.name.endsWith('-start') ? 0 : 1;
-        valueRef.current[index] = value;
+  // Handle change
+  const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {
+    const value = DomUtils.getInputValue(event.target);
+    const index = event.target.name.endsWith("-start") ? 0 : 1;
+    valueRef.current[index] = value;
 
-        if (onValuesChange) {
-            if (onValuesChange(valueRef.current) === false) return;
-        }
-        if (onChange) onChange(event);
-    };
+    if (onValuesChange) {
+      if (onValuesChange(valueRef.current) === false) return;
+    }
+    if (onChange) onChange(event);
+  };
 
-    const formatValue = (v: ValueType, type?: string) => {
-        if (v == null) return '';
-        if (typeof v === 'number') return v;
-        if (type === 'date' || type === 'datetime-local')
-            return DateUtils.formatForInput(v, type);
-        return v;
-    };
+  const formatValue = (v: ValueType, type?: string) => {
+    if (v == null) return "";
+    if (typeof v === "number") return v;
+    if (type === "date" || type === "datetime-local")
+      return DateUtils.formatForInput(v, type);
+    return v;
+  };
 
-    React.useEffect(() => {
-        valueRef.current = localValues;
-    }, [localValues]);
+  React.useEffect(() => {
+    valueRef.current = localValues;
+  }, [localValues]);
 
-    // Layout
-    return (
-        <InputField
-            name={`${name}-start`}
-            type={type}
-            value={formatValue(localValues[0], type)}
-            ref={dimensions[0][0]}
-            inputProps={inputProps}
-            InputProps={{
-                endAdornment: (
-                    <InputAdornment
-                        position="end"
-                        sx={{
-                            display: 'flex',
-                            alignItems: 'center',
-                            gap: 1
-                        }}
-                    >
-                        <ArrowRightAltIcon />
-                        <Input
-                            type={type}
-                            name={`${name}-end`}
-                            value={formatValue(localValues[1], type)}
-                            disableUnderline
-                            onInput={onInput}
-                            onChange={handleChange}
-                            inputProps={inputProps}
-                        />
-                    </InputAdornment>
-                )
+  // Layout
+  return (
+    <InputField
+      name={`${name}-start`}
+      type={type}
+      value={formatValue(localValues[0], type)}
+      ref={dimensions[0][0]}
+      inputProps={inputProps}
+      InputProps={{
+        endAdornment: (
+          <InputAdornment
+            position="end"
+            sx={{
+              display: "flex",
+              alignItems: "center",
+              gap: 1
             }}
-            onInput={onInput}
-            onChange={handleChange}
-            {...rest}
-        />
-    );
+          >
+            <ArrowRightAltIcon />
+            <Input
+              type={type}
+              name={`${name}-end`}
+              value={formatValue(localValues[1], type)}
+              disableUnderline
+              onInput={onInput}
+              onChange={handleChange}
+              inputProps={inputProps}
+            />
+          </InputAdornment>
+        )
+      }}
+      onInput={onInput}
+      onChange={handleChange}
+      {...rest}
+    />
+  );
 }

package/src/app/IServicePage.ts

@@ -1,4 +1,4 @@
-import { IPageData } from '@etsoo/react';
+import { IPageData } from "@etsoo/react";
 
 /**
  * Service page data interface

package/src/app/Labels.ts

@@ -1,77 +1,77 @@
-import { DataTypes, Utils } from '@etsoo/shared';
+import { DataTypes, Utils } from "@etsoo/shared";
 
 /**
  * Labels
  */
 export namespace Labels {
-    /**
-     * Common page labels
-     */
-    export const CommonPage = {
-        add: 'Add',
-        back: 'Back',
-        delete: 'Delete',
-        more: 'More',
-        pullToRefresh: 'Pull down to refresh',
-        refresh: 'Refresh',
-        refreshing: 'Refreshing',
-        releaseToRefresh: 'Release to refresh',
-        reset: 'Reset',
-        save: 'Save',
-        scrollTop: 'Scroll to top',
-        submit: 'Submit'
-    };
+  /**
+   * Common page labels
+   */
+  export const CommonPage = {
+    add: "Add",
+    back: "Back",
+    delete: "Delete",
+    more: "More",
+    pullToRefresh: "Pull down to refresh",
+    refresh: "Refresh",
+    refreshing: "Refreshing",
+    releaseToRefresh: "Release to refresh",
+    reset: "Reset",
+    save: "Save",
+    scrollTop: "Scroll to top",
+    submit: "Submit"
+  };
 
-    /**
-     * Notification MU labels
-     */
-    export const NotificationMU = {
-        alertTitle: 'Warning',
-        alertOK: 'OK',
-        confirmTitle: 'Confirm',
-        confirmYes: 'OK',
-        confirmNo: 'Cancel',
-        promptTitle: 'Input',
-        promptCancel: 'Cancel',
-        promptOK: 'OK',
-        loading: 'Loading',
-        success: 'Success',
-        warning: 'Warning',
-        info: 'Information'
-    };
+  /**
+   * Notification MU labels
+   */
+  export const NotificationMU = {
+    alertTitle: "Warning",
+    alertOK: "OK",
+    confirmTitle: "Confirm",
+    confirmYes: "OK",
+    confirmNo: "Cancel",
+    promptTitle: "Input",
+    promptCancel: "Cancel",
+    promptOK: "OK",
+    loading: "Loading",
+    success: "Success",
+    warning: "Warning",
+    info: "Information"
+  };
 
-    /**
-     * UserAvatarEditor labels
-     */
-    export const UserAvatarEditor = {
-        done: 'Done',
-        reset: 'Reset',
-        rotateLeft: 'Rotate left 90°',
-        rotateRight: 'Rotate right 90°',
-        upload: 'Upload',
-        zoom: 'Zoom'
-    };
+  /**
+   * UserAvatarEditor labels
+   */
+  export const UserAvatarEditor = {
+    done: "Done",
+    reset: "Reset",
+    rotateLeft: "Rotate left 90°",
+    rotateRight: "Rotate right 90°",
+    upload: "Upload",
+    zoom: "Zoom"
+  };
 
-    /**
-     * setLabelReference key reference
-     */
-    export interface setLabelsReference {
-        commonPage?: DataTypes.StringDictionary;
-        notificationMU?: DataTypes.StringDictionary;
-        userAvatarEditor?: DataTypes.StringDictionary;
-    }
+  /**
+   * setLabelReference key reference
+   */
+  export interface setLabelsReference {
+    commonPage?: DataTypes.StringDictionary;
+    notificationMU?: DataTypes.StringDictionary;
+    userAvatarEditor?: DataTypes.StringDictionary;
+  }
 
-    /**
-     * Set components' labels
-     * @param labels Labels
-     * @param reference Key reference
-     */
-    export const setLabels = (
-        labels: DataTypes.StringRecord,
-        reference: setLabelsReference = {}
-    ) => {
-        Utils.setLabels(CommonPage, labels, reference.commonPage);
-        Utils.setLabels(NotificationMU, labels, reference.notificationMU);
-        Utils.setLabels(UserAvatarEditor, labels, reference.userAvatarEditor);
-    };
+  /**
+   * Set components' labels
+   * @param labels Labels
+   * @param reference Key reference
+   */
+  export const setLabels = (
+    labels: DataTypes.StringRecord,
+    reference: setLabelsReference = {}
+  ) => {
+    Utils.setLabels(CommonPage, labels, reference.commonPage);
+    Utils.setLabels(NotificationMU, labels, reference.notificationMU);
+    Utils.setLabels(UserAvatarEditor, labels, reference.userAvatarEditor);
+  };
 }

package/src/index.ts

@@ -94,6 +94,7 @@ export * from "./PList";
 export * from "./ProgressCount";
 export * from "./PullToRefreshUI";
 export * from "./QuickList";
+export * from "./RegionsRQ";
 export * from "./ResponsibleContainer";
 export * from "./ResponsiveStyleValue";
 export * from "./ScrollerListEx";

package/src/texts/MoneyText.tsx

@@ -1,21 +1,21 @@
-import { NumberUtils } from '@etsoo/shared';
-import { Typography } from '@mui/material';
-import React from 'react';
-import { NumberTextProps } from './NumberText';
+import { NumberUtils } from "@etsoo/shared";
+import { Typography } from "@mui/material";
+import React from "react";
+import { NumberTextProps } from "./NumberText";
 
 /**
  * Money text props
  */
 export interface MoneyTextProps extends NumberTextProps {
-    /**
-     * Currency, USD for US dollar
-     */
-    currency?: string;
+  /**
+   * Currency, USD for US dollar
+   */
+  currency?: string;
 
-    /**
-     * Is integer number
-     */
-    isInteger?: boolean;
+  /**
+   * Is integer number
+   */
+  isInteger?: boolean;
 }
 
 /**
@@ -24,28 +24,22 @@ export interface MoneyTextProps extends NumberTextProps {
  * @returns Component
  */
 export function MoneyText(props: MoneyTextProps) {
-    // Destruct
-    const {
-        currency,
-        isInteger = false,
-        locale,
-        options = {},
-        value,
-        ...rest
-    } = props;
+  // Destruct
+  const {
+    currency,
+    isInteger = false,
+    locale,
+    options = {},
+    value,
+    ...rest
+  } = props;
 
-    // Layout
-    return (
-        <Typography component="span" fontSize="inherit" {...rest}>
-            {value == null
-                ? ''
-                : NumberUtils.formatMoney(
-                      value,
-                      currency,
-                      locale,
-                      isInteger,
-                      options
-                  )}
-        </Typography>
-    );
+  // Layout
+  return (
+    <Typography component="span" fontSize="inherit" {...rest}>
+      {value == null
+        ? ""
+        : NumberUtils.formatMoney(value, currency, locale, isInteger, options)}
+    </Typography>
+  );
 }

package/src/texts/NumberText.tsx

@@ -1,25 +1,25 @@
-import { NumberUtils } from '@etsoo/shared';
-import { Typography, TypographyProps } from '@mui/material';
-import React from 'react';
+import { NumberUtils } from "@etsoo/shared";
+import { Typography, TypographyProps } from "@mui/material";
+import React from "react";
 
 /**
  * Number text props
  */
 export interface NumberTextProps extends TypographyProps {
-    /**
-     * Locale
-     */
-    locale?: string | string[];
+  /**
+   * Locale
+   */
+  locale?: string | string[];
 
-    /**
-     * Options
-     */
-    options?: Intl.NumberFormatOptions;
+  /**
+   * Options
+   */
+  options?: Intl.NumberFormatOptions;
 
-    /**
-     * Value
-     */
-    value?: number | bigint | null;
+  /**
+   * Value
+   */
+  value?: number | bigint | null;
 }
 
 /**
@@ -28,13 +28,13 @@ export interface NumberTextProps extends TypographyProps {
  * @returns Component
  */
 export function NumberText(props: NumberTextProps) {
-    // Destruct
-    const { locale, options = {}, value, ...rest } = props;
+  // Destruct
+  const { locale, options = {}, value, ...rest } = props;
 
-    // Layout
-    return (
-        <Typography component="span" fontSize="inherit" {...rest}>
-            {value == null ? '' : NumberUtils.format(value, locale, options)}
-        </Typography>
-    );
+  // Layout
+  return (
+    <Typography component="span" fontSize="inherit" {...rest}>
+      {value == null ? "" : NumberUtils.format(value, locale, options)}
+    </Typography>
+  );
 }