@instructure/ui-range-input 11.7.8 → 11.7.9-pr-snapshot-1792147648392

package/CHANGELOG.md

@@ -3,6 +3,19 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [11.7.9-pr-snapshot-1792147648392](https://github.com/instructure/instructure-ui/compare/v11.7.8...v11.7.9-pr-snapshot-1792147648392) (2026-10-16)
+
+### Build System
+
+* **many:** replace babel with swc ([7e36c54](https://github.com/instructure/instructure-ui/commit/7e36c54d240b4fa483801c03ab18e7f860f561e2))
+
+### BREAKING CHANGES
+
+* **many:** `@instructure/ui-babel-preset` and
+  `@instructure/browserslist-config-instui` are removed and will no longer be
+  published. Packages depend on `@swc/helpers` instead of `@babel/runtime`.
+
+
 ## [11.7.8](https://github.com/instructure/instructure-ui/compare/v11.7.7...v11.7.8) (2026-10-02)
 
 **Note:** Version bump only for package @instructure/ui-range-input

package/es/RangeInput/v1/index.js

@@ -1,28 +1,5 @@
-var _dec, _dec2, _class;
-/*
- * The MIT License (MIT)
- *
- * Copyright (c) 2015 - present Instructure, Inc.
- *
- * Permission is hereby granted, free of charge, to any person obtaining a copy
- * of this software and associated documentation files (the "Software"), to deal
- * in the Software without restriction, including without limitation the rights
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
- * copies of the Software, and to permit persons to whom the Software is
- * furnished to do so, subject to the following conditions:
- *
- * The above copyright notice and this permission notice shall be included in all
- * copies or substantial portions of the Software.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
- * SOFTWARE.
- */
-
+import { _ as _ts_decorate } from "@swc/helpers/_/_ts_decorate";
+import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
 import { Component } from 'react';
 import { warn } from '@instructure/console';
 import { ContextView } from '@instructure/ui-view/v11_6';
@@ -33,156 +10,141 @@ import { omitProps, pickProps, withDeterministicId } from '@instructure/ui-react
 import generateStyle from './styles.js';
 import generateComponentTheme from './theme.js';
 import { allowedProps } from './props.js';
-
-/**
----
-category: components
----
-**/
-import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
-let RangeInput = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle, generateComponentTheme), _dec(_class = _dec2(_class = class RangeInput extends Component {
-  static displayName = 'RangeInput';
-  static componentId = 'RangeInput';
-  static outputLocatorAttribute = 'data-range-output';
-  static allowedProps = allowedProps;
-  static defaultProps = {
-    step: 1,
-    formatValue: val => val,
-    // If min and max has default value, they don't give a warning if not set, even if they are required props.
-    // TODO: figure out if they don't need to be required or remove defaults in V9.
-    max: 0,
-    min: 0,
-    inline: false,
-    size: 'medium',
-    layout: 'stacked',
-    displayValue: true,
-    disabled: false,
-    readOnly: false,
-    thumbVariant: 'deprecated'
-  };
-  ref = null;
-  _input = null;
-  _inputListener = null;
-  _changeListener = null;
-  defaultId;
-  handleRef = el => {
-    this.ref = el;
-  };
-  handleInputRef = el => {
-    this._input = el;
-    if (typeof this.props.inputRef === 'function') {
-      this.props.inputRef(el);
+class RangeInput extends Component {
+    static{
+        this.displayName = 'RangeInput';
+    }
+    static{
+        this.componentId = 'RangeInput';
+    }
+    static{
+        this.outputLocatorAttribute = 'data-range-output';
     }
-  };
-  constructor(props) {
-    super(props);
-    if (typeof props.value === 'undefined') {
-      this.state = {
-        value: props.defaultValue
-      };
+    static{
+        this.allowedProps = allowedProps;
     }
-    this.defaultId = props.deterministicId();
-  }
-
-  /* workaround for https://github.com/facebook/react/issues/554 */
-  componentDidMount() {
-    this.props.makeStyles?.();
-    if (this._input !== null) {
-      // https://connect.microsoft.com/IE/Feedback/Details/856998
-      this._inputListener = addEventListener(this._input, 'input', this.handleChange);
-      this._changeListener = addEventListener(this._input, 'change', this.handleChange);
+    static{
+        this.defaultProps = {
+            step: 1,
+            formatValue: (val)=>val,
+            max: 0,
+            min: 0,
+            inline: false,
+            size: 'medium',
+            layout: 'stacked',
+            displayValue: true,
+            disabled: false,
+            readOnly: false,
+            thumbVariant: 'deprecated'
+        };
     }
-  }
-  componentWillUnmount() {
-    if (!this._input) {
-      return;
+    constructor(props){
+        super(props), this.ref = null, this._input = null, this._inputListener = null, this._changeListener = null, this.handleRef = (el)=>{
+            this.ref = el;
+        }, this.handleInputRef = (el)=>{
+            this._input = el;
+            if (typeof this.props.inputRef === 'function') {
+                this.props.inputRef(el);
+            }
+        }, this.handleChange = (event)=>{
+            const { onChange, value } = this.props;
+            if (typeof value === 'undefined') {
+                this.setState({
+                    value: event.target.value
+                });
+            }
+            if (typeof onChange === 'function') {
+                onChange(event.target.value);
+            }
+        }, this.noopChange = ()=>{};
+        if (typeof props.value === 'undefined') {
+            this.state = {
+                value: props.defaultValue
+            };
+        }
+        this.defaultId = props.deterministicId();
     }
-    this._inputListener?.remove();
-    this._changeListener?.remove();
-  }
-  /* end workaround */
-
-  componentDidUpdate() {
-    this.props.makeStyles?.();
-  }
-  handleChange = event => {
-    const {
-      onChange,
-      value
-    } = this.props;
-    if (typeof value === 'undefined') {
-      this.setState({
-        value: event.target.value
-      });
+    componentDidMount() {
+        this.props.makeStyles?.();
+        if (this._input !== null) {
+            this._inputListener = addEventListener(this._input, 'input', this.handleChange);
+            this._changeListener = addEventListener(this._input, 'change', this.handleChange);
+        }
     }
-    if (typeof onChange === 'function') {
-      onChange(event.target.value);
+    componentWillUnmount() {
+        if (!this._input) {
+            return;
+        }
+        this._inputListener?.remove();
+        this._changeListener?.remove();
     }
-  };
-
-  // controlled input must have an onChange, but we're handling it with native events
-  noopChange = () => {};
-  get value() {
-    const value = typeof this.props.value === 'undefined' ? this.state.value : this.props.value;
-    return typeof value === 'string' ? parseInt(value) : value;
-  }
-  get id() {
-    return this.props.id || this.defaultId;
-  }
-  renderValue() {
-    if (this.props.displayValue) {
-      if (!this.value) {
-        warn(false, 'RangeInput should have a `value` or `defaultValue` set for the value to be displayed. If no value has to be displayed, set `displayValue={false}`.');
+    componentDidUpdate() {
+        this.props.makeStyles?.();
+    }
+    get value() {
+        const value = typeof this.props.value === 'undefined' ? this.state.value : this.props.value;
+        return typeof value === 'string' ? parseInt(value) : value;
+    }
+    get id() {
+        return this.props.id || this.defaultId;
+    }
+    renderValue() {
+        if (this.props.displayValue) {
+            if (!this.value) {
+                warn(false, 'RangeInput should have a `value` or `defaultValue` set for the value to be displayed. If no value has to be displayed, set `displayValue={false}`.');
+                return null;
+            }
+            const props = {
+                [RangeInput.outputLocatorAttribute]: this.id
+            };
+            return /*#__PURE__*/ _jsx(ContextView, {
+                background: "inverse",
+                placement: "end center",
+                children: /*#__PURE__*/ _jsx("div", {
+                    ...props,
+                    css: this.props.styles?.rangeInputInputValue,
+                    children: this.props.formatValue(this.value, this.props.max)
+                })
+            });
+        }
         return null;
-      }
-      const props = {
-        [RangeInput.outputLocatorAttribute]: this.id
-      };
-      return _jsx(ContextView, {
-        background: "inverse",
-        placement: "end center",
-        children: _jsx("div", {
-          ...props,
-          css: this.props.styles?.rangeInputInputValue,
-          children: this.props.formatValue(this.value, this.props.max)
-        })
-      });
     }
-    return null;
-  }
-  render() {
-    const {
-      formatValue,
-      disabled,
-      readOnly
-    } = this.props;
-    const props = omitProps(this.props, RangeInput.allowedProps);
-    return _jsx(FormField, {
-      ...pickProps(this.props, FormField.allowedProps),
-      label: this.props.label,
-      id: this.id,
-      elementRef: this.handleRef,
-      "data-cid": "RangeInput",
-      children: _jsxs("div", {
-        css: this.props.styles?.rangeInput,
-        children: [_jsx("input", {
-          css: this.props.styles?.rangeInputInput,
-          ref: this.handleInputRef,
-          type: "range",
-          id: this.id,
-          min: this.props.min,
-          max: this.props.max,
-          step: this.props.step,
-          value: this.value,
-          onChange: this.noopChange,
-          "aria-valuetext": formatValue(this.value, this.props.max),
-          ...props,
-          disabled: disabled || readOnly,
-          "aria-disabled": disabled || readOnly ? 'true' : undefined
-        }), this.renderValue()]
-      })
-    });
-  }
-}) || _class) || _class);
+    render() {
+        const { formatValue, disabled, readOnly } = this.props;
+        const props = omitProps(this.props, RangeInput.allowedProps);
+        return /*#__PURE__*/ _jsx(FormField, {
+            ...pickProps(this.props, FormField.allowedProps),
+            label: this.props.label,
+            id: this.id,
+            elementRef: this.handleRef,
+            "data-cid": "RangeInput",
+            children: /*#__PURE__*/ _jsxs("div", {
+                css: this.props.styles?.rangeInput,
+                children: [
+                    /*#__PURE__*/ _jsx("input", {
+                        css: this.props.styles?.rangeInputInput,
+                        ref: this.handleInputRef,
+                        type: "range",
+                        id: this.id,
+                        min: this.props.min,
+                        max: this.props.max,
+                        step: this.props.step,
+                        value: this.value,
+                        onChange: this.noopChange,
+                        "aria-valuetext": formatValue(this.value, this.props.max),
+                        ...props,
+                        disabled: disabled || readOnly,
+                        "aria-disabled": disabled || readOnly ? 'true' : undefined
+                    }),
+                    this.renderValue()
+                ]
+            })
+        });
+    }
+}
+RangeInput = _ts_decorate([
+    withDeterministicId(),
+    withStyle(generateStyle, generateComponentTheme)
+], RangeInput);
 export default RangeInput;
-export { RangeInput };
+export { RangeInput };

package/es/RangeInput/v1/props.js

@@ -1,26 +1,21 @@
-/*
- * The MIT License (MIT)
- *
- * Copyright (c) 2015 - present Instructure, Inc.
- *
- * Permission is hereby granted, free of charge, to any person obtaining a copy
- * of this software and associated documentation files (the "Software"), to deal
- * in the Software without restriction, including without limitation the rights
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
- * copies of the Software, and to permit persons to whom the Software is
- * furnished to do so, subject to the following conditions:
- *
- * The above copyright notice and this permission notice shall be included in all
- * copies or substantial portions of the Software.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
- * SOFTWARE.
- */
-
-const allowedProps = ['min', 'max', 'defaultValue', 'value', 'onChange', 'messages', 'size', 'layout', 'id', 'label', 'displayValue', 'step', 'formatValue', 'inline', 'disabled', 'readOnly', 'thumbVariant', 'inputRef'];
-export { allowedProps };
+const allowedProps = [
+    'min',
+    'max',
+    'defaultValue',
+    'value',
+    'onChange',
+    'messages',
+    'size',
+    'layout',
+    'id',
+    'label',
+    'displayValue',
+    'step',
+    'formatValue',
+    'inline',
+    'disabled',
+    'readOnly',
+    'thumbVariant',
+    'inputRef'
+];
+export { allowedProps };