@papillonbits/components 0.46.0 → 0.48.0

package/build/primer/Form/Checkbox/Checkbox.js

@@ -1,36 +1,27 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.Checkbox = Checkbox;
-
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
 var _classnames = _interopRequireDefault(require("classnames"));
-
 var _margin = _interopRequireDefault(require("@papillonbits/css/build/primer/utilities/margin.scss"));
-
 var _Checkbox = require("./Checkbox.prop");
-
 var _Checkbox2 = _interopRequireDefault(require("./Checkbox.scss"));
-
 var _index = _interopRequireDefault(require("../index.scss"));
-
 var _jsxRuntime = require("react/jsx-runtime");
-
 function Checkbox(_ref) {
   var dataTest = _ref.dataTest,
-      className = _ref.className,
-      htmlFor = _ref.htmlFor,
-      ariaAttr = _ref.ariaAttr,
-      inputType = _ref.inputType,
-      isChecked = _ref.isChecked,
-      text = _ref.text,
-      _onChange = _ref.onChange,
-      state = _ref.state;
+    className = _ref.className,
+    htmlFor = _ref.htmlFor,
+    ariaAttr = _ref.ariaAttr,
+    inputType = _ref.inputType,
+    isChecked = _ref.isChecked,
+    text = _ref.text,
+    _onChange = _ref.onChange,
+    state = _ref.state;
   var describedBy = ariaAttr.describedBy;
   return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
     "data-test": dataTest,
@@ -48,6 +39,5 @@ function Checkbox(_ref) {
     })
   });
 }
-
 Checkbox.propTypes = _Checkbox.propTypes;
 Checkbox.defaultProps = _Checkbox.defaultProps;

package/build/primer/Form/Checkbox/Checkbox.prop.js

@@ -4,9 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.propTypes = exports.inputType = exports.defaultProps = exports.checkboxState = void 0;
-
 var _propTypes = require("prop-types");
-
 var checkboxState = {
   active: 'active',
   inactive: 'inactive'

package/build/primer/Form/Checkbox/index.js

@@ -15,7 +15,5 @@ Object.defineProperty(exports, "checkboxState", {
     return _Checkbox2.checkboxState;
   }
 });
-
 var _Checkbox = require("./Checkbox");
-
 var _Checkbox2 = require("./Checkbox.prop");

package/build/primer/Form/Input/Input.js

@@ -1,38 +1,30 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.Input = Input;
-
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
 var _classnames = _interopRequireDefault(require("classnames"));
-
 var _Input = require("./Input.prop");
-
 var _Input2 = _interopRequireDefault(require("./Input.scss"));
-
 var _index = _interopRequireDefault(require("../index.scss"));
-
 var _jsxRuntime = require("react/jsx-runtime");
