@k-int/stripes-kint-components 2.2.0 → 2.3.2

package/es/lib/CustomProperties/Filter/CustomPropertiesRule.js

@@ -0,0 +1,139 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _uniqueId2 = _interopRequireDefault(require("lodash/uniqueId"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _reactIntl = require("react-intl");
+
+var _reactFinalForm = require("react-final-form");
+
+var _components = require("@folio/stripes/components");
+
+var _validators = require("../../utils/validators");
+
+var _useValueProps = _interopRequireDefault(require("./useValueProps"));
+
+var _useOperators = _interopRequireDefault(require("./useOperators"));
+
+var _jsxRuntime = require("react/jsx-runtime");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+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) { _defineProperty(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; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+var propTypes = {
+  ariaLabelledby: _propTypes.default.string.isRequired,
+  clearRuleValue: _propTypes.default.func.isRequired,
+  index: _propTypes.default.number.isRequired,
+  name: _propTypes.default.string.isRequired,
+  onDelete: _propTypes.default.func.isRequired,
+  custPropDefinition: _propTypes.default.shape({
+    type: _propTypes.default.string,
+    category: _propTypes.default.shape({
+      values: _propTypes.default.arrayOf(_propTypes.default.object)
+    })
+  }),
+  value: _propTypes.default.shape({
+    operator: _propTypes.default.string,
+    value: _propTypes.default.string
+  })
+};
+
+var CustomPropertiesRule = function CustomPropertiesRule(_ref) {
+  var ariaLabelledby = _ref.ariaLabelledby,
+      clearRuleValue = _ref.clearRuleValue,
+      index = _ref.index,
+      name = _ref.name,
+      onDelete = _ref.onDelete,
+      _ref$custPropDefiniti = _ref.custPropDefinition,
+      custPropDefinition = _ref$custPropDefiniti === void 0 ? {} : _ref$custPropDefiniti,
+      value = _ref.value;
+  var operators = (0, _useOperators.default)(custPropDefinition.type);
+  var valueProps = (0, _useValueProps.default)(custPropDefinition);
+  var selectedOperator = operators.find(function (o) {
+    return o.value === (value === null || value === void 0 ? void 0 : value.operator);
+  });
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.Row, {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Col, {
+      xs: 2,
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Layout, {
+        className: "textCentered",
+        children: index === 0 ? null : /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactIntl.FormattedMessage, {
+          id: "stripes-kint-components.OR"
+        })
+      })
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Col, {
+      xs: 4,
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactFinalForm.Field, {
+        name: "".concat(name, ".operator"),
+        validate: _validators.required,
+        children: function children(_ref2) {
+          var input = _ref2.input,
+              meta = _ref2.meta;
+          return /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Select, _objectSpread(_objectSpread({}, input), {}, {
+            "aria-labelledby": "".concat(ariaLabelledby, "-rule-column-header-comparator"),
+            dataOptions: operators,
+            error: (meta === null || meta === void 0 ? void 0 : meta.touched) && (meta === null || meta === void 0 ? void 0 : meta.error),
+            onChange: function onChange(e) {
+              input.onChange(e);
+              var newlySelectedOperator = operators.find(function (o) {
+                return o.value === e.target.value;
+              });
+
+              if (newlySelectedOperator !== null && newlySelectedOperator !== void 0 && newlySelectedOperator.noValueAllowed) {
+                clearRuleValue();
+              }
+            },
+            placeholder: " ",
+            required: true
+          }));
+        }
+      })
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Col, {
+      xs: 4,
+      children: selectedOperator !== null && selectedOperator !== void 0 && selectedOperator.noValueAllowed ? null : /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactFinalForm.Field, _objectSpread({
+        "aria-labelledby": "".concat(ariaLabelledby, "-rule-column-header-value"),
+        name: "".concat(name, ".value"),
+        required: true,
+        validate: _validators.required
+      }, valueProps))
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Col, {
+      xs: 2,
+      children: index ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Tooltip, {
+        id: (0, _uniqueId2.default)('delete-rule-btn'),
+        text: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactIntl.FormattedMessage, {
+          id: "stripes-kint-components.customProperty.removeRule",
+          values: {
+            number: index + 1
+          }
+        }),
+        children: function children(_ref3) {
+          var ref = _ref3.ref,
+              ariaIds = _ref3.ariaIds;
+          return /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.IconButton, {
+            ref: ref,
+            "aria-labelledby": ariaIds.text,
+            icon: "trash",
+            onClick: onDelete
+          });
+        }
+      }) : null
+    })]
+  }, name);
+};
+
+CustomPropertiesRule.propTypes = propTypes;
+var _default = CustomPropertiesRule;
+exports.default = _default;

