@elliemae/ds-breadcrumb 2.0.0-alpha.11 → 2.0.0-alpha.12

package/cjs/DSBreadcrumb.js

@@ -6,6 +6,13 @@ var _defineProperty = require('@babel/runtime/helpers/defineProperty');
 var _jsx = require('@babel/runtime/helpers/jsx');
 var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
 require('core-js/modules/web.dom-collections.iterator.js');
+require('core-js/modules/esnext.async-iterator.map.js');
+require('core-js/modules/esnext.iterator.map.js');
+require('core-js/modules/esnext.async-iterator.filter.js');
+require('core-js/modules/esnext.iterator.constructor.js');
+require('core-js/modules/esnext.iterator.filter.js');
+require('core-js/modules/esnext.async-iterator.for-each.js');
+require('core-js/modules/esnext.iterator.for-each.js');
 var React = require('react');
 var reactDesc = require('react-desc');
 var DSBreadcrumbItem = require('./DSBreadcrumbItem.js');

package/cjs/DSBreadcrumbItem.js

@@ -2,6 +2,11 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
+require('core-js/modules/esnext.async-iterator.filter.js');
+require('core-js/modules/esnext.iterator.constructor.js');
+require('core-js/modules/esnext.iterator.filter.js');
+require('core-js/modules/esnext.async-iterator.for-each.js');
+require('core-js/modules/esnext.iterator.for-each.js');
 var _defineProperty = require('@babel/runtime/helpers/defineProperty');
 var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
 require('react');

package/cjs/styles.js

@@ -14,35 +14,53 @@ const handleColor = (theme, isActive, color, isTitle) => {
 
 const StyledList = /*#__PURE__*/styled__default["default"].ol.withConfig({
   componentId: "sc-12gvmg4-0"
-})(["width:100%;list-style:none;display:flex;padding:0;li:first-child *{margin-left:0;}"]);
+})(["width:100%;list-style:none;display:flex;padding:0;margin:0;li:first-child *{margin-left:0;}"]);
 const StyledCrumbWrapper = /*#__PURE__*/styled__default["default"].li.withConfig({
   componentId: "sc-12gvmg4-1"
-})(["display:inline-flex;align-items:center;flex-shrink:20;transition:flex-shrink 0.1s cubic-bezier(0.64,0,0.35,1);height:16px;min-width:10px;&:hover{flex-shrink:0;}", ""], ({
-  theme,
-  isTitle,
-  trailingSlash
-}) => isTitle || !trailingSlash ? "&:not(:last-child):after {\n    display: inline-block;\n    content: '/';\n    color: ".concat(theme.colors.neutral[700], ";\n  }\n  ") : "&:after {\n    display: inline-block;\n    content: '/';\n    color: ".concat(theme.colors.neutral[700], ";\n  }\n  "));
+})(["display:inline-flex;align-items:center;flex-shrink:20;transition:flex-shrink 0.1s cubic-bezier(0.64,0,0.35,1);height:16px;min-width:10px;&:hover{flex-shrink:0;}", ""], _ref => {
+  let {
+    theme,
+    isTitle,
+    trailingSlash
+  } = _ref;
+  return isTitle || !trailingSlash ? "&:not(:last-child):after {\n    display: inline-block;\n    content: '/';\n    color: ".concat(theme.colors.neutral[700], ";\n  }\n  ") : "&:after {\n    display: inline-block;\n    content: '/';\n    color: ".concat(theme.colors.neutral[700], ";\n  }\n  ");
+});
 const StyledContainer = /*#__PURE__*/styled__default["default"].nav.withConfig({
   componentId: "sc-12gvmg4-2"
 })(["display:flex;align-items:center;padding:0;"]);
 const StyledLink = /*#__PURE__*/styled__default["default"].a.withConfig({
   componentId: "sc-12gvmg4-3"
-})(["white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-decoration:none;font-size:12px;outline:none;margin:0 2px;border:2px solid transparent;-webkit-text-stroke:0.4px transparent;font-weight:", ";color:", ";&:hover{color:", ";cursor:pointer;", ";}&:focus{", " border-radius:2px;}"], ({
-  theme
-}) => theme.fontWeights.regular, ({
-  theme,
-  isActive,
-  color,
-  isTitle
-}) => handleColor(theme, isActive, color, isTitle), ({
-  theme,
-  color
-}) => color ? color : theme.colors.brand[800], ({
-  theme,
-  color
-}) => "-webkit-text-stroke: 0.4px ".concat(color ? color : theme.colors.brand[800]), ({
-  theme
-}) => "border: 2px solid ".concat(theme.colors.brand[700], ";"));
+})(["white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-decoration:none;font-size:12px;outline:none;margin:0 2px;border:2px solid transparent;-webkit-text-stroke:0.4px transparent;font-weight:", ";color:", ";&:hover{color:", ";cursor:pointer;", ";}&:focus{", " border-radius:2px;}"], _ref2 => {
+  let {
+    theme
+  } = _ref2;
+  return theme.fontWeights.regular;
+}, _ref3 => {
+  let {
+    theme,
+    isActive,
+    color,
+    isTitle
+  } = _ref3;
+  return handleColor(theme, isActive, color, isTitle);
+}, _ref4 => {
+  let {
+    theme,
+    color
+  } = _ref4;
+  return color ? color : theme.colors.brand[800];
+}, _ref5 => {
+  let {
+    theme,
+    color
+  } = _ref5;
+  return "-webkit-text-stroke: 0.4px ".concat(color ? color : theme.colors.brand[800]);
+}, _ref6 => {
+  let {
+    theme
+  } = _ref6;
+  return "border: 2px solid ".concat(theme.colors.brand[700], ";");
+});
 
 exports.StyledContainer = StyledContainer;
 exports.StyledCrumbWrapper = StyledCrumbWrapper;

