xmlui 0.10.10 → 0.10.12

package/dist/scripts/src/components/Charts/RadarChart/RadarChartNative.js

@@ -0,0 +1,125 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.defaultProps = void 0;
+exports.RadarChart = RadarChart;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const recharts_1 = require("recharts");
+const react_1 = require("react");
+const react_2 = require("react");
+const ChartProvider_1 = __importStar(require("../utils/ChartProvider"));
+const TooltipContent_1 = require("../Tooltip/TooltipContent");
+const ThemeContext_1 = require("../../../components-core/theming/ThemeContext");
+exports.defaultProps = {
+    hideGrid: false,
+    hideAngleAxis: false,
+    hideRadiusAxis: false,
+    hideTooltip: false,
+    showLegend: false,
+    filled: true,
+    strokeWidth: 2,
+    fillOpacity: 0.3,
+};
+function RadarChart({ data = [], nameKey, dataKeys = [], hideGrid = exports.defaultProps.hideGrid, hideAngleAxis = exports.defaultProps.hideAngleAxis, hideRadiusAxis = exports.defaultProps.hideRadiusAxis, hideTooltip = exports.defaultProps.hideTooltip, className, children, showLegend = exports.defaultProps.showLegend, filled = exports.defaultProps.filled, strokeWidth = exports.defaultProps.strokeWidth, fillOpacity = exports.defaultProps.fillOpacity, tooltipRenderer, }) {
+    // Validate and normalize data
+    const validData = Array.isArray(data) ? data : [];
+    const { getThemeVar } = (0, ThemeContext_1.useTheme)();
+    const colorValues = (0, react_2.useMemo)(() => {
+        return [
+            getThemeVar("color-primary-500"),
+            getThemeVar("color-primary-300"),
+            getThemeVar("color-success-500"),
+            getThemeVar("color-success-300"),
+            getThemeVar("color-warn-500"),
+            getThemeVar("color-warn-300"),
+            getThemeVar("color-danger-500"),
+            getThemeVar("color-danger-300"),
+            getThemeVar("color-info-500"),
+            getThemeVar("color-info-300"),
+            getThemeVar("color-secondary-500"),
+            getThemeVar("color-secondary-300"),
+        ];
+    }, [getThemeVar]);
+    const config = (0, react_2.useMemo)(() => {
+        return Object.assign({}, ...dataKeys.map((key, index) => {
+            return {
+                [key]: {
+                    label: key,
+                    color: colorValues[index % colorValues.length],
+                },
+            };
+        }));
+    }, [colorValues, dataKeys]);
+    const chartContextValue = (0, ChartProvider_1.useChartContextValue)({ dataKeys, nameKey });
+    // Process data and create radar elements based on dataKeys
+    const radarElements = (0, react_2.useMemo)(() => {
+        return dataKeys.map((key, index) => {
+            const color = colorValues[index % colorValues.length];
+            return ((0, jsx_runtime_1.jsx)(recharts_1.Radar, { name: key, dataKey: key, stroke: color, fill: filled ? color : "none", fillOpacity: filled ? fillOpacity : 0, strokeWidth: strokeWidth }, key));
+        });
+    }, [dataKeys, colorValues, filled, fillOpacity, strokeWidth]);
+    // Handle responsive behavior
+    const [containerSize, setContainerSize] = (0, react_1.useState)({ width: 0, height: 0 });
+    const containerRef = (0, react_1.useRef)(null);
+    (0, react_1.useEffect)(() => {
+        const updateSize = () => {
+            if (containerRef.current) {
+                const { width, height } = containerRef.current.getBoundingClientRect();
+                setContainerSize({ width, height });
+            }
+        };
+        updateSize();
+        window.addEventListener('resize', updateSize);
+        return () => window.removeEventListener('resize', updateSize);
+    }, []);
+    // Determine if we're in mini mode (very small container)
+    const isMiniMode = containerSize.height < 150;
+    const safeTooltipRenderer = (0, react_1.useCallback)((props) => {
+        if (!tooltipRenderer)
+            return (0, jsx_runtime_1.jsx)(TooltipContent_1.TooltipContent, Object.assign({}, props));
+        const payloadObject = {};
+        if (props.payload && props.payload.length > 0 && props.payload[0].payload) {
+            Object.assign(payloadObject, props.payload[0].payload);
+        }
+        // Extract tooltip data from Recharts props
+        const tooltipData = {
+            label: props.label,
+            payload: payloadObject,
+            active: props.active,
+        };
+        return tooltipRenderer(tooltipData);
+    }, [tooltipRenderer]);
+    return ((0, jsx_runtime_1.jsx)(ChartProvider_1.default, { value: chartContextValue, children: (0, jsx_runtime_1.jsx)("div", { ref: containerRef, className: className, children: (0, jsx_runtime_1.jsx)(recharts_1.ResponsiveContainer, { width: "100%", height: "100%", children: (0, jsx_runtime_1.jsxs)(recharts_1.RadarChart, { data: validData, children: [!hideGrid && (0, jsx_runtime_1.jsx)(recharts_1.PolarGrid, {}), !hideAngleAxis && ((0, jsx_runtime_1.jsx)(recharts_1.PolarAngleAxis, { dataKey: nameKey, hide: isMiniMode })), !hideRadiusAxis && ((0, jsx_runtime_1.jsx)(recharts_1.PolarRadiusAxis, { hide: isMiniMode })), !isMiniMode && !hideTooltip && ((0, jsx_runtime_1.jsx)(recharts_1.Tooltip, { content: safeTooltipRenderer })), showLegend && !isMiniMode && (0, jsx_runtime_1.jsx)(recharts_1.Legend, {}), radarElements, children] }) }) }) }));
+}

