xmlui 0.9.56 → 0.9.57

package/dist/scripts/package.json

@@ -1,6 +1,6 @@
 {
     "name": "xmlui",
-    "version": "0.9.56",
+    "version": "0.9.57",
     "sideEffects": false,
     "scripts": {
         "start-test-bed": "cd src/testing/infrastructure && xmlui start",

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

@@ -15,7 +15,7 @@ const SlotItem_1 = require("../../components/SlotItem");
 const AppHeaderNative_1 = require("./AppHeaderNative");
 const COMP = "AppHeader";
 exports.AppHeaderMd = (0, ComponentDefs_1.createMetadata)({
-    status: "experimental",
+    status: "stable",
     description: `\`${COMP}\` is a placeholder within \`App\` to define a custom application header.`,
     props: {
         profileMenuTemplate: (0, metadata_helpers_1.dComponent)(`This property makes the profile menu slot of the \`${COMP}\` component customizable.`),

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

@@ -16,9 +16,9 @@ const FileInputNative_1 = require("./FileInputNative");
 const COMP = "FileInput";
 const DEFAULT_ICON = "browse:FileInput";
 exports.FileInputMd = (0, ComponentDefs_1.createMetadata)({
+    status: "stable",
     description: `The \`${COMP}\` is a user interface component that allows users to select files from their ` +
         `device's file system for upload (or processing its content otherwise).`,
-    status: "experimental",
     props: {
         placeholder: (0, metadata_helpers_1.dPlaceholder)(),
         initialValue: (0, metadata_helpers_1.dInitialValue)(),

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

@@ -14,7 +14,7 @@ const abstractions_1 = require("../abstractions");
 const FormNative_1 = require("./FormNative");
 const COMP = "Form";
 exports.FormMd = (0, ComponentDefs_1.createMetadata)({
-    status: "experimental",
+    status: "stable",
     description: `A \`${COMP}\` is a fundamental component that displays user interfaces that allow users to input ` +
         `(or change) data and submit it to the app (a server) for further processing.`,
     props: {

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

@@ -29,7 +29,7 @@ const COMP = "FormItem";
 // NOTE: We need to filter the "none" value out so that it doesn't show up in the docs.
 const filteredValidationSeverityValues = FormContext_1.validationSeverityValues.filter((value) => value !== "none");
 exports.FormItemMd = (0, ComponentDefs_1.createMetadata)({
-    status: "experimental",
+    status: "stable",
     description: `A \`${COMP}\` component represents a single input element within a \`Form\`. The value within ` +
         `the \`${COMP}\` may be associated with a particular property within the encapsulating \`Form\` ` +
         `component's data.`,

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

@@ -12,7 +12,7 @@ const themeVars_1 = require("../../components-core/theming/themeVars");
 const IconNative_1 = __importDefault(require("./IconNative"));
 const COMP = "Icon";
 exports.IconMd = (0, ComponentDefs_1.createMetadata)({
-    status: "experimental",
+    status: "stable",
     description: `This component is the representation of an icon.`,
     props: {
         name: (0, ComponentDefs_1.d)("This string property specifies the name of the icon to display. All icons have " +

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

@@ -15,7 +15,7 @@ const abstractions_1 = require("../abstractions");
 const ListNative_1 = require("./ListNative");
 const COMP = "List";
 exports.ListMd = (0, ComponentDefs_1.createMetadata)({
-    status: "experimental",
+    status: "stable",
     description: `The \`${COMP}\` component is a robust layout container that renders associated data items ` +
         `as a list of components. \`${COMP}\` is virtualized; it renders only items that are visible ` +
         `in the viewport.`,

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

@@ -7,7 +7,7 @@ const renderers_1 = require("../../components-core/renderers");
 const LogoNative_1 = require("./LogoNative");
 const COMP = "Logo";
 exports.LogoMd = (0, ComponentDefs_1.createMetadata)({
-    status: "experimental",
+    status: "stable",
     description: `The \`${COMP}\` component represents a logo or a brand symbol. Usually, you use ` +
         `this component in the [\`AppHeader\`](./AppHeader.mdx#logotemplate).`,
     props: {

package/dist/scripts/src/components/NavPanel/NavPanelNative.js

@@ -56,9 +56,9 @@ const contextValue = {
 };
 function DrawerNavPanel({ logoContent, children, className, style, }) {
     const scrollContainerRef = (0, react_1.useRef)(null);
-    return ((0, jsx_runtime_1.jsx)(exports.NavPanelContext.Provider, { value: contextValue, children: (0, jsx_runtime_1.jsx)("div", { ref: scrollContainerRef, className: (0, classnames_1.default)(NavPanel_module_scss_1.default.wrapper, className), children: (0, jsx_runtime_1.jsxs)(ScrollContext_1.ScrollContext.Provider, { value: scrollContainerRef, children: [(0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)(NavPanel_module_scss_1.default.logoWrapper, NavPanel_module_scss_1.default.inDrawer), children: logoContent || (0, jsx_runtime_1.jsx)(LogoNative_1.Logo, {}) }), (0, jsx_runtime_1.jsx)("div", { className: NavPanel_module_scss_1.default.wrapperInner, style: style, children: children })] }) }) }));
+    return ((0, jsx_runtime_1.jsx)(exports.NavPanelContext.Provider, { value: contextValue, children: (0, jsx_runtime_1.jsx)("div", { ref: scrollContainerRef, className: (0, classnames_1.default)(NavPanel_module_scss_1.default.wrapper, className), style: style, children: (0, jsx_runtime_1.jsxs)(ScrollContext_1.ScrollContext.Provider, { value: scrollContainerRef, children: [(0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)(NavPanel_module_scss_1.default.logoWrapper, NavPanel_module_scss_1.default.inDrawer), children: logoContent || (0, jsx_runtime_1.jsx)(LogoNative_1.Logo, {}) }), (0, jsx_runtime_1.jsx)("div", { className: NavPanel_module_scss_1.default.wrapperInner, style: style, children: children })] }) }) }));
 }
-exports.NavPanel = (0, react_1.forwardRef)(function NavPanel({ children, style, logoContent, className, inDrawer = exports.defaultProps.inDrawer, renderChild, }, forwardedRef) {
+exports.NavPanel = (0, react_1.forwardRef)(function NavPanel({ children, style, logoContent, className, inDrawer = exports.defaultProps.inDrawer, renderChild }, forwardedRef) {
     var _a, _b;
     const scrollContainerRef = (0, react_1.useRef)(null);
     const ref = forwardedRef ? (0, react_compose_refs_1.composeRefs)(scrollContainerRef, forwardedRef) : scrollContainerRef;
@@ -75,5 +75,5 @@ exports.NavPanel = (0, react_1.forwardRef)(function NavPanel({ children, style,
             [NavPanel_module_scss_1.default.horizontal]: horizontal,
             [NavPanel_module_scss_1.default.vertical]: vertical,
             [NavPanel_module_scss_1.default.condensed]: isCondensed,
-        }), children: (0, jsx_runtime_1.jsxs)(ScrollContext_1.ScrollContext.Provider, { value: scrollContainerRef, children: [showLogo && ((0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)(NavPanel_module_scss_1.default.logoWrapper), children: safeLogoContent || (0, jsx_runtime_1.jsx)(LogoNative_1.Logo, {}) })), (0, jsx_runtime_1.jsx)("div", { className: NavPanel_module_scss_1.default.wrapperInner, style: style, children: children })] }) }));
+        }), style: style, children: (0, jsx_runtime_1.jsxs)(ScrollContext_1.ScrollContext.Provider, { value: scrollContainerRef, children: [showLogo && ((0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)(NavPanel_module_scss_1.default.logoWrapper), children: safeLogoContent || (0, jsx_runtime_1.jsx)(LogoNative_1.Logo, {}) })), (0, jsx_runtime_1.jsx)("div", { className: NavPanel_module_scss_1.default.wrapperInner, style: style, children: children })] }) }));
 });

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

@@ -13,7 +13,7 @@ const metadata_helpers_1 = require("../metadata-helpers");
 const NumberBoxNative_1 = require("./NumberBoxNative");
 const COMP = "NumberBox";
 exports.NumberBoxMd = (0, ComponentDefs_1.createMetadata)({
-    status: "experimental",
+    status: "stable",
     description: `A \`${COMP}\` component allows users to input numeric values: either integer or floating ` +
         `point numbers. It also accepts empty values, where the stored value will be of type \`null\`.`,
     props: {

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

@@ -16,7 +16,7 @@ const react_select_1 = require("@radix-ui/react-select");
 const COMP = "Select";
 exports.SelectMd = (0, ComponentDefs_1.createMetadata)({
     description: "Provides a dropdown with a list of options to choose from.",
-    status: "experimental",
+    status: "stable",
     props: {
         placeholder: Object.assign(Object.assign({}, (0, metadata_helpers_1.dPlaceholder)()), { defaultValue: SelectNative_1.defaultProps.placeholder }),
         initialValue: (0, metadata_helpers_1.dInitialValue)(),

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

@@ -13,7 +13,7 @@ const metadata_helpers_1 = require("../metadata-helpers");
 const SliderNative_1 = require("./SliderNative");
 const COMP = "Slider";
 exports.SliderMd = (0, ComponentDefs_1.createMetadata)({
-    status: "experimental",
+    status: "stable",
     description: `The \`${COMP}\` component allows you to select a numeric value ` +
         `between a range specified by minimum and maximum values.`,
     props: {

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

@@ -12,7 +12,7 @@ const themeVars_1 = require("../../components-core/theming/themeVars");
 const StickyBoxNative_1 = require("./StickyBoxNative");
 const COMP = "StickyBox";
 exports.StickyBoxMd = (0, ComponentDefs_1.createMetadata)({
-    status: "experimental",
+    status: "stable",
     description: `The \`${COMP}\` is a component that "sticks" or remains fixed at the top or bottom ` +
         `position on the screen as the user scrolls.`,
     props: {

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

@@ -19,7 +19,7 @@ exports.resizeOptionsMd = [
     { value: "both", description: "Can resize in both dimensions" },
 ];
 exports.TextAreaMd = (0, ComponentDefs_1.createMetadata)({
-    status: "experimental",
+    status: "stable",
     description: `\`${COMP}\` is a component that provides a multiline text input area.`,
     props: {
         enterSubmits: {

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

@@ -13,7 +13,7 @@ const metadata_helpers_1 = require("../metadata-helpers");
 const TextBoxNative_1 = require("./TextBoxNative");
 const COMP = "TextBox";
 exports.TextBoxMd = (0, ComponentDefs_1.createMetadata)({
-    status: "experimental",
+    status: "stable",
     description: `The \`${COMP}\` is an input component that allows users to input and edit textual data.`,
     props: {
         placeholder: (0, metadata_helpers_1.dPlaceholder)(),

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

@@ -16,7 +16,7 @@ exports.defaultProps = {
     darkToLightIcon: DARK_TO_LIGHT_ICON
 };
 exports.ToneChangerButtonMd = (0, ComponentDefs_1.createMetadata)({
-    status: "experimental",
+    status: "stable",
     description: `The \`${COMP}\` component is a component that allows the user to change the tone of the app.`,
     props: {
         lightToDarkIcon: {