-
 function Input(_ref) {
   var dataTest = _ref.dataTest,
-      id = _ref.id,
-      className = _ref.className,
-      placeholder = _ref.placeholder,
-      ariaAttr = _ref.ariaAttr,
-      inputType = _ref.inputType,
-      value = _ref.value,
-      _onChange = _ref.onChange,
-      _onKeyUp = _ref.onKeyUp,
-      onFocus = _ref.onFocus,
-      onBlur = _ref.onBlur,
-      autoFocus = _ref.autoFocus,
-      state = _ref.state;
+    id = _ref.id,
+    className = _ref.className,
+    placeholder = _ref.placeholder,
+    ariaAttr = _ref.ariaAttr,
+    inputType = _ref.inputType,
+    value = _ref.value,
+    _onChange = _ref.onChange,
+    _onKeyUp = _ref.onKeyUp,
+    onFocus = _ref.onFocus,
+    onBlur = _ref.onBlur,
+    autoFocus = _ref.autoFocus,
+    state = _ref.state;
   return /*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
     "data-test": dataTest,
     id: id,
@@ -50,7 +42,6 @@ function Input(_ref) {
     placeholder: placeholder,
     "aria-label": ariaAttr.label,
     autoFocus: autoFocus // eslint-disable-line
-
   });
 }
 

package/build/primer/Form/Input/Input.prop.js

@@ -4,9 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.propTypes = exports.inputType = exports.inputState = exports.defaultProps = void 0;
-
 var _propTypes = require("prop-types");
-
 var inputState = {
   active: 'active',
   inactive: 'inactive'

package/build/primer/Form/Input/index.js

@@ -21,7 +21,5 @@ Object.defineProperty(exports, "inputType", {
     return _Input2.inputType;
   }
 });
-
 var _Input = require("./Input");
-
 var _Input2 = require("./Input.prop");

package/build/primer/Form/Radio/Radio.js

@@ -1,36 +1,27 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.Radio = Radio;
-
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
 var _classnames = _interopRequireDefault(require("classnames"));
-
 var _margin = _interopRequireDefault(require("@papillonbits/css/build/primer/utilities/margin.scss"));
-
 var _Radio = require("./Radio.prop");
-
 var _Radio2 = _interopRequireDefault(require("./Radio.scss"));
-
 var _index = _interopRequireDefault(require("../index.scss"));
-
 var _jsxRuntime = require("react/jsx-runtime");
-
 function Radio(_ref) {
   var dataTest = _ref.dataTest,
-      className = _ref.className,
-      htmlFor = _ref.htmlFor,
-      inputType = _ref.inputType,
-      name = _ref.name,
-      isChecked = _ref.isChecked,
-      text = _ref.text,
-      _onChange = _ref.onChange,
-      state = _ref.state;
+    className = _ref.className,
+    htmlFor = _ref.htmlFor,
+    inputType = _ref.inputType,
+    name = _ref.name,
+    isChecked = _ref.isChecked,
+    text = _ref.text,
+    _onChange = _ref.onChange,
+    state = _ref.state;
   return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
     "data-test": dataTest,
     className: (0, _classnames["default"])(className, _margin["default"]['m-0'], _index["default"]['form-checkbox'], (0, _defineProperty2["default"])({}, _Radio2["default"]['radio-inactive'], state === _Radio.radioState.inactive)),
@@ -47,6 +38,5 @@ function Radio(_ref) {
     })
   });
 }
-
 Radio.propTypes = _Radio.propTypes;
 Radio.defaultProps = _Radio.defaultProps;

package/build/primer/Form/Radio/Radio.prop.js

@@ -4,9 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.radioState = exports.propTypes = exports.inputType = exports.defaultProps = void 0;
-
 var _propTypes = require("prop-types");
-
 var radioState = {
   active: 'active',
   inactive: 'inactive'

package/build/primer/Form/Radio/index.js

@@ -15,7 +15,5 @@ Object.defineProperty(exports, "radioState", {
     return _Radio2.radioState;
   }
 });
-
 var _Radio = require("./Radio");
-
 var _Radio2 = require("./Radio.prop");

package/build/primer/Form/index.js

@@ -4,13 +4,9 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.Form = void 0;
-
 var _Checkbox = require("./Checkbox");
-
 var _Input = require("./Input");
-
 var _Radio = require("./Radio");
-
 var Form = {
   Checkbox: {
     Checkbox: _Checkbox.Checkbox,

package/build/primer/Grid/DisplayTable/DisplayTable.js

@@ -1,39 +1,26 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.DisplayTable = DisplayTable;
-
 var _react = require("react");
-
 var _classnames = _interopRequireDefault(require("classnames"));
-
 var _uuid = require("uuid");
-
 var _visibilityDisplay = _interopRequireDefault(require("@papillonbits/css/build/primer/utilities/visibility-display.scss"));
-
 var _borders = _interopRequireDefault(require("@papillonbits/css/build/primer/utilities/borders.scss"));
-
 var _padding = _interopRequireDefault(require("@papillonbits/css/build/primer/utilities/padding.scss"));
-
 var _typography = _interopRequireDefault(require("@papillonbits/css/build/primer/utilities/typography.scss"));
-
 var _colors = _interopRequireDefault(require("@papillonbits/css/build/primer/utilities/colors.scss"));
-
 var _grid = _interopRequireDefault(require("../../Layout/grid.scss"));
-
 var _DisplayTable = require("./DisplayTable.prop");
-
 var _jsxRuntime = require("react/jsx-runtime");
-
 function DisplayTable(_ref) {
   var className = _ref.className,
-      items = _ref.items,
-      idIndex = _ref.idIndex,
-      isSelectedIndex = _ref.isSelectedIndex;
+    items = _ref.items,
+    idIndex = _ref.idIndex,
+    isSelectedIndex = _ref.isSelectedIndex;
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_react.Fragment, {
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
       className: (0, _classnames["default"])(className, _visibilityDisplay["default"]['d-table'], _grid["default"]['col-12'], _colors["default"]['bg-blue-light']),
@@ -52,7 +39,6 @@ function DisplayTable(_ref) {
         className: (0, _classnames["default"])(className, _visibilityDisplay["default"]['d-table'], _grid["default"]['col-12']),
         children: item.values.map(function (value, valueIndex) {
           var _value$value;
-
           var isIdColumn = valueIndex === idIndex;
           var isSelectedColumn = valueIndex === isSelectedIndex;
           return /*#__PURE__*/(0, _jsxRuntime.jsx)(_react.Fragment, {
@@ -66,6 +52,5 @@ function DisplayTable(_ref) {
     })]
   });
 }