package/dist/scripts/src/components/Checkbox/Checkbox.js

@@ -44,6 +44,7 @@ exports.CheckboxMd = (0, metadata_helpers_1.createMetadata)({
     },
     childrenAsTemplate: "inputTemplate",
     events: {
+        click: (0, metadata_helpers_1.dClick)(COMP),
         gotFocus: (0, metadata_helpers_1.dGotFocus)(COMP),
         lostFocus: (0, metadata_helpers_1.dLostFocus)(COMP),
         didChange: (0, metadata_helpers_1.dDidChange)(COMP),
@@ -80,5 +81,5 @@ exports.checkboxComponentRenderer = (0, renderers_1.createComponentRenderer)(COM
     const inputTemplate = node.props.inputTemplate;
     return ((0, jsx_runtime_1.jsx)(Toggle_1.Toggle, { inputRenderer: inputTemplate
             ? (contextVars) => ((0, jsx_runtime_1.jsx)(container_helpers_1.MemoizedItem, { contextVars: contextVars, node: inputTemplate, renderChild: renderChild, layoutContext: layoutContext }))
-            : undefined, enabled: extractValue.asOptionalBoolean(node.props.enabled), className: className, initialValue: extractValue.asOptionalBoolean(node.props.initialValue, exports.defaultProps.initialValue), value: state === null || state === void 0 ? void 0 : state.value, readOnly: extractValue.asOptionalBoolean(node.props.readOnly), validationStatus: extractValue(node.props.validationStatus), updateState: updateState, onDidChange: lookupEventHandler("didChange"), onFocus: lookupEventHandler("gotFocus"), onBlur: lookupEventHandler("lostFocus"), label: extractValue(node.props.label), labelPosition: extractValue(node.props.labelPosition), labelWidth: extractValue(node.props.labelWidth), labelBreak: extractValue.asOptionalBoolean(node.props.labelBreak), required: extractValue.asOptionalBoolean(node.props.required), indeterminate: extractValue.asOptionalBoolean(node.props.indeterminate), registerComponentApi: registerComponentApi, autoFocus: extractValue.asOptionalBoolean(node.props.autoFocus) }));
+            : undefined, enabled: extractValue.asOptionalBoolean(node.props.enabled), className: className, initialValue: extractValue.asOptionalBoolean(node.props.initialValue, exports.defaultProps.initialValue), value: state === null || state === void 0 ? void 0 : state.value, readOnly: extractValue.asOptionalBoolean(node.props.readOnly), validationStatus: extractValue(node.props.validationStatus), updateState: updateState, onClick: lookupEventHandler("click"), onDidChange: lookupEventHandler("didChange"), onFocus: lookupEventHandler("gotFocus"), onBlur: lookupEventHandler("lostFocus"), label: extractValue(node.props.label), labelPosition: extractValue(node.props.labelPosition), labelWidth: extractValue(node.props.labelWidth), labelBreak: extractValue.asOptionalBoolean(node.props.labelBreak), required: extractValue.asOptionalBoolean(node.props.required), indeterminate: extractValue.asOptionalBoolean(node.props.indeterminate), registerComponentApi: registerComponentApi, autoFocus: extractValue.asOptionalBoolean(node.props.autoFocus) }));
 });

