@elastic/eui 108.0.0 → 109.1.0-snapshot.1763390960850

package/es/test/cypress/test_reposition_on_scroll.js

@@ -0,0 +1,66 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+/// <reference types="cypress" />
+/// <reference types="cypress-real-events" />
+/// <reference types="../../../cypress/support" />
+
+import React from 'react';
+import { jsx as ___EmotionJSX } from "@emotion/react";
+export var testRepositionOnScroll = function testRepositionOnScroll(_ref) {
+  var shouldReposition = _ref.shouldReposition,
+    propValue = _ref.propValue,
+    componentDefaultValue = _ref.componentDefaultValue,
+    componentName = _ref.componentName,
+    triggerSelector = _ref.triggerSelector,
+    panelSelector = _ref.panelSelector,
+    renderComponent = _ref.renderComponent;
+  var repositionProps = {
+    repositionOnScroll: typeof propValue === 'boolean' ? propValue : undefined
+  };
+  var providerProps = typeof componentDefaultValue === 'boolean' ? {
+    providerProps: {
+      componentDefaults: _defineProperty({}, componentName, {
+        repositionOnScroll: componentDefaultValue
+      })
+    }
+  } : undefined;
+  cy.mount(___EmotionJSX(React.Fragment, null, ___EmotionJSX("div", {
+    style: {
+      height: '200vh'
+    }
+  }), ___EmotionJSX("div", {
+    style: {
+      position: 'fixed',
+      bottom: '16px',
+      right: '16px'
+    }
+  }, renderComponent(repositionProps))), providerProps);
+  cy.get(triggerSelector).click();
+
+  // Wait for positioning to finish
+  cy.get(panelSelector).as('panel').should('exist').waitForPositionToSettle();
+  cy.get('@panel').then(function ($panel) {
+    var initialRect = $panel[0].getBoundingClientRect();
+    cy.scrollTo(0, 500);
+
+    // Wait for re-positioning to finish
+    cy.get('@panel').waitForPositionToSettle().then(function ($repositionedPanel) {
+      var finalRect = $repositionedPanel[0].getBoundingClientRect();
+      if (shouldReposition) {
+        expect(finalRect.top).to.equal(initialRect.top);
+      } else {
+        expect(finalRect.top).to.not.equal(initialRect.top);
+      }
+    });
+  });
+};

package/es/test/enzyme/enzyme_matchers.d.ts

@@ -0,0 +1,36 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the "Elastic License
+ * 2.0", the "GNU Affero General Public License v3.0 only", and the "Server Side
+ * Public License v 1"; you may not use this file except in compliance with, at
+ * your election, the "Elastic License 2.0", the "GNU Affero General Public
+ * License v3.0 only", or the "Server Side Public License, v 1".
+ */
+
+import { ReactWrapper } from 'enzyme';
+
+declare global {
+  namespace jest {
+    interface Matchers<R> {
+      /**
+       * Checks if an Enzyme wrapper has EUI disabled state (it checks `disabled`, `isDisabled` and `aria-disabled` props)
+       */
+      toHaveEuiDisabledProp(): R;
+    }
+  }
+}
+
+export declare const toHaveEuiDisabledProp: (wrapper: ReactWrapper<any>) => {
+  message: () => string;
+  pass: boolean;
+};
+
+export declare const hasEuiDisabledProp: (
+  props: Record<string, any>
+) => boolean;
+
+export declare const euiEnzymeMatchers: {
+  toHaveEuiDisabledProp: typeof toHaveEuiDisabledProp;
+};
+
+export declare const setupEuiEnzymeMatchers: () => void;

package/es/test/enzyme/enzyme_matchers.js

@@ -0,0 +1,43 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the "Elastic License
+ * 2.0", the "GNU Affero General Public License v3.0 only", and the "Server Side
+ * Public License v 1"; you may not use this file except in compliance with, at
+ * your election, the "Elastic License 2.0", the "GNU Affero General Public
+ * License v3.0 only", or the "Server Side Public License, v 1".
+ */
+
+/* eslint-env jest */
+
+export var euiEnzymeMatchers = {
+  /**
+   * Checks if an Enzyme wrapper has an EUI disabled state.
+   * It looks for `disabled`, `isDisabled` and `aria-disabled` props
+   */
+  toHaveEuiDisabledProp: function toHaveEuiDisabledProp(props) {
+    if (!props || _typeof(props) !== 'object') {
+      throw new Error('toHaveEuiDisabledProp() must be called with the props value from ReactWrapper.props()');
+    }
+    var isDisabled = hasEuiDisabledProp(props);
+    return {
+      message: function message() {
+        return isDisabled ? 'Expected component NOT to have EUI disabled prop, but it was disabled' : 'Expected component to have EUI disabled prop (`disabled`, `isDisabled` or `aria-disabled="true"`)';
+      },
+      pass: isDisabled
+    };
+  }
+};
+export var setupEuiEnzymeMatchers = function setupEuiEnzymeMatchers() {
+  expect.extend(euiEnzymeMatchers);
+};
+
+/* Utilities */
+
+/**
+ * Checks if a ReactWrapper has one of the following disabled props enabled:
+ * `disabled`, `isDisabled` or attribute or `aria-disabled="true"`.
+ */
+export var hasEuiDisabledProp = function hasEuiDisabledProp(props) {
+  return props.disabled === true || props.isDisabled === true || props['aria-disabled'] === true || props['aria-disabled'] === 'true';
+};

