@vertigis/react-ui 19.0.2 → 19.1.1

package/Autocomplete/HighlightOption.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 export declare const highlightOptionClasses: {
     highlight: string;
 };

package/Chip/Chip.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { ChipProps as MuiChipProps } from "@mui/material/Chip";
 export * from "@mui/material/Chip";
 export interface ChipProps extends MuiChipProps {

package/Chip/Chip.js

@@ -7,7 +7,7 @@ import Clear from "../icons/Clear.js";
 export * from "@mui/material/Chip";
 const Chip = forwardRef(({ deleteIcon, label, deleteLabel = "", onClick, onDelete, ...props }, ref) => {
     // Replace the close button as it is not WCAG compliant by default.
-    const deleteChipButton = useMemo(() => (_jsx(IconButton, { size: "small", "aria-label": deleteLabel, title: deleteLabel, children: deleteIcon ? deleteIcon : _jsx(Clear, { fontSize: "small" }) })), [deleteLabel, deleteIcon]);
+    const deleteChipButton = useMemo(() => (_jsx(IconButton, { size: "small", "aria-label": deleteLabel, title: deleteLabel, children: deleteIcon ?? _jsx(Clear, { fontSize: "small" }) })), [deleteLabel, deleteIcon]);
     const [title, setTitle] = useState();
     useEffect(() => {
         setTitle(typeof label === "string" ? label : undefined);

package/ColorInput/ColorInput.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { BoxProps } from "@mui/material/Box";
 import type { SketchPickerStylesProps } from "react-color/lib/components/sketch/Sketch";
 import type { ButtonProps } from "../Button/index.js";

package/CopyableText/CopyableText.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { InputProps as InputPropsType } from "../Input/index.js";
 import type { StackProps } from "../Stack/index.js";
 export declare const copyableTextClasses: {

package/DatePicker/DatePicker.d.ts

@@ -4,5 +4,5 @@ export type { PickerValidDate };
 export * from "@mui/x-date-pickers/DatePicker";
 export interface DatePickerProps<TDate extends PickerValidDate> extends MuiDatePickerProps<TDate> {
 }
-declare const _default: <TDate extends unknown>(props: DatePickerProps<TDate>) => JSX.Element;
+declare const _default: <TDate extends PickerValidDate>(props: DatePickerProps<TDate>) => JSX.Element;
 export default _default;

package/DateRangePicker/DateRangePicker.d.ts

@@ -5,5 +5,5 @@ export * from "@mui/x-date-pickers-pro/DateRangePicker";
 export interface DateRangePickerProps<TDate extends PickerValidDate> extends MuiDateRangePickerProps<TDate> {
     dateSeparator?: string;
 }
-declare const _default: <TDate extends unknown>(props: DateRangePickerProps<TDate>) => JSX.Element;
+declare const _default: <TDate extends PickerValidDate>(props: DateRangePickerProps<TDate>) => JSX.Element;
 export default _default;

package/DateTimePicker/DateTimePicker.d.ts

@@ -4,5 +4,5 @@ export type { PickerValidDate };
 export * from "@mui/x-date-pickers/DateTimePicker";
 export interface DateTimePickerProps<TDate extends PickerValidDate, TEnableAccessibleFieldDOMStructure extends boolean = false> extends MuiDateTimePickerProps<TDate, TEnableAccessibleFieldDOMStructure> {
 }
-declare const _default: <TDate extends unknown, TEnableAccessibleFieldDOMStructure extends boolean = false>(props: MuiDateTimePickerProps<TDate, TEnableAccessibleFieldDOMStructure>) => JSX.Element;
+declare const _default: <TDate extends PickerValidDate, TEnableAccessibleFieldDOMStructure extends boolean = false>(props: MuiDateTimePickerProps<TDate, TEnableAccessibleFieldDOMStructure>) => JSX.Element;
 export default _default;

package/DateTimeRangePicker/DateTimeRangePicker.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { DateTimeRangePickerProps as MuiDateTimeRangePickerProps, PickerValidDate } from "@mui/x-date-pickers-pro";
 export interface DateTimeRangePickerProps extends MuiDateTimeRangePickerProps<PickerValidDate> {
     dateSeparator?: string;

package/FormLabel/FormLabel.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { FormLabelClasses as MUIFormLabelClasses, FormLabelProps as MUIFormLabelProps } from "@mui/material/FormLabel";
 import type { OverridableComponent } from "@mui/material/OverridableComponent";
 declare const gcxFormLabelClasses: {

package/FormLabelColorField/FormLabelColorField.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { TextFieldProps } from "@mui/material/TextField";
 import { type ColorInputProps } from "../ColorInput/ColorInput.js";
 import type { FormControlProps } from "../FormControl/index.js";

package/FormLabelTextField/FormLabelTextField.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { TextFieldProps } from "@mui/material/TextField";
 import type { FormControlProps } from "../FormControl/index.js";
 export type FormLabelTextFieldProps = Omit<TextFieldProps, "variant"> & Pick<FormControlProps, "inlineHelpContent" | "inlineHelpUrl"> & {

package/InlineHelp/InlineHelp.js

@@ -42,7 +42,7 @@ const InlineHelp = forwardRef(({ children, classes: classesProp, className, icon
     const handleIconPopoverClose = () => setIconBtnEl(undefined);
     return (_jsxs(Box, { className: clsx(classes.root, className), ref: ref, ...other, children: [_jsx(IconButton, { onClick: handleIconPopoverOpen, title: title, size: "small", "data-test": `${PREFIX}-button`, className: clsx(classes.button, {
                     [classes.errorIcon]: formControl?.error,
-                }), children: icon ? icon : _jsx(HelpIcon, { fontSize: "small" }) }), _jsxs(StyledPopover, { anchorEl: iconBtnEl, open: !!iconBtnEl, classes: { paper: classes.paper }, anchorOrigin: theme.direction === "rtl" ? RTL_ORIGIN : LTR_ORIGIN, transformOrigin: theme.direction === "rtl" ? RTL_ORIGIN : LTR_ORIGIN, onClose: () => {
+                }), children: icon ?? _jsx(HelpIcon, { fontSize: "small" }) }), _jsxs(StyledPopover, { anchorEl: iconBtnEl, open: !!iconBtnEl, classes: { paper: classes.paper }, anchorOrigin: theme.direction === "rtl" ? RTL_ORIGIN : LTR_ORIGIN, transformOrigin: theme.direction === "rtl" ? RTL_ORIGIN : LTR_ORIGIN, onClose: () => {
                     handleIconPopoverClose();
                     onClose?.();
                 }, children: [_jsx(Typography, { children: children }), url && (_jsx(Link, { align: "right", display: "block", href: url.href, onClick: () => url.onClick?.(url.href), target: "_blank", variant: "body2", children: url.label }))] })] }));

package/NumberFormatContext/NumberFormatContext.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 export interface NumberFormatContextProps {
     /**
      * Returns a stringified number that may include additional/alternative

package/NumberInput/NumberInput.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { type InputProps } from "@mui/material/Input";
 export declare const DEFAULT_DECIMAL_PLACES = 16;
 export type ErrorType = "NaN" | "out-of-range" | "max-decimals" | "unknown";

package/Switch/Switch.d.ts

@@ -1,3 +1,4 @@
+import type { StyledComponent } from "@emotion/styled";
 import type { ButtonBaseClasses } from "@mui/material/ButtonBase";
 import type { IconButtonClasses } from "@mui/material/IconButton";
 import type { SwitchProps as MUISwitchProps, SwitchClasses as MUISwitchClasses } from "@mui/material/Switch";
@@ -8,5 +9,5 @@ export type SwitchClassKey = keyof SwitchClasses;
 export type SwitchProps = Omit<MUISwitchProps, "classes"> & {
     classes?: Partial<SwitchClasses>;
 };
-declare const Switch: import("@emotion/styled").StyledComponent<MUISwitchProps & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+declare const Switch: StyledComponent<SwitchProps>;
 export default Switch;

package/SymbolInput/SimpleFillSymbolInput.js

@@ -62,7 +62,9 @@ const SimpleFillSymbolInput = props => {
                     },
                     style: newState.fillStyle ?? fillStyle,
                 };
-            default:
+            case "esriSLS":
+            case "esriSMS":
+            case "esriTS":
                 return { type };
         }
     };

package/SymbolInput/SimpleLineSymbolInput.js

@@ -53,7 +53,9 @@ const SimpleLineSymbolInput = props => {
                     width: newState.lineWidth ?? lineWidth,
                     style: newState.lineStyle ?? lineStyle,
                 };
-            default:
+            case "esriSFS":
+            case "esriSMS":
+            case "esriTS":
                 return { type };
         }
     };

package/SymbolInput/SimpleMarkerSymbolInput.js

@@ -86,7 +86,9 @@ const SimpleMarkerSymbolInput = props => {
                     xoffset: newState.xOffset ?? xOffset,
                     yoffset: newState.yOffset ?? yOffset,
                 };
-            default:
+            case "esriSFS":
+            case "esriSLS":
+            case "esriTS":
                 return { type };
         }
     };

package/SymbolInput/utilities.js

@@ -74,7 +74,7 @@ export const getLineStyle = (symbol) => {
             return symbol.outline?.style;
         case "esriSLS":
             return symbol.style;
-        default:
+        case "esriTS":
             return undefined;
     }
 };
@@ -82,7 +82,9 @@ export const getFillStyle = (symbol) => {
     switch (symbol?.type) {
         case "esriSFS":
             return symbol.style;
-        default:
+        case "esriSLS":
+        case "esriSMS":
+        case "esriTS":
             return undefined;
     }
 };
@@ -93,7 +95,7 @@ export const getLineColor = (symbol) => {
             return symbol.outline?.color;
         case "esriSLS":
             return symbol.color;
-        default:
+        case "esriTS":
             return undefined;
     }
 };
@@ -102,7 +104,8 @@ export const getFillColor = (symbol) => {
         case "esriSMS":
         case "esriSFS":
             return symbol.color;
-        default:
+        case "esriSLS":
+        case "esriTS":
             return undefined;
     }
 };
@@ -113,7 +116,7 @@ export const getLineWidth = (symbol) => {
             return symbol.outline?.width;
         case "esriSLS":
             return symbol.width;
-        default:
+        case "esriTS":
             return undefined;
     }
 };

package/Tabs/Tabs.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { TabsProps as MUITabsProps, TabsClasses as MUITabsClasses } from "@mui/material/Tabs";
 export * from "@mui/material/Tabs";
 declare const gcxTabsClasses: {

package/TimePicker/TimePicker.d.ts

@@ -4,5 +4,5 @@ export type { PickerValidDate };
 export * from "@mui/x-date-pickers/TimePicker";
 export interface TimePickerProps<TDate extends PickerValidDate, TEnableAccessibleFieldDOMStructure extends boolean = false> extends MuiTimePickerProps<TDate, TEnableAccessibleFieldDOMStructure> {
 }
-declare const _default: <TDate extends unknown, TEnableAccessibleFieldDOMStructure extends boolean = false>(props: TimePickerProps<TDate, TEnableAccessibleFieldDOMStructure>) => JSX.Element;
+declare const _default: <TDate extends PickerValidDate, TEnableAccessibleFieldDOMStructure extends boolean = false>(props: TimePickerProps<TDate, TEnableAccessibleFieldDOMStructure>) => JSX.Element;
 export default _default;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vertigis/react-ui",
-  "version": "19.0.2",
+  "version": "19.1.1",
   "description": "Utilities and React components used in VertiGIS applications.",
   "keywords": [
     "vertigis",
@@ -12,6 +12,7 @@
     "**/*.js",
     "**/*.d.ts"
   ],
+  "type": "module",
   "sideEffects": false,
   "dependencies": {
     "@mui/icons-material": "^6.4.0",
@@ -34,15 +35,14 @@
     "@types/autosuggest-highlight": "^3.2.3",
     "@types/color": "^3.0.6",
     "@types/lodash.escape": "^4.0.9",
+    "@types/react": "^18.3.12",
     "@types/react-color": "^3.0.12",
     "@vertigis/icons": "5.4.0"
   },
   "peerDependencies": {
-    "@emotion/react": "*",
-    "@emotion/styled": "*",
     "@esri/arcgis-html-sanitizer": "^4.0.3",
-    "react": ">= 18 < 19",
-    "react-dom": ">= 18 < 19"
-  },
-  "type": "module"
+    "@mui/system": "*",
+    "react": ">= 18 < 20",
+    "react-dom": ">= 18 < 20"
+  }
 }

package/styles/palette.d.ts

@@ -37,7 +37,7 @@ export declare const defaultPalette: {
         A200: string;
         A400: string;
         A700: string;
-        dark?: string | undefined;
+        dark?: string;
     };
     warning: {
         main: string;