@cavilha/breadcrumb - npm Package Compare versions

Comparing version 0.1.3 to 0.2.0

CHANGELOG.md

 # @cavilha/breadcrumb
 
+## 0.2.0
+
+### Minor Changes
+
+- 4071c83: add prop onBreadcrumbItemClick: add click event to crumbs
+
 ## 0.1.3
@@ -4,0 +10,0 @@

dist/Breadcrumb.d.ts

@@ -1,21 +0,4 @@
-import React from 'react';
-import * as S from './Breadcrumb.styles';
-export declare type Crumb = {
-    key: string | number;
-    name?: string;
-    path?: string;
-    childElement?: React.ReactNode;
-};
-export declare type BreadcrumbProps = {
-    crumbs: Crumb[];
-    homePath?: string;
-    showHomeButton?: boolean;
-    showBackButton?: boolean;
-    isLastItemLimited?: boolean;
-    scrollMobile?: boolean;
-    homeButtonType?: string;
-    focusLastItem?: boolean;
-    onBackButtonClick?: (e: React.MouseEvent<HTMLButtonElement>) => void;
-} & S.Variants;
-declare const Breadcrumb: ({ crumbs, homePath, showHomeButton, showBackButton, onBackButtonClick, isLastItemLimited, scrollMobile, homeButtonType, focusLastItem, }: BreadcrumbProps) => JSX.Element;
+/// <reference types="react" />
+import { BreadcrumbProps } from './Breadcrumb.types';
+declare const Breadcrumb: ({ crumbs, homePath, showHomeButton, showBackButton, onBackButtonClick, isLastItemLimited, scrollMobile, homeButtonType, focusLastItem, onBreadcrumbItemClick, }: BreadcrumbProps) => JSX.Element;
 export default Breadcrumb;

dist/BreadcrumbItem.d.ts

@@ -1,11 +0,4 @@
-import React from 'react';
-import * as S from './Breadcrumb.styles';
-export declare type BreadcrumbItemProps = React.ComponentProps<typeof S.BreadcrumbItemContainer> & {
-    path?: string;
-    hasMark?: boolean;
-    markPosition?: string;
-    isActive?: boolean;
-    isMobile?: boolean;
-    isLastItemLimited?: boolean;
-};
+/// <reference types="react" />
+import { BreadcrumbItemLinkProps, BreadcrumbItemProps } from './Breadcrumb.types';
+export declare const BreadcrumbItemLink: ({ children, path, isActive, onBreadcrumbItemClick }: BreadcrumbItemLinkProps) => JSX.Element;
 export declare const BreadcrumbItem: ({ children, path, hasMark, markPosition, isActive, isMobile, isLastItemLimited, }: BreadcrumbItemProps) => JSX.Element;

dist/index.cjs.js

