@dxc-technology/halstack-react 0.0.0-97eade8 → 0.0.0-9852702

package/useTheme.js

@@ -1,22 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = void 0;
-
-var _react = require("react");
-
-var _variables = require("./common/variables");
-
-var _HalstackContext = _interopRequireDefault(require("./HalstackContext"));
-
-var useTheme = function useTheme() {
-  var colorsTheme = (0, _react.useContext)(_HalstackContext["default"]);
-  return colorsTheme || _variables.componentTokens;
-};
-
-var _default = useTheme;
-exports["default"] = _default;

package/useTranslatedLabels.d.ts

@@ -1,85 +0,0 @@
-declare const useTranslatedLabels: () => {
-    formFields?: Partial<{
-        optionalLabel: string;
-        requiredSelectionErrorMessage: string;
-        requiredValueErrorMessage: string;
-        formatRequestedErrorMessage: string;
-        lengthErrorMessage: (minLength?: number, maxLength?: number) => string;
-        logoAlternativeText: string;
-    }>;
-    applicationLayout?: Partial<{
-        visibilityToggleTitle: string;
-    }>;
-    alert?: Partial<{
-        infoTitleText: string;
-        successTitleText: string;
-        warningTitleText: string;
-        errorTitleText: string;
-    }>;
-    dateInput?: Partial<{
-        invalidDateErrorMessage: string;
-    }>;
-    dialog?: Partial<{
-        closeIconAriaLabel: string;
-    }>;
-    fileInput?: Partial<{
-        fileSizeGreaterThanErrorMessage: string;
-        fileSizeLessThanErrorMessage: string;
-        multipleButtonLabelDefault: string;
-        singleButtonLabelDefault: string;
-        dropAreaButtonLabelDefault: string;
-        multipleDropAreaLabelDefault: string;
-        singleDropAreaLabelDefault: string;
-        deleteFileActionTitle: string;
-    }>;
-    footer?: Partial<{
-        copyrightText: (year: number) => string;
-    }>;
-    header?: Partial<{
-        closeIcon: string;
-        hamburguerTitle: string;
-    }>;
-    numberInput?: Partial<{
-        valueGreaterThanOrEqualToErrorMessage: (value: number) => string;
-        valueLessThanOrEqualToErrorMessage: (value: number) => string;
-        decrementValueTitle: string;
-        incrementValueTitle: string;
-    }>;
-    paginator?: Partial<{
-        itemsPerPageText: string;
-        minToMaxOfText: (minNumberOfItems: number, maxNumberOfItems: number, totalItems: number) => string;
-        goToPageText: string;
-        pageOfText: (pageNumber: number, totalPagesNumber: number) => string;
-    }>;
-    passwordInput?: Partial<{
-        inputShowPasswordTitle: string;
-        inputHidePasswordTitle: string;
-    }>;
-    quickNav?: Partial<{
-        contentTitle: string;
-    }>;
-    radioGroup?: Partial<{
-        optionalItemLabelDefault: string;
-    }>;
-    select?: Partial<{
-        noMatchesErrorMessage: string;
-        actionClearSelectionTitle: string;
-        actionClearSearchTitle: string;
-    }>;
-    tabs?: Partial<{
-        scrollLeft: string;
-        scrollRight: string;
-    }>;
-    textInput?: Partial<{
-        clearFieldActionTitle: string;
-        searchingMessage: string;
-        fetchingDataErrorMessage: string;
-    }>;
-    calendar?: Partial<{
-        daysShort: string[];
-        months: string[];
-        previousMonthTitle: string;
-        nextMonthTitle: string;
-    }>;
-};
-export default useTranslatedLabels;

package/useTranslatedLabels.js

@@ -1,20 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = void 0;
-
-var _react = require("react");
-
-var _variables = require("./common/variables");
-
-var _HalstackContext = require("./HalstackContext");
-
-var useTranslatedLabels = function useTranslatedLabels() {
-  var labels = (0, _react.useContext)(_HalstackContext.HalstackLanguageContext);
-  return labels || _variables.defaultTranslatedComponentLabels;
-};
-
-var _default = useTranslatedLabels;
-exports["default"] = _default;

package/utils/BaseTypography.d.ts

@@ -1,21 +0,0 @@
-import React from "react";
-declare type TypographyContextProps = {
-    as?: keyof HTMLElementTagNameMap;
-    display?: string;
-    fontFamily?: string;
-    fontSize?: string;
-    fontStyle?: string;
-    fontWeight?: string;
-    letterSpacing?: string;
-    lineHeight?: string;
-    textAlign?: string;
-    color?: string;
-    textDecoration?: string;
-    textOverflow?: string;
-    whiteSpace?: string;
-};
-declare type BaseTypographyProps = TypographyContextProps & {
-    children: React.ReactNode;
-};
-declare const BaseTypography: ({ as, display, fontFamily, fontSize, fontStyle, fontWeight, letterSpacing, lineHeight, textAlign, color, textDecoration, textOverflow, whiteSpace, children, }: BaseTypographyProps) => JSX.Element;
-export default BaseTypography;