package/esm/DSBreadcrumb.js

@@ -2,6 +2,13 @@ import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
 import _jsx from '@babel/runtime/helpers/esm/jsx';
 import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
 import 'core-js/modules/web.dom-collections.iterator.js';
+import 'core-js/modules/esnext.async-iterator.map.js';
+import 'core-js/modules/esnext.iterator.map.js';
+import 'core-js/modules/esnext.async-iterator.filter.js';
+import 'core-js/modules/esnext.iterator.constructor.js';
+import 'core-js/modules/esnext.iterator.filter.js';
+import 'core-js/modules/esnext.async-iterator.for-each.js';
+import 'core-js/modules/esnext.iterator.for-each.js';
 import React, { useMemo, cloneElement } from 'react';
 import { PropTypes, describe } from 'react-desc';
 import { DSBreadcrumbItem } from './DSBreadcrumbItem.js';

package/esm/DSBreadcrumbItem.js

@@ -1,3 +1,8 @@
+import 'core-js/modules/esnext.async-iterator.filter.js';
+import 'core-js/modules/esnext.iterator.constructor.js';
+import 'core-js/modules/esnext.iterator.filter.js';
+import 'core-js/modules/esnext.async-iterator.for-each.js';
+import 'core-js/modules/esnext.iterator.for-each.js';
 import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
 import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
 import 'react';

package/esm/styles.js