package/es/test/enzyme/index.d.ts

@@ -0,0 +1,14 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the "Elastic License
+ * 2.0", the "GNU Affero General Public License v3.0 only", and the "Server Side
+ * Public License v 1"; you may not use this file except in compliance with, at
+ * your election, the "Elastic License 2.0", the "GNU Affero General Public
+ * License v3.0 only", or the "Server Side Public License, v 1".
+ */
+
+export {
+  euiEnzymeMatchers,
+  setupEuiEnzymeMatchers,
+  hasEuiDisabledProp,
+} from './enzyme_matchers';

package/es/test/enzyme/index.js

@@ -0,0 +1,10 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the "Elastic License
+ * 2.0", the "GNU Affero General Public License v3.0 only", and the "Server Side
+ * Public License v 1"; you may not use this file except in compliance with, at
+ * your election, the "Elastic License 2.0", the "GNU Affero General Public
+ * License v3.0 only", or the "Server Side Public License, v 1".
+ */
+
+export { euiEnzymeMatchers, setupEuiEnzymeMatchers, hasEuiDisabledProp } from './enzyme_matchers';

package/es/test/rtl/index.d.ts

@@ -1,3 +1,11 @@
 export * from './component_helpers';
-export { queryByTestSubject, queryAllByTestSubject, getByTestSubject, getAllByTestSubject, findAllByTestSubject, findByTestSubject, } from './data_test_subj_queries';
+export {
+  queryByTestSubject,
+  queryAllByTestSubject,
+  getByTestSubject,
+  getAllByTestSubject,
+  findAllByTestSubject,
+  findByTestSubject,
+} from './data_test_subj_queries';
 export { render, screen, within } from './custom_render';
+export { euiMatchers, setupEuiMatchers, isEuiDisabled } from './matchers';

package/es/test/rtl/index.js

@@ -9,4 +9,5 @@
 export * from './component_helpers';
 export { queryByTestSubject, queryAllByTestSubject, getByTestSubject, getAllByTestSubject, findAllByTestSubject, findByTestSubject } from './data_test_subj_queries';
 export { render, screen, within } from './custom_render';
-export * from './render_hook';
+export * from './render_hook';
+export { euiMatchers, setupEuiMatchers, isEuiDisabled } from './matchers';

package/es/test/rtl/matchers.d.ts

@@ -0,0 +1,36 @@
+declare global {
+  /* eslint-disable-next-line @typescript-eslint/no-namespace,no-redeclare */
+  namespace jest {
+    interface Matchers<R> {
+      /**
+       * Custom matcher to check the disabled state of a DOM element.
+       * Ensures that both `disabled` and `aria-disabled` attributes are checked.
+       */
+      toBeEuiDisabled(): R;
+      /**
+       * Custom matcher to check a DOM element is enabled (= not disabled).
+       * Ensures that both `disabled` and `aria-disabled` attributes are checked.
+       */
+      toBeEuiEnabled(): R;
+    }
+  }
+}
+
+export declare const toBeEuiDisabled: (element: HTMLElement) => {
+  message: () => string;
+  pass: boolean;
+};
+
+export declare const toBeEuiEnabled: (element: HTMLElement) => {
+  message: () => string;
+  pass: boolean;
+};
+
+export declare const isEuiDisabled: (element: HTMLElement) => boolean;
+
+export declare const euiMatchers: {
+  toBeEuiDisabled: typeof toBeEuiDisabled;
+  toBeEuiEnabled: typeof toBeEuiEnabled;
+};
+
+export declare const setupEuiMatchers: () => void;

package/es/test/rtl/matchers.js