package/utils/BaseTypography.js

@@ -1,108 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-var _typeof = require("@babel/runtime/helpers/typeof");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = void 0;
-
-var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-
-var _react = _interopRequireWildcard(require("react"));
-
-var _styledComponents = _interopRequireDefault(require("styled-components"));
-
-var _templateObject;
-
-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 TypographyContext = /*#__PURE__*/_react["default"].createContext(null);
-
-var BaseTypography = function BaseTypography(_ref) {
-  var as = _ref.as,
-      display = _ref.display,
-      fontFamily = _ref.fontFamily,
-      fontSize = _ref.fontSize,
-      fontStyle = _ref.fontStyle,
-      fontWeight = _ref.fontWeight,
-      letterSpacing = _ref.letterSpacing,
-      lineHeight = _ref.lineHeight,
-      textAlign = _ref.textAlign,
-      color = _ref.color,
-      textDecoration = _ref.textDecoration,
-      textOverflow = _ref.textOverflow,
-      whiteSpace = _ref.whiteSpace,
-      children = _ref.children;
-  var componentContext = (0, _react.useContext)(TypographyContext);
-  var contextValue = (0, _react.useMemo)(function () {
-    var _ref2, _ref3, _ref4, _ref5, _ref6, _ref7, _ref8, _ref9, _ref10, _ref11, _ref12, _ref13, _ref14;
-
-    return {
-      as: (_ref2 = as !== null && as !== void 0 ? as : componentContext === null || componentContext === void 0 ? void 0 : componentContext.as) !== null && _ref2 !== void 0 ? _ref2 : "span",
-      display: (_ref3 = display !== null && display !== void 0 ? display : componentContext === null || componentContext === void 0 ? void 0 : componentContext.display) !== null && _ref3 !== void 0 ? _ref3 : "inline",
-      fontFamily: (_ref4 = fontFamily !== null && fontFamily !== void 0 ? fontFamily : componentContext === null || componentContext === void 0 ? void 0 : componentContext.fontFamily) !== null && _ref4 !== void 0 ? _ref4 : "Open Sans, sans-serif",
-      fontSize: (_ref5 = fontSize !== null && fontSize !== void 0 ? fontSize : componentContext === null || componentContext === void 0 ? void 0 : componentContext.fontSize) !== null && _ref5 !== void 0 ? _ref5 : "1rem",
-      fontStyle: (_ref6 = fontStyle !== null && fontStyle !== void 0 ? fontStyle : componentContext === null || componentContext === void 0 ? void 0 : componentContext.fontStyle) !== null && _ref6 !== void 0 ? _ref6 : "normal",
-      fontWeight: (_ref7 = fontWeight !== null && fontWeight !== void 0 ? fontWeight : componentContext === null || componentContext === void 0 ? void 0 : componentContext.fontWeight) !== null && _ref7 !== void 0 ? _ref7 : "400",
-      letterSpacing: (_ref8 = letterSpacing !== null && letterSpacing !== void 0 ? letterSpacing : componentContext === null || componentContext === void 0 ? void 0 : componentContext.letterSpacing) !== null && _ref8 !== void 0 ? _ref8 : "0em",
-      lineHeight: (_ref9 = lineHeight !== null && lineHeight !== void 0 ? lineHeight : componentContext === null || componentContext === void 0 ? void 0 : componentContext.lineHeight) !== null && _ref9 !== void 0 ? _ref9 : "1.5em",
-      textAlign: (_ref10 = textAlign !== null && textAlign !== void 0 ? textAlign : componentContext === null || componentContext === void 0 ? void 0 : componentContext.textAlign) !== null && _ref10 !== void 0 ? _ref10 : "left",
-      color: (_ref11 = color !== null && color !== void 0 ? color : componentContext === null || componentContext === void 0 ? void 0 : componentContext.color) !== null && _ref11 !== void 0 ? _ref11 : "#000000",
-      textDecoration: (_ref12 = textDecoration !== null && textDecoration !== void 0 ? textDecoration : componentContext === null || componentContext === void 0 ? void 0 : componentContext.textDecoration) !== null && _ref12 !== void 0 ? _ref12 : "none",
-      textOverflow: (_ref13 = textOverflow !== null && textOverflow !== void 0 ? textOverflow : componentContext === null || componentContext === void 0 ? void 0 : componentContext.textOverflow) !== null && _ref13 !== void 0 ? _ref13 : "unset",
-      whiteSpace: (_ref14 = whiteSpace !== null && whiteSpace !== void 0 ? whiteSpace : componentContext === null || componentContext === void 0 ? void 0 : componentContext.whiteSpace) !== null && _ref14 !== void 0 ? _ref14 : "normal"
-    };
-  }, [as, display, fontFamily, fontSize, fontStyle, fontWeight, letterSpacing, lineHeight, textAlign, color, textDecoration, textOverflow, whiteSpace]);
-  return /*#__PURE__*/_react["default"].createElement(TypographyContext.Provider, {
-    value: contextValue
-  }, /*#__PURE__*/_react["default"].createElement(StyledTypography, contextValue, children));
-};
-
-var StyledTypography = _styledComponents["default"].span(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n  display: ", ";\n  color: ", ";\n  font-family: ", ";\n  font-size: ", ";\n  font-style: ", ";\n  font-weight: ", ";\n  letter-spacing: ", ";\n  line-height: ", ";\n  text-align: ", ";\n  text-decoration: ", ";\n  text-overflow: ", ";\n  white-space: ", ";\n  overflow: ", ";\n  margin: 0;\n"])), function (_ref15) {
-  var display = _ref15.display;
-  return display;
-}, function (_ref16) {
-  var color = _ref16.color;
-  return color;
-}, function (_ref17) {
-  var fontFamily = _ref17.fontFamily;
-  return fontFamily;
-}, function (_ref18) {
-  var fontSize = _ref18.fontSize;
-  return fontSize;
-}, function (_ref19) {
-  var fontStyle = _ref19.fontStyle;
-  return fontStyle;
-}, function (_ref20) {
-  var fontWeight = _ref20.fontWeight;
-  return fontWeight;
-}, function (_ref21) {
-  var letterSpacing = _ref21.letterSpacing;
-  return letterSpacing;
-}, function (_ref22) {
-  var lineHeight = _ref22.lineHeight;
-  return lineHeight;
-}, function (_ref23) {
-  var textAlign = _ref23.textAlign;
-  return textAlign;
-}, function (_ref24) {
-  var textDecoration = _ref24.textDecoration;
-  return textDecoration;
-}, function (_ref25) {
-  var textOverflow = _ref25.textOverflow;
-  return textOverflow;
-}, function (_ref26) {
-  var whiteSpace = _ref26.whiteSpace;
-  return whiteSpace;
-}, function (_ref27) {
-  var textOverflow = _ref27.textOverflow;
-  return textOverflow !== "unset" ? "hidden" : "visible";
-});
-
-var _default = BaseTypography;
-exports["default"] = _default;

