@pingux/astro 2.8.1 → 2.8.2-alpha.1

package/lib/components/EnvironmentBreadcrumb/EnvironmentBreadcrumb.stories.js

@@ -9,10 +9,11 @@ import _extends from "@babel/runtime-corejs3/helpers/esm/extends";
 import _defineProperty from "@babel/runtime-corejs3/helpers/esm/defineProperty";
 import _slicedToArray from "@babel/runtime-corejs3/helpers/esm/slicedToArray";
 function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (_Object$getOwnPropertySymbols) { var symbols = _Object$getOwnPropertySymbols(object); enumerableOnly && (symbols = _filterInstanceProperty(symbols).call(symbols, 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 _context6, _context7; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context6 = ownKeys(Object(source), !0)).call(_context6, function (key) { _defineProperty(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : _forEachInstanceProperty(_context7 = ownKeys(Object(source))).call(_context7, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var _context7, _context8; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context7 = ownKeys(Object(source), !0)).call(_context7, function (key) { _defineProperty(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : _forEachInstanceProperty(_context8 = ownKeys(Object(source))).call(_context8, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
 import _findInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/find";
-import _filterInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/filter";
+import _reduceInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/reduce";
 import _concatInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/concat";
+import _filterInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/filter";
 import _sliceInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/slice";
 import _indexOfInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/index-of";
 import _mapInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/map";
@@ -201,40 +202,49 @@ export var DefaultClosed = function DefaultClosed(args) {
   });
 };
 export var WithSections = function WithSections() {
+  var _context;
   var _useState5 = useState(environmentsWithSections),
     _useState6 = _slicedToArray(_useState5, 2),
     environments = _useState6[0],
     setEnvironments = _useState6[1];
-  var _useState7 = useState({
+  var _useState7 = useState(null),
+    _useState8 = _slicedToArray(_useState7, 2),
+    filteredOptionsNumber = _useState8[0],
+    setFilteredOptionsNumber = _useState8[1];
+  var _useState9 = useState({
       name: 'Consumer Banking Prod'
     }),
-    _useState8 = _slicedToArray(_useState7, 2),
-    selectedEnvironment = _useState8[0],
-    setSelectedEnvironment = _useState8[1];
+    _useState10 = _slicedToArray(_useState9, 2),
+    selectedEnvironment = _useState10[0],
+    setSelectedEnvironment = _useState10[1];
   var recentEnvShown = 3;
+  var totalOptionsNumber = _reduceInstanceProperty(environmentsWithSections).call(environmentsWithSections, function (acc, section) {
+    return acc + section.options.length;
+  }, 0);
+  var optionsCountMessage = filteredOptionsNumber === totalOptionsNumber ? "".concat(totalOptionsNumber, " options in total") : _concatInstanceProperty(_context = "".concat(filteredOptionsNumber, " of ")).call(_context, totalOptionsNumber, " options");
   var getUpdatedRecentEnvs = function getUpdatedRecentEnvs(envObj, prevEnvs) {
-    var _context3;
+    var _context4;
     var envName = envObj.name;
     var isDuplicate = _filterInstanceProperty(prevEnvs).call(prevEnvs, function (prevEnv) {
       return prevEnv.name === envName;
     }).length > 0;
     if (isDuplicate) {
-      var _context;
-      return _concatInstanceProperty(_context = [_objectSpread({}, envObj)]).call(_context, _filterInstanceProperty(prevEnvs).call(prevEnvs, function (prevEnv) {
+      var _context2;
+      return _concatInstanceProperty(_context2 = [_objectSpread({}, envObj)]).call(_context2, _filterInstanceProperty(prevEnvs).call(prevEnvs, function (prevEnv) {
         return prevEnv.name !== envName;
       }));
     }
     if (prevEnvs.length >= recentEnvShown) {
-      var _context2;
-      return _concatInstanceProperty(_context2 = [_objectSpread({}, envObj)]).call(_context2, _sliceInstanceProperty(prevEnvs).call(prevEnvs, 0, recentEnvShown - 1));
+      var _context3;
+      return _concatInstanceProperty(_context3 = [_objectSpread({}, envObj)]).call(_context3, _sliceInstanceProperty(prevEnvs).call(prevEnvs, 0, recentEnvShown - 1));
     }
-    return _concatInstanceProperty(_context3 = [_objectSpread({}, envObj)]).call(_context3, prevEnvs);
+    return _concatInstanceProperty(_context4 = [_objectSpread({}, envObj)]).call(_context4, prevEnvs);
   };
   var findEnvObj = function findEnvObj(envName, envSectionName) {
-    var _context4;
-    return _findInstanceProperty(_context4 = _findInstanceProperty(environments).call(environments, function (section) {
+    var _context5;
+    return _findInstanceProperty(_context5 = _findInstanceProperty(environments).call(environments, function (section) {
       return section.name === envSectionName;
-    }).options).call(_context4, function (option) {
+    }).options).call(_context5, function (option) {
       return option.name === envName;
     });
   };
@@ -271,6 +281,8 @@ export var WithSections = function WithSections() {
     name: "Globochem",
     selectedItem: envNode,
     onSelectionChange: handleEnvPress,
+    onFilteredOptionsNumber: setFilteredOptionsNumber,
+    optionsCountMessage: optionsCountMessage,
     isDefaultOpen: true
   }, function (_ref5) {
     var sectionName = _ref5.name,
@@ -281,12 +293,12 @@ export var WithSections = function WithSections() {
       title: sectionName,
       items: sectionOptions
     }, function (_ref6) {
-      var _context5;
+      var _context6;
       var itemName = _ref6.name,
         itemOptions = _ref6.options,
         isSandbox = _ref6.isSandbox;
       return ___EmotionJSX(Item, {
-        key: _concatInstanceProperty(_context5 = "".concat(sectionName, "-")).call(_context5, itemName),
+        key: _concatInstanceProperty(_context6 = "".concat(sectionName, "-")).call(_context6, itemName),
         childItems: itemOptions,
         textValue: itemName
       }, ___EmotionJSX(Box, {
@@ -305,13 +317,13 @@ export var OrgLevel = function OrgLevel() {
   });
 };
 export var DefaultOpen = function DefaultOpen() {
-  var _useState9 = useState({
+  var _useState11 = useState({
       name: 'Dog',
       isSandbox: true
     }),
-    _useState10 = _slicedToArray(_useState9, 2),
-    selectedEnvironment = _useState10[0],
-    setSelectedEnvironment = _useState10[1];
+    _useState12 = _slicedToArray(_useState11, 2),
+    selectedEnvironment = _useState12[0],
+    setSelectedEnvironment = _useState12[1];
   var envNode = ___EmotionJSX(Box, {
     isRow: true,
     key: selectedEnvironment.name
@@ -352,17 +364,17 @@ export var DefaultOpen = function DefaultOpen() {
   });
 };
 export var ControlledMenu = function ControlledMenu() {
-  var _useState11 = useState(false),
-    _useState12 = _slicedToArray(_useState11, 2),
-    isOpen = _useState12[0],
-    setIsOpen = _useState12[1];
-  var _useState13 = useState({
+  var _useState13 = useState(false),
+    _useState14 = _slicedToArray(_useState13, 2),
+    isOpen = _useState14[0],
+    setIsOpen = _useState14[1];
+  var _useState15 = useState({
       name: 'Shark',
       isSandbox: true
     }),
-    _useState14 = _slicedToArray(_useState13, 2),
-    selectedEnvironment = _useState14[0],
-    setSelectedEnvironment = _useState14[1];
+    _useState16 = _slicedToArray(_useState15, 2),
+    selectedEnvironment = _useState16[0],
+    setSelectedEnvironment = _useState16[1];
   var envNode = ___EmotionJSX(Box, {
     isRow: true,
     key: selectedEnvironment.name
@@ -404,13 +416,13 @@ export var ControlledMenu = function ControlledMenu() {
   });
 };
 export var RightAlignedBadges = function RightAlignedBadges(args) {
-  var _useState15 = useState({
+  var _useState17 = useState({
       name: 'Snail',
       isSandbox: true
     }),
-    _useState16 = _slicedToArray(_useState15, 2),
-    selectedEnvironment = _useState16[0],
-    setSelectedEnvironment = _useState16[1];
+    _useState18 = _slicedToArray(_useState17, 2),
+    selectedEnvironment = _useState18[0],
+    setSelectedEnvironment = _useState18[1];
   var envNode = ___EmotionJSX(Box, {
     isRow: true
   }, ___EmotionJSX(Text, {

package/lib/components/TextAreaField/TextAreaField.js

@@ -19,10 +19,6 @@ import { useColumnStyles, useField, useLabelHeight, usePropWarning } from '../..
 import { ariaAttributesBasePropTypes } from '../../utils/docUtils/ariaAttributes';
 import { inputFieldAttributesBasePropTypes } from '../../utils/docUtils/fieldAttributes';
 import { statusDefaultProp, statusPropTypes } from '../../utils/docUtils/statusProp';
-
-/**
- * Combines a textarea, label, and helper text for a complete, form-ready solution.
- */
 import { jsx as ___EmotionJSX } from "@emotion/react";
 var TextAreaField = /*#__PURE__*/forwardRef(function (props, ref) {
   var helperText = props.helperText,

package/lib/components/TextAreaField/TextAreaField.stories.js

@@ -14,17 +14,22 @@ function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var _context, _context2; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context = ownKeys(Object(source), !0)).call(_context, function (key) { _defineProperty(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : _forEachInstanceProperty(_context2 = ownKeys(Object(source))).call(_context2, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
 import React, { useState } from 'react';
 import SearchIcon from '@pingux/mdi-react/SearchIcon';
+import DocsLayout from '../../../.storybook/storybookDocsLayout';
 import { Box, Icon, TextAreaField } from '../../index';
 import { ariaAttributeBaseArgTypes } from '../../utils/docUtils/ariaAttributes';
 import { inputFieldAttributeBaseArgTypes } from '../../utils/docUtils/fieldAttributes';
 import { statusArgTypes } from '../../utils/docUtils/statusProp';
 import { modes as labelModes } from '../Label/constants';
+import TextAreaFieldReadme from './TextAreaField.mdx';
 import { jsx as ___EmotionJSX } from "@emotion/react";
 export default {
   title: 'Form/TextAreaField',
   component: TextAreaField,
   parameters: {
     docs: {
+      page: function page() {
+        return ___EmotionJSX(React.Fragment, null, ___EmotionJSX(TextAreaFieldReadme, null), ___EmotionJSX(DocsLayout, null));
+      },
       source: {
         type: 'code'
       }

package/lib/components/TextField/TextField.js

@@ -19,10 +19,6 @@ import useColumnStyles from '../../hooks/useColumnStyles';
 import { ariaAttributesBasePropTypes } from '../../utils/docUtils/ariaAttributes';
 import { inputFieldAttributesBasePropTypes } from '../../utils/docUtils/fieldAttributes';
 import { statusDefaultProp, statusPropTypes } from '../../utils/docUtils/statusProp';
-
-/**
- * Combines a text input, label, and helper text for a complete, form-ready solution.
- */
 import { jsx as ___EmotionJSX } from "@emotion/react";
 var TextField = /*#__PURE__*/forwardRef(function (props, ref) {
   var helperText = props.helperText,

package/lib/components/TextField/TextField.stories.js

@@ -16,6 +16,7 @@ function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var _context, _context2; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context = ownKeys(Object(source), !0)).call(_context, function (key) { _defineProperty(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : _forEachInstanceProperty(_context2 = ownKeys(Object(source))).call(_context2, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
 import React, { useState } from 'react';
 import isEmpty from 'lodash/isEmpty';
+import DocsLayout from '../../../.storybook/storybookDocsLayout';
 import useCopyToClipboard from '../../hooks/useCopyToClipboard';
 import { Box, TextField } from '../../index';
 import { ariaAttributeBaseArgTypes } from '../../utils/docUtils/ariaAttributes';
@@ -23,12 +24,16 @@ import { inputFieldAttributeBaseArgTypes } from '../../utils/docUtils/fieldAttri
 import { statusArgTypes } from '../../utils/docUtils/statusProp';
 import CopyButton from '../CopyText/CopyButton';
 import { modes as labelModes } from '../Label/constants';
+import TextFieldReadme from './TextField.mdx';
 import { jsx as ___EmotionJSX } from "@emotion/react";
 export default {
   title: 'Form/TextField',
   component: TextField,
   parameters: {
     docs: {
+      page: function page() {
+        return ___EmotionJSX(React.Fragment, null, ___EmotionJSX(TextFieldReadme, null), ___EmotionJSX(DocsLayout, null));
+      },
       source: {
         type: 'code'
       }

package/lib/components/TimeZonePicker/TimeZonePicker.js

@@ -57,14 +57,6 @@ var getTimezoneOffset = function getTimezoneOffset(timeZone) {
   var formattedString = "".concat(offset, ":00");
   return offset > 0 ? "+".concat(formattedString) : formattedString;
 };
-
-/**
- *  Component allows users to choose a timezone from the list.
- *  You can checkout the default timezones list [here](https://github.com/yury-dymov/react-bootstrap-timezone-picker/blob/master/src/timezones.json).
- *
- *  Utilizes ComboBoxField component. You can use the same props as with
- *  the ComboBoxField - they will be spread into it.
- */
 var TimeZonePicker = /*#__PURE__*/forwardRef(function (props, ref) {
   var additionalTimeZones = props.additionalTimeZones,
     emptySearchText = props.emptySearchText,

package/lib/components/TimeZonePicker/TimeZonePicker.stories.js

@@ -1,9 +1,18 @@
 import React from 'react';
+import DocsLayout from '../../../.storybook/storybookDocsLayout';
 import { TimeZonePicker } from '../../index';
+import TimeZonePickerReadme from './TimeZonePicker.mdx';
 import { jsx as ___EmotionJSX } from "@emotion/react";
 export default {
   title: 'Form/TimeZonePicker',
-  component: TimeZonePicker
+  component: TimeZonePicker,
+  parameters: {
+    docs: {
+      page: function page() {
+        return ___EmotionJSX(React.Fragment, null, ___EmotionJSX(TimeZonePickerReadme, null), ___EmotionJSX(DocsLayout, null));
+      }
+    }
+  }
 };
 export var Default = function Default() {
   return ___EmotionJSX(TimeZonePicker, {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pingux/astro",
-  "version": "2.8.1",
+  "version": "2.8.2-alpha.1",
   "description": "PingUX themeable React component library",
   "repository": {
     "type": "git",