package/dist/scripts/src/components/ComponentProvider.js

@@ -45,7 +45,6 @@ const RealTimeAdapter_1 = require("./RealTimeAdapter/RealTimeAdapter");
 const Form_1 = require("./Form/Form");
 const EmojiSelector_1 = require("./EmojiSelector/EmojiSelector");
 const NumberBox_1 = require("./NumberBox/NumberBox");
-const NumberBox2_1 = require("./NumberBox/NumberBox2");
 const HoverCard_1 = require("./HoverCard/HoverCard");
 const App_1 = require("./App/App");
 const NavPanel_1 = require("./NavPanel/NavPanel");
@@ -108,12 +107,14 @@ const InspectButton_1 = require("./InspectButton/InspectButton");
 const NestedApp_1 = require("./NestedApp/NestedApp");
 const AppWithCodeView_1 = require("./NestedApp/AppWithCodeView");
 const CodeBlock_1 = require("./CodeBlock/CodeBlock");
+const AreaChart_1 = require("./Charts/AreaChart/AreaChart");
 const BarChart_1 = require("./Charts/BarChart/BarChart");
 const DonutChart_1 = require("./Charts/DonutChart/DonutChart");
 const LabelList_1 = require("./Charts/LabelList/LabelList");
 const Legend_1 = require("./Charts/Legend/Legend");
 const LineChart_1 = require("./Charts/LineChart/LineChart");
 const PieChart_1 = require("./Charts/PieChart/PieChart");