@@ -0,0 +1,82 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+import { elementCanBeDisabled } from '../../utils';
+var NATIVE_DISABLED_ATTR = 'disabled';
+var CUSTOM_DISABLED_ATTR = 'aria-disabled';
+var toBeEuiDisabled = function toBeEuiDisabled(element) {
+  var _getEuiDisabledState = getEuiDisabledState(element),
+    isDisabled = _getEuiDisabledState.isDisabled,
+    canBeDisabled = _getEuiDisabledState.canBeDisabled,
+    isNativelyDisabled = _getEuiDisabledState.isNativelyDisabled;
+  return {
+    message: function message() {
+      if (isDisabled) {
+        var method = isNativelyDisabled ? "`".concat(NATIVE_DISABLED_ATTR, "`") : "`".concat(CUSTOM_DISABLED_ATTR, "=\"true\"`");
+        if (!canBeDisabled) {
+          return "Element cannot be disabled (based on its role), but it was disabled via ".concat(method);
+        } else {
+          return "Expected element NOT to be disabled, but it was disabled via ".concat(method);
+        }
+      } else {
+        return "Expected element to be disabled via either `".concat(NATIVE_DISABLED_ATTR, "` or `").concat(CUSTOM_DISABLED_ATTR, "=\"true\"` attribute, but found neither");
+      }
+    },
+    pass: isDisabled
+  };
+};
+var toBeEuiEnabled = function toBeEuiEnabled(element) {
+  var _getEuiDisabledState2 = getEuiDisabledState(element),
+    isDisabled = _getEuiDisabledState2.isDisabled,
+    isNativelyDisabled = _getEuiDisabledState2.isNativelyDisabled,
+    isAriaDisabled = _getEuiDisabledState2.isAriaDisabled;
+  return {
+    message: function message() {
+      var attributes = [isNativelyDisabled ? "`".concat(NATIVE_DISABLED_ATTR, "`") : undefined, isAriaDisabled ? "`".concat(CUSTOM_DISABLED_ATTR, "=\"true\"`") : undefined].filter(function (item) {
+        return item !== undefined;
+      }).join(' and ');
+      return "Expected element NOT to have attributes: ".concat(attributes, ".");
+    },
+    pass: !isDisabled
+  };
+};
+export var euiMatchers = {
+  toBeEuiDisabled: toBeEuiDisabled,
+  toBeEuiEnabled: toBeEuiEnabled
+};
+export var setupEuiMatchers = function setupEuiMatchers() {
+  expect.extend(euiMatchers);
+};
+export default euiMatchers;
+
+/* Utilities */
+
+/**
+ * Retrieve an element's disabled state details.
+ * Checks wheather the element has an `disabled` attribute or `aria-disabled="true"` attribute
+ * @returns { isDisabled: boolean; canBeDisabled: boolean; isNativelyDisabled: boolean; isAriaDisabled: boolean }
+ */
+export var getEuiDisabledState = function getEuiDisabledState(element) {
+  var canBeDisabled = elementCanBeDisabled(element);
+  var isNativelyDisabled = element.hasAttribute('disabled');
+  var isAriaDisabled = element.getAttribute('aria-disabled') === 'true';
+  var isDisabled = canBeDisabled && (isNativelyDisabled || isAriaDisabled);
+  return {
+    isDisabled: isDisabled,
+    canBeDisabled: canBeDisabled,
+    isNativelyDisabled: isNativelyDisabled,
+    isAriaDisabled: isAriaDisabled
+  };
+};
+
+/**
+ * Checks if an element is disabled via `disabled` attribute or `aria-disabled="true"`.
+ */
+export var isEuiDisabled = function isEuiDisabled(element) {
+  return getEuiDisabledState(element).isDisabled;
+};

package/es/utils/element_can_be_disabled.js

@@ -0,0 +1,16 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+var SUPPORTED_ELEMENTS = ['fieldset', 'input', 'select', 'optgroup', 'option', 'button', 'textarea'];
+export var elementCanBeDisabled = function elementCanBeDisabled(htmlElement) {
+  var _htmlElement$getAttri;
+  if (!htmlElement) return false;
+  var tagName = htmlElement.tagName && htmlElement.tagName.toLowerCase();
+  var roleName = (_htmlElement$getAttri = htmlElement.getAttribute('role')) !== null && _htmlElement$getAttri !== void 0 ? _htmlElement$getAttri : '';
+  return SUPPORTED_ELEMENTS.includes(roleName) || SUPPORTED_ELEMENTS.includes(tagName);
+};

package/es/utils/index.js

@@ -8,4 +8,5 @@
 
 export * from './prop_types';
 export * from './is_jest';
-export * from './type_guards';
+export * from './type_guards';
+export { elementCanBeDisabled } from './element_can_be_disabled';