@dhis2-ui/select 9.5.0-alpha.1 → 9.6.0

package/build/cjs/multi-select/features/position/index.js

@@ -1,19 +1,17 @@
 "use strict";
 
-require("../common/index.js");
+var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
 
-var _steps = require("cypress-cucumber-preprocessor/steps");
-
-(0, _steps.Given)('there is enough space below the anchor to fit the MultiSelect menu', () => {
+(0, _cypressCucumberPreprocessor.Given)('there is enough space below the anchor to fit the MultiSelect menu', () => {
   cy.visitStory('MultiSelect', 'Default position');
 });
-(0, _steps.Given)('there is not enough space below the anchor to fit the MultiSelect menu', () => {
+(0, _cypressCucumberPreprocessor.Given)('there is not enough space below the anchor to fit the MultiSelect menu', () => {
   cy.visitStory('MultiSelect', 'Flipped position');
 });
-(0, _steps.Given)('there is not enough space above or below the anchor to fit the MultiSelect menu', () => {
+(0, _cypressCucumberPreprocessor.Given)('there is not enough space above or below the anchor to fit the MultiSelect menu', () => {
   cy.visitStory('MultiSelect', 'Shifted into view');
 });
-(0, _steps.Given)('the input is empty', () => {
+(0, _cypressCucumberPreprocessor.Given)('the input is empty', () => {
   cy.get('[data-test="dhis2-uicore-select-input"]').should('exist').should('have.length', 1).then(inputs => {
     const $input = inputs[0];
     const inputRect = $input.getBoundingClientRect();
@@ -21,19 +19,19 @@ var _steps = require("cypress-cucumber-preprocessor/steps");
   }).as('emptyInputHeight');
   cy.get('[data-test="dhis2-uicore-select-input"] .root').should('be.empty');
 });
-(0, _steps.When)('the MultiSelect is clicked', () => {
+(0, _cypressCucumberPreprocessor.When)('the MultiSelect is clicked', () => {
   cy.get('[data-test="dhis2-uicore-multiselect"]').click();
 });
-(0, _steps.When)('the window is scrolled down', () => {
+(0, _cypressCucumberPreprocessor.When)('the window is scrolled down', () => {
   cy.scrollTo(0, 800);
 });
-(0, _steps.When)('the window is resized to a greater width', () => {
+(0, _cypressCucumberPreprocessor.When)('the window is resized to a greater width', () => {
   cy.viewport(1200, 660);
 });
-(0, _steps.When)('an option is clicked', () => {
+(0, _cypressCucumberPreprocessor.When)('an option is clicked', () => {
   cy.contains('option one').click();
 });
-(0, _steps.Then)('the Input remains the same height', () => {
+(0, _cypressCucumberPreprocessor.Then)('the Input remains the same height', () => {
   const emptyInputHeight = '@emptyInputHeight';
   const inputDataTest = '[data-test="dhis2-uicore-select-input"]';
   cy.getAll(emptyInputHeight, inputDataTest).should(_ref => {
@@ -44,7 +42,7 @@ var _steps = require("cypress-cucumber-preprocessor/steps");
     expect(inputRect.height).to.equal(emptyInputHeight);
   });
 });
-(0, _steps.Then)('the top of the menu is aligned with the bottom of the input', () => {
+(0, _cypressCucumberPreprocessor.Then)('the top of the menu is aligned with the bottom of the input', () => {
   const selectDataTest = '[data-test="dhis2-uicore-multiselect"]';
   const menuDataTest = '[data-test="dhis2-uicore-select-menu-menuwrapper"]';
   cy.getAll(selectDataTest, menuDataTest).should(_ref2 => {
@@ -58,7 +56,7 @@ var _steps = require("cypress-cucumber-preprocessor/steps");
     expect(menuRect.top).to.equal(selectRect.bottom);
   });
 });
-(0, _steps.Then)('the bottom of the menu is aligned with the top of the input', () => {
+(0, _cypressCucumberPreprocessor.Then)('the bottom of the menu is aligned with the top of the input', () => {
   const selectDataTest = '[data-test="dhis2-uicore-multiselect"]';
   const menuDataTest = '[data-test="dhis2-uicore-select-menu-menuwrapper"]';
   cy.getAll(selectDataTest, menuDataTest).should(_ref3 => {
@@ -72,7 +70,7 @@ var _steps = require("cypress-cucumber-preprocessor/steps");
     expect(selectRect.top).to.equal(menuRect.bottom);
   });
 });
-(0, _steps.Then)('it is rendered on top of the MultiSelect', () => {
+(0, _cypressCucumberPreprocessor.Then)('it is rendered on top of the MultiSelect', () => {
   const selectDataTest = '[data-test="dhis2-uicore-multiselect"]';
   const menuDataTest = '[data-test="dhis2-uicore-select-menu-menuwrapper"]';
   cy.getAll(selectDataTest, menuDataTest).should(_ref4 => {
@@ -87,7 +85,7 @@ var _steps = require("cypress-cucumber-preprocessor/steps");
     expect(menuRect.bottom).to.be.greaterThan(selectRect.bottom);
   });
 });
-(0, _steps.Then)('the left of the Menu is aligned with the left of the Input', () => {
+(0, _cypressCucumberPreprocessor.Then)('the left of the Menu is aligned with the left of the Input', () => {
   const selectDataTest = '[data-test="dhis2-uicore-multiselect"]';
   const menuDataTest = '[data-test="dhis2-uicore-select-menu-menuwrapper"]';
   cy.getAll(selectDataTest, menuDataTest).should(_ref5 => {
@@ -101,7 +99,7 @@ var _steps = require("cypress-cucumber-preprocessor/steps");
     expect(selectRect.left).to.equal(menuRect.left);
   });
 });
-(0, _steps.Then)('the Menu and the Input have an equal width', () => {
+(0, _cypressCucumberPreprocessor.Then)('the Menu and the Input have an equal width', () => {
   const inputDataTest = '[data-test="dhis2-uicore-multiselect"] .root-input';
   const menuDataTest = '[data-test="dhis2-uicore-select-menu-menuwrapper"]';
   cy.getAll(inputDataTest, menuDataTest).should(_ref6 => {

package/build/cjs/multi-select/features/shows_selections/index.js

@@ -1,19 +1,17 @@
 "use strict";
 
-require("../common/index.js");
+var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
 
-var _steps = require("cypress-cucumber-preprocessor/steps");
-
-(0, _steps.Given)('a MultiSelect with options and a selection is rendered', () => {
+(0, _cypressCucumberPreprocessor.Given)('a MultiSelect with options and a selection is rendered', () => {
   cy.visitStory('MultiSelect', 'With options and a selection');
 });
-(0, _steps.Given)('a MultiSelect with options and multiple selections is rendered', () => {
+(0, _cypressCucumberPreprocessor.Given)('a MultiSelect with options and multiple selections is rendered', () => {
   cy.visitStory('MultiSelect', 'With options and multiple selections');
 });
-(0, _steps.Then)('the selection is displayed', () => {
+(0, _cypressCucumberPreprocessor.Then)('the selection is displayed', () => {
   cy.contains('option one').should('be.visible');
 });
-(0, _steps.Then)('the selections are displayed', () => {
+(0, _cypressCucumberPreprocessor.Then)('the selections are displayed', () => {
   cy.contains('option one').should('be.visible');
   cy.contains('option two').should('be.visible');
 });

package/build/cjs/multi-select/input.js

@@ -39,7 +39,7 @@ const Input = _ref => {
   } = _ref;
   const hasSelection = selected.length > 0;
 
-  const onClear = (_, e) => {
+  const onClear = e => {
     const data = {
       selected: []
     };
@@ -48,7 +48,7 @@ const Input = _ref => {
   };
 
   return /*#__PURE__*/_react.default.createElement("div", {
-    className: _style.default.dynamic([["1209882888", [_uiConstants.colors.grey900]], ["1331770409", [inputMaxHeight]]]) + " " + ((0, _classnames.default)('root', className) || "")
+    className: _style.default.dynamic([["64009541", [_uiConstants.colors.grey900]], ["1331770409", [inputMaxHeight]]]) + " " + ((0, _classnames.default)('root', className) || "")
   }, /*#__PURE__*/_react.default.createElement(_index.InputPrefix, {
     prefix: prefix,
     dataTest: "".concat(dataTest, "-prefix")
@@ -56,22 +56,22 @@ const Input = _ref => {
     placeholder: placeholder,
     dataTest: "".concat(dataTest, "-placeholder")
   }), hasSelection && /*#__PURE__*/_react.default.createElement("div", {
-    className: _style.default.dynamic([["1209882888", [_uiConstants.colors.grey900]], ["1331770409", [inputMaxHeight]]]) + " " + "root-input"
+    className: _style.default.dynamic([["64009541", [_uiConstants.colors.grey900]], ["1331770409", [inputMaxHeight]]]) + " " + "root-input"
   }, /*#__PURE__*/_react.default.createElement(_selectionList.SelectionList, {
     selected: selected,
     onChange: onChange,
     options: options,
     disabled: disabled
   })), hasSelection && clearable && !disabled && /*#__PURE__*/_react.default.createElement("div", {
-    className: _style.default.dynamic([["1209882888", [_uiConstants.colors.grey900]], ["1331770409", [inputMaxHeight]]]) + " " + "root-right"
+    className: _style.default.dynamic([["64009541", [_uiConstants.colors.grey900]], ["1331770409", [inputMaxHeight]]]) + " " + "root-right"
   }, /*#__PURE__*/_react.default.createElement(_index.InputClearButton, {
     onClear: onClear,
     clearText: clearText,
     dataTest: "".concat(dataTest, "-clear")
   })), /*#__PURE__*/_react.default.createElement(_style.default, {
-    id: "1209882888",
+    id: "64009541",
     dynamic: [_uiConstants.colors.grey900]
-  }, [".root.__jsx-style-dynamic-selector{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;color:".concat(_uiConstants.colors.grey900, ";font-size:14px;line-height:16px;}"), ".root-input.__jsx-style-dynamic-selector{overflow-y:auto;-webkit-flex:1;-ms-flex:1;flex:1;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-flow:wrap;-ms-flex-flow:wrap;flex-flow:wrap;gap:4px;}", ".root-right.__jsx-style-dynamic-selector{margin-inline-start:auto;margin-inline-end:10px;}"]), /*#__PURE__*/_react.default.createElement(_style.default, {
+  }, [".root.__jsx-style-dynamic-selector{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;color:".concat(_uiConstants.colors.grey900, ";font-size:14px;line-height:16px;}"), ".root-input.__jsx-style-dynamic-selector{overflow-y:auto;-webkit-flex:1;-ms-flex:1;flex:1;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-flow:wrap;-ms-flex-flow:wrap;flex-flow:wrap;gap:4px;}", ".root-right.__jsx-style-dynamic-selector{margin-inline-start:auto;}"]), /*#__PURE__*/_react.default.createElement(_style.default, {
     id: "1331770409",
     dynamic: [inputMaxHeight]
   }, [".root-input.__jsx-style-dynamic-selector{max-height:".concat(inputMaxHeight, ";}")]));

package/build/cjs/multi-select-field/features/accepts_help_text/index.js

@@ -1,10 +1,10 @@
 "use strict";
 
-var _steps = require("cypress-cucumber-preprocessor/steps");
+var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
 
-(0, _steps.Given)('a MultiSelectField with help text is rendered', () => {
+(0, _cypressCucumberPreprocessor.Given)('a MultiSelectField with help text is rendered', () => {
   cy.visitStory('MultiSelectField', 'With help text');
 });
-(0, _steps.Then)('the help text is visible', () => {
+(0, _cypressCucumberPreprocessor.Then)('the help text is visible', () => {
   cy.contains('The help text').should('be.visible');
 });

package/build/cjs/multi-select-field/features/accepts_label/index.js

@@ -1,10 +1,10 @@
 "use strict";
 
-var _steps = require("cypress-cucumber-preprocessor/steps");
+var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
 
-(0, _steps.Given)('a MultiSelectField with a label is rendered', () => {
+(0, _cypressCucumberPreprocessor.Given)('a MultiSelectField with a label is rendered', () => {
   cy.visitStory('MultiSelectField', 'With label');
 });
-(0, _steps.Then)('the label is visible', () => {
+(0, _cypressCucumberPreprocessor.Then)('the label is visible', () => {
   cy.contains('The label').should('be.visible');
 });

package/build/cjs/multi-select-field/features/accepts_validation_text/index.js

@@ -1,10 +1,10 @@
 "use strict";
 
-var _steps = require("cypress-cucumber-preprocessor/steps");
+var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
 
-(0, _steps.Given)('a MultiSelectField with validation text is rendered', () => {
+(0, _cypressCucumberPreprocessor.Given)('a MultiSelectField with validation text is rendered', () => {
   cy.visitStory('MultiSelectField', 'With validation text');
 });
-(0, _steps.Then)('the validation text is visible', () => {
+(0, _cypressCucumberPreprocessor.Then)('the validation text is visible', () => {
   cy.contains('The validation text').should('be.visible');
 });

package/build/cjs/multi-select-field/features/can_be_required/index.js

@@ -1,10 +1,10 @@
 "use strict";
 
-var _steps = require("cypress-cucumber-preprocessor/steps");
+var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
 
-(0, _steps.Given)('a MultiSelectField with label and a required flag is rendered', () => {
+(0, _cypressCucumberPreprocessor.Given)('a MultiSelectField with label and a required flag is rendered', () => {
   cy.visitStory('MultiSelectField', 'With label and required status');
 });
-(0, _steps.Then)('the required indicator is visible', () => {
+(0, _cypressCucumberPreprocessor.Then)('the required indicator is visible', () => {
   cy.get('[data-test="dhis2-uiwidgets-multiselectfield-label-required"]').should('be.visible');
 });

package/build/cjs/multi-select-field/features/has_default_clear_text/index.js

@@ -1,10 +1,13 @@
 "use strict";
 
-var _steps = require("cypress-cucumber-preprocessor/steps");
+var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
 
-(0, _steps.Given)('a clearable MultiSelectField with selected option is rendered', () => {
+(0, _cypressCucumberPreprocessor.Given)('a clearable MultiSelectField with selected option is rendered', () => {
   cy.visitStory('MultiSelectField', 'With clearable and selected option');
 });
-(0, _steps.Then)('the clear text is visible', () => {
+(0, _cypressCucumberPreprocessor.When)('the clear button is hovered', () => {
+  cy.get('[data-test="dhis2-uicore-multiselect-clear"]').trigger('mouseover', 'top');
+});
+(0, _cypressCucumberPreprocessor.Then)('the clear text is visible', () => {
   cy.contains('Clear').should('be.visible');
 });

package/build/cjs/multi-select-field/features/has_default_clear_text.feature

@@ -2,4 +2,5 @@ Feature: Clear text for the MultiSelectField
 
     Scenario: Rendering a clearable MultiSelectField
         Given a clearable MultiSelectField with selected option is rendered
+        When the clear button is hovered
         Then the clear text is visible

package/build/cjs/multi-select-field/features/has_default_empty_text/index.js

@@ -1,13 +1,13 @@
 "use strict";
 
-var _steps = require("cypress-cucumber-preprocessor/steps");
+var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
 
-(0, _steps.Given)('an empty MultiSelectField is rendered', () => {
+(0, _cypressCucumberPreprocessor.Given)('an empty MultiSelectField is rendered', () => {
   cy.visitStory('MultiSelectField', 'Without options');
 });
-(0, _steps.When)('the Select is opened', () => {
+(0, _cypressCucumberPreprocessor.When)('the Select is opened', () => {
   cy.get('[data-test="dhis2-uicore-select-input"]').click();
 });
-(0, _steps.Then)('the empty text is visible', () => {
+(0, _cypressCucumberPreprocessor.Then)('the empty text is visible', () => {
   cy.contains('No data found').should('be.visible');
 });

package/build/cjs/multi-select-field/features/has_default_filter_nomatch_text/index.js

@@ -1,16 +1,16 @@
 "use strict";
 
-var _steps = require("cypress-cucumber-preprocessor/steps");
+var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
 
-(0, _steps.Given)('a filterable MultiSelectField is rendered', () => {
+(0, _cypressCucumberPreprocessor.Given)('a filterable MultiSelectField is rendered', () => {
   cy.visitStory('MultiSelectField', 'With filterable');
 });
-(0, _steps.When)('the Select is opened', () => {
+(0, _cypressCucumberPreprocessor.When)('the Select is opened', () => {
   cy.get('[data-test="dhis2-uicore-select-input"]').click();
 });
-(0, _steps.When)('a filter that does not match any options is entered', () => {
+(0, _cypressCucumberPreprocessor.When)('a filter that does not match any options is entered', () => {
   cy.focused().type('Two');
 });
-(0, _steps.Then)('the no match text is visible', () => {
+(0, _cypressCucumberPreprocessor.Then)('the no match text is visible', () => {
   cy.contains('No options found').should('be.visible');
 });

package/build/cjs/multi-select-field/features/has_default_filter_placeholder/index.js

@@ -1,13 +1,13 @@
 "use strict";
 
-var _steps = require("cypress-cucumber-preprocessor/steps");
+var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
 
-(0, _steps.Given)('a filterable MultiSelectField is rendered', () => {
+(0, _cypressCucumberPreprocessor.Given)('a filterable MultiSelectField is rendered', () => {
   cy.visitStory('MultiSelectField', 'With filterable');
 });
-(0, _steps.When)('the Select is opened', () => {
+(0, _cypressCucumberPreprocessor.When)('the Select is opened', () => {
   cy.get('[data-test="dhis2-uicore-select-input"]').click();
 });
-(0, _steps.Then)('the filter placeholder exists', () => {
+(0, _cypressCucumberPreprocessor.Then)('the filter placeholder exists', () => {
   cy.get('[data-test="dhis2-uicore-multiselect-filterinput"] [placeholder="Type to filter options"]').should('exist');
 });

package/build/cjs/multi-select-field/features/has_default_loading_text/index.js

@@ -1,13 +1,13 @@
 "use strict";
 
-var _steps = require("cypress-cucumber-preprocessor/steps");
+var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
 
-(0, _steps.Given)('a loading MultiSelectField is rendered', () => {
+(0, _cypressCucumberPreprocessor.Given)('a loading MultiSelectField is rendered', () => {
   cy.visitStory('MultiSelectField', 'With loading');
 });
-(0, _steps.When)('the Select is opened', () => {
+(0, _cypressCucumberPreprocessor.When)('the Select is opened', () => {
   cy.get('[data-test="dhis2-uicore-select-input"]').click();
 });
-(0, _steps.Then)('the loading text is visible', () => {
+(0, _cypressCucumberPreprocessor.Then)('the loading text is visible', () => {
   cy.contains('Loading options').should('be.visible');
 });

package/build/cjs/select/input-clear-button.js

@@ -5,7 +5,11 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.InputClearButton = void 0;
 
-var _button = require("@dhis2-ui/button");
+var _style = _interopRequireDefault(require("styled-jsx/style"));
+
+var _tooltip = require("@dhis2-ui/tooltip");
+
+var _uiConstants = require("@dhis2/ui-constants");
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
 
@@ -20,14 +24,29 @@ const InputClearButton = _ref => {
     className,
     dataTest
   } = _ref;
-  return /*#__PURE__*/_react.default.createElement(_button.Button, {
-    small: true,
-    secondary: true,
-    dataTest: dataTest,
+  return /*#__PURE__*/_react.default.createElement(_tooltip.Tooltip, {
+    openDelay: 500,
+    content: clearText
+  }, /*#__PURE__*/_react.default.createElement("button", {
+    "data-test": dataTest,
     onClick: onClear,
     type: "button",
-    className: className
-  }, clearText);
+    className: _style.default.dynamic([["2606883952", [_uiConstants.colors.grey500, _uiConstants.colors.grey800, _uiConstants.colors.grey200, _uiConstants.theme.focus]]]) + " " + (className || "")
+  }, /*#__PURE__*/_react.default.createElement("svg", {
+    width: "16",
+    height: "16",
+    viewBox: "0 0 16 16",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    className: _style.default.dynamic([["2606883952", [_uiConstants.colors.grey500, _uiConstants.colors.grey800, _uiConstants.colors.grey200, _uiConstants.theme.focus]]])
+  }, /*#__PURE__*/_react.default.createElement("path", {
+    d: "M8 16A8 8 0 1 0 8 0a8 8 0 0 0 0 16Zm3.536-5.879a1 1 0 1 1-1.415 1.414l-2.12-2.12-2.122 2.121a1 1 0 1 1-1.415-1.414L6.586 8 4.464 5.878A1 1 0 1 1 5.88 4.464L8 6.586l2.121-2.121a1 1 0 1 1 1.415 1.414L9.415 8l2.12 2.121Z",
+    fill: "none",
+    className: _style.default.dynamic([["2606883952", [_uiConstants.colors.grey500, _uiConstants.colors.grey800, _uiConstants.colors.grey200, _uiConstants.theme.focus]]])
+  })), /*#__PURE__*/_react.default.createElement(_style.default, {
+    id: "2606883952",
+    dynamic: [_uiConstants.colors.grey500, _uiConstants.colors.grey800, _uiConstants.colors.grey200, _uiConstants.theme.focus]
+  }, ["button.__jsx-style-dynamic-selector{background:none;border:none;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;cursor:pointer;height:24px;width:24px;border-radius:3px;}", "button.__jsx-style-dynamic-selector svg.__jsx-style-dynamic-selector path.__jsx-style-dynamic-selector{fill:".concat(_uiConstants.colors.grey500, ";}"), "button.__jsx-style-dynamic-selector:hover svg.__jsx-style-dynamic-selector path.__jsx-style-dynamic-selector{fill:".concat(_uiConstants.colors.grey800, ";}"), "button.__jsx-style-dynamic-selector:hover{background:".concat(_uiConstants.colors.grey200, ";}"), "button.__jsx-style-dynamic-selector:focus{outline:2px solid ".concat(_uiConstants.theme.focus, ";}")])));
 };
 
 exports.InputClearButton = InputClearButton;

package/build/cjs/single-select/features/accepts_blur_cb/index.js

@@ -1,13 +1,11 @@
 "use strict";
 
-require("../common/index.js");
+var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
 
-var _steps = require("cypress-cucumber-preprocessor/steps");
-
-(0, _steps.Given)('a SingleSelect with onBlur handler is rendered', () => {
+(0, _cypressCucumberPreprocessor.Given)('a SingleSelect with onBlur handler is rendered', () => {
   cy.visitStory('SingleSelect', 'With onBlur');
 });
-(0, _steps.Then)('the onBlur handler is called', () => {
+(0, _cypressCucumberPreprocessor.Then)('the onBlur handler is called', () => {
   cy.window().should(win => {
     expect(win.onBlur).to.be.calledOnce;
     expect(win.onBlur).to.be.calledWith({

package/build/cjs/single-select/features/accepts_focus_cb/index.js

@@ -1,13 +1,11 @@
 "use strict";
 
-require("../common/index.js");
+var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
 
-var _steps = require("cypress-cucumber-preprocessor/steps");
-
-(0, _steps.Given)('a SingleSelect with onFocus handler is rendered', () => {
+(0, _cypressCucumberPreprocessor.Given)('a SingleSelect with onFocus handler is rendered', () => {
   cy.visitStory('SingleSelect', 'With onFocus');
 });
-(0, _steps.Then)('the onFocus handler is called', () => {
+(0, _cypressCucumberPreprocessor.Then)('the onFocus handler is called', () => {
   cy.window().should(win => {
     expect(win.onFocus).to.be.calledOnce;
     expect(win.onFocus).to.be.calledWith({

package/build/cjs/single-select/features/accepts_initial_focus/index.js

@@ -1,9 +1,7 @@
 "use strict";
 
-require("../common/index.js");
+var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
 
-var _steps = require("cypress-cucumber-preprocessor/steps");
-
-(0, _steps.Given)('a SingleSelect with initial focus is rendered', () => {
+(0, _cypressCucumberPreprocessor.Given)('a SingleSelect with initial focus is rendered', () => {
   cy.visitStory('SingleSelect', 'With initialFocus');
 });

package/build/cjs/single-select/features/accepts_loading/index.js

@@ -1,18 +1,16 @@
 "use strict";
 
-require("../common/index.js");
+var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
 
-var _steps = require("cypress-cucumber-preprocessor/steps");
-
-(0, _steps.Given)('a SingleSelect with options and a loading flag is rendered', () => {
+(0, _cypressCucumberPreprocessor.Given)('a SingleSelect with options and a loading flag is rendered', () => {
   cy.visitStory('SingleSelect', 'With options and loading');
 });
-(0, _steps.Given)('a SingleSelect with options, a loading flag and a loading text is rendered', () => {
+(0, _cypressCucumberPreprocessor.Given)('a SingleSelect with options, a loading flag and a loading text is rendered', () => {
   cy.visitStory('SingleSelect', 'With options, loading and loading text');
 });
-(0, _steps.Then)('the loading spinner is displayed', () => {
+(0, _cypressCucumberPreprocessor.Then)('the loading spinner is displayed', () => {
   cy.get('[data-test="dhis2-uicore-circularloader"]').should('be.visible');
 });
-(0, _steps.Then)('the loading text is displayed', () => {
+(0, _cypressCucumberPreprocessor.Then)('the loading text is displayed', () => {
   cy.get('[data-test="dhis2-uicore-singleselect-loading"]').contains('Loading options').should('be.visible');
 });

package/build/cjs/single-select/features/accepts_max_height/index.js

@@ -1,21 +1,16 @@
 "use strict";
 
-require("../common/index.js");
+var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
 
-var _steps = require("cypress-cucumber-preprocessor/steps");
-
-(0, _steps.Given)('a SingleSelect with more than ten options is rendered', () => {
+(0, _cypressCucumberPreprocessor.Given)('a SingleSelect with more than ten options is rendered', () => {
   cy.visitStory('SingleSelect', 'With more than ten options');
 });
-(0, _steps.Given)('a SingleSelect with more than three options and a 100px max-height is rendered', () => {
+(0, _cypressCucumberPreprocessor.Given)('a SingleSelect with more than three options and a 100px max-height is rendered', () => {
   cy.visitStory('SingleSelect', 'With more than three options and a 100px max-height');
 });
-(0, _steps.Given)('the SingleSelect is open', () => {
-  cy.get('[data-test="dhis2-uicore-select"]').click();
-});
-(0, _steps.Then)('has the default max-height', () => {
+(0, _cypressCucumberPreprocessor.Then)('has the default max-height', () => {
   cy.get('[data-test="dhis2-uicore-select-menu-menuwrapper"]').should('have.css', 'max-height', '280px');
 });
-(0, _steps.Then)('has a max-height of 100px', () => {
+(0, _cypressCucumberPreprocessor.Then)('has a max-height of 100px', () => {
   cy.get('[data-test="dhis2-uicore-select-menu-menuwrapper"]').should('have.css', 'max-height', '100px');
 });

package/build/cjs/single-select/features/accepts_placeholder/index.js

@@ -1,21 +1,19 @@
 "use strict";
 
-require("../common/index.js");
+var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
 
-var _steps = require("cypress-cucumber-preprocessor/steps");
-
-(0, _steps.Given)('a SingleSelect with a placeholder and no selection is rendered', () => {
+(0, _cypressCucumberPreprocessor.Given)('a SingleSelect with a placeholder and no selection is rendered', () => {
   cy.visitStory('SingleSelect', 'With placeholder');
 });
-(0, _steps.Given)('a SingleSelect with a placeholder and a selection is rendered', () => {
+(0, _cypressCucumberPreprocessor.Given)('a SingleSelect with a placeholder and a selection is rendered', () => {
   cy.visitStory('SingleSelect', 'With placeholder and selection');
 });
-(0, _steps.Then)('the placeholder is shown', () => {
+(0, _cypressCucumberPreprocessor.Then)('the placeholder is shown', () => {
   cy.get('[data-test="dhis2-uicore-singleselect-placeholder"]').contains('Placeholder text').should('be.visible');
 });
-(0, _steps.Then)('the placeholder is not rendered', () => {
+(0, _cypressCucumberPreprocessor.Then)('the placeholder is not rendered', () => {
   cy.get('[data-test="dhis2-uicore-singleselect-placeholder"]').should('not.exist');
 });
-(0, _steps.Then)('the selection is displayed', () => {
+(0, _cypressCucumberPreprocessor.Then)('the selection is displayed', () => {
   cy.contains('option one').should('be.visible');
 });

package/build/cjs/single-select/features/accepts_prefix/index.js

@@ -1,18 +1,16 @@
 "use strict";
 
-require("../common/index.js");
+var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
 
-var _steps = require("cypress-cucumber-preprocessor/steps");
-
-(0, _steps.Given)('a SingleSelect with a prefix and no selection is rendered', () => {
+(0, _cypressCucumberPreprocessor.Given)('a SingleSelect with a prefix and no selection is rendered', () => {
   cy.visitStory('SingleSelect', 'With prefix');
 });
-(0, _steps.Given)('a SingleSelect with a prefix and a selection is rendered', () => {
+(0, _cypressCucumberPreprocessor.Given)('a SingleSelect with a prefix and a selection is rendered', () => {
   cy.visitStory('SingleSelect', 'With prefix and selection');
 });
-(0, _steps.Then)('the prefix is shown', () => {
+(0, _cypressCucumberPreprocessor.Then)('the prefix is shown', () => {
   cy.get('[data-test="dhis2-uicore-singleselect-prefix"]').contains('Prefix text').should('be.visible');
 });
-(0, _steps.Then)('the selection is shown', () => {
+(0, _cypressCucumberPreprocessor.Then)('the selection is shown', () => {
   cy.contains('option one').should('be.visible');
 });

package/build/cjs/single-select/features/allows_invalid_options/index.js

@@ -1,24 +1,22 @@
 "use strict";
 
-require("../common/index.js");
+var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
 
-var _steps = require("cypress-cucumber-preprocessor/steps");
-
-(0, _steps.Given)('a SingleSelect with invalid options is rendered', () => {
+(0, _cypressCucumberPreprocessor.Given)('a SingleSelect with invalid options is rendered', () => {
   cy.visitStory('SingleSelect', 'With invalid options');
 });
-(0, _steps.Given)('a SingleSelect with invalid filterable options is rendered', () => {
+(0, _cypressCucumberPreprocessor.Given)('a SingleSelect with invalid filterable options is rendered', () => {
   cy.visitStory('SingleSelect', 'With invalid filterable options');
 });
-(0, _steps.When)('the user enters a filter string', () => {
+(0, _cypressCucumberPreprocessor.When)('the user enters a filter string', () => {
   cy.get('[data-test="dhis2-uicore-singleselect-filterinput"]').click().focused().type('invalid');
 });
-(0, _steps.Then)('the invalid options are displayed', () => {
+(0, _cypressCucumberPreprocessor.Then)('the invalid options are displayed', () => {
   cy.contains('invalid one').should('be.visible');
   cy.contains('invalid two').should('be.visible');
   cy.contains('invalid three').should('be.visible');
 });
-(0, _steps.Then)('the invalid options are not rendered', () => {
+(0, _cypressCucumberPreprocessor.Then)('the invalid options are not rendered', () => {
   cy.contains('invalid one').should('not.exist');
   cy.contains('invalid two').should('not.exist');
   cy.contains('invalid three').should('not.exist');

package/build/cjs/single-select/features/allows_selecting/index.js

@@ -1,22 +1,20 @@
 "use strict";
 
-require("../common/index.js");
+var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
 
-var _steps = require("cypress-cucumber-preprocessor/steps");
-
-(0, _steps.Given)('a SingleSelect with a disabled option and onChange handler is rendered', () => {
+(0, _cypressCucumberPreprocessor.Given)('a SingleSelect with a disabled option and onChange handler is rendered', () => {
   cy.visitStory('SingleSelect', 'With disabled option and onChange');
 });
-(0, _steps.Given)('a SingleSelect with custom options and onChange handler is rendered', () => {
+(0, _cypressCucumberPreprocessor.Given)('a SingleSelect with custom options and onChange handler is rendered', () => {
   cy.visitStory('SingleSelect', 'With custom options and onChange');
 });
-(0, _steps.When)('an option is clicked', () => {
+(0, _cypressCucumberPreprocessor.When)('an option is clicked', () => {
   cy.contains('option one').click();
 });
-(0, _steps.When)('the disabled option is clicked', () => {
+(0, _cypressCucumberPreprocessor.When)('the disabled option is clicked', () => {
   cy.contains('disabled option').click();
 });
-(0, _steps.Then)('the clicked option is selected', () => {
+(0, _cypressCucumberPreprocessor.Then)('the clicked option is selected', () => {
   cy.window().should(win => {
     expect(win.onChange).to.be.calledOnce;
     expect(win.onChange).to.be.calledWith({
@@ -24,7 +22,7 @@ var _steps = require("cypress-cucumber-preprocessor/steps");
     });
   });
 });
-(0, _steps.Then)('the onchange handler is not called', () => {
+(0, _cypressCucumberPreprocessor.Then)('the onchange handler is not called', () => {
   cy.window().should(win => {
     expect(win.onChange).to.not.be.called;
   });