-
 DisplayTable.propTypes = _DisplayTable.propTypes;
 DisplayTable.defaultProps = _DisplayTable.defaultProps;

package/build/primer/Grid/DisplayTable/DisplayTable.prop.js

@@ -4,9 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.propTypes = exports.defaultProps = void 0;
-
 var _propTypes = require("prop-types");
-
 var propTypes = {
   className: _propTypes.string,
   items: _propTypes.array.isRequired,

package/build/primer/Grid/DisplayTable/index.js

@@ -9,5 +9,4 @@ Object.defineProperty(exports, "DisplayTable", {
     return _DisplayTable.DisplayTable;
   }
 });
-
 var _DisplayTable = require("./DisplayTable");

package/build/primer/Grid/FlexGrid/FlexGrid.js

@@ -1,79 +1,52 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.FlexGrid = FlexGrid;
-
 var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
-
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
 var _react = require("react");
-
 var _classnames = _interopRequireDefault(require("classnames"));
-
 var _uuid = require("uuid");
-
 var _string = require("@papillonbits/library/string");
-
 var _sort = require("@papillonbits/library/sort");
-
 var _visibilityDisplay = _interopRequireDefault(require("@papillonbits/css/build/primer/utilities/visibility-display.scss"));
-
 var _flexbox = _interopRequireDefault(require("@papillonbits/css/build/primer/utilities/flexbox.scss"));
-
 var _borders = _interopRequireDefault(require("@papillonbits/css/build/primer/utilities/borders.scss"));
-
 var _padding = _interopRequireDefault(require("@papillonbits/css/build/primer/utilities/padding.scss"));
-
 var _margin = _interopRequireDefault(require("@papillonbits/css/build/primer/utilities/margin.scss"));
-
 var _typography = _interopRequireDefault(require("@papillonbits/css/build/primer/utilities/typography.scss"));
-
 var _layout = _interopRequireDefault(require("@papillonbits/css/build/primer/utilities/layout.scss"));
-
 var _colors = _interopRequireDefault(require("@papillonbits/css/build/primer/utilities/colors.scss"));
-
 var _index = _interopRequireDefault(require("@papillonbits/css/build/primer/truncate/index.scss"));
-
 var _grid = _interopRequireDefault(require("../../Layout/grid.scss"));
-
 var _FlexGrid = require("./FlexGrid.prop");
-
 var _FlexGrid2 = _interopRequireDefault(require("./FlexGrid.scss"));
-
 var _Radio = require("../../Form/Radio");
-
 var _Checkbox = require("../../Form/Checkbox");
-
 var _Icon = require("../../Icon");
-
 var _jsxRuntime = require("react/jsx-runtime");
