@hyphen/hyphen-components 7.1.0 → 7.2.0

package/dist/components/SelectInputNative/SelectInputNative.d.ts

@@ -3,14 +3,16 @@ import { ResponsiveProp } from '../../types';
 import { BoxProps } from '../Box/Box';
 import { FormControlProps } from '../FormControl/FormControl';
 export type SelectInputNativeSize = 'sm' | 'md' | 'lg';
+export interface SelectInputNativeOption {
+    value: string | number;
+    label: string | number;
+    disabled?: boolean;
+}
 export interface SelectInputNativeProps extends BoxProps, FormControlProps {
     /**
      * List of options for the select input.
      */
-    options: {
-        value: string | number;
-        label: string | number;
-    }[];
+    options: SelectInputNativeOption[];
     /**
      * onChange callback from select element.
      */

package/dist/hyphen-components.cjs.development.js

@@ -2677,9 +2677,10 @@ var SelectInputNative = function SelectInputNative(_ref) {
     restProps = _objectWithoutPropertiesLoose(_ref, _excluded$o);
   var placeholderOption = {
     value: '',
-    label: placeholder
+    label: placeholder,
+    disabled: true
   };
-  var optionsWithPlaceholder = [_extends({}, placeholderOption)].concat(options);
+  var optionsWithPlaceholder = [placeholderOption].concat(options);
   var responsiveClasses = generateResponsiveClasses('size', size);
   var selectWrapperClasses = classNames.apply(void 0, ['hyphen-components__variables__form-control', styles$g['select-input-native-wrapper']].concat(responsiveClasses.map(function (className) {
     return styles$g[className];
@@ -2709,11 +2710,12 @@ var SelectInputNative = function SelectInputNative(_ref) {
     id: id,
     required: isRequired
   }, optionsWithPlaceholder.map(function (option) {
+    var _option$disabled;
     return React.createElement(Box, {
       as: "option",
       key: option.value,
       value: option.value,
-      disabled: option.value === '',
+      disabled: (_option$disabled = option.disabled) != null ? _option$disabled : false,
       hidden: option.value === '',
       color: option.value === '' ? 'disabled' : 'base'
     }, option.label);