package/es/lib/CustomProperties/Filter/index.js

@@ -0,0 +1,55 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "CustomPropertiesFilter", {
+  enumerable: true,
+  get: function get() {
+    return _CustomPropertiesFilter.default;
+  }
+});
+Object.defineProperty(exports, "CustomPropertiesFilterField", {
+  enumerable: true,
+  get: function get() {
+    return _CustomPropertiesFilterField.default;
+  }
+});
+Object.defineProperty(exports, "CustomPropertiesFilterFieldArray", {
+  enumerable: true,
+  get: function get() {
+    return _CustomPropertiesFilterFieldArray.default;
+  }
+});
+Object.defineProperty(exports, "CustomPropertiesFilterForm", {
+  enumerable: true,
+  get: function get() {
+    return _CustomPropertiesFilterForm.default;
+  }
+});
+Object.defineProperty(exports, "useOperators", {
+  enumerable: true,
+  get: function get() {
+    return _useOperators.default;
+  }
+});
+Object.defineProperty(exports, "useParseActiveFilterStrings", {
+  enumerable: true,
+  get: function get() {
+    return _useParseActiveFilterStrings.default;
+  }
+});
+
+var _CustomPropertiesFilter = _interopRequireDefault(require("./CustomPropertiesFilter"));
+
+var _CustomPropertiesFilterForm = _interopRequireDefault(require("./CustomPropertiesFilterForm"));
+
+var _useOperators = _interopRequireDefault(require("./useOperators"));
+
+var _useParseActiveFilterStrings = _interopRequireDefault(require("./useParseActiveFilterStrings"));
+
+var _CustomPropertiesFilterField = _interopRequireDefault(require("./CustomPropertiesFilterField"));
+
+var _CustomPropertiesFilterFieldArray = _interopRequireDefault(require("./CustomPropertiesFilterFieldArray"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

package/es/lib/CustomProperties/Filter/useOperators.js

@@ -0,0 +1,100 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _reactIntl = require("react-intl");
+
+var CUSTPROP_TYPES = _interopRequireWildcard(require("../../constants/customProperties"));
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+var REFDATA = CUSTPROP_TYPES.REFDATA_CLASS_NAME,
+    DECIMAL = CUSTPROP_TYPES.DECIMAL_CLASS_NAME,
+    INTEGER = CUSTPROP_TYPES.INTEGER_CLASS_NAME,
+    DATE = CUSTPROP_TYPES.DATE_CLASS_NAME,
+    TEXT = CUSTPROP_TYPES.TEXT_CLASS_NAME;
+
+var useOperators = function useOperators(type) {
+  var intl = (0, _reactIntl.useIntl)();
+
+  var getLabel = function getLabel(id) {
+    return intl.formatMessage({
+      id: id
+    });
+  };
+
+  var operators = [{
+    value: ' isSet',
+    label: getLabel('stripes-kint-components.operator.isSet'),
+    noValueAllowed: true
+  }, {
+    value: ' isNotSet',
+    label: getLabel('stripes-kint-components.operator.isNotSet'),
+    noValueAllowed: true
+  }];
+
+  if (!type || type === INTEGER || type === DECIMAL) {
+    operators.push({
+      value: '==',
+      label: getLabel('stripes-kint-components.operator.equals')
+    }, {
+      value: '!=',
+      label: getLabel('stripes-kint-components.operator.doesNotEqual')
+    }, {
+      value: '>=',
+      label: getLabel('stripes-kint-components.operator.isGreaterThanOrEqual')
+    }, {
+      value: '<=',
+      label: getLabel('stripes-kint-components.operator.isLessThanOrEqual')
+    });
+  }
+
+  if (type === DATE) {
+    // Basically the same as the "number" types above, so no need to reassign if there is no type
+    operators.push({
+      value: '==',
+      label: getLabel('stripes-kint-components.operator.equals')
+    }, {
+      value: '!=',
+      label: getLabel('stripes-kint-components.operator.doesNotEqual')
+    }, {
+      value: '>=',
+      label: getLabel('stripes-kint-components.operator.isOnOrAfter')
+    }, {
+      value: '<=',
+      label: getLabel('stripes-kint-components.operator.isOnOrBefore')
+    });
+  }
+
+  if (!type || type === REFDATA) {
+    operators.push({
+      value: '==',
+      label: getLabel('stripes-kint-components.operator.is')
+    }, {
+      value: '!=',
+      label: getLabel('stripes-kint-components.operator.isNot')
+    });
+  }
+
+  if (!type || type === TEXT) {
+    operators.push({
+      value: '=~',
+      label: getLabel('stripes-kint-components.operator.contains')
+    }, {
+      value: '!~',
+      label: getLabel('stripes-kint-components.operator.doesNotContain')
+    });
+  }
+
+  return operators;
+};
+
+var _default = useOperators;
+exports.default = _default;

package/es/lib/CustomProperties/Filter/useParseActiveFilterStrings.js

@@ -0,0 +1,64 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _useOperators = _interopRequireDefault(require("./useOperators"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
+var useParseActiveFilterStrings = function useParseActiveFilterStrings(filterStrings) {
+  var operators = (0, _useOperators.default)().map(function (o) {
+    return o.value;
+  });
+  var numberOfFilters = 0;
+  var filters = filterStrings.map(function (filter) {
+    var customProperty;
+    var rules = filter.split('||').map(function (ruleString) {
+      var _operators$find;
+
+      // ruleString is constructed in this.handleSubmit passed to CustomPropertyFiltersForm
+      // and has shape "customProperties.foo.value!=42"
+      var _ruleString$split = ruleString.split('.value'),
+          _ruleString$split2 = _slicedToArray(_ruleString$split, 2),
+          customPropertyPath = _ruleString$split2[0],
+          rule = _ruleString$split2[1];
+
+      customProperty = customPropertyPath.replace('customProperties.', '');
+      var operator = (_operators$find = operators.find(function (o) {
+        return rule.startsWith(o);
+      })) !== null && _operators$find !== void 0 ? _operators$find : '';
+      var value = rule.substring(operator.length);
+      numberOfFilters += 1;
+      return {
+        operator: operator,
+        value: value
+      };
+    });
+    return {
+      customProperty: customProperty,
+      rules: rules
+    };
+  });
+  return {
+    filters: filters,
+    numberOfFilters: numberOfFilters
+  };
+};
+
+var _default = useParseActiveFilterStrings;
+exports.default = _default;

package/es/lib/CustomProperties/Filter/useValueProps.js

@@ -0,0 +1,67 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _components = require("@folio/stripes/components");
+
+var CUSTPROP_TYPES = _interopRequireWildcard(require("../../constants/customProperties"));
+
+var _validators = require("../../utils/validators");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+var REFDATA = CUSTPROP_TYPES.REFDATA_CLASS_NAME,
+    DECIMAL = CUSTPROP_TYPES.DECIMAL_CLASS_NAME,
+    INTEGER = CUSTPROP_TYPES.INTEGER_CLASS_NAME,
+    DATE = CUSTPROP_TYPES.DATE_CLASS_NAME,
+    TEXT = CUSTPROP_TYPES.TEXT_CLASS_NAME;
+
+var useValueProps = function useValueProps(custPropDefinition) {
+  var props = {
+    validate: _validators.required
+  };
+
+  switch (custPropDefinition.type) {
+    case INTEGER:
+    case DECIMAL:
+      props.component = _components.TextField;
+      props.type = 'number';
+      props.validate = _validators.invalidNumber;
+      break;
+
+    case REFDATA:
+      props.component = _components.Select;
+      props.dataOptions = custPropDefinition.category.values.map(function (rdv) {
+        return {
+          label: rdv.label,
+          value: rdv.id
+        };
+      });
+      props.placeholder = ' ';
+      break;
+
+    case DATE:
+      props.component = _components.Datepicker;
+      props.backendDateStandard = 'YYYY-MM-DD';
+      props.timeZone = 'UTC';
+      props.usePortal = true;
+      break;
+
+    case TEXT:
+    default:
+      props.component = _components.TextField;
+      break;
+  }
+
+  return props;
+};
+
+var _default = useValueProps;
+exports.default = _default;

package/es/lib/CustomProperties/View/CustomPropertiesView.js

@@ -0,0 +1,44 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _CustomPropertiesViewCtx = _interopRequireDefault(require("./CustomPropertiesViewCtx"));
+
+var _jsxRuntime = require("react/jsx-runtime");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+var CustomPropertiesView = function CustomPropertiesView(_ref) {
+  var _ref$contexts = _ref.contexts,
+      contexts = _ref$contexts === void 0 ? [] : _ref$contexts,
+      customProperties = _ref.customProperties,
+      customPropertiesEndpoint = _ref.customPropertiesEndpoint,
+      id = _ref.id,
+      _ref$labelOverrides = _ref.labelOverrides,
+      labelOverrides = _ref$labelOverrides === void 0 ? {} : _ref$labelOverrides;
+  return contexts.map(function (ctx) {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_CustomPropertiesViewCtx.default, {
+      ctx: ctx,
+      customProperties: customProperties,
+      customPropertiesEndpoint: customPropertiesEndpoint,
+      id: id,
+      labelOverrides: labelOverrides
+    }, "customPropertiesView-".concat(ctx));
+  });
+};
+
+CustomPropertiesView.propTypes = {
+  contexts: _propTypes.default.arrayOf(_propTypes.default.string),
+  customProperties: _propTypes.default.object,
+  customPropertiesEndpoint: _propTypes.default.string,
+  id: _propTypes.default.string,
+  labelOverrides: _propTypes.default.object,
+  nameOverride: _propTypes.default.string
+};
+var _default = CustomPropertiesView;
+exports.default = _default;

package/es/lib/CustomProperties/View/CustomPropertiesViewCtx.js

@@ -0,0 +1,155 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _reactIntl = require("react-intl");
+
+var _components = require("@folio/stripes/components");
+
+var _hooks = require("../../hooks");
+
+var _CustomPropertyCard = _interopRequireDefault(require("./CustomPropertyCard"));
+
+var _jsxRuntime = require("react/jsx-runtime");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
+var CustomPropertiesViewCtx = function CustomPropertiesViewCtx(_ref) {
+  var _custprops$filter$len, _custprops$filter, _Object$entries$filte, _Object$entries, _Object$entries$filte2;
+
+  var ctx = _ref.ctx,
+      _ref$customProperties = _ref.customProperties,
+      customProperties = _ref$customProperties === void 0 ? [] : _ref$customProperties,
+      customPropertiesEndpoint = _ref.customPropertiesEndpoint,
+      id = _ref.id,
+      labelOverrides = _ref.labelOverrides;
+
+  // Deal with all the possible label override options
+  var getAccordionLabel = function getAccordionLabel() {
+    var _labelOverrides$defau;
+
+    // Special case for null context
+    if (ctx === 'isNull') {
+      var _labelOverrides$noCon;
+
+      return (_labelOverrides$noCon = labelOverrides.noContext) !== null && _labelOverrides$noCon !== void 0 ? _labelOverrides$noCon : /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactIntl.FormattedMessage, {
+        id: "stripes-kint-components.customProperties"
+      });
+    } // Label overrides for specific contexts
+
+
+    if (labelOverrides[ctx]) {
+      return labelOverrides[ctx];
+    } // Label override for default title, taking ctx into account
+
+
+    if (labelOverrides.defaultTitle && typeof labelOverrides.defaultTitle === 'function') {
+      return labelOverrides.defaultTitle(ctx);
+    } // Label override for default title or finally built in default
+
+
+    return (_labelOverrides$defau = labelOverrides.defaultTitle) !== null && _labelOverrides$defau !== void 0 ? _labelOverrides$defau : /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactIntl.FormattedMessage, {
+      id: "stripes-kint-components.customProperties.ctx.title",
+      values: {
+        ctx: ctx
+      }
+    });
+  };
+
+  var _useCustomProperties = (0, _hooks.useCustomProperties)({
+    ctx: ctx,
+    endpoint: customPropertiesEndpoint,
+    returnQueryObject: true,
+    options: {
+      sort: [{
+        path: 'retired'
+      }, // Place retired custprops at the end
+      {
+        path: 'primary',
+        direction: 'desc'
+      }, // Primary properties should display before optional
+      {
+        path: 'label'
+      } // Within those groups, sort by label
+      ]
+    }
+  }),
+      custprops = _useCustomProperties.data,
+      isLoading = _useCustomProperties.isLoading;
+
+  if (isLoading) {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Accordion, {
+      closedByDefault: true,
+      displayWhenClosed: /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Spinner, {}),
+      displayWhenOpen: /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Spinner, {}),
+      id: "".concat(id, "-accordion-").concat(ctx),
+      label: getAccordionLabel(),
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Spinner, {})
+    });
+  } // We need to display any set properties, along with any non-set primary properties
+
+
+  var primaryCount = (_custprops$filter$len = custprops === null || custprops === void 0 ? void 0 : (_custprops$filter = custprops.filter(function (cp) {
+    return cp.primary === true;
+  })) === null || _custprops$filter === void 0 ? void 0 : _custprops$filter.length) !== null && _custprops$filter$len !== void 0 ? _custprops$filter$len : 0;
+  var optionalCount = (_Object$entries$filte = (_Object$entries = Object.entries(customProperties)) === null || _Object$entries === void 0 ? void 0 : (_Object$entries$filte2 = _Object$entries.filter(function (_ref2) {
+    var _cp$, _cp$$type, _cp$2, _cp$2$type, _cp$3, _cp$3$type;
+
+    var _ref3 = _slicedToArray(_ref2, 2),
+        _key = _ref3[0],
+        cp = _ref3[1];
+
+    return (((_cp$ = cp[0]) === null || _cp$ === void 0 ? void 0 : (_cp$$type = _cp$.type) === null || _cp$$type === void 0 ? void 0 : _cp$$type.ctx) === ctx || ctx === 'isNull' && !((_cp$2 = cp[0]) !== null && _cp$2 !== void 0 && (_cp$2$type = _cp$2.type) !== null && _cp$2$type !== void 0 && _cp$2$type.ctx)) && // Either the ctx string matches, or isNull matches blank
+    ((_cp$3 = cp[0]) === null || _cp$3 === void 0 ? void 0 : (_cp$3$type = _cp$3.type) === null || _cp$3$type === void 0 ? void 0 : _cp$3$type.primary) === false // Only count non-primary set custprops
+    ;
+  })) === null || _Object$entries$filte2 === void 0 ? void 0 : _Object$entries$filte2.length) !== null && _Object$entries$filte !== void 0 ? _Object$entries$filte : 0;
+  return primaryCount + optionalCount > 0 && /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Accordion, {
+    closedByDefault: true,
+    displayWhenClosed: /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Badge, {
+      children: primaryCount + optionalCount
+    }),
+    displayWhenOpen: /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Badge, {
+      children: primaryCount + optionalCount
+    }),
+    id: "".concat(id, "-accordion-").concat(ctx),
+    label: getAccordionLabel(),
+    children: custprops.map(function (cp, index) {
+      var _customProperties$cp$;
+
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_CustomPropertyCard.default, {
+        ctx: ctx,
+        customProperty: customProperties === null || customProperties === void 0 ? void 0 : (_customProperties$cp$ = customProperties[cp.name]) === null || _customProperties$cp$ === void 0 ? void 0 : _customProperties$cp$[0],
+        customPropertyDefinition: cp,
+        index: index,
+        labelOverrides: labelOverrides
+      }, "custom-property-card-".concat(ctx, "[").concat(index, "]"));
+    })
+  });
+};
+
+CustomPropertiesViewCtx.propTypes = {
+  ctx: _propTypes.default.string,
+  customProperties: _propTypes.default.object,
+  customPropertiesEndpoint: _propTypes.default.string,
+  id: _propTypes.default.string,
+  labelOverrides: _propTypes.default.object
+};
+var _default = CustomPropertiesViewCtx;
+exports.default = _default;