-
 function FlexGrid(_ref) {
   var _items$, _items$$names;
-
   var className = _ref.className,
-      items = _ref.items,
-      idIndex = _ref.idIndex,
-      isSelectedIndex = _ref.isSelectedIndex,
-      selection = _ref.selection,
-      sort = _ref.sort,
-      _onChange = _ref.onChange,
-      _onClick = _ref.onClick,
-      _onDoubleClick = _ref.onDoubleClick,
-      iconColor = _ref.iconColor,
-      state = _ref.state;
+    items = _ref.items,
+    idIndex = _ref.idIndex,
+    isSelectedIndex = _ref.isSelectedIndex,
+    selection = _ref.selection,
+    sort = _ref.sort,
+    _onChange = _ref.onChange,
+    _onClick = _ref.onClick,
+    _onDoubleClick = _ref.onDoubleClick,
+    iconColor = _ref.iconColor,
+    state = _ref.state;
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
     className: (0, _classnames["default"])(className, (0, _defineProperty2["default"])({}, _FlexGrid2["default"]['flexGrid-inactive'], state === _FlexGrid.flexGridState.inactive)),
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
       className: (0, _classnames["default"])(_visibilityDisplay["default"]['d-flex'], _flexbox["default"]['flex-row'], _flexbox["default"]['flex-items-start'], _colors["default"]['bg-blue-light'], (0, _defineProperty2["default"])({}, _borders["default"].border, items === null || items === void 0 ? void 0 : items[0])),
       children: items === null || items === void 0 ? void 0 : (_items$ = items[0]) === null || _items$ === void 0 ? void 0 : (_items$$names = _items$.names) === null || _items$$names === void 0 ? void 0 : _items$$names.map(function (name, nameIndex) {
         var _cx3, _items$2;
-
         var isIdColumn = nameIndex === idIndex;
         var isSelectedColumn = nameIndex === isSelectedIndex;
         var isSelectedComponent = selection === _FlexGrid.flexGridSelection.radio ? null : /*#__PURE__*/(0, _jsxRuntime.jsx)(_Checkbox.Checkbox, {
@@ -97,12 +70,10 @@ function FlexGrid(_ref) {
                 isSelected: newItem[isSelectedIndex]
               };
             });
-
             _onChange(newItems);
           }
         });
         var sortComponent;
-
         if (sort.index === nameIndex && sort.value === name) {
           if (sort.order === _sort.sortOrder.ascending) {
             sortComponent = /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.Icon, {
@@ -118,7 +89,6 @@ function FlexGrid(_ref) {
             });
           }
         }
-
         return /*#__PURE__*/(0, _jsxRuntime.jsx)(_react.Fragment, {
           children: !isIdColumn && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
             className: (0, _classnames["default"])(_typography["default"].h6, _visibilityDisplay["default"]['d-flex'], _flexbox["default"]['flex-row'], _padding["default"]['p-2'], _index["default"]['css-truncate'], _index["default"]['css-truncate-overflow'], _FlexGrid2["default"].item, (_cx3 = {}, (0, _defineProperty2["default"])(_cx3, _grid["default"]['col-2'], isSelectedColumn), (0, _defineProperty2["default"])(_cx3, _grid["default"]['col-12'], !isSelectedColumn), (0, _defineProperty2["default"])(_cx3, _flexbox["default"]['flex-justify-center'], isSelectedColumn), (0, _defineProperty2["default"])(_cx3, _flexbox["default"]['flex-justify-between'], !isSelectedColumn), _cx3)),
@@ -166,7 +136,6 @@ function FlexGrid(_ref) {
               if ((0, _typeof2["default"])(newValue) === 'object' && ['FileDirectory16', 'File16'].includes(newValue === null || newValue === void 0 ? void 0 : newValue.icon)) {
                 bubleUpNewItems = false;
               }
-
               return newItemIndex === itemIndex && newValueIndex === isSelectedIndex ? !newValue : newValue;
             });
           }).map(function (newItem) {
@@ -175,7 +144,6 @@ function FlexGrid(_ref) {
               isSelected: newItem[isSelectedIndex]
             };
           });
-
           if (bubleUpNewItems) {
             _onChange(newItems);
           }