@@ -6,34 +6,52 @@ const handleColor = (theme, isActive, color, isTitle) => {
 
 const StyledList = /*#__PURE__*/styled.ol.withConfig({
   componentId: "sc-12gvmg4-0"
-})(["width:100%;list-style:none;display:flex;padding:0;li:first-child *{margin-left:0;}"]);
+})(["width:100%;list-style:none;display:flex;padding:0;margin:0;li:first-child *{margin-left:0;}"]);
 const StyledCrumbWrapper = /*#__PURE__*/styled.li.withConfig({
   componentId: "sc-12gvmg4-1"
-})(["display:inline-flex;align-items:center;flex-shrink:20;transition:flex-shrink 0.1s cubic-bezier(0.64,0,0.35,1);height:16px;min-width:10px;&:hover{flex-shrink:0;}", ""], ({
-  theme,
-  isTitle,
-  trailingSlash
-}) => isTitle || !trailingSlash ? "&:not(:last-child):after {\n    display: inline-block;\n    content: '/';\n    color: ".concat(theme.colors.neutral[700], ";\n  }\n  ") : "&:after {\n    display: inline-block;\n    content: '/';\n    color: ".concat(theme.colors.neutral[700], ";\n  }\n  "));
+})(["display:inline-flex;align-items:center;flex-shrink:20;transition:flex-shrink 0.1s cubic-bezier(0.64,0,0.35,1);height:16px;min-width:10px;&:hover{flex-shrink:0;}", ""], _ref => {
+  let {
+    theme,
+    isTitle,
+    trailingSlash
+  } = _ref;
+  return isTitle || !trailingSlash ? "&:not(:last-child):after {\n    display: inline-block;\n    content: '/';\n    color: ".concat(theme.colors.neutral[700], ";\n  }\n  ") : "&:after {\n    display: inline-block;\n    content: '/';\n    color: ".concat(theme.colors.neutral[700], ";\n  }\n  ");
+});
 const StyledContainer = /*#__PURE__*/styled.nav.withConfig({
   componentId: "sc-12gvmg4-2"
 })(["display:flex;align-items:center;padding:0;"]);
 const StyledLink = /*#__PURE__*/styled.a.withConfig({
   componentId: "sc-12gvmg4-3"
-})(["white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-decoration:none;font-size:12px;outline:none;margin:0 2px;border:2px solid transparent;-webkit-text-stroke:0.4px transparent;font-weight:", ";color:", ";&:hover{color:", ";cursor:pointer;", ";}&:focus{", " border-radius:2px;}"], ({
-  theme
-}) => theme.fontWeights.regular, ({
-  theme,
-  isActive,
-  color,
-  isTitle
-}) => handleColor(theme, isActive, color, isTitle), ({
-  theme,
-  color
-}) => color ? color : theme.colors.brand[800], ({
-  theme,
-  color
-}) => "-webkit-text-stroke: 0.4px ".concat(color ? color : theme.colors.brand[800]), ({
-  theme
-}) => "border: 2px solid ".concat(theme.colors.brand[700], ";"));
+})(["white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-decoration:none;font-size:12px;outline:none;margin:0 2px;border:2px solid transparent;-webkit-text-stroke:0.4px transparent;font-weight:", ";color:", ";&:hover{color:", ";cursor:pointer;", ";}&:focus{", " border-radius:2px;}"], _ref2 => {
+  let {
+    theme
+  } = _ref2;
+  return theme.fontWeights.regular;
+}, _ref3 => {
+  let {
+    theme,
+    isActive,
+    color,
+    isTitle
+  } = _ref3;
+  return handleColor(theme, isActive, color, isTitle);
+}, _ref4 => {
+  let {
+    theme,
+    color
+  } = _ref4;
+  return color ? color : theme.colors.brand[800];
+}, _ref5 => {
+  let {
+    theme,
+    color
+  } = _ref5;
+  return "-webkit-text-stroke: 0.4px ".concat(color ? color : theme.colors.brand[800]);
+}, _ref6 => {
+  let {
+    theme
+  } = _ref6;
+  return "border: 2px solid ".concat(theme.colors.brand[700], ";");
+});
 
 export { StyledContainer, StyledCrumbWrapper, StyledLink, StyledList };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elliemae/ds-breadcrumb",
-  "version": "2.0.0-alpha.11",
+  "version": "2.0.0-alpha.12",
   "license": "MIT",
   "description": "ICE MT - Dimsum - Breadcrumb",
   "module": "./esm/index.js",