@@ -1,1 +0,1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("react-responsive"),r=require("@cavilha/theme"),a=require("@fortawesome/pro-regular-svg-icons"),l=require("@cavilha/button"),i=require("@cavilha/icon");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var o=n(e),c=n(l),u=n(i),s=function(){return s=Object.assign||function(e){for(var t,r=1,a=arguments.length;r<a;r++)for(var l in t=arguments[r])Object.prototype.hasOwnProperty.call(t,l)&&(e[l]=t[l]);return e},s.apply(this,arguments)};function d(e,t){var r={};for(var a in e)Object.prototype.hasOwnProperty.call(e,a)&&t.indexOf(a)<0&&(r[a]=e[a]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var l=0;for(a=Object.getOwnPropertySymbols(e);l<a.length;l++)t.indexOf(a[l])<0&&Object.prototype.propertyIsEnumerable.call(e,a[l])&&(r[a[l]]=e[a[l]])}return r}var f=r.styled("div",{display:"flex",flexWrap:"wrap",alignItems:"center",padding:"$small3 0",variants:{scrollMobile:{true:{flexWrap:"initial",overflow:"scroll","@lg":{flexWrap:"wrap",overflow:"initial"}}}}}),m=r.styled("div",{display:"flex",fontSize:"$bodySmall","& p":{margin:0},"& a":{textDecoration:"none",borderRadius:"$small",minWidth:"max-content","&:hover":{textDecoration:"underline"},"&:focus":{outline:"none",boxShadow:"$focusPressed"},"&:active":{outline:"none",boxShadow:"$focusPressed"}},variants:{active:{true:{color:"$neutral5","& a":{color:"$neutral5"}},false:{"& a":{color:"$secondary4"}}},isMobile:{true:{"& p":{maxWidth:"20ch",overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"}}},isLastItemLimited:{true:{"& p":{maxWidth:"300px",overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"}}}}}),v=r.styled("div",{color:"$neutral4",padding:"0 $small2"}),h=r.styled("div",{padding:"1px 2px",borderRadius:"$small",textDecoration:"none",variants:{active:{false:{"&:hover":{background:"$secondaryHover0"}}}}}),p=r.styled("div",{borderRadius:"$small",cursor:"pointer",fontSize:"$bodySmall",color:"$neutral5","& a":{textDecoration:"none",borderRadius:"$small",fontSize:"$bodySmall",fontWeight:"$bold",color:"$neutral5 !important",p:"$none","&:hover":{textDecoration:"underline",backgroundColor:"$none"}}}),b=r.styled("button",{background:"none",border:"none",borderRadius:"$small",cursor:"pointer","&:hover":{textDecoration:"underline"},"&:focus":{outline:"none",boxShadow:"$focusPressed"},"&:active":{outline:"none",boxShadow:"$focusPressed"}}),E=r.styled("div",{display:"flex",variants:{scrollMobile:{true:{overflow:"scroll",width:"100%",minWidth:"max-content"}}}}),y=function(e){var t=e.marker,r=d(e,["marker"]);return o.default.createElement(b,s({},r),t)},g=function(e){var t=e.marker,r="string"==typeof t?t:o.default.createElement(u.default,{icon:t,iconSize:14});return o.default.createElement(v,null,r)},x=function(e){var t=e.children,r=e.path,l=e.hasMark,i=void 0!==l&&l,n=e.markPosition,c=void 0===n?"left":n,u=e.isActive,s=void 0!==u&&u,d=e.isMobile,f=void 0!==d&&d,v=e.isLastItemLimited,h=void 0!==v&&v,p="left"===c&&o.default.createElement(g,{marker:a.faChevronRight}),b="right"===c&&o.default.createElement(g,{marker:a.faChevronRight});return o.default.createElement(m,{active:s,isMobile:f,isLastItemLimited:h},i&&p,function(e,t,r){return void 0===r&&(r=!1),r?o.default.createElement("p",null,e):"string"==typeof e&&t?o.default.createElement("a",{href:t},e):e}(t,r,s),i&&b)},k=function(e){var t=e.isActive,r=e.homePath;return o.default.createElement(h,{active:t},o.default.createElement(x,{isActive:t},t?o.default.createElement(u.default,{icon:a.faHomeAlt,iconSize:14}):o.default.createElement("a",{href:r},o.default.createElement(u.default,{icon:a.faHomeAlt,iconSize:14}))))},L=function(e){var t=e.isActive,r=e.homePath;return o.default.createElement(h,null,o.default.createElement(x,{isActive:t},o.default.createElement("a",{href:r,title:"Voltar a Página inicial"},"Página inicial")))},M=function(a){var l=a.isActive,i=a.onBackButtonClick,n=t.useMediaQuery({query:r.media.md}),u=e.useMemo((function(){return n?"Voltar a página anterior":"Voltar"}),[n]);return o.default.createElement(p,null,o.default.createElement(x,{isActive:l},o.default.createElement(c.default,{as:"a",variant:"terciary",onClick:i,label:u})))},w=function(e){var t=e.crumbs,r=e.isLastItemLimited;return t.map((function(e,a){var l=e.key,i=e.path,n=e.name,c=e.childElement,u=void 0===c?null:c,s=function(e,t){return e===t-1}(a,t.length);return u?o.default.createElement(x,{key:l,hasMark:!0,isActive:s},u):o.default.createElement(x,{key:l,hasMark:!0,path:i,isActive:s,isMobile:!1,isLastItemLimited:r&&s},n)}))},$=function(e){var t=e.crumbs,r=e.scrollMobile,a=e.isLastItemLimited,l=d(e,["crumbs","scrollMobile","isLastItemLimited"]),i=t[t.length-1],n=i.name,c=i.childElement;return r?o.default.createElement(E,{scrollMobile:!0},o.default.createElement(w,{crumbs:t,isLastItemLimited:a})):o.default.createElement(E,null,o.default.createElement(x,{hasMark:!0},o.default.createElement(y,s({marker:"..."},l))),c?o.default.createElement(x,{hasMark:!0,isActive:!0,isMobile:!0},c):o.default.createElement(x,{hasMark:!0,isActive:!0,isMobile:!0},n))},S=function(a){var l=a.crumbs,i=a.isLastItemLimited,n=a.scrollMobile,c=t.useMediaQuery({query:r.media.md}),u=e.useState(!1),s=u[0],d=u[1];if(e.useEffect((function(){d(!c&&l.length>1)}),[l,c]),s){return o.default.createElement($,{crumbs:l,onClick:function(e){e.preventDefault(),d(!1)},scrollMobile:n,isLastItemLimited:i})}return o.default.createElement(w,{crumbs:l,isLastItemLimited:i})};exports.BreadcrumbItem=x,exports.default=function(t){var r=t.crumbs,l=void 0===r?[]:r,i=t.homePath,n=void 0===i?"/":i,c=t.showHomeButton,u=void 0===c||c,s=t.showBackButton,d=void 0!==s&&s,m=t.onBackButtonClick,v=t.isLastItemLimited,h=void 0!==v&&v,p=t.scrollMobile,b=void 0!==p&&p,E=t.homeButtonType,y=void 0===E?"icon":E,x=t.focusLastItem,w=void 0!==x&&x,$=e.useRef(null);return e.useEffect((function(){w&&$.current&&($.current.scrollLeft=$.current.offsetWidth)}),[w]),o.default.createElement(f,{scrollMobile:b,ref:$},d&&m&&o.default.createElement(o.default.Fragment,null,o.default.createElement(g,{marker:a.faChevronLeft}),o.default.createElement(M,{onBackButtonClick:m,isActive:!(null==l?void 0:l.length)}),!!u&&o.default.createElement(g,{marker:"꣎"})),u&&"icon"===y&&o.default.createElement(k,{isActive:!(null==l?void 0:l.length),homePath:n}),u&&"text"===y&&o.default.createElement(L,{isActive:!(null==l?void 0:l.length),homePath:n}),(null==l?void 0:l.length)?o.default.createElement(S,{crumbs:l,isLastItemLimited:h,scrollMobile:b}):null)};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("react-responsive"),r=require("@cavilha/theme"),a=require("@fortawesome/pro-regular-svg-icons"),l=require("@cavilha/button"),n=require("@cavilha/icon"),i=require("@cavilha/text");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var c=o(e),u=o(l),d=o(n),m=o(i),s=function(){return s=Object.assign||function(e){for(var t,r=1,a=arguments.length;r<a;r++)for(var l in t=arguments[r])Object.prototype.hasOwnProperty.call(t,l)&&(e[l]=t[l]);return e},s.apply(this,arguments)};function f(e,t){var r={};for(var a in e)Object.prototype.hasOwnProperty.call(e,a)&&t.indexOf(a)<0&&(r[a]=e[a]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var l=0;for(a=Object.getOwnPropertySymbols(e);l<a.length;l++)t.indexOf(a[l])<0&&Object.prototype.propertyIsEnumerable.call(e,a[l])&&(r[a[l]]=e[a[l]])}return r}var v=r.styled("div",{display:"flex",flexWrap:"wrap",alignItems:"center",padding:"$small3 0",variants:{scrollMobile:{true:{flexWrap:"initial",overflow:"scroll","@lg":{flexWrap:"wrap",overflow:"initial"}}}}}),b=r.styled("div",{display:"flex",fontSize:"$bodySmall",alignItems:"center",cursor:"$pointer","& p":{margin:0},"& button":{textDecoration:"none",borderRadius:"$small",minWidth:"max-content",fontWeight:"$regular",p:"$none",m:"$none","&:hover":{textDecoration:"underline",background:"$mono1"},"&:focus":{outline:"none",boxShadow:"$focusPressed"},"&:active":{outline:"none",boxShadow:"$focusPressed"}},variants:{active:{true:{color:"$neutral5","& button":{color:"$neutral5"}},false:{"& button":{color:"$secondary4"}}},isMobile:{true:{"& p":{maxWidth:"20ch",overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"}}},isLastItemLimited:{true:{"& p":{maxWidth:"300px",overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"}}}}}),h=r.styled("div",{color:"$neutral4",padding:"0 $small2"}),p=r.styled("div",{padding:"1px 2px",borderRadius:"$small",textDecoration:"none",variants:{active:{false:{"&:hover":{background:"$secondaryHover0"}}}}}),k=r.styled("div",{borderRadius:"$small",cursor:"pointer",fontSize:"$bodySmall",color:"$neutral5","& a":{textDecoration:"none",borderRadius:"$small",fontSize:"$bodySmall",fontWeight:"$bold",color:"$neutral5 !important",p:"$none","&:hover":{textDecoration:"underline",backgroundColor:"$none"}}}),E=r.styled("button",{background:"none",border:"none",borderRadius:"$small",cursor:"pointer","&:hover":{textDecoration:"underline"},"&:focus":{outline:"none",boxShadow:"$focusPressed"},"&:active":{outline:"none",boxShadow:"$focusPressed"}}),y=r.styled("div",{display:"flex",variants:{scrollMobile:{true:{overflow:"scroll",width:"100%",minWidth:"max-content"}}}}),g=function(e){var t=e.marker,r=f(e,["marker"]);return c.default.createElement(E,s({},r),t)},x=function(e){var t=e.marker,r="string"==typeof t?t:c.default.createElement(d.default,{icon:t,iconSize:14});return c.default.createElement(h,null,r)},I=function(e){var t=e.children,r=e.path,a=e.isActive,l=void 0!==a&&a,n=e.onBreadcrumbItemClick;return l?c.default.createElement(m.default,{as:"p"},t):"string"==typeof t&&r?c.default.createElement(u.default,{variant:"terciary",onClick:function(){n&&n({name:t,path:r}),window.location.href=r},label:t}):c.default.createElement(c.default.Fragment,null,t)},L=function(e){var t=e.children,r=e.path,l=e.hasMark,n=void 0!==l&&l,i=e.markPosition,o=void 0===i?"left":i,u=e.isActive,d=void 0!==u&&u,m=e.isMobile,s=void 0!==m&&m,f=e.isLastItemLimited,v=void 0!==f&&f,h="left"===o&&c.default.createElement(x,{marker:a.faChevronRight}),p="right"===o&&c.default.createElement(x,{marker:a.faChevronRight});return c.default.createElement(b,{active:d,isMobile:s,isLastItemLimited:v},n&&h,c.default.createElement(I,{path:r,isActive:d},t),n&&p)},$=function(e){var t=e.isActive,r=e.homePath;return c.default.createElement(p,{active:t},c.default.createElement(L,{isActive:t},t?c.default.createElement(d.default,{icon:a.faHomeAlt,iconSize:14}):c.default.createElement("a",{href:r},c.default.createElement(d.default,{icon:a.faHomeAlt,iconSize:14}))))},w=function(e){var t=e.isActive,r=e.homePath;return c.default.createElement(p,null,c.default.createElement(L,{isActive:t},c.default.createElement("a",{href:r,title:"Voltar a Página inicial"},"Página inicial")))},M=function(a){var l=a.isActive,n=a.onBackButtonClick,i=t.useMediaQuery({query:r.media.md}),o=e.useMemo((function(){return i?"Voltar a página anterior":"Voltar"}),[i]);return c.default.createElement(k,null,c.default.createElement(L,{isActive:l},c.default.createElement(u.default,{as:"a",variant:"terciary",onClick:n,label:o})))},B=function(e){var t=e.crumbs,r=e.isLastItemLimited,a=e.onBreadcrumbItemClick;return c.default.createElement(c.default.Fragment,null,t.map((function(e,l){var n=e.key,i=e.path,o=e.name,u=e.childElement,d=void 0===u?null:u,m=function(e,t){return e===t-1}(l,t.length);return d?c.default.createElement(L,{key:n,hasMark:!0,isActive:m,onBreadcrumbItemClick:a},d):c.default.createElement(L,{key:n,hasMark:!0,path:i,isActive:m,isMobile:!1,isLastItemLimited:r&&m,onBreadcrumbItemClick:a},o)})))},C=function(e){var t=e.crumbs,r=e.scrollMobile,a=e.isLastItemLimited,l=e.onBreadcrumbItemClick,n=f(e,["crumbs","scrollMobile","isLastItemLimited","onBreadcrumbItemClick"]),i=t[t.length-1],o=i.name,u=i.childElement;return r?c.default.createElement(y,{scrollMobile:!0},c.default.createElement(B,{crumbs:t,isLastItemLimited:a,onBreadcrumbItemClick:l})):c.default.createElement(y,null,c.default.createElement(L,{hasMark:!0,onBreadcrumbItemClick:l},c.default.createElement(g,s({marker:"..."},n))),u?c.default.createElement(L,{hasMark:!0,isActive:!0,isMobile:!0,onBreadcrumbItemClick:l},u):c.default.createElement(L,{hasMark:!0,isActive:!0,isMobile:!0,onBreadcrumbItemClick:l},o))},A=function(a){var l=a.crumbs,n=a.isLastItemLimited,i=a.scrollMobile,o=a.onBreadcrumbItemClick,u=t.useMediaQuery({query:r.media.md}),d=e.useState(!1),m=d[0],s=d[1];if(e.useEffect((function(){s(!u&&l.length>1)}),[l,u]),m){return c.default.createElement(C,{crumbs:l,onClick:function(e){e.preventDefault(),s(!1)},scrollMobile:i,isLastItemLimited:n})}return c.default.createElement(B,{crumbs:l,isLastItemLimited:n,onBreadcrumbItemClick:o})};exports.BreadcrumbItem=L,exports.default=function(t){var r=t.crumbs,l=void 0===r?[]:r,n=t.homePath,i=void 0===n?"/":n,o=t.showHomeButton,u=void 0===o||o,d=t.showBackButton,m=void 0!==d&&d,s=t.onBackButtonClick,f=t.isLastItemLimited,b=void 0!==f&&f,h=t.scrollMobile,p=void 0!==h&&h,k=t.homeButtonType,E=void 0===k?"icon":k,y=t.focusLastItem,g=void 0!==y&&y,I=t.onBreadcrumbItemClick,L=e.useRef(null);return e.useEffect((function(){g&&L.current&&(L.current.scrollLeft=L.current.offsetWidth)}),[g]),c.default.createElement(v,{scrollMobile:p,ref:L},m&&s&&c.default.createElement(c.default.Fragment,null,c.default.createElement(x,{marker:a.faChevronLeft}),c.default.createElement(M,{onBackButtonClick:s,isActive:!(null==l?void 0:l.length)}),!!u&&c.default.createElement(x,{marker:"꣎"})),u&&"icon"===E&&c.default.createElement($,{isActive:!(null==l?void 0:l.length),homePath:i}),u&&"text"===E&&c.default.createElement(w,{isActive:!(null==l?void 0:l.length),homePath:i}),(null==l?void 0:l.length)?c.default.createElement(A,{crumbs:l,isLastItemLimited:b,scrollMobile:p,onBreadcrumbItemClick:I}):null)};

