xmlui 0.9.50 → 0.9.52

package/dist/scripts/src/components/RadioGroup/RadioGroupNative.js

@@ -36,7 +36,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.RadioGroupOption = exports.RadioGroup = void 0;
+exports.RadioGroupOption = exports.RadioGroup = exports.defaultProps = void 0;
 exports.useRadioGroupValue = useRadioGroupValue;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = __importStar(require("react"));
@@ -47,10 +47,17 @@ const constants_1 = require("../../components-core/constants");
 const misc_1 = require("../../components-core/utils/misc");
 const ItemWithLabel_1 = require("../FormItem/ItemWithLabel");
 const OptionTypeProvider_1 = __importDefault(require("../Option/OptionTypeProvider"));
+exports.defaultProps = {
+    value: "",
+    initialValue: "",
+    enabled: true,
+    validationStatus: "none",
+    required: false,
+};
 const RadioGroupValidationStatusContext = (0, react_1.createContext)({
     status: "none",
 });
-exports.RadioGroup = (0, react_1.forwardRef)(function RadioGroup({ id, value = "", initialValue = "", enabled = true, validationStatus = "none", label, labelPosition, labelWidth, labelBreak, required = false, updateState = constants_1.noop, onDidChange = constants_1.noop, onFocus = constants_1.noop, onBlur = constants_1.noop, children, registerComponentApi, style, }, forwardedRef) {
+exports.RadioGroup = (0, react_1.forwardRef)(function RadioGroup({ id, value = exports.defaultProps.value, initialValue = exports.defaultProps.initialValue, enabled = exports.defaultProps.enabled, validationStatus = exports.defaultProps.validationStatus, label, labelPosition, labelWidth, labelBreak, required = exports.defaultProps.required, updateState = constants_1.noop, onDidChange = constants_1.noop, onFocus = constants_1.noop, onBlur = constants_1.noop, children, registerComponentApi, style, }, forwardedRef) {
     const [focused, setFocused] = react_1.default.useState(false);
     // --- Initialize the related field with the input's initial value
     (0, react_1.useEffect)(() => {

package/dist/scripts/src/components/RadioGroup/RadioItem.js

@@ -10,8 +10,14 @@ exports.RadioItemMd = (0, ComponentDefs_1.createMetadata)({
     status: "experimental",
     description: `The \`${COMP}\` component is a radio button that is part of a group of radio buttons.`,
     props: {
-        checked: (0, ComponentDefs_1.d)("This property specifies whether the radio button is checked."),
-        value: (0, ComponentDefs_1.d)("This property specifies the value of the radio button."),
+        checked: {
+            description: "This property specifies whether the radio button is checked.",
+            defaultValue: RadioItemNative_1.defaultProps.checked,
+        },
+        value: {
+            description: "This property specifies the value of the radio button.",
+            defaultValue: RadioItemNative_1.defaultProps.value,
+        },
     },
 });
 exports.radioItemComponentRenderer = (0, renderers_1.createComponentRenderer)(COMP, exports.RadioItemMd, ({ node, extractValue }) => {

package/dist/scripts/src/components/RadioGroup/RadioItemNative.js

@@ -36,13 +36,17 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.RadioItem = void 0;
+exports.RadioItem = exports.defaultProps = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 const RadioGroup_module_scss_1 = __importDefault(require("./RadioGroup.module.scss"));
 const InnerRadioGroup = __importStar(require("@radix-ui/react-radio-group"));
 const classnames_1 = __importDefault(require("classnames"));
-const RadioItem = ({ checked, style, value }) => {
+exports.defaultProps = {
+    checked: false,
+    value: "",
+};
+const RadioItem = ({ checked = exports.defaultProps.checked, style, value = exports.defaultProps.value }) => {
     const id = (0, react_1.useId)();
     return ((0, jsx_runtime_1.jsx)("div", { className: RadioGroup_module_scss_1.default.radioOptionContainer, style: style, children: (0, jsx_runtime_1.jsx)(InnerRadioGroup.Item, { className: (0, classnames_1.default)(RadioGroup_module_scss_1.default.radioOption), id: id, value: value, checked: checked, children: (0, jsx_runtime_1.jsx)(InnerRadioGroup.Indicator, { className: (0, classnames_1.default)(RadioGroup_module_scss_1.default.indicator) }) }) }, id));
 };

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

@@ -10,7 +10,10 @@ exports.RealTimeAdapterMd = (0, ComponentDefs_1.createMetadata)({
     status: "experimental",
     description: `\`${COMP}\` is a non-visual component that listens to real-time events through long-polling.`,
     props: {
-        url: (0, ComponentDefs_1.d)(`This property specifies the URL to use for long-polling.`),
+        url: {
+            description: `This property specifies the URL to use for long-polling.`,
+            defaultValue: RealTimeAdapterNative_1.defaultProps.url,
+        },
     },
     events: {
         eventArrived: (0, ComponentDefs_1.d)(`This event is raised when data arrives from the backend using long-polling.`),

package/dist/scripts/src/components/RealTimeAdapter/RealTimeAdapterNative.js

@@ -12,11 +12,15 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.defaultProps = void 0;
 exports.RealTimeAdapter = RealTimeAdapter;
 const react_1 = require("react");
 const RestApiProxy_1 = __importDefault(require("../../components-core/RestApiProxy"));
 const misc_1 = require("../../components-core/utils/misc");
 const AppContext_1 = require("../../components-core/AppContext");
+exports.defaultProps = {
+    url: "",
+};
 class PollClient {
     constructor(url, appContext) {
         this.url = url;

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

@@ -1,18 +1,24 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.redirectRenderer = exports.RedirectMd = void 0;
+exports.redirectRenderer = exports.RedirectMd = exports.defaultProps = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("@remix-run/react");
 const ComponentDefs_1 = require("../../abstractions/ComponentDefs");
 const renderers_1 = require("../../components-core/renderers");
 const component_utils_1 = require("../component-utils");
 const COMP = "Redirect";
+exports.defaultProps = {
+    to: "",
+};
 exports.RedirectMd = (0, ComponentDefs_1.createMetadata)({
     description: `\`${COMP}\` is a component that immediately redirects the browser to the URL in its ` +
         `\`to\` property when it gets visible (its \`when\` property gets \`true\`). The ` +
         `redirection works only within the app.`,
     props: {
-        to: (0, ComponentDefs_1.d)(`This property defines the URL to which this component is about to redirect requests.`),
+        to: {
+            description: `This property defines the URL to which this component is about to redirect requests.`,
+            defaultValue: exports.defaultProps.to,
+        },
     },
 });
 exports.redirectRenderer = (0, renderers_1.createComponentRenderer)(COMP, exports.RedirectMd, ({ node, extractValue }) => {

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

@@ -18,28 +18,37 @@ exports.SelectMd = (0, ComponentDefs_1.createMetadata)({
     description: "Provides a dropdown with a list of options to choose from.",
     status: "experimental",
     props: {
-        placeholder: (0, metadata_helpers_1.dPlaceholder)(),
+        placeholder: Object.assign(Object.assign({}, (0, metadata_helpers_1.dPlaceholder)()), { defaultValue: SelectNative_1.defaultProps.placeholder }),
         initialValue: (0, metadata_helpers_1.dInitialValue)(),
-        autoFocus: (0, metadata_helpers_1.dAutoFocus)(),
-        required: (0, metadata_helpers_1.dRequired)(),
-        readOnly: (0, metadata_helpers_1.dReadonly)(),
-        enabled: (0, metadata_helpers_1.dEnabled)(),
-        validationStatus: (0, metadata_helpers_1.dValidationStatus)(),
+        autoFocus: Object.assign(Object.assign({}, (0, metadata_helpers_1.dAutoFocus)()), { defaultValue: SelectNative_1.defaultProps.autoFocus }),
+        required: Object.assign(Object.assign({}, (0, metadata_helpers_1.dRequired)()), { defaultValue: SelectNative_1.defaultProps.required }),
+        readOnly: Object.assign(Object.assign({}, (0, metadata_helpers_1.dReadonly)()), { defaultValue: SelectNative_1.defaultProps.readOnly }),
+        enabled: Object.assign(Object.assign({}, (0, metadata_helpers_1.dEnabled)()), { defaultValue: SelectNative_1.defaultProps.enabled }),
+        validationStatus: Object.assign(Object.assign({}, (0, metadata_helpers_1.dValidationStatus)()), { defaultValue: SelectNative_1.defaultProps.validationStatus }),
         label: (0, metadata_helpers_1.dLabel)(),
         labelPosition: (0, metadata_helpers_1.dLabelPosition)("top"),
         labelWidth: (0, metadata_helpers_1.dLabelWidth)(COMP),
-        labelBreak: (0, metadata_helpers_1.dLabelBreak)(COMP),
+        labelBreak: Object.assign(Object.assign({}, (0, metadata_helpers_1.dLabelBreak)(COMP)), { defaultValue: SelectNative_1.defaultProps.labelBreak }),
         optionLabelTemplate: (0, metadata_helpers_1.dComponent)(`This property allows replacing the default template to display an option in the dropdown list.`),
         optionTemplate: (0, metadata_helpers_1.dComponent)(`This property allows replacing the default template to display an option in the dropdown list.`),
         valueTemplate: (0, metadata_helpers_1.dComponent)(`This property allows replacing the default template to display a selected value when ` +
             `multiple selections (\`multiSelect\` is \`true\`) are enabled.`),
-        dropdownHeight: (0, ComponentDefs_1.d)("This property sets the height of the dropdown list."),
+        dropdownHeight: (0, ComponentDefs_1.d)("This property sets the height of the dropdown list. If not set, the height is determined automatically."),
         emptyListTemplate: (0, ComponentDefs_1.d)(`This optional property provides the ability to customize what is displayed when the ` +
             `list of options is empty.`),
-        multiSelect: (0, metadata_helpers_1.dMulti)(),
-        searchable: (0, ComponentDefs_1.d)(`This property enables the search functionality in the dropdown list.`),
-        inProgress: (0, ComponentDefs_1.d)(`This property indicates whether the component is in progress. It can be used to show a loading message.`),
-        inProgressNotificationMessage: (0, ComponentDefs_1.d)(`This property indicates the message to display when the component is in progress.`),
+        multiSelect: Object.assign(Object.assign({}, (0, metadata_helpers_1.dMulti)()), { defaultValue: SelectNative_1.defaultProps.multiSelect }),
+        searchable: {
+            description: `This property enables the search functionality in the dropdown list.`,
+            defaultValue: SelectNative_1.defaultProps.searchable,
+        },
+        inProgress: {
+            description: `This property indicates whether the component is in progress. It can be used to show a loading message.`,
+            defaultValue: SelectNative_1.defaultProps.inProgress,
+        },
+        inProgressNotificationMessage: {
+            description: `This property indicates the message to display when the component is in progress.`,
+            defaultValue: SelectNative_1.defaultProps.inProgressNotificationMessage,
+        },
     },
     events: {
         gotFocus: (0, metadata_helpers_1.dGotFocus)(COMP),

package/dist/scripts/src/components/Select/SelectNative.js

@@ -36,7 +36,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.ComboboxOption = exports.Select = void 0;
+exports.ComboboxOption = exports.Select = exports.defaultProps = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = __importStar(require("react"));
 const react_compose_refs_1 = require("@radix-ui/react-compose-refs");
@@ -55,6 +55,19 @@ const OptionTypeProvider_1 = __importDefault(require("../Option/OptionTypeProvid
 const OptionContext_1 = require("./OptionContext");
 const ItemWithLabel_1 = require("../FormItem/ItemWithLabel");
 const HiddenOption_1 = require("./HiddenOption");
+exports.defaultProps = {
+    enabled: true,
+    placeholder: "",
+    autoFocus: false,
+    searchable: false,
+    multiSelect: false,
+    required: false,
+    inProgress: false,
+    inProgressNotificationMessage: "",
+    readOnly: false,
+    validationStatus: "none",
+    labelBreak: false,
+};
 const SimpleSelect = (0, react_1.forwardRef)(function SimpleSelect(props, forwardedRef) {
     var _a;
     const { root } = (0, ThemeContext_1.useTheme)();
@@ -77,7 +90,7 @@ const SimpleSelect = (0, react_1.forwardRef)(function SimpleSelect(props, forwar
                     [Select_module_scss_1.default.valid]: validationStatus === "valid",
                 }), ref: ref, autoFocus: autoFocus, children: [(0, jsx_runtime_1.jsx)("div", { className: Select_module_scss_1.default.selectValue, children: readOnly ? (((_a = Array.from(options).find((o) => `${o.value}` === stringValue)) === null || _a === void 0 ? void 0 : _a.label) || ((0, jsx_runtime_1.jsx)("span", { "aria-placeholder": placeholder, children: placeholder }))) : ((0, jsx_runtime_1.jsx)(react_select_1.Value, { "aria-placeholder": placeholder, placeholder: placeholder })) }), (0, jsx_runtime_1.jsx)(react_select_1.Icon, { asChild: true, children: (0, jsx_runtime_1.jsx)(IconNative_1.default, { name: "chevrondown" }) })] }), (0, jsx_runtime_1.jsx)(react_select_1.Portal, { container: root, children: (0, jsx_runtime_1.jsxs)(react_select_1.Content, { className: Select_module_scss_1.default.selectContent, position: "popper", style: { height: height }, children: [(0, jsx_runtime_1.jsx)(react_select_1.ScrollUpButton, { className: Select_module_scss_1.default.selectScrollUpButton, children: (0, jsx_runtime_1.jsx)(IconNative_1.default, { name: "chevronup" }) }), (0, jsx_runtime_1.jsx)(react_select_1.SelectViewport, { className: Select_module_scss_1.default.selectViewport, role: "listbox", children: children }), (0, jsx_runtime_1.jsx)(react_select_1.ScrollDownButton, { className: Select_module_scss_1.default.selectScrollDownButton, children: (0, jsx_runtime_1.jsx)(IconNative_1.default, { name: "chevrondown" }) })] }) })] }));
 });
-exports.Select = (0, react_1.forwardRef)(function Select({ id, initialValue, value, enabled = true, placeholder, updateState = constants_1.noop, validationStatus = "none", onDidChange = constants_1.noop, onFocus = constants_1.noop, onBlur = constants_1.noop, registerComponentApi, emptyListTemplate, optionLabelRenderer, optionRenderer, valueRenderer, style, dropdownHeight, children, autoFocus = false, searchable = false, multiSelect = false, label, labelPosition, labelWidth, labelBreak = false, required = false, inProgress = false, inProgressNotificationMessage = "Loading...", readOnly = false, }, ref) {
+exports.Select = (0, react_1.forwardRef)(function Select({ id, initialValue, value, enabled = exports.defaultProps.enabled, placeholder = exports.defaultProps.placeholder, updateState = constants_1.noop, validationStatus = exports.defaultProps.validationStatus, onDidChange = constants_1.noop, onFocus = constants_1.noop, onBlur = constants_1.noop, registerComponentApi, emptyListTemplate, optionLabelRenderer, optionRenderer, valueRenderer, style, dropdownHeight, children, autoFocus = exports.defaultProps.autoFocus, searchable = exports.defaultProps.searchable, multiSelect = exports.defaultProps.multiSelect, label, labelPosition, labelWidth, labelBreak = exports.defaultProps.labelBreak, required = exports.defaultProps.required, inProgress = exports.defaultProps.inProgress, inProgressNotificationMessage = exports.defaultProps.inProgressNotificationMessage, readOnly = false, }, ref) {
     var _a;
     const [referenceElement, setReferenceElement] = (0, react_1.useState)(null);
     const [open, setOpen] = (0, react_1.useState)(false);

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

@@ -11,9 +11,12 @@ exports.SelectionStoreMd = (0, ComponentDefs_1.createMetadata)({
     description: `The \`${COMP}\` is a non-visual component that may wrap components (items) and manage ` +
         `their selection state to accommodate the usage of other actions.`,
     props: {
-        idKey: (0, ComponentDefs_1.d)(`The selected items in the selection store needs to have a unique ID to use as an ` +
-            `unambiguous key for that particular item. This property uniquely identifies the ` +
-            `selected object item via a given property. By default, the key attribute is \`"id"\`.`),
+        idKey: {
+            description: `The selected items in the selection store needs to have a unique ID to use as an ` +
+                `unambiguous key for that particular item. This property uniquely identifies the ` +
+                `selected object item via a given property. By default, the key attribute is \`"id"\`.`,
+            defaultValue: SelectionStoreNative_1.defaultProps.idKey,
+        },
     },
 });
 exports.selectionStoreComponentRenderer = (0, renderers_1.createComponentRenderer)(COMP, exports.SelectionStoreMd, (rendererContext) => {

package/dist/scripts/src/components/SelectionStore/SelectionStoreNative.js

@@ -33,13 +33,17 @@ var __importStar = (this && this.__importStar) || (function () {
     };
 })();
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.SelectionStore = exports.StandaloneSelectionStore = void 0;
+exports.SelectionStore = exports.StandaloneSelectionStore = exports.defaultProps = void 0;
 exports.useSelectionContext = useSelectionContext;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = __importStar(require("react"));
 const lodash_es_1 = require("lodash-es");
 const misc_1 = require("../../components-core/utils/misc");
 const constants_1 = require("../../components-core/constants");
+exports.defaultProps = {
+    idKey: "id",
+    selectedItems: constants_1.EMPTY_ARRAY,
+};
 const EMPTY_SELECTION_STATE = {
     value: constants_1.EMPTY_ARRAY,
 };
@@ -48,7 +52,7 @@ const StandaloneSelectionStore = ({ children }) => {
     return ((0, jsx_runtime_1.jsx)(exports.SelectionStore, { updateState: setSelection, selectedItems: selection.value, children: children }));
 };
 exports.StandaloneSelectionStore = StandaloneSelectionStore;
-const SelectionStore = ({ updateState = lodash_es_1.noop, idKey = "id", children, selectedItems = constants_1.EMPTY_ARRAY, registerComponentApi = lodash_es_1.noop, }) => {
+const SelectionStore = ({ updateState = lodash_es_1.noop, idKey = exports.defaultProps.idKey, children, selectedItems = exports.defaultProps.selectedItems, registerComponentApi = lodash_es_1.noop, }) => {
     const [items, setItems] = (0, react_1.useState)(selectedItems);
     const valueInitializedRef = (0, react_1.useRef)(false);
     const refreshSelection = (0, misc_1.useEvent)((allItems = constants_1.EMPTY_ARRAY) => {

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

@@ -22,19 +22,38 @@ exports.SliderMd = (0, ComponentDefs_1.createMetadata)({
         labelPosition: (0, metadata_helpers_1.dLabelPosition)("top"),
         labelWidth: (0, metadata_helpers_1.dLabelWidth)(COMP),
         labelBreak: (0, metadata_helpers_1.dLabelBreak)(COMP),
-        minValue: (0, ComponentDefs_1.d)(`This property specifies the minimum value of the allowed input range.`, null, "number", 0),
-        maxValue: (0, ComponentDefs_1.d)(`This property specifies the maximum value of the allowed input range.`, null, "number", 10),
-        step: (0, ComponentDefs_1.d)(`This property defines the increment value for the slider, determining the allowed intervals between selectable values.`),
-        minStepsBetweenThumbs: (0, ComponentDefs_1.d)(`This property sets the minimum number of steps required between multiple thumbs on the slider, ensuring they maintain a specified distance.`),
+        minValue: {
+            description: `This property specifies the minimum value of the allowed input range.`,
+            valueType: "number",
+            defaultValue: SliderNative_1.defaultProps.min,
+        },
+        maxValue: {
+            description: `This property specifies the maximum value of the allowed input range.`,
+            valueType: "number",
+            defaultValue: SliderNative_1.defaultProps.max,
+        },
+        step: {
+            description: `This property defines the increment value for the slider, determining the allowed intervals between selectable values.`,
+            defaultValue: SliderNative_1.defaultProps.step,
+        },
+        minStepsBetweenThumbs: (0, ComponentDefs_1.d)(`This property sets the minimum number of steps required between multiple thumbs on the slider, ensuring they maintain a specified distance.`, undefined, "number", SliderNative_1.defaultProps.minStepsBetweenThumbs),
         enabled: (0, metadata_helpers_1.dEnabled)(),
         autoFocus: (0, metadata_helpers_1.dAutoFocus)(),
         required: (0, metadata_helpers_1.dRequired)(),
         readOnly: (0, metadata_helpers_1.dReadonly)(),
-        validationStatus: (0, metadata_helpers_1.dValidationStatus)(),
-        rangeStyle: (0, ComponentDefs_1.d)(`This property allows you to apply custom styles to the range element of the slider.`),
-        thumbStyle: (0, ComponentDefs_1.d)(`This property allows you to apply custom styles to the thumb elements of the slider.`),
-        showValues: (0, ComponentDefs_1.d)(`This property controls whether the slider shows the current values of the thumbs.`, null, "boolean", true),
-        valueFormat: (0, ComponentDefs_1.d)(`This property allows you to customize how the values are displayed.`, null, "any")
+        validationStatus: Object.assign(Object.assign({}, (0, metadata_helpers_1.dValidationStatus)()), { defaultValue: SliderNative_1.defaultProps.validationStatus }),
+        rangeStyle: (0, ComponentDefs_1.d)(`This optional property allows you to apply custom styles to the range element of the slider.`),
+        thumbStyle: (0, ComponentDefs_1.d)(`This optional property allows you to apply custom styles to the thumb elements of the slider.`),
+        showValues: {
+            description: `This property controls whether the slider shows the current values of the thumbs.`,
+            valueType: "boolean",
+            defaultValue: SliderNative_1.defaultProps.showValues,
+        },
+        valueFormat: {
+            description: `This property allows you to customize how the values are displayed.`,
+            valueType: "any",
+            defaultValue: "(value) => value.toString()",
+        },
     },
     events: {
         didChange: (0, metadata_helpers_1.dDidChange)(COMP),

package/dist/scripts/src/components/Slider/SliderNative.js

@@ -36,7 +36,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Slider = void 0;
+exports.Slider = exports.defaultProps = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = __importStar(require("react"));
 const react_2 = require("react");
@@ -46,6 +46,17 @@ const constants_1 = require("../../components-core/constants");
 const misc_1 = require("../../components-core/utils/misc");
 const ItemWithLabel_1 = require("../FormItem/ItemWithLabel");
 const classnames_1 = __importDefault(require("classnames"));
+exports.defaultProps = {
+    step: 1,
+    min: 0,
+    max: 10,
+    enabled: true,
+    validationStatus: "none",
+    tabIndex: -1,
+    showValues: true,
+    valueFormat: (value) => value.toString(),
+    minStepsBetweenThumbs: 1,
+};
 // Helper function to ensure value is properly formatted
 const formatValue = (val, defaultVal = 0) => {
     if (val === undefined) {
@@ -59,7 +70,7 @@ const formatValue = (val, defaultVal = 0) => {
     }
     return [defaultVal];
 };
-exports.Slider = (0, react_2.forwardRef)(({ style, step = 1, min = 0, max = 10, inverted, updateState, onDidChange = constants_1.noop, onFocus = constants_1.noop, onBlur = constants_1.noop, registerComponentApi, enabled = true, value, autoFocus, readOnly, tabIndex = -1, label, labelPosition, labelWidth, labelBreak, required, validationStatus = "none", initialValue, minStepsBetweenThumbs, rangeStyle, thumbStyle, showValues = true, valueFormat = (value) => value.toString(), }, forwardedRef) => {
+exports.Slider = (0, react_2.forwardRef)(({ style, step = exports.defaultProps.step, min = exports.defaultProps.min, max = exports.defaultProps.max, inverted, updateState, onDidChange = constants_1.noop, onFocus = constants_1.noop, onBlur = constants_1.noop, registerComponentApi, enabled = exports.defaultProps.enabled, value, autoFocus, readOnly, tabIndex = exports.defaultProps.tabIndex, label, labelPosition, labelWidth, labelBreak, required, validationStatus = exports.defaultProps.validationStatus, initialValue, minStepsBetweenThumbs = exports.defaultProps.minStepsBetweenThumbs, rangeStyle, thumbStyle, showValues = exports.defaultProps.showValues, valueFormat = exports.defaultProps.valueFormat, }, forwardedRef) => {
     const inputRef = (0, react_1.useRef)(null);
     // Initialize localValue properly
     const [localValue, setLocalValue] = react_1.default.useState([]);
@@ -145,7 +156,7 @@ exports.Slider = (0, react_2.forwardRef)(({ style, step = 1, min = 0, max = 10,
     const valuesText = displayValue.map(v => valueFormat(v)).join(', ');
     // Create a custom label that includes the current values
     const displayLabel = label ? (showValues ? `${label} ${valuesText}` : label) : (showValues ? valuesText : '');
-    return ((0, jsx_runtime_1.jsx)(ItemWithLabel_1.ItemWithLabel, { labelPosition: labelPosition, label: displayLabel, labelWidth: labelWidth, labelBreak: labelBreak, required: required, enabled: enabled, onFocus: onFocus, onBlur: onBlur, style: style, ref: forwardedRef, children: (0, jsx_runtime_1.jsx)("div", { className: Slider_module_scss_1.default.sliderContainer, children: (0, jsx_runtime_1.jsxs)(react_slider_1.Root, { minStepsBetweenThumbs: minStepsBetweenThumbs || 1, ref: inputRef, tabIndex: tabIndex, "aria-readonly": readOnly, className: (0, classnames_1.default)(Slider_module_scss_1.default.sliderRoot, {
+    return ((0, jsx_runtime_1.jsx)(ItemWithLabel_1.ItemWithLabel, { labelPosition: labelPosition, label: displayLabel, labelWidth: labelWidth, labelBreak: labelBreak, required: required, enabled: enabled, onFocus: onFocus, onBlur: onBlur, style: style, ref: forwardedRef, children: (0, jsx_runtime_1.jsx)("div", { className: Slider_module_scss_1.default.sliderContainer, children: (0, jsx_runtime_1.jsxs)(react_slider_1.Root, { minStepsBetweenThumbs: minStepsBetweenThumbs, ref: inputRef, tabIndex: tabIndex, "aria-readonly": readOnly, className: (0, classnames_1.default)(Slider_module_scss_1.default.sliderRoot, {
                     [Slider_module_scss_1.default.disabled]: !enabled,
                     [Slider_module_scss_1.default.readOnly]: readOnly
                 }), style: style, max: max, min: min, inverted: inverted, step: step, disabled: !enabled, onFocus: handleOnFocus, onBlur: handleOnBlur, onValueChange: onInputChange, "aria-required": required, value: displayValue, autoFocus: autoFocus, children: [(0, jsx_runtime_1.jsx)(react_slider_1.Track, { className: (0, classnames_1.default)(Slider_module_scss_1.default.sliderTrack, {

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

@@ -18,12 +18,12 @@ exports.SpinnerMd = (0, ComponentDefs_1.createMetadata)({
         delay: {
             description: `The delay in milliseconds before the spinner is displayed.`,
             valueType: "number",
-            defaultValue: 400,
+            defaultValue: SpinnerNative_1.defaultProps.delay,
         },
         fullScreen: {
             description: `If set to \`true\`, the component will be rendered in a full screen container.`,
             valueType: "boolean",
-            defaultValue: false,
+            defaultValue: SpinnerNative_1.defaultProps.fullScreen,
         },
     },
     themeVars: (0, themeVars_1.parseScssVar)(Spinner_module_scss_1.default.themeVars),

package/dist/scripts/src/components/Spinner/SpinnerNative.js

@@ -3,12 +3,16 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Spinner = void 0;
+exports.Spinner = exports.defaultProps = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 const Spinner_module_scss_1 = __importDefault(require("./Spinner.module.scss"));
+exports.defaultProps = {
+    delay: 400,
+    fullScreen: false
+};
 // source https://loading.io/css/
-exports.Spinner = (0, react_1.forwardRef)(function Spinner({ delay = 400, fullScreen = false, style }, forwardedRef) {
+exports.Spinner = (0, react_1.forwardRef)(function Spinner({ delay = exports.defaultProps.delay, fullScreen = exports.defaultProps.fullScreen, style }, forwardedRef) {
     const [pastDelay, setPastDelay] = (0, react_1.useState)(delay === 0);
     (0, react_1.useEffect)(() => {
         const timeout = setTimeout(() => {

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

@@ -22,32 +22,32 @@ const baseSplitterMd = (0, ComponentDefs_1.createMetadata)({
             description: `This optional booelan property indicates whether the \`${COMP}\` sections are layed out as ` +
                 `primary and secondary (\`false\`) or secondary and primary (\`true\`) from left to right.`,
             valueType: "boolean",
-            defaultValue: false,
+            defaultValue: SplitterNative_1.defaultProps.swapped,
         },
         splitterTemplate: (0, metadata_helpers_1.dComponent)(`The divider can be customized using XMLUI components via this property.`),
         initialPrimarySize: {
             description: `This optional number property sets the initial size of the primary section. The unit of ` +
                 `the size value is in pixels or percentages.`,
             valueType: "string",
-            defaultValue: "50%",
+            defaultValue: SplitterNative_1.defaultProps.initialPrimarySize,
         },
         minPrimarySize: {
             description: `This property sets the minimum size the primary section can have. The unit of the size ` +
                 `value is in pixels or percentages.`,
             valueType: "string",
-            defaultValue: "0%",
+            defaultValue: SplitterNative_1.defaultProps.minPrimarySize,
         },
         maxPrimarySize: {
             description: `This property sets the maximum size the primary section can have. The unit of the size ` +
                 `value is in pixels or percentages.`,
             valueType: "string",
-            defaultValue: "100%",
+            defaultValue: SplitterNative_1.defaultProps.maxPrimarySize,
         },
         floating: {
             description: `Toggles whether the resizer is visible (\`false\`) or not (\`true\`) when not hovered ` +
                 `or dragged. The default value is \`false\`, meaning the resizer is visible all the time.`,
             valueType: "boolean",
-            defaultValue: false,
+            defaultValue: SplitterNative_1.defaultProps.floating,
         },
         orientation: {
             description: `Sets whether the \`Splitter\` divides the container horizontally and lays out the ` +
@@ -55,7 +55,7 @@ const baseSplitterMd = (0, ComponentDefs_1.createMetadata)({
                 `next to each other (\`horizontal\`).`,
             valueType: "string",
             availableValues: ["horizontal", "vertical"],
-            defaultValue: "vertical",
+            defaultValue: SplitterNative_1.defaultProps.orientation,
         },
     },
     events: {

package/dist/scripts/src/components/Splitter/SplitterNative.js

@@ -36,14 +36,22 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Splitter = void 0;
+exports.Splitter = exports.defaultProps = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = __importStar(require("react"));
 const classnames_1 = __importDefault(require("classnames"));
 const Splitter_module_scss_1 = __importDefault(require("./Splitter.module.scss"));
 const constants_1 = require("../../components-core/constants");
 const utils_1 = require("../Splitter/utils");
-const Splitter = ({ initialPrimarySize = "50%", minPrimarySize = "0%", maxPrimarySize = "100%", orientation = "vertical", children, style, swapped = false, floating = false, splitterTemplate, resize = constants_1.noop, }) => {
+exports.defaultProps = {
+    initialPrimarySize: "50%",
+    minPrimarySize: "0%",
+    maxPrimarySize: "100%",
+    orientation: "vertical",
+    swapped: false,
+    floating: false,
+};
+const Splitter = ({ initialPrimarySize = exports.defaultProps.initialPrimarySize, minPrimarySize = exports.defaultProps.minPrimarySize, maxPrimarySize = exports.defaultProps.maxPrimarySize, orientation = exports.defaultProps.orientation, children, style, swapped = exports.defaultProps.swapped, floating = exports.defaultProps.floating, splitterTemplate, resize = constants_1.noop, }) => {
     var _a;
     const [size, setSize] = (0, react_1.useState)(0);
     const [splitter, setSplitter] = (0, react_1.useState)(null);

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

@@ -38,7 +38,7 @@ const stackMd = (0, ComponentDefs_1.createMetadata)({
         reverse: {
             description: "Optional boolean property to reverse the order of child elements.",
             valueType: "boolean",
-            defaultValue: false,
+            defaultValue: StackNative_1.defaultProps.reverse,
         },
         wrapContent: {
             description: "Optional boolean which wraps the content if set to true and the available " +
@@ -51,12 +51,12 @@ const stackMd = (0, ComponentDefs_1.createMetadata)({
                 "the Stack lays out its children in a row or a column).",
             availableValues: ["horizontal", "vertical"],
             valueType: "string",
-            defaultValue: StackNative_1.DEFAULT_ORIENTATION,
+            defaultValue: StackNative_1.defaultProps.orientation,
         },
         horizontalAlignment: HORIZONTAL_ALIGNMENT,
         verticalAlignment: VERTICAL_ALIGNMENT,
-        hoverContainer: (0, metadata_helpers_1.dInternal)("Reserved for future use"),
-        visibleOnHover: (0, metadata_helpers_1.dInternal)("Reserved for future use"),
+        hoverContainer: Object.assign(Object.assign({}, (0, metadata_helpers_1.dInternal)("Reserved for future use")), { defaultValue: StackNative_1.defaultProps.hoverContainer }),
+        visibleOnHover: Object.assign(Object.assign({}, (0, metadata_helpers_1.dInternal)("Reserved for future use")), { defaultValue: StackNative_1.defaultProps.visibleOnHover }),
     },
     events: {
         click: (0, metadata_helpers_1.dClick)(COMP),

package/dist/scripts/src/components/Stack/StackNative.js

@@ -14,7 +14,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Stack = exports.DEFAULT_ORIENTATION = void 0;
+exports.Stack = exports.defaultProps = exports.DEFAULT_ORIENTATION = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 const classnames_1 = __importDefault(require("classnames"));
@@ -22,10 +22,16 @@ const Stack_module_scss_1 = __importDefault(require("./Stack.module.scss"));
 const component_hooks_1 = require("../../components-core/component-hooks");
 const hooks_1 = require("../../components-core/utils/hooks");
 exports.DEFAULT_ORIENTATION = "vertical";
+exports.defaultProps = {
+    orientation: exports.DEFAULT_ORIENTATION,
+    reverse: false,
+    hoverContainer: false,
+    visibleOnHover: false,
+};
 // =====================================================================================================================
 // Stack React component
 exports.Stack = (0, react_1.forwardRef)(function Stack(_a, ref) {
-    var { uid, children, orientation = exports.DEFAULT_ORIENTATION, horizontalAlignment, verticalAlignment, style, reverse, hoverContainer, visibleOnHover, onClick, onMount } = _a, rest = __rest(_a, ["uid", "children", "orientation", "horizontalAlignment", "verticalAlignment", "style", "reverse", "hoverContainer", "visibleOnHover", "onClick", "onMount"]);
+    var { uid, children, orientation = exports.defaultProps.orientation, horizontalAlignment, verticalAlignment, style, reverse = exports.defaultProps.reverse, hoverContainer = exports.defaultProps.hoverContainer, visibleOnHover = exports.defaultProps.visibleOnHover, onClick, onMount } = _a, rest = __rest(_a, ["uid", "children", "orientation", "horizontalAlignment", "verticalAlignment", "style", "reverse", "hoverContainer", "visibleOnHover", "onClick", "onMount"]);
     (0, hooks_1.useOnMount)(onMount);
     const { horizontal, vertical } = (0, component_hooks_1.useContentAlignment)(orientation, horizontalAlignment, verticalAlignment);
     return ((0, jsx_runtime_1.jsx)("div", Object.assign({}, rest, { onClick: onClick, ref: ref, style: style, className: (0, classnames_1.default)(Stack_module_scss_1.default.base, {

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

@@ -21,7 +21,7 @@ exports.StickyBoxMd = (0, ComponentDefs_1.createMetadata)({
                 "the \`top\` or \`bottom\`.",
             availableValues: ["top", "bottom"],
             valueType: "string",
-            defaultValue: "top",
+            defaultValue: StickyBoxNative_1.defaultProps.to,
         },
     },
     themeVars: (0, themeVars_1.parseScssVar)(StickyBox_module_scss_1.default.themeVars),

package/dist/scripts/src/components/StickyBox/StickyBoxNative.js

@@ -3,6 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.defaultProps = void 0;
 exports.StickyBox = StickyBox;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
@@ -10,7 +11,12 @@ const classnames_1 = __importDefault(require("classnames"));
 const react_sticky_el_1 = require("react-sticky-el");
 const StickyBox_module_scss_1 = __importDefault(require("./StickyBox.module.scss"));
 const hooks_1 = require("../../components-core/utils/hooks");
-function StickyBox({ children, uid, layout, to = "top" }) {
+// =====================================================================================================================
+// React StickyBox component implementation
+exports.defaultProps = {
+    to: "top",
+};
+function StickyBox({ children, uid, layout, to = exports.defaultProps.to }) {
     const sentinelRef = (0, react_1.useRef)(null);
     const [wrapper, setWrapper] = (0, react_1.useState)(null);
     const [stuck, setStuck] = (0, react_1.useState)(false);