@@ -48,12 +48,21 @@
     "build": "node ../../scripts/build/build.js"
   },
   "dependencies": {
-    "@elliemae/ds-classnames": "2.0.0-alpha.11",
-    "react-desc": "^4.1.3"
+    "@elliemae/ds-system": "2.0.0-alpha.12",
+    "react-desc": "~4.1.3"
+  },
+  "devDependencies": {
+    "@elliemae/pui-theme": "~2.2.5",
+    "@testing-library/jest-dom": "~5.15.0",
+    "@testing-library/react": "~12.1.2",
+    "@testing-library/user-event": "~13.5.0",
+    "styled-components": "~5.3.3"
   },
   "peerDependencies": {
+    "@elliemae/pui-theme": "^2.2.5",
     "react": "^17.0.2",
-    "react-dom": "^17.0.2"
+    "react-dom": "^17.0.2",
+    "styled-components": "^5.3.3"
   },
   "publishConfig": {
     "access": "public",

package/types/DSBreadcrumb.d.ts

@@ -1,3 +1,4 @@
+/// <reference path="../../../../shared/typings/react-desc.d.ts" />
 import React from 'react';
 import DSBreadcrumbItem from './DSBreadcrumbItem';
 import type { DSBreadcrumbPropsT } from './index.d';
@@ -7,25 +8,49 @@ declare const DSBreadcrumb: {
     Item: typeof DSBreadcrumbItem;
     propTypes: {
         /** props injected to breadcrumb wrapper */
-        containerProps: any;
+        containerProps: {
+            defaultValue<T = unknown>(arg: T): {
+                deprecated: import("react-desc").PropTypesDescValidator;
+            };
+            isRequired: import("react-desc").PropTypesDescValidator;
+        };
         /**
          * Type of element you want the main container to be:
          * 'nav', 'div', 'header', 'footer', 'main'
          */
-        as: any;
+        as: {
+            defaultValue<T = unknown>(arg: T): {
+                deprecated: import("react-desc").PropTypesDescValidator;
+            };
+            isRequired: import("react-desc").PropTypesDescValidator;
+        };
         /**
          * Whether to show the last element of the breadcrumb as a title
          * Also removes trailing slash to show last element as title
          */
-        isTitle: any;
+        isTitle: {
+            defaultValue<T = unknown>(arg: T): {
+                deprecated: import("react-desc").PropTypesDescValidator;
+            };
+            isRequired: import("react-desc").PropTypesDescValidator;
+        };
         /** breadcrumb label */
-        label: any;
+        label: {
+            defaultValue<T = unknown>(arg: T): {
+                deprecated: import("react-desc").PropTypesDescValidator;
+            };
+            isRequired: import("react-desc").PropTypesDescValidator;
+        };
         /**
          * Container items to wrap
          */
         children: any;
     };
 };
-declare const DSBreadcrumbWithSchema: any;
+declare const DSBreadcrumbWithSchema: {
+    (props?: DSBreadcrumbPropsT | undefined): JSX.Element;
+    propTypes: unknown;
+    toTypescript: () => import("react-desc").TypescriptSchema;
+};
 export { DSBreadcrumb, DSBreadcrumbWithSchema, htmlElements };
 export default DSBreadcrumb;

package/types/DSBreadcrumbItem.d.ts

@@ -1,28 +1,78 @@
+/// <reference path="../../../../shared/typings/react-desc.d.ts" />
 import React from 'react';
 import type { DSBreadcrumbItemPropsT } from './index.d';
 declare function DSBreadcrumbItem({ active, as, href, isTitle, onClick, label, color, addRef, childIndex, trailingSlash, onKeyDown, ...rest }: DSBreadcrumbItemPropsT): React.ReactElement;
 declare namespace DSBreadcrumbItem {
     var propTypes: {
         /** inject props to wrapper */
-        containerComponent: any;
+        containerComponent: {
+            defaultValue<T = unknown>(arg: T): {
+                deprecated: import("react-desc").PropTypesDescValidator;
+            };
+            isRequired: import("react-desc").PropTypesDescValidator;
+        };
         /** render as any html node */
-        as: any;
+        as: {
+            defaultValue<T = unknown>(arg: T): {
+                deprecated: import("react-desc").PropTypesDescValidator;
+            };
+            isRequired: import("react-desc").PropTypesDescValidator;
+        };
         /** active item */
-        active: any;
+        active: {
+            defaultValue<T = unknown>(arg: T): {
+                deprecated: import("react-desc").PropTypesDescValidator;
+            };
+            isRequired: import("react-desc").PropTypesDescValidator;
+        };
         /** href link */
-        href: any;
+        href: {
+            defaultValue<T = unknown>(arg: T): {
+                deprecated: import("react-desc").PropTypesDescValidator;
+            };
+            isRequired: import("react-desc").PropTypesDescValidator;
+        };
         /** on click handler */
-        onClick: any;
+        onClick: {
+            defaultValue<T = unknown>(arg: T): {
+                deprecated: import("react-desc").PropTypesDescValidator;
+            };
+            isRequired: import("react-desc").PropTypesDescValidator;
+        };
         /** style item as title */
-        isTitle: any;
+        isTitle: {
+            defaultValue<T = unknown>(arg: T): {
+                deprecated: import("react-desc").PropTypesDescValidator;
+            };
+            isRequired: import("react-desc").PropTypesDescValidator;
+        };
         /** add trailing slash */
-        trailingSlash: any;
+        trailingSlash: {
+            defaultValue<T = unknown>(arg: T): {
+                deprecated: import("react-desc").PropTypesDescValidator;
+            };
+            isRequired: import("react-desc").PropTypesDescValidator;
+        };
         /** item label */
-        label: any;
+        label: {
+            defaultValue<T = unknown>(arg: T): {
+                deprecated: import("react-desc").PropTypesDescValidator;
+            };
+            isRequired: import("react-desc").PropTypesDescValidator;
+        };
         /** link color */
-        color: any;
+        color: {
+            defaultValue<T = unknown>(arg: T): {
+                deprecated: import("react-desc").PropTypesDescValidator;
+            };
+            isRequired: import("react-desc").PropTypesDescValidator;
+        };
     };
 }
-declare const DSBreadcrumbItemWithSchema: any;
+declare const DSBreadcrumbItemWithSchema: {
+    (props?: DSBreadcrumbItemPropsT | undefined): JSX.Element;
+    propTypes: unknown;
+    toTypescript: () => import("react-desc").TypescriptSchema;
+};
 export { DSBreadcrumbItem, DSBreadcrumbItemWithSchema };
 export default DSBreadcrumbItem;

package/types/styles.d.ts

@@ -1,6 +1,6 @@
 import type { DSBreadcrumbItemPropsT } from './index.d';
-declare const StyledList: import("styled-components").StyledComponent<"ol", any, {}, never>;
-declare const StyledCrumbWrapper: import("styled-components").StyledComponent<"li", any, Partial<DSBreadcrumbItemPropsT>, never>;
-declare const StyledContainer: import("styled-components").StyledComponent<"nav", any, {}, never>;
-declare const StyledLink: import("styled-components").StyledComponent<"a", any, Partial<DSBreadcrumbItemPropsT>, never>;
+declare const StyledList: import("styled-components").StyledComponent<"ol", import("styled-components").DefaultTheme, {}, never>;
+declare const StyledCrumbWrapper: import("styled-components").StyledComponent<"li", import("styled-components").DefaultTheme, Partial<DSBreadcrumbItemPropsT>, never>;
+declare const StyledContainer: import("styled-components").StyledComponent<"nav", import("styled-components").DefaultTheme, {}, never>;
+declare const StyledLink: import("styled-components").StyledComponent<"a", import("styled-components").DefaultTheme, Partial<DSBreadcrumbItemPropsT>, never>;
 export { StyledList, StyledCrumbWrapper, StyledContainer, StyledLink };