package/utils/FocusLock.d.ts

@@ -1,13 +0,0 @@
-import React from "react";
-/**
- * Traps the focus inside the children of the component. It will focus the first focusable element when the component is mounted.
- * When the focus is on the last focusable element and the user tries to focus the next element, it will focus the first element.
- * When the focus is on the first focusable element and the user tries to focus the previous element, it will focus the last element.
- * The focus can't be moved outside the children unless the children are removed from the DOM (for example, a Dialog, a Modal, etc).
- * @param children: React.ReactNode
- * @returns
- */
-declare const FocusLock: ({ children }: {
-    children: React.ReactNode;
-}) => JSX.Element;
-export default FocusLock;

package/utils/FocusLock.js

@@ -1,138 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-var _typeof = require("@babel/runtime/helpers/typeof");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = void 0;
-
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
-var _react = _interopRequireWildcard(require("react"));
-
-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 not = {
-  negTabIndex: ':not([tabindex^="-"])',
-  disabled: ":not(:disabled)"
-};
-var focusableQuery = ["a[href]".concat(not.negTabIndex), "area[href]".concat(not.negTabIndex), "input:not([type=\"hidden\"])".concat(not.negTabIndex).concat(not.disabled), "select".concat(not.negTabIndex).concat(not.disabled), "textarea".concat(not.negTabIndex).concat(not.disabled), "button".concat(not.negTabIndex).concat(not.disabled), "details > summary:first-of-type".concat(not.negTabIndex), "iframe".concat(not.negTabIndex), "audio[controls]".concat(not.negTabIndex), "video[controls]".concat(not.negTabIndex), "[contenteditable]".concat(not.negTabIndex), "[tabindex]".concat(not.negTabIndex).concat(not.disabled)].join(",");
-
-var getFocusableElements = function getFocusableElements(container) {
-  return Array.prototype.slice.call(container.querySelectorAll(focusableQuery)).filter(function (element) {
-    return element.getAttribute("aria-hidden") !== "true" && window.getComputedStyle(element).display !== "none" && window.getComputedStyle(element).visibility !== "hidden";
-  });
-};
-/**
- * This function will try to focus the element and return true if it was able to receive the focus.
- * Even if the element is focusable (passes any of the conditions of our selector), there is the possibility
- * that the element may not be focusable at all.
- * @param element: HTMLElement
- * @returns
- */
-
-
-var attempFocus = function attempFocus(element) {
-  element === null || element === void 0 ? void 0 : element.focus();
-  return document.activeElement === element;
-};
-/**
- * @param element: HTMLElement
- * @returns boolean: true if element is contained inside a Radix Portal, false otherwise.
- */
-
-
-var radixPortalContains = function radixPortalContains(activeElement) {
-  var radixPortals = document.querySelectorAll("[data-radix-portal]");
-  return Array.prototype.slice.call(radixPortals).some(function (portal) {
-    return portal.contains(activeElement);
-  });
-};
-/**
- * Custom hook that returns an array of focusable elements inside a container.
- * @param ref: React.MutableRefObject<HTMLDivElement>
- * @returns
- */
-
-
-var useFocusableElements = function useFocusableElements(ref) {
-  var _useState = (0, _react.useState)(),
-      _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
-      focusableElements = _useState2[0],
-      setFocusableElements = _useState2[1];
-
-  (0, _react.useEffect)(function () {
-    if (ref.current != null) {
-      setFocusableElements(getFocusableElements(ref.current));
-      var observer = new MutationObserver(function () {
-        setFocusableElements(getFocusableElements(ref.current));
-      });
-      observer.observe(ref.current, {
-        childList: true,
-        subtree: true,
-        attributes: true
-      });
-      return function () {
-        observer.disconnect();
-      };
-    }
-  }, []);
-  return focusableElements;
-};
-/**
- * Traps the focus inside the children of the component. It will focus the first focusable element when the component is mounted.
- * When the focus is on the last focusable element and the user tries to focus the next element, it will focus the first element.
- * When the focus is on the first focusable element and the user tries to focus the previous element, it will focus the last element.
- * The focus can't be moved outside the children unless the children are removed from the DOM (for example, a Dialog, a Modal, etc).
- * @param children: React.ReactNode
- * @returns
- */
-
-
-var FocusLock = function FocusLock(_ref) {
-  var children = _ref.children;
-  var childrenContainerRef = (0, _react.useRef)();
-  var focusableElements = useFocusableElements(childrenContainerRef);
-  var focusFirst = (0, _react.useCallback)(function () {
-    var _childrenContainerRef;
-
-    if ((focusableElements === null || focusableElements === void 0 ? void 0 : focusableElements.length) === 0) (_childrenContainerRef = childrenContainerRef.current) === null || _childrenContainerRef === void 0 ? void 0 : _childrenContainerRef.focus();else if ((focusableElements === null || focusableElements === void 0 ? void 0 : focusableElements.length) > 0) for (var i = 0; i < focusableElements.length; i++) {
-      if (attempFocus(focusableElements[i])) return;
-    }
-  }, [focusableElements]);
-
-  var focusLast = function focusLast() {
-    for (var i = focusableElements.length - 1; i >= 0; i--) {
-      if (attempFocus(focusableElements[i])) return;
-    }
-  };
-
-  var focusLock = function focusLock(event) {
-    if (event.key === "Tab") focusableElements.length === 0 && event.preventDefault();else if (event.key === "Tab" && event.key === "Shift") focusableElements.length === 0 && event.preventDefault();
-  };
-
-  (0, _react.useEffect)(function () {
-    var _childrenContainerRef2;
-
-    if (!((_childrenContainerRef2 = childrenContainerRef.current) !== null && _childrenContainerRef2 !== void 0 && _childrenContainerRef2.contains(document.activeElement)) && !radixPortalContains(document.activeElement)) focusFirst();
-  }, [focusFirst]);
-  return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("div", {
-    onFocus: focusLast,
-    tabIndex: 0
-  }), /*#__PURE__*/_react["default"].createElement("div", {
-    onKeyDown: focusLock,
-    ref: childrenContainerRef,
-    tabIndex: (focusableElements === null || focusableElements === void 0 ? void 0 : focusableElements.length) === 0 ? 0 : -1
-  }, children), /*#__PURE__*/_react["default"].createElement("div", {
-    onFocus: focusFirst,
-    tabIndex: 0
-  }));
-};
-
-var _default = FocusLock;
-exports["default"] = _default;

package/wizard/Wizard.d.ts

@@ -1,4 +0,0 @@
-/// <reference types="react" />
-import WizardPropsType from "./types";
-declare const DxcWizard: ({ mode, defaultCurrentStep, currentStep, onStepClick, steps, margin, tabIndex, }: WizardPropsType) => JSX.Element;
-export default DxcWizard;