dist/index.d.ts

 export { default } from './Breadcrumb';
-export type { BreadcrumbProps } from './Breadcrumb';
+export type { BreadcrumbProps, BreadcrumbItemProps } from './Breadcrumb.types';
 export { BreadcrumbItem } from './BreadcrumbItem';
-export type { BreadcrumbItemProps } from './BreadcrumbItem';

dist/index.es.js

@@ -1,1 +0,1 @@
-import e,{useRef as t,useEffect as r,useMemo as i,useState as n}from"react";import{useMediaQuery as o}from"react-responsive";import{styled as a,media as l}from"@cavilha/theme";import{faChevronRight as c,faHomeAlt as s,faChevronLeft as m}from"@fortawesome/pro-regular-svg-icons";import u from"@cavilha/button";import d from"@cavilha/icon";var v=function(){return v=Object.assign||function(e){for(var t,r=1,i=arguments.length;r<i;r++)for(var n in t=arguments[r])Object.prototype.hasOwnProperty.call(t,n)&&(e[n]=t[n]);return e},v.apply(this,arguments)};function f(e,t){var r={};for(var i in e)Object.prototype.hasOwnProperty.call(e,i)&&t.indexOf(i)<0&&(r[i]=e[i]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var n=0;for(i=Object.getOwnPropertySymbols(e);n<i.length;n++)t.indexOf(i[n])<0&&Object.prototype.propertyIsEnumerable.call(e,i[n])&&(r[i[n]]=e[i[n]])}return r}var h=a("div",{display:"flex",flexWrap:"wrap",alignItems:"center",padding:"$small3 0",variants:{scrollMobile:{true:{flexWrap:"initial",overflow:"scroll","@lg":{flexWrap:"wrap",overflow:"initial"}}}}}),p=a("div",{display:"flex",fontSize:"$bodySmall","& p":{margin:0},"& a":{textDecoration:"none",borderRadius:"$small",minWidth:"max-content","&:hover":{textDecoration:"underline"},"&:focus":{outline:"none",boxShadow:"$focusPressed"},"&:active":{outline:"none",boxShadow:"$focusPressed"}},variants:{active:{true:{color:"$neutral5","& a":{color:"$neutral5"}},false:{"& a":{color:"$secondary4"}}},isMobile:{true:{"& p":{maxWidth:"20ch",overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"}}},isLastItemLimited:{true:{"& p":{maxWidth:"300px",overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"}}}}}),b=a("div",{color:"$neutral4",padding:"0 $small2"}),E=a("div",{padding:"1px 2px",borderRadius:"$small",textDecoration:"none",variants:{active:{false:{"&:hover":{background:"$secondaryHover0"}}}}}),g=a("div",{borderRadius:"$small",cursor:"pointer",fontSize:"$bodySmall",color:"$neutral5","& a":{textDecoration:"none",borderRadius:"$small",fontSize:"$bodySmall",fontWeight:"$bold",color:"$neutral5 !important",p:"$none","&:hover":{textDecoration:"underline",backgroundColor:"$none"}}}),k=a("button",{background:"none",border:"none",borderRadius:"$small",cursor:"pointer","&:hover":{textDecoration:"underline"},"&:focus":{outline:"none",boxShadow:"$focusPressed"},"&:active":{outline:"none",boxShadow:"$focusPressed"}}),x=a("div",{display:"flex",variants:{scrollMobile:{true:{overflow:"scroll",width:"100%",minWidth:"max-content"}}}}),y=function(t){var r=t.marker,i=f(t,["marker"]);return e.createElement(k,v({},i),r)},L=function(t){var r=t.marker,i="string"==typeof r?r:e.createElement(d,{icon:r,iconSize:14});return e.createElement(b,null,i)},w=function(t){var r=t.children,i=t.path,n=t.hasMark,o=void 0!==n&&n,a=t.markPosition,l=void 0===a?"left":a,s=t.isActive,m=void 0!==s&&s,u=t.isMobile,d=void 0!==u&&u,v=t.isLastItemLimited,f=void 0!==v&&v,h="left"===l&&e.createElement(L,{marker:c}),b="right"===l&&e.createElement(L,{marker:c});return e.createElement(p,{active:m,isMobile:d,isLastItemLimited:f},o&&h,function(t,r,i){return void 0===i&&(i=!1),i?e.createElement("p",null,t):"string"==typeof t&&r?e.createElement("a",{href:r},t):t}(r,i,m),o&&b)},$=function(t){var r=t.isActive,i=t.homePath;return e.createElement(E,{active:r},e.createElement(w,{isActive:r},r?e.createElement(d,{icon:s,iconSize:14}):e.createElement("a",{href:i},e.createElement(d,{icon:s,iconSize:14}))))},M=function(t){var r=t.isActive,i=t.homePath;return e.createElement(E,null,e.createElement(w,{isActive:r},e.createElement("a",{href:i,title:"Voltar a Página inicial"},"Página inicial")))},S=function(t){var r=t.isActive,n=t.onBackButtonClick,a=o({query:l.md}),c=i((function(){return a?"Voltar a página anterior":"Voltar"}),[a]);return e.createElement(g,null,e.createElement(w,{isActive:r},e.createElement(u,{as:"a",variant:"terciary",onClick:n,label:c})))},I=function(t){var r=t.crumbs,i=t.isLastItemLimited;return r.map((function(t,n){var o=t.key,a=t.path,l=t.name,c=t.childElement,s=void 0===c?null:c,m=function(e,t){return e===t-1}(n,r.length);return s?e.createElement(w,{key:o,hasMark:!0,isActive:m},s):e.createElement(w,{key:o,hasMark:!0,path:a,isActive:m,isMobile:!1,isLastItemLimited:i&&m},l)}))},P=function(t){var r=t.crumbs,i=t.scrollMobile,n=t.isLastItemLimited,o=f(t,["crumbs","scrollMobile","isLastItemLimited"]),a=r[r.length-1],l=a.name,c=a.childElement;return i?e.createElement(x,{scrollMobile:!0},e.createElement(I,{crumbs:r,isLastItemLimited:n})):e.createElement(x,null,e.createElement(w,{hasMark:!0},e.createElement(y,v({marker:"..."},o))),c?e.createElement(w,{hasMark:!0,isActive:!0,isMobile:!0},c):e.createElement(w,{hasMark:!0,isActive:!0,isMobile:!0},l))},A=function(t){var i=t.crumbs,a=t.isLastItemLimited,c=t.scrollMobile,s=o({query:l.md}),m=n(!1),u=m[0],d=m[1];if(r((function(){d(!s&&i.length>1)}),[i,s]),u){return e.createElement(P,{crumbs:i,onClick:function(e){e.preventDefault(),d(!1)},scrollMobile:c,isLastItemLimited:a})}return e.createElement(I,{crumbs:i,isLastItemLimited:a})},O=function(i){var n=i.crumbs,o=void 0===n?[]:n,a=i.homePath,l=void 0===a?"/":a,c=i.showHomeButton,s=void 0===c||c,u=i.showBackButton,d=void 0!==u&&u,v=i.onBackButtonClick,f=i.isLastItemLimited,p=void 0!==f&&f,b=i.scrollMobile,E=void 0!==b&&b,g=i.homeButtonType,k=void 0===g?"icon":g,x=i.focusLastItem,y=void 0!==x&&x,w=t(null);return r((function(){y&&w.current&&(w.current.scrollLeft=w.current.offsetWidth)}),[y]),e.createElement(h,{scrollMobile:E,ref:w},d&&v&&e.createElement(e.Fragment,null,e.createElement(L,{marker:m}),e.createElement(S,{onBackButtonClick:v,isActive:!(null==o?void 0:o.length)}),!!s&&e.createElement(L,{marker:"꣎"})),s&&"icon"===k&&e.createElement($,{isActive:!(null==o?void 0:o.length),homePath:l}),s&&"text"===k&&e.createElement(M,{isActive:!(null==o?void 0:o.length),homePath:l}),(null==o?void 0:o.length)?e.createElement(A,{crumbs:o,isLastItemLimited:p,scrollMobile:E}):null)};export{w as BreadcrumbItem,O as default};
+import e,{useRef as t,useEffect as r,useMemo as n,useState as i}from"react";import{useMediaQuery as o}from"react-responsive";import{styled as a,media as l}from"@cavilha/theme";import{faChevronRight as c,faHomeAlt as m,faChevronLeft as s}from"@fortawesome/pro-regular-svg-icons";import u from"@cavilha/button";import d from"@cavilha/icon";import v from"@cavilha/text";var f=function(){return f=Object.assign||function(e){for(var t,r=1,n=arguments.length;r<n;r++)for(var i in t=arguments[r])Object.prototype.hasOwnProperty.call(t,i)&&(e[i]=t[i]);return e},f.apply(this,arguments)};function b(e,t){var r={};for(var n in e)Object.prototype.hasOwnProperty.call(e,n)&&t.indexOf(n)<0&&(r[n]=e[n]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var i=0;for(n=Object.getOwnPropertySymbols(e);i<n.length;i++)t.indexOf(n[i])<0&&Object.prototype.propertyIsEnumerable.call(e,n[i])&&(r[n[i]]=e[n[i]])}return r}var h=a("div",{display:"flex",flexWrap:"wrap",alignItems:"center",padding:"$small3 0",variants:{scrollMobile:{true:{flexWrap:"initial",overflow:"scroll","@lg":{flexWrap:"wrap",overflow:"initial"}}}}}),p=a("div",{display:"flex",fontSize:"$bodySmall",alignItems:"center",cursor:"$pointer","& p":{margin:0},"& button":{textDecoration:"none",borderRadius:"$small",minWidth:"max-content",fontWeight:"$regular",p:"$none",m:"$none","&:hover":{textDecoration:"underline",background:"$mono1"},"&:focus":{outline:"none",boxShadow:"$focusPressed"},"&:active":{outline:"none",boxShadow:"$focusPressed"}},variants:{active:{true:{color:"$neutral5","& button":{color:"$neutral5"}},false:{"& button":{color:"$secondary4"}}},isMobile:{true:{"& p":{maxWidth:"20ch",overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"}}},isLastItemLimited:{true:{"& p":{maxWidth:"300px",overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"}}}}}),k=a("div",{color:"$neutral4",padding:"0 $small2"}),E=a("div",{padding:"1px 2px",borderRadius:"$small",textDecoration:"none",variants:{active:{false:{"&:hover":{background:"$secondaryHover0"}}}}}),g=a("div",{borderRadius:"$small",cursor:"pointer",fontSize:"$bodySmall",color:"$neutral5","& a":{textDecoration:"none",borderRadius:"$small",fontSize:"$bodySmall",fontWeight:"$bold",color:"$neutral5 !important",p:"$none","&:hover":{textDecoration:"underline",backgroundColor:"$none"}}}),I=a("button",{background:"none",border:"none",borderRadius:"$small",cursor:"pointer","&:hover":{textDecoration:"underline"},"&:focus":{outline:"none",boxShadow:"$focusPressed"},"&:active":{outline:"none",boxShadow:"$focusPressed"}}),x=a("div",{display:"flex",variants:{scrollMobile:{true:{overflow:"scroll",width:"100%",minWidth:"max-content"}}}}),y=function(t){var r=t.marker,n=b(t,["marker"]);return e.createElement(I,f({},n),r)},$=function(t){var r=t.marker,n="string"==typeof r?r:e.createElement(d,{icon:r,iconSize:14});return e.createElement(k,null,n)},L=function(t){var r=t.children,n=t.path,i=t.isActive,o=void 0!==i&&i,a=t.onBreadcrumbItemClick;return o?e.createElement(v,{as:"p"},r):"string"==typeof r&&n?e.createElement(u,{variant:"terciary",onClick:function(){a&&a({name:r,path:n}),window.location.href=n},label:r}):e.createElement(e.Fragment,null,r)},w=function(t){var r=t.children,n=t.path,i=t.hasMark,o=void 0!==i&&i,a=t.markPosition,l=void 0===a?"left":a,m=t.isActive,s=void 0!==m&&m,u=t.isMobile,d=void 0!==u&&u,v=t.isLastItemLimited,f=void 0!==v&&v,b="left"===l&&e.createElement($,{marker:c}),h="right"===l&&e.createElement($,{marker:c});return e.createElement(p,{active:s,isMobile:d,isLastItemLimited:f},o&&b,e.createElement(L,{path:n,isActive:s},r),o&&h)},B=function(t){var r=t.isActive,n=t.homePath;return e.createElement(E,{active:r},e.createElement(w,{isActive:r},r?e.createElement(d,{icon:m,iconSize:14}):e.createElement("a",{href:n},e.createElement(d,{icon:m,iconSize:14}))))},M=function(t){var r=t.isActive,n=t.homePath;return e.createElement(E,null,e.createElement(w,{isActive:r},e.createElement("a",{href:n,title:"Voltar a Página inicial"},"Página inicial")))},C=function(t){var r=t.isActive,i=t.onBackButtonClick,a=o({query:l.md}),c=n((function(){return a?"Voltar a página anterior":"Voltar"}),[a]);return e.createElement(g,null,e.createElement(w,{isActive:r},e.createElement(u,{as:"a",variant:"terciary",onClick:i,label:c})))},S=function(t){var r=t.crumbs,n=t.isLastItemLimited,i=t.onBreadcrumbItemClick;return e.createElement(e.Fragment,null,r.map((function(t,o){var a=t.key,l=t.path,c=t.name,m=t.childElement,s=void 0===m?null:m,u=function(e,t){return e===t-1}(o,r.length);return s?e.createElement(w,{key:a,hasMark:!0,isActive:u,onBreadcrumbItemClick:i},s):e.createElement(w,{key:a,hasMark:!0,path:l,isActive:u,isMobile:!1,isLastItemLimited:n&&u,onBreadcrumbItemClick:i},c)})))},A=function(t){var r=t.crumbs,n=t.scrollMobile,i=t.isLastItemLimited,o=t.onBreadcrumbItemClick,a=b(t,["crumbs","scrollMobile","isLastItemLimited","onBreadcrumbItemClick"]),l=r[r.length-1],c=l.name,m=l.childElement;return n?e.createElement(x,{scrollMobile:!0},e.createElement(S,{crumbs:r,isLastItemLimited:i,onBreadcrumbItemClick:o})):e.createElement(x,null,e.createElement(w,{hasMark:!0,onBreadcrumbItemClick:o},e.createElement(y,f({marker:"..."},a))),m?e.createElement(w,{hasMark:!0,isActive:!0,isMobile:!0,onBreadcrumbItemClick:o},m):e.createElement(w,{hasMark:!0,isActive:!0,isMobile:!0,onBreadcrumbItemClick:o},c))},P=function(t){var n=t.crumbs,a=t.isLastItemLimited,c=t.scrollMobile,m=t.onBreadcrumbItemClick,s=o({query:l.md}),u=i(!1),d=u[0],v=u[1];if(r((function(){v(!s&&n.length>1)}),[n,s]),d){return e.createElement(A,{crumbs:n,onClick:function(e){e.preventDefault(),v(!1)},scrollMobile:c,isLastItemLimited:a})}return e.createElement(S,{crumbs:n,isLastItemLimited:a,onBreadcrumbItemClick:m})},O=function(n){var i=n.crumbs,o=void 0===i?[]:i,a=n.homePath,l=void 0===a?"/":a,c=n.showHomeButton,m=void 0===c||c,u=n.showBackButton,d=void 0!==u&&u,v=n.onBackButtonClick,f=n.isLastItemLimited,b=void 0!==f&&f,p=n.scrollMobile,k=void 0!==p&&p,E=n.homeButtonType,g=void 0===E?"icon":E,I=n.focusLastItem,x=void 0!==I&&I,y=n.onBreadcrumbItemClick,L=t(null);return r((function(){x&&L.current&&(L.current.scrollLeft=L.current.offsetWidth)}),[x]),e.createElement(h,{scrollMobile:k,ref:L},d&&v&&e.createElement(e.Fragment,null,e.createElement($,{marker:s}),e.createElement(C,{onBackButtonClick:v,isActive:!(null==o?void 0:o.length)}),!!m&&e.createElement($,{marker:"꣎"})),m&&"icon"===g&&e.createElement(B,{isActive:!(null==o?void 0:o.length),homePath:l}),m&&"text"===g&&e.createElement(M,{isActive:!(null==o?void 0:o.length),homePath:l}),(null==o?void 0:o.length)?e.createElement(P,{crumbs:o,isLastItemLimited:b,scrollMobile:k,onBreadcrumbItemClick:y}):null)};export{w as BreadcrumbItem,O as default};

package.json

 {
   "name": "@cavilha/breadcrumb",
-  "version": "0.1.3",
+  "version": "0.2.0",
   "author": "MadeiraMadeira webstore squads",
@@ -75,4 +75,5 @@ "description": "A component responsible for navigating the user in a visual way.",
     "@cavilha/button": "0.0.5",
+    "@cavilha/text": "0.0.3",
     "react-responsive": "^9.0.0-beta.3"
   }
 }

No alert changes

Improved metrics

Total package byte prevSize

70831

increased by4.26%

Number of package files

13

increased by8.33%

Lines of code

2083

increased by1.66%

Worsened metrics

Dependency count

11

increased by10%

Dependency changes

• + Added@cavilha/text@0.0.3

• + Added@cavilha/text@0.0.3(transitive)