+const RadarChart_1 = require("./Charts/RadarChart/RadarChart");
 const Pagination_1 = require("./Pagination/Pagination");
 const Tooltip_1 = require("./Tooltip/Tooltip");
 /**
@@ -377,12 +378,14 @@ class ComponentRegistry {
             this.registerCoreComponent(Pagination_1.paginationComponentRenderer);
         }
         if (process.env.VITE_USED_COMPONENTS_Charts !== "false") {
+            this.registerCoreComponent(AreaChart_1.areaChartComponentRenderer);
             this.registerCoreComponent(BarChart_1.barChartComponentRenderer);
             this.registerCoreComponent(DonutChart_1.donutChartComponentRenderer);
             this.registerCoreComponent(LabelList_1.labelListComponentRenderer);
             this.registerCoreComponent(Legend_1.legendComponentRenderer);
             this.registerCoreComponent(LineChart_1.lineChartComponentRenderer);
             this.registerCoreComponent(PieChart_1.pieChartComponentRenderer);
+            this.registerCoreComponent(RadarChart_1.radarChartComponentRenderer);
         }
         if (process.env.VITE_USED_COMPONENTS_EmojiSelector !== "false") {
             this.registerCoreComponent(EmojiSelector_1.emojiSelectorRenderer);
@@ -407,7 +410,6 @@ class ComponentRegistry {
             this.registerCoreComponent(TextBox_1.textBoxComponentRenderer);
             this.registerCoreComponent(TextBox_1.passwordInputComponentRenderer);
             this.registerCoreComponent(NumberBox_1.numberBoxComponentRenderer);
-            this.registerCoreComponent(NumberBox2_1.numberBox2ComponentRenderer);
             this.registerCoreComponent(HoverCard_1.hoverCardComponentRenderer);
             this.registerCoreComponent(RadioGroup_1.radioGroupRenderer);
             this.registerCoreComponent(FileInput_1.fileInputRenderer);

package/dist/scripts/src/components/DataSource/DataSource.js

@@ -0,0 +1,124 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DataSourceMd = void 0;
+const abstractions_1 = require("../abstractions");
+const metadata_helpers_1 = require("../metadata-helpers");
+// NOTE: Original component this is based on is the `Loader` component
+const COMP = "DataSource";
+exports.DataSourceMd = (0, metadata_helpers_1.createMetadata)({
+    status: "stable",
+    description: "`DataSource` fetches and caches data from API endpoints, versus " +
+        "[`APICall`](/components/APICall) which creates, updates or deletes data.",
+    props: {
+        method: {
+            description: `Set the HTTP method.`,
+            defaultValue: "get",
+            availableValues: abstractions_1.httpMethodNames,
+        },
+        id: {
+            description: `Set the ID used by other components to access the retrieved data in the \`value\`` +
+                "property of a \`DataSource\`, or status info in the \`loaded\` and \`error\` properties." +
+                "When no `id` is set, the component cannot be used programmatically.",
+            isRequired: true,
+            valueType: "string",
+        },
+        url: {
+            description: `Set the URL.`,
+            isRequired: true,
+            valueType: "string",
+        },
+        body: {
+            description: `Set the optional request body. The object you pass is serialized as a JSON string.`,
+            valueType: "any",
+        },
+        rawBody: {
+            description: `Set the request body with no serialization. Use it to send a payload  ` +
+                `that has already been serialized to a JSON string.`,
+            valueType: "string",
+        },
+        queryParams: {
+            description: `Append optional key-value pairs to the URL.`,
+            valueType: "any",
+        },
+        headers: {
+            description: `Set request headers. Pass an object whose keys are header names and values are header values.`,
+            valueType: "any",
+        },
+        pollIntervalInSeconds: {
+            description: "Set the interval for periodic data fetching. If the data changes on refresh, " +
+                "XMLUI will re-render components that refer directly or indirectly to the \`DataSource\`. " +
+                "If not set or set to zero, the component does not poll for data.",
+            valueType: "number",
+        },
+        inProgressNotificationMessage: {
+            description: "Set the message to display when the data fetch is in progress. " +
+                "If the property value is not set, no progress message is displayed.",
+            valueType: "string",
+        },
+        completedNotificationMessage: {
+            description: "Set the message to display when the data fetch completes." +
+                "If the property value is not set, no completion message is displayed.",
+            valueType: "string",
+        },
+        errorNotificationMessage: {
+            description: "Set the message to display when the there is an error. " +
+                "You can use the `$error` context value in an expression to " +
+                "refer to the original error message.",
+            valueType: "string",
+        },
+        resultSelector: {
+            description: "Set an optional object key to extract a subset of the response data. If this " +
+                "value is not set, the entire response body is considered the result.",
+            valueType: "string",
+        },
+        transformResult: {
+            description: "Set an optional function to perform a final transformation of the " +
+                "response data. If this value is not set, the result is not transformed.",
+        },
+        prevPageSelector: {
+            description: `When using \`${COMP}\` with paging, the response may contain information about the ` +
+                `previous and next page. This property defines the selector that extracts the ` +
+                `previous page information from the response deserialized to an object.`,
+        },
+        nextPageSelector: {
+            description: `When using \`${COMP}\` with paging, the response may contain information about ` +
+                `the previous and next page. This property defines the selector that extracts ` +
+                `the next page information from the response deserialized to an object.`,
+        },
+        structuralSharing: {
+            description: "This property allows structural sharing. When turned on, `DataSource` will keep " +
+                "the original reference if nothing has changed in the data. If a subset has " +
+                "changed, `DataSource` will keep the unchanged parts and only replace the changed " +
+                "parts. If you do not need this behavior, set this property to `false`.",
+            defaultValue: "true",
+        },
+    },
+    events: {
+        loaded: (0, metadata_helpers_1.d)("The component triggers this event when the fetch operation has been completed " +
+            "and the data is loaded. The event has two arguments. The first is the data " +
+            "loaded; the second indicates if the event is a result of a refetch."),
+        error: (0, metadata_helpers_1.d)(`This event fires when a request results in an error.`),
+    },
+    apis: {
+        value: {
+            description: `This property retrieves the data queried from the source after optional transformations.`,
+            signature: "get value(): any",
+        },
+        inProgress: {
+            description: "This property indicates if the data is being fetched.",
+            signature: "get inProgress(): boolean",
+        },
+        isRefetching: {
+            description: "This property indicates if the data is being re-fetched.",
+            signature: "get isRefetching(): boolean",
+        },
+        loaded: {
+            description: "This property indicates if the data has been loaded.",
+            signature: "get loaded(): boolean",
+        },
+        refetch: {
+            description: "This method requests the re-fetch of the data.",
+            signature: "refetch(): void",
+        },
+    },
+});

package/dist/scripts/src/components/DropdownMenu/DropdownMenu.js

@@ -130,7 +130,7 @@ exports.MenuItemMd = (0, metadata_helpers_1.createMetadata)({
         [`color-${MICOMP}`]: "$textColor-primary",
         [`color-${MICOMP}--disabled`]: "$textColor--disabled",
         [`fontFamily-${MICOMP}`]: "$fontFamily",
-        [`fontSize-${MICOMP}`]: "$fontSize-small",
+        [`fontSize-${MICOMP}`]: "$fontSize-sm",
         [`paddingVertical-${MICOMP}`]: "$space-2",
         [`paddingHorizontal-${MICOMP}`]: "$space-3",
         [`backgroundColor-${MICOMP}--hover`]: "$backgroundColor-dropdown-item--hover",

package/dist/scripts/src/components/Footer/Footer.js

@@ -22,7 +22,7 @@ exports.FooterMd = (0, metadata_helpers_1.createMetadata)({
     defaultThemeVars: {
         [`backgroundColor-${COMP}`]: "$backgroundColor-AppHeader",
         [`verticalAlignment-${COMP}`]: "center",
-        [`fontSize-${COMP}`]: "$fontSize-small",
+        [`fontSize-${COMP}`]: "$fontSize-sm",
         [`textColor-${COMP}`]: "$textColor-secondary",
         [`maxWidth-content-${COMP}`]: "$maxWidth-content",
         [`borderTop-${COMP}`]: `1px solid $borderColor`,

package/dist/scripts/src/components/Footer/FooterNative.js

@@ -29,7 +29,7 @@ exports.Footer = (0, react_1.forwardRef)(function Footer(_a, forwardedRef) {
     var { children, style, className } = _a, rest = __rest(_a, ["children", "style", "className"]);
     const { layout } = (0, AppLayoutContext_1.useAppLayoutContext)() || {};
     const canRestrictContentWidth = layout !== "vertical-full-header";
-    return ((0, jsx_runtime_1.jsx)("div", Object.assign({}, rest, { className: Footer_module_scss_1.default.outerWrapper, ref: forwardedRef, style: style, children: (0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)(Footer_module_scss_1.default.wrapper, className, {
+    return ((0, jsx_runtime_1.jsx)("div", Object.assign({}, rest, { className: Footer_module_scss_1.default.outerWrapper, ref: forwardedRef, style: style, role: "contentinfo", children: (0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)(Footer_module_scss_1.default.wrapper, className, {
                 [Footer_module_scss_1.default.full]: !canRestrictContentWidth,
             }), children: children }) })));
 });

package/dist/scripts/src/components/Form/FormNative.js

@@ -45,6 +45,8 @@ const formActions_2 = require("../Form/formActions");
 const FormContext_1 = require("./FormContext");
 const lodash_es_1 = require("lodash-es");
 const classnames_1 = __importDefault(require("classnames"));
+const PART_CANCEL_BUTTON = "cancelButton";
+const PART_SUBMIT_BUTTON = "submitButton";
 const getByPath = (obj, path) => {
     return (0, lodash_es_1.get)(obj, path);
 };
@@ -248,7 +250,7 @@ const Form = (0, react_2.forwardRef)(function (_a, ref) {
         try {
             const filteredSubject = cleanUpSubject(formState.subject);
             const result = yield (onSubmit === null || onSubmit === void 0 ? void 0 : onSubmit(filteredSubject, {
-                passAsDefaultBody: true
+                passAsDefaultBody: true,
             }));
             dispatch((0, formActions_1.formSubmitted)());
             yield (onSuccess === null || onSuccess === void 0 ? void 0 : onSuccess(result));
@@ -321,8 +323,8 @@ const Form = (0, react_2.forwardRef)(function (_a, ref) {
             });
         });
     });
-    const cancelButton = cancelLabel === "" ? null : ((0, jsx_runtime_1.jsx)(ButtonNative_1.Button, { type: "button", themeColor: "secondary", variant: "ghost", onClick: doCancel, children: cancelLabel }, "cancel"));
-    const submitButton = (0, react_2.useMemo)(() => ((0, jsx_runtime_1.jsx)(ButtonNative_1.Button, { type: "submit", disabled: !isEnabled, children: formState.submitInProgress ? saveInProgressLabel : saveLabel }, "submit")), [isEnabled, formState.submitInProgress, saveInProgressLabel, saveLabel]);
+    const cancelButton = cancelLabel === "" ? null : ((0, jsx_runtime_1.jsx)(ButtonNative_1.Button, { "data-part-id": PART_CANCEL_BUTTON, type: "button", themeColor: "secondary", variant: "ghost", onClick: doCancel, children: cancelLabel }, "cancel"));
+    const submitButton = (0, react_2.useMemo)(() => ((0, jsx_runtime_1.jsx)(ButtonNative_1.Button, { "data-part-id": PART_SUBMIT_BUTTON, type: "submit", disabled: !isEnabled, children: formState.submitInProgress ? saveInProgressLabel : saveLabel }, "submit")), [isEnabled, formState.submitInProgress, saveInProgressLabel, saveLabel]);
     (0, react_2.useEffect)(() => {
         registerComponentApi === null || registerComponentApi === void 0 ? void 0 : registerComponentApi({
             reset: doReset,

package/dist/scripts/src/components/FormItem/FormItem.js

@@ -193,7 +193,7 @@ exports.FormItemMd = (0, metadata_helpers_1.createMetadata)({
     themeVars: (0, themeVars_1.parseScssVar)(FormItem_module_scss_1.default.themeVars),
     defaultThemeVars: {
         "textColor-FormItemLabel": "$textColor-primary",
-        "fontSize-FormItemLabel": "$fontSize-small",
+        "fontSize-FormItemLabel": "$fontSize-sm",
         "fontWeight-FormItemLabel": "$fontWeight-medium",
         "fontStyle-FormItemLabel": "normal",
         "textTransform-FormItemLabel": "none",

package/dist/scripts/src/components/FormItem/FormItemNative.js

@@ -35,7 +35,6 @@ const Validations_1 = require("./Validations");
 const SliderNative_1 = require("../Slider/SliderNative");
 const ColorPickerNative_1 = require("../ColorPicker/ColorPickerNative");
 const HelperText_1 = require("./HelperText");
-const NumberBox2Native_1 = require("../NumberBox/NumberBox2Native");
 const ItemsNative_1 = require("../Items/ItemsNative");
 const constants_1 = require("../../components-core/constants");
 const hooks_1 = require("../../components-core/utils/hooks");
@@ -168,14 +167,6 @@ exports.FormItem = (0, react_1.memo)(function FormItem(_a) {
             formControl = ((0, jsx_runtime_1.jsx)(NumberBoxNative_1.NumberBox, Object.assign({}, rest, { initialValue: initialValue, value: value, updateState: onStateChange, registerComponentApi: registerComponentApi, enabled: isEnabled, integersOnly: type === "integer", validationStatus: validationStatus, min: validations.minValue, max: validations.maxValue, maxLength: maxTextLength !== null && maxTextLength !== void 0 ? maxTextLength : validations === null || validations === void 0 ? void 0 : validations.maxLength, gap: gap })));
             break;
         }
-        // NOTE: This is a prototype for the new number field
-        // works as good as the regular number field but untested
-        // in production.
-        case "integer2":
-        case "number2": {
-            formControl = ((0, jsx_runtime_1.jsx)(NumberBox2Native_1.NumberBox2, Object.assign({}, rest, { initialValue: initialValue, value: value, updateState: onStateChange, registerComponentApi: registerComponentApi, enabled: isEnabled, min: validations.minValue, max: validations.maxValue, integersOnly: type === "integer2" })));
-            break;
-        }
         case "switch":
         case "checkbox": {
             formControl = ((0, jsx_runtime_1.jsx)(Toggle_1.Toggle, Object.assign({}, rest, { value: value, updateState: onStateChange, 

package/dist/scripts/src/components/FormItem/ItemWithLabel.js

@@ -28,9 +28,9 @@ exports.defaultProps = {
 const numberRegex = /^[0-9]+$/;
 exports.ItemWithLabel = (0, react_1.forwardRef)(function ItemWithLabel(_a, ref) {
     var { id, labelPosition = "top", style = {}, className, label, labelBreak = exports.defaultProps.labelBreak, labelWidth, enabled = true, required = false, children, validationInProgress = false, shrinkToLabel = false, onFocus, onBlur, labelStyle, validationResult, isInputTemplateUsed = false } = _a, rest = __rest(_a, ["id", "labelPosition", "style", "className", "label", "labelBreak", "labelWidth", "enabled", "required", "children", "validationInProgress", "shrinkToLabel", "onFocus", "onBlur", "labelStyle", "validationResult", "isInputTemplateUsed"]);
-    // --- HACK: the "rest" may contain a "layoutContext" property with undefined value, and it
-    // --- would issue a warning in React.
-    if (rest.layoutContext === undefined) {
+    // --- HACK: the "rest" may contain a "layoutContext" property that React doesn't recognize
+    // --- as a valid DOM attribute, which would issue a warning in React.
+    if (rest.layoutContext !== undefined) {
         delete rest.layoutContext;
     }
     // --- END HACK