@telus-uds/components-base 1.71.0 → 1.73.0

package/types/index.d.ts

@@ -0,0 +1,62 @@
+export { default as Badge } from './Badge'
+export type { BadgeProps, BadgeVariants, BadgeTokens } from './Badge'
+
+export { default as Box } from './Box'
+export type { BoxVariants, BoxTokens, BoxProps } from './Box'
+
+export { default as ChevronLink } from './ChevronLink'
+export { ChevronLinkTokens, ChevronLinkProps, HrefProps } from './ChevronLink'
+
+export { default as Divider } from './Divider'
+export { DividerVariants, DividerProps, DividerTokens } from './Divider'
+
+export { default as ExpandCollapse } from './ExpandCollapse'
+export {
+  ExpandCollapseVariants,
+  ExpandCollapseTokens,
+  ExpandCollapseControlTokens,
+  ExpandFnProps,
+  ExpandCollapseProps,
+  ExpandCollapsePanelProps
+} from './ExpandCollapse'
+
+export { default as HorizontalScrollButton } from './HorizontalScrollButton'
+export { HorizontalScrollButtonTokens } from './HorizontalScrollButton'
+
+export { default as Icon } from './Icon'
+export { IconProps, IconTokens, IconVariant, IconPositionLeftRight } from './Icon'
+
+export { default as Link } from './Link'
+export { LinkProps, LinkSize, LinkAndTextButtonVariants, LinkTokens } from './Link'
+
+export { default as List } from './List'
+export { ListVariants, ListTokens, ListProps, ListItemProps, ListItemTokens } from './List'
+
+export { default as Search } from './Search'
+export { SearchTokens, SearchProps } from './Search'
+
+export { default as Select } from './Select'
+export { SelectTokens, SelectProps, SelectItemProps, SelectGroupProps } from './Select'
+
+export { default as Spacer } from './Spacer'
+export { SpacerProps } from './Spacer'
+
+export { default as StackView } from './StackView'
+export { StackViewTokens, StackViewProps } from './StackView'
+
+export { default as Tabs } from './Tabs'
+export { TabsProps, TabsTokens, TabSelectorProps, TabsVariant, TabsItem } from './Tabs'
+
+export { default as TextButton } from './TextButton'
+export { TextButtonProps } from './TextButton'
+
+export { default as ToggleSwitch } from './ToggleSwitch'
+export { ToggleSwitchTokens, ToggleSwitchProps } from './ToggleSwitch'
+
+export { default as Tooltip } from './ToolTip'
+export { TooltipTokens, TooltipVariants, TooltipProps } from './ToolTip'
+
+export { default as Typography } from './Typography'
+export { TypographyProps, TypographyVariants, TypographyTokens } from './Typography'
+
+export * from './Common'

package/lib/utils/ssr-media-query/create-stylesheet.js

@@ -1,76 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _cssMediaquery = _interopRequireDefault(require("css-mediaquery"));
-var _Dimensions = _interopRequireDefault(require("react-native-web/dist/cjs/exports/Dimensions"));
-var _Platform = _interopRequireDefault(require("react-native-web/dist/cjs/exports/Platform"));
-var _inject = require("./utils/inject");
-var _createDeclarationBlock = _interopRequireDefault(require("./utils/create-declaration-block"));
-var _hash = _interopRequireDefault(require("./hash"));
-var _common = require("./utils/common");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-const createStyleSheet = stylesWithQuery => {
-  if (!stylesWithQuery) return {
-    ids: {},
-    styles: {},
-    fullStyles: {}
-  };
-  let cleanStyles;
-  let ids = {};
-  Object.keys(stylesWithQuery).forEach(key => {
-    if (!(stylesWithQuery !== null && stylesWithQuery !== void 0 && stylesWithQuery[key])) return;
-    const mediaQueriesAndPseudoClasses = Object.keys(stylesWithQuery[key]).filter(_common.isMediaOrPseudo);
-    if (_Platform.default.OS === 'web') {
-      cleanStyles = (0, _common.deepClone)(stylesWithQuery);
-      mediaQueriesAndPseudoClasses.forEach(query => {
-        var _ids;
-        const css = (0, _createDeclarationBlock.default)(stylesWithQuery[key][query]);
-        const stringHash = `rnmq-${(0, _hash.default)(`${key}${query}${css}`)}`;
-        const rule = (0, _common.createCssRule)(query, stringHash, css);
-        (0, _inject.addCss)(`${stringHash}`, rule);
-        delete cleanStyles[key][query];
-        ids = {
-          ...ids,
-          [key]: `${(_ids = ids) !== null && _ids !== void 0 && _ids[key] ? `${ids[key]} ` : ''}${stringHash}`
-        };
-      });
-    } else {
-      cleanStyles = JSON.parse(JSON.stringify(stylesWithQuery));
-      mediaQueriesAndPseudoClasses.forEach(str => {
-        if ((0, _common.isMedia)(str)) {
-          const mqStr = str.replace('@media', '');
-          const {
-            width,
-            height
-          } = _Dimensions.default.get('window');
-          const isMatchingMediaQuery = _cssMediaquery.default.match(mqStr, {
-            width,
-            height,
-            orientation: width > height ? 'landscape' : 'portrait',
-            'aspect-ratio': width / height
-          });
-          if (isMatchingMediaQuery) {
-            cleanStyles = {
-              ...cleanStyles,
-              [key]: {
-                ...cleanStyles[key],
-                ...stylesWithQuery[key][str]
-              }
-            };
-          }
-        }
-        delete cleanStyles[key][str];
-      });
-    }
-  });
-  return {
-    ids,
-    styles: cleanStyles,
-    fullStyles: stylesWithQuery
-  };
-};
-var _default = createStyleSheet;
-exports.default = _default;