@@ -188,7 +156,6 @@ function FlexGrid(_ref) {
         },
         children: item.values.map(function (value, valueIndex) {
           var _cx4;
-
           var isIdColumn = valueIndex === idIndex;
           var isSelectedColumn = valueIndex === isSelectedIndex;
           var isSelectedComponent = selection === _FlexGrid.flexGridSelection.radio ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Radio.Radio, {
@@ -197,31 +164,26 @@ function FlexGrid(_ref) {
             onChange: function onChange(event) {
               var newItems = items === null || items === void 0 ? void 0 : items.map(function (_ref4, newItemIndex) {
                 var names = _ref4.names,
-                    values = _ref4.values;
+                  values = _ref4.values;
                 return {
                   names: names,
                   values: values.map(function (newValue, newValueIndex) {
                     if (newItemIndex === itemIndex && newValueIndex === isSelectedIndex) {
                       return event.target.checked;
                     }
-
                     if (newItemIndex === itemIndex && newValueIndex !== isSelectedIndex) {
                       return newValue;
                     }
-
                     if (newItemIndex !== itemIndex && newValueIndex === isSelectedIndex) {
                       return false;
                     }
-
                     if (newItemIndex !== itemIndex && newValueIndex !== isSelectedIndex) {
                       return newValue;
                     }
-
                     return newValue;
                   })
                 };
               });
-
               _onChange(newItems);
             }
           }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_Checkbox.Checkbox, {
@@ -241,7 +203,6 @@ function FlexGrid(_ref) {
                   isSelected: newItem[isSelectedIndex]
                 };
               });
-
               _onChange(newItems);
             }
           });
@@ -272,6 +233,5 @@ function FlexGrid(_ref) {
     })]
   });
 }
-
 FlexGrid.propTypes = _FlexGrid.propTypes;
 FlexGrid.defaultProps = _FlexGrid.defaultProps;

package/build/primer/Grid/FlexGrid/FlexGrid.prop.js

@@ -4,9 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.propTypes = exports.flexGridState = exports.flexGridSelection = exports.defaultProps = void 0;
-
 var _propTypes = require("prop-types");
-
 var flexGridState = {
   active: 'active',
   inactive: 'inactive'

package/build/primer/Grid/FlexGrid/index.js

@@ -21,7 +21,5 @@ Object.defineProperty(exports, "flexGridState", {
     return _FlexGrid2.flexGridState;
   }
 });
-
 var _FlexGrid = require("./FlexGrid");
-
 var _FlexGrid2 = require("./FlexGrid.prop");

package/build/primer/Grid/index.js

@@ -4,11 +4,8 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.Grid = void 0;
-
 var _DisplayTable = require("./DisplayTable");
-
 var _FlexGrid = require("./FlexGrid");
-
 var Grid = {
   DisplayTable: _DisplayTable.DisplayTable,
   FlexGrid: _FlexGrid.FlexGrid,

package/build/primer/Icon/Icon.js

@@ -1,42 +1,30 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.Icon = Icon;
-
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
-
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-
 var _Icon = require("./Icon.prop");
-
 var _Icon2 = require("./Icon.part");
-
 var _jsxRuntime = require("react/jsx-runtime");
-
 var _excluded = ["className", "ariaLabel", "icon", "height", "width", "size", "fill", "verticalAlign"];
-
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
 var defaultSize = [16, 16];
-
 function Icon(_ref) {
   var className = _ref.className,
-      ariaLabel = _ref.ariaLabel,
-      icon = _ref.icon,
-      height = _ref.height,
-      width = _ref.width,
-      size = _ref.size,
-      fill = _ref.fill,
-      verticalAlign = _ref.verticalAlign,
-      otherProps = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
+    ariaLabel = _ref.ariaLabel,
+    icon = _ref.icon,
+    height = _ref.height,
+    width = _ref.width,
+    size = _ref.size,
+    fill = _ref.fill,
+    verticalAlign = _ref.verticalAlign,
+    otherProps = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
   var widthHeight = defaultSize;
   var attrs = {
     className: className,
@@ -46,7 +34,6 @@ function Icon(_ref) {
     role: 'img',
     viewBox: [0, 0].concat((0, _toConsumableArray2["default"])(widthHeight)).join(' ')
   };
-
   if (width && height) {
     Object.assign(attrs, {
       width: width,
@@ -62,7 +49,6 @@ function Icon(_ref) {
     attrs[given] = width || height || _Icon.iconSize[size] || size;
     attrs[computed] = attrs[given] * (dims[computed] / dims[given]);
   }
-
   attrs.style = {
     display: 'inline-block',
     fill: fill,
@@ -74,6 +60,5 @@ function Icon(_ref) {
     className: className
   }, attrs), otherProps)) : null;
 }
-
 Icon.propTypes = _Icon.propTypes;
 Icon.defaultProps = _Icon.defaultProps;