@telus-uds/components-web 2.43.0 → 3.0.0

package/lib-module/Disclaimer/Disclaimer.js

@@ -1,54 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import styled from 'styled-components';
-import { applyTextStyles, selectSystemProps, useThemeTokens, getTokensPropType } from '@telus-uds/components-base';
-import { htmlAttrs } from '../utils';
-import { jsx as _jsx } from "react/jsx-runtime";
-const [selectProps, selectedSystemPropTypes] = selectSystemProps([htmlAttrs]);
-const StyledDisclaimer = /*#__PURE__*/styled.p.withConfig({
-  displayName: "Disclaimer__StyledDisclaimer",
-  componentId: "components-web__sc-1l4xf7u-0"
-})(_ref => {
-  let {
-    fontName,
-    fontWeight,
-    fontSize,
-    ...tokens
-  } = _ref;
-  const {
-    fontFamily
-  } = applyTextStyles({
-    fontName,
-    fontWeight
-  });
-  return {
-    fontSize: `${fontSize}px`,
-    fontFamily,
-    ...tokens
-  };
-});
-
-/**
- * Use Disclaimer to display singular legal statement and must be displayed
- * immediately adjacent to the related, originating content.
- */
-const Disclaimer = /*#__PURE__*/React.forwardRef((_ref2, ref) => {
-  let {
-    children,
-    ...rest
-  } = _ref2;
-  const themeTokens = useThemeTokens('Disclaimer');
-  return /*#__PURE__*/_jsx(StyledDisclaimer, {
-    ref: ref,
-    ...selectProps(rest),
-    ...themeTokens,
-    children: children
-  });
-});
-Disclaimer.displayName = 'Disclaimer';
-Disclaimer.propTypes = {
-  ...selectedSystemPropTypes,
-  tokens: getTokensPropType('Disclaimer'),
-  children: PropTypes.node.isRequired
-};
-export default Disclaimer;

package/lib-module/Disclaimer/index.js

@@ -1 +0,0 @@
-export { default } from './Disclaimer';

package/lib-module/ExpandCollapseMini/ExpandCollapseMini.js

@@ -1,73 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import { ExpandCollapse, getTokensPropType } from '@telus-uds/components-base';
-import ExpandCollapseMiniControl from './ExpandCollapseMiniControl';
-import { jsx as _jsx } from "react/jsx-runtime";
-const ExpandCollapseMini = /*#__PURE__*/React.forwardRef((_ref, ref) => {
-  let {
-    children,
-    onToggle = () => {},
-    tokens = {},
-    nativeID,
-    initialOpen = false,
-    ...rest
-  } = _ref;
-  const expandCollapeMiniPanelId = 'ExpandCollapseMiniPanel';
-  const handleChange = (openPanels, event) => {
-    if (typeof onToggle === 'function') {
-      const isOpen = openPanels.length > 0;
-      onToggle(event, isOpen);
-    }
-  };
-  return /*#__PURE__*/_jsx(ExpandCollapse, {
-    onChange: handleChange,
-    tokens: tokens,
-    initialOpen: initialOpen ? [expandCollapeMiniPanelId] : [],
-    children: expandProps => /*#__PURE__*/_jsx(ExpandCollapse.Panel, {
-      ...expandProps,
-      panelId: expandCollapeMiniPanelId,
-      variant: {
-        mini: true
-      },
-      controlTokens: {
-        // Remove unwanted look and feel from ExpandCollapse(background pressed, focus border and text underline)
-        icon: null,
-        borderColor: 'transparent',
-        textLine: 'none',
-        backgroundColor: 'transparent'
-      }
-      // TODO refactor
-      // eslint-disable-next-line react/no-unstable-nested-components
-      ,
-      control: pressableState => /*#__PURE__*/_jsx(ExpandCollapseMiniControl, {
-        pressableState: pressableState,
-        ...rest
-      }),
-      controlRef: ref,
-      nativeID: nativeID,
-      children: children
-    })
-  });
-});
-ExpandCollapseMini.displayName = 'ExpandCollapseMini';
-ExpandCollapseMini.propTypes = {
-  ...ExpandCollapseMiniControl.propTypes,
-  /**
-   * Function to call on pressing the panel's control, which should open or close the panel.
-   */
-  onToggle: PropTypes.func,
-  /**
-   * ID for DOM element on web
-   */
-  nativeID: PropTypes.string,
-  /**
-   * Children nodes that can be added
-   */
-  children: PropTypes.node.isRequired,
-  /**
-   * Controls if the panel and the content is opened by default on the first load
-   */
-  initialOpen: PropTypes.bool,
-  tokens: getTokensPropType('ExpandCollapseMini')
-};
-export default ExpandCollapseMini;