package/lib-module/utils/ssr-media-query/create-stylesheet.js

@@ -1,68 +0,0 @@
-import mediaQuery from 'css-mediaquery';
-import Dimensions from "react-native-web/dist/exports/Dimensions";
-import Platform from "react-native-web/dist/exports/Platform";
-import { addCss } from './utils/inject';
-import createDeclarationBlock from './utils/create-declaration-block';
-import hash from './hash';
-import { isMediaOrPseudo, isMedia, deepClone, createCssRule } from './utils/common';
-const createStyleSheet = stylesWithQuery => {
-  if (!stylesWithQuery) return {
-    ids: {},
-    styles: {},
-    fullStyles: {}
-  };
-  let cleanStyles;
-  let ids = {};
-  Object.keys(stylesWithQuery).forEach(key => {
-    if (!(stylesWithQuery !== null && stylesWithQuery !== void 0 && stylesWithQuery[key])) return;
-    const mediaQueriesAndPseudoClasses = Object.keys(stylesWithQuery[key]).filter(isMediaOrPseudo);
-    if (Platform.OS === 'web') {
-      cleanStyles = deepClone(stylesWithQuery);
-      mediaQueriesAndPseudoClasses.forEach(query => {
-        var _ids;
-        const css = createDeclarationBlock(stylesWithQuery[key][query]);
-        const stringHash = `rnmq-${hash(`${key}${query}${css}`)}`;
-        const rule = createCssRule(query, stringHash, css);
-        addCss(`${stringHash}`, rule);
-        delete cleanStyles[key][query];
-        ids = {
-          ...ids,
-          [key]: `${(_ids = ids) !== null && _ids !== void 0 && _ids[key] ? `${ids[key]} ` : ''}${stringHash}`
-        };
-      });
-    } else {
-      cleanStyles = JSON.parse(JSON.stringify(stylesWithQuery));
-      mediaQueriesAndPseudoClasses.forEach(str => {
-        if (isMedia(str)) {
-          const mqStr = str.replace('@media', '');
-          const {
-            width,
-            height
-          } = Dimensions.get('window');
-          const isMatchingMediaQuery = mediaQuery.match(mqStr, {
-            width,
-            height,
-            orientation: width > height ? 'landscape' : 'portrait',
-            'aspect-ratio': width / height
-          });
-          if (isMatchingMediaQuery) {
-            cleanStyles = {
-              ...cleanStyles,
-              [key]: {
-                ...cleanStyles[key],
-                ...stylesWithQuery[key][str]
-              }
-            };
-          }
-        }
-        delete cleanStyles[key][str];
-      });
-    }
-  });
-  return {
-    ids,
-    styles: cleanStyles,
-    fullStyles: stylesWithQuery
-  };
-};
-export default createStyleSheet;

package/src/utils/ssr-media-query/create-stylesheet.js

@@ -1,61 +0,0 @@
-import mediaQuery from 'css-mediaquery'
-import { Dimensions, Platform } from 'react-native'
-import { addCss } from './utils/inject'
-import createDeclarationBlock from './utils/create-declaration-block'
-import hash from './hash'
-import { isMediaOrPseudo, isMedia, deepClone, createCssRule } from './utils/common'
-
-const createStyleSheet = (stylesWithQuery) => {
-  if (!stylesWithQuery) return { ids: {}, styles: {}, fullStyles: {} }
-  let cleanStyles
-  let ids = {}
-  Object.keys(stylesWithQuery).forEach((key) => {
-    if (!stylesWithQuery?.[key]) return
-
-    const mediaQueriesAndPseudoClasses = Object.keys(stylesWithQuery[key]).filter(isMediaOrPseudo)
-    if (Platform.OS === 'web') {
-      cleanStyles = deepClone(stylesWithQuery)
-      mediaQueriesAndPseudoClasses.forEach((query) => {
-        const css = createDeclarationBlock(stylesWithQuery[key][query])
-        const stringHash = `rnmq-${hash(`${key}${query}${css}`)}`
-        const rule = createCssRule(query, stringHash, css)
-
-        addCss(`${stringHash}`, rule)
-        delete cleanStyles[key][query]
-
-        ids = {
-          ...ids,
-          [key]: `${ids?.[key] ? `${ids[key]} ` : ''}${stringHash}`
-        }
-      })
-    } else {
-      cleanStyles = JSON.parse(JSON.stringify(stylesWithQuery))
-      mediaQueriesAndPseudoClasses.forEach((str) => {
-        if (isMedia(str)) {
-          const mqStr = str.replace('@media', '')
-          const { width, height } = Dimensions.get('window')
-
-          const isMatchingMediaQuery = mediaQuery.match(mqStr, {
-            width,
-            height,
-            orientation: width > height ? 'landscape' : 'portrait',
-            'aspect-ratio': width / height
-          })
-
-          if (isMatchingMediaQuery) {
-            cleanStyles = {
-              ...cleanStyles,
-              [key]: { ...cleanStyles[key], ...stylesWithQuery[key][str] }
-            }
-          }
-        }
-
-        delete cleanStyles[key][str]
-      })
-    }
-  })
-
-  return { ids, styles: cleanStyles, fullStyles: stylesWithQuery }
-}
-
-export default createStyleSheet