package/lib-module/ExpandCollapseMini/ExpandCollapseMiniControl.js

@@ -1,117 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import { selectSystemProps, Link, useThemeTokens } from '@telus-uds/components-base';
-import { htmlAttrs } from '../utils';
-import { jsx as _jsx } from "react/jsx-runtime";
-const [selectProps, selectedSystemPropTypes] = selectSystemProps([htmlAttrs]);
-
-// The ExpandCollapseControl has all the appropriate role, a11y, press handling etc
-// and a more appropriate press area, defer interaction handling to it.
-const presentationOnly = {
-  accessibilityRole: null,
-  // Treat as regular flow content with the Control
-  pointerEvents: 'none',
-  // Stop RNW from stopping clicks from bubbling to Control
-  focusable: false // Stop RNW from setting tabIndex={0}: focus goes to Control only
-};
-
-const selectLinkTokens = _ref => {
-  let {
-    color,
-    textLine,
-    lineHeight,
-    fontSize
-  } = _ref;
-  return {
-    color,
-    textLine,
-    blockLineHeight: lineHeight,
-    blockFontSize: fontSize
-  };
-};
-const ExpandCollapseMiniControl = /*#__PURE__*/React.forwardRef((_ref2, ref) => {
-  let {
-    pressableState,
-    collapseTitle,
-    expandTitle = collapseTitle,
-    iconPosition = 'right',
-    tokens,
-    variant = {},
-    ...rest
-  } = _ref2;
-  const {
-    expanded,
-    hover,
-    focus
-  } = pressableState || {};
-  // we only want focus outline when focusing, if user is pressing we don't want the border.
-  const {
-    outerBorderColor
-  } = useThemeTokens('Link', {}, {}, {
-    focus
-  });
-  const {
-    size,
-    icon,
-    ...themeTokens
-  } = useThemeTokens('ExpandCollapseMiniControl', tokens, variant, {
-    expanded,
-    focus
-  });
-
-  // Choose hover styles when any part of Control is hoverred
-  const appearance = {
-    ...variant,
-    hover
-  };
-  const getTokens = linkState => {
-    const {
-      hover: linkHover
-    } = linkState || {};
-    const isHovered = hover || linkHover;
-    if (isHovered) {
-      // Include vertical icon animation on hover alongside built-in Link theme, the size is size4
-      return {
-        iconTranslateY: (expanded ? -1 : 1) * size
-      };
-    }
-    return {};
-  };
-  return /*#__PURE__*/_jsx(Link, {
-    variant: appearance,
-    icon: icon,
-    iconPosition: iconPosition,
-    tokens: linkState => ({
-      ...getTokens(linkState),
-      ...selectLinkTokens(themeTokens),
-      outerBorderColor
-    }),
-    ref: ref,
-    ...presentationOnly,
-    ...selectProps(rest),
-    children: expanded ? expandTitle : collapseTitle
-  });
-});
-ExpandCollapseMiniControl.displayName = 'ExpandCollapseMiniControl';
-ExpandCollapseMiniControl.propTypes = {
-  ...selectedSystemPropTypes,
-  ...Link.propTypes,
-  /**
-   * Optional function to call on pressing the panel's control, in addition to opening or closing the panel
-   */
-  onPress: PropTypes.func,
-  /**
-   * ExpandCollapseMiniControl title when expanded
-   */
-  expandTitle: PropTypes.string.isRequired,
-  /**
-   * ExpandCollapseMiniControl title when collapsed
-   */
-  collapseTitle: PropTypes.string.isRequired,
-  /**
-   * React Native's `Pressable`'s state object
-   */
-  pressableState: PropTypes.object,
-  variant: PropTypes.object
-};
-export default ExpandCollapseMiniControl;

package/lib-module/ExpandCollapseMini/index.js

@@ -1,2 +0,0 @@
-import ExpandCollapseMini from './ExpandCollapseMini';
-export default ExpandCollapseMini;