@purpurds/tabs 4.5.0 → 4.6.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/LICENSE.txt CHANGED
@@ -1,5 +1,5 @@
1
1
  Name: @purpurds/icon
2
- Version: 4.4.0
2
+ Version: 4.5.1
3
3
  License: AGPL-3.0-only
4
4
  Private: false
5
5
 
package/dist/tabs.cjs.js CHANGED
@@ -6,5 +6,5 @@
6
6
  Copyright (c) 2018 Jed Watson.
7
7
  Licensed under the MIT License (MIT), see
8
8
  http://jedwatson.github.io/classnames
9
- */(function(e){(function(){var t={}.hasOwnProperty;function n(){for(var c="",s=0;s<arguments.length;s++){var i=arguments[s];i&&(c=a(c,o.call(this,i)))}return c}function o(c){if(typeof c=="string"||typeof c=="number")return this&&this[c]||c;if(typeof c!="object")return"";if(Array.isArray(c))return n.apply(this,c);if(c.toString!==Object.prototype.toString&&!c.toString.toString().includes("[native code]"))return c.toString();var s="";for(var i in c)t.call(c,i)&&c[i]&&(s=a(s,this&&this[i]||i));return s}function a(c,s){return s?c?c+" "+s:c+s:c}e.exports?(n.default=n,e.exports=n):window.classNames=n})()})(me);var wt=me.exports;const J=Et(wt),yt={"purpur-tab-content":"_purpur-tab-content_rbfjg_1"},St=J.bind(yt),It="purpur-tab-content",Tt=r.forwardRef(({children:e,tabId:t,"data-testid":n,className:o,...a},c)=>w.jsx(Ct,{ref:c,className:St([It,o]),"data-testid":n,value:t,...a,children:e})),Nt=e=>!!e&&r.isValidElement(e)&&!!e.props.name&&!!e.props.tabId,Rt={"purpur-tab-header":"_purpur-tab-header_ls5xt_1","purpur-tab-header--contained":"_purpur-tab-header--contained_ls5xt_32","purpur-tab-header--contained-negative":"_purpur-tab-header--contained-negative_ls5xt_32","purpur-tab-header--line":"_purpur-tab-header--line_ls5xt_35","purpur-tab-header--line-negative":"_purpur-tab-header--line-negative_ls5xt_47"},At=J.bind(Rt),te="purpur-tab-header",Mt=r.forwardRef(({index:e,tabId:t,variant:n,onFocus:o,"data-testid":a,children:c},s)=>w.jsx(xt,{id:`${t}-trigger`,className:At([te,`${te}--${n}`]),value:t,"data-testid":a,"data-index":e,ref:s,onFocus:o,children:c})),Pt={"purpur-tabs__wrapper":"_purpur-tabs__wrapper_1dpqy_1","purpur-tabs__scroll-button":"_purpur-tabs__scroll-button_1dpqy_9","purpur-tabs__scroll-button--left":"_purpur-tabs__scroll-button--left_1dpqy_63","purpur-tabs__scroll-button--right":"_purpur-tabs__scroll-button--right_1dpqy_66","purpur-tabs__wrapper--scroll-end":"_purpur-tabs__wrapper--scroll-end_1dpqy_69","purpur-tabs__wrapper--scroll-start":"_purpur-tabs__wrapper--scroll-start_1dpqy_72","purpur-tabs--line":"_purpur-tabs--line_1dpqy_75","purpur-tabs--line-negative":"_purpur-tabs--line-negative_1dpqy_75","purpur-tabs__selected-border":"_purpur-tabs__selected-border_1dpqy_83","purpur-tabs--contained":"_purpur-tabs--contained_1dpqy_103","purpur-tabs__list":"_purpur-tabs__list_1dpqy_103","purpur-tabs--contained-negative":"_purpur-tabs--contained-negative_1dpqy_103","purpur-tabs__content-container":"_purpur-tabs__content-container_1dpqy_106","purpur-tabs--fullWidth":"_purpur-tabs--fullWidth_1dpqy_115"},Ot=["line","line-negative","contained","contained-negative"],ve=e=>new CustomEvent("tabChangeDetail",{detail:{value:e}}),A=J.bind(Pt),I="purpur-tabs",Ft=(e,t)=>{var l;if(typeof(e==null?void 0:e.getBoundingClientRect)!="function"||typeof(t==null?void 0:t.scroll)!="function")return;const n=e.getBoundingClientRect(),o=t.getBoundingClientRect(),a=t.clientWidth,c=parseInt((l=getComputedStyle(t).borderLeftWidth)==null?void 0:l.split("px")[0],10),s=o.left+(isNaN(c)?0:c);let i;n.right>o.right&&(i=n.left+t.scrollLeft,i=i+n.width-a+a*.1,i=i-s),n.left<o.left&&(i=n.left+t.scrollLeft,i=i-a*.1,i=i-s),i!==void 0&&t.scroll({left:i,behavior:"smooth"})},_e=({children:e,variant:t="line",fullWidth:n=!1,onChange:o,className:a,defaultValue:c,"data-testid":s,...i})=>{const[l,u]=r.useState({}),[p,f]=r.useState(0),[$,v]=r.useState(0),d=r.Children.toArray(e).filter(Nt),m=r.useRef(),h=r.useRef(new Array(d.length)),_=200,g=t==="line"||t==="line-negative",M=A([I,`${I}--${t}`,{[`${I}--fullWidth`]:n},a]),S=r.Children.map(d,({props:{tabId:b}})=>b),F=()=>S.findIndex(b=>b===c)||0,[D,C]=r.useState(F);if(new Set(S).size!==S.length)throw new Error("tabId must be unique");const j=(b,E)=>E||s?`${E||s}-${b}`:void 0,P=()=>{if(!g)return;const b=h.current[D];f((b==null?void 0:b.offsetLeft)||0),v((b==null?void 0:b.getBoundingClientRect().width)||0)},q=b=>{g&&C(d.findIndex(E=>E.props.tabId===b)),o==null||o(ve(b))},k=b=>{if(m!=null&&m.current){const{scrollLeft:E}=m.current,x=b==="left"?-_:_;m.current.scroll({left:E+x,behavior:"smooth"})}},V=({side:b})=>w.jsx("button",{className:A(`${I}__scroll-button`,`${I}__scroll-button--${b}`),onClick:()=>k(b),type:"button","aria-hidden":"true",tabIndex:-1,"data-testid":j("scroll-button"),children:w.jsx(Fe,{svg:b==="left"?Te:Ne,size:"md"})});return r.useEffect(()=>(window.addEventListener("resize",P),()=>{window.removeEventListener("resize",P)}),[]),r.useEffect(()=>{P()},[D,n,d,t]),r.useEffect(()=>{const b=x=>{if(x.every(N=>N.isIntersecting)&&x.length===d.length){u({});return}x.forEach(N=>{const R=Number(N.target.getAttribute("data-index")),ge=R===0,he=R===d.length-1;u(xe=>({...xe,...ge&&{[`${I}__wrapper--scroll-end`]:!N.isIntersecting},...he&&{[`${I}__wrapper--scroll-start`]:!N.isIntersecting}}))})},E=new IntersectionObserver(b,{threshold:[.99],root:m.current});return h.current.forEach(x=>E.observe(x)),()=>{h.current.forEach(x=>E.unobserve(x))}},[d.length]),w.jsx(gt,{defaultValue:c,onValueChange:q,"data-testid":s,className:M,...i,children:w.jsxs("div",{className:A(`${I}__container`),children:[w.jsxs("div",{className:A([`${I}__wrapper`,l]),children:[w.jsxs(ht,{ref:b=>{m.current=b},className:A(`${I}__list`),children:[r.Children.map(d,(b,E)=>{const{name:x,tabId:Q,"data-testid":N}=b.props;return w.jsx(Mt,{"data-testid":j("header",N),index:E,tabId:Q,ref:R=>{R&&(h.current[E]=R)},onFocus:R=>{Ft(R.target,m.current)},variant:t,children:x})}),g&&w.jsx("div",{className:A(`${I}__selected-border`),style:{width:$,transform:`translateX(${p}px)`},"data-testid":j("selected-border")})]}),w.jsx(V,{side:"left"}),w.jsx(V,{side:"right"})]}),w.jsx("div",{className:A(`${I}__content-container`),children:r.Children.map(d,b=>b)})]})})};_e.Content=Tt;exports.Tabs=_e;exports.createTabChangeDetailEvent=ve;exports.tabsVariants=Ot;
9
+ */(function(e){(function(){var t={}.hasOwnProperty;function n(){for(var c="",s=0;s<arguments.length;s++){var i=arguments[s];i&&(c=a(c,o.call(this,i)))}return c}function o(c){if(typeof c=="string"||typeof c=="number")return this&&this[c]||c;if(typeof c!="object")return"";if(Array.isArray(c))return n.apply(this,c);if(c.toString!==Object.prototype.toString&&!c.toString.toString().includes("[native code]"))return c.toString();var s="";for(var i in c)t.call(c,i)&&c[i]&&(s=a(s,this&&this[i]||i));return s}function a(c,s){return s?c?c+" "+s:c+s:c}e.exports?(n.default=n,e.exports=n):window.classNames=n})()})(me);var wt=me.exports;const J=Et(wt),yt={"purpur-tab-content":"_purpur-tab-content_rbfjg_1"},St=J.bind(yt),It="purpur-tab-content",Tt=r.forwardRef(({children:e,tabId:t,"data-testid":n,className:o,...a},c)=>w.jsx(Ct,{ref:c,className:St([It,o]),"data-testid":n,value:t,...a,children:e})),Nt=e=>!!e&&r.isValidElement(e)&&!!e.props.name&&!!e.props.tabId,Rt={"purpur-tab-header":"_purpur-tab-header_ls5xt_1","purpur-tab-header--contained":"_purpur-tab-header--contained_ls5xt_32","purpur-tab-header--contained-negative":"_purpur-tab-header--contained-negative_ls5xt_32","purpur-tab-header--line":"_purpur-tab-header--line_ls5xt_35","purpur-tab-header--line-negative":"_purpur-tab-header--line-negative_ls5xt_47"},At=J.bind(Rt),te="purpur-tab-header",Mt=r.forwardRef(({index:e,tabId:t,variant:n,onFocus:o,"data-testid":a,children:c},s)=>w.jsx(xt,{id:`${t}-trigger`,className:At([te,`${te}--${n}`]),value:t,"data-testid":a,"data-index":e,ref:s,onFocus:o,children:c})),Pt={"purpur-tabs__wrapper":"_purpur-tabs__wrapper_1dpqy_1","purpur-tabs__scroll-button":"_purpur-tabs__scroll-button_1dpqy_9","purpur-tabs__scroll-button--left":"_purpur-tabs__scroll-button--left_1dpqy_63","purpur-tabs__scroll-button--right":"_purpur-tabs__scroll-button--right_1dpqy_66","purpur-tabs__wrapper--scroll-end":"_purpur-tabs__wrapper--scroll-end_1dpqy_69","purpur-tabs__wrapper--scroll-start":"_purpur-tabs__wrapper--scroll-start_1dpqy_72","purpur-tabs--line":"_purpur-tabs--line_1dpqy_75","purpur-tabs--line-negative":"_purpur-tabs--line-negative_1dpqy_75","purpur-tabs__selected-border":"_purpur-tabs__selected-border_1dpqy_83","purpur-tabs--contained":"_purpur-tabs--contained_1dpqy_103","purpur-tabs__list":"_purpur-tabs__list_1dpqy_103","purpur-tabs--contained-negative":"_purpur-tabs--contained-negative_1dpqy_103","purpur-tabs__content-container":"_purpur-tabs__content-container_1dpqy_106","purpur-tabs--fullWidth":"_purpur-tabs--fullWidth_1dpqy_115"},Ot=["line","line-negative","contained","contained-negative"],ve=e=>new CustomEvent("tabChangeDetail",{detail:{value:e}}),A=J.bind(Pt),I="purpur-tabs",Ft=(e,t)=>{var l;if(typeof(e==null?void 0:e.getBoundingClientRect)!="function"||typeof(t==null?void 0:t.scroll)!="function")return;const n=e.getBoundingClientRect(),o=t.getBoundingClientRect(),a=t.clientWidth,c=parseInt((l=getComputedStyle(t).borderLeftWidth)==null?void 0:l.split("px")[0],10),s=o.left+(isNaN(c)?0:c);let i;n.right>o.right&&(i=n.left+t.scrollLeft,i=i+n.width-a+a*.1,i=i-s),n.left<o.left&&(i=n.left+t.scrollLeft,i=i-a*.1,i=i-s),i!==void 0&&t.scroll({left:i,behavior:"smooth"})},_e=({children:e,variant:t="line",fullWidth:n=!1,onChange:o,className:a,defaultValue:c,"data-testid":s,...i})=>{const[l,u]=r.useState({}),[p,f]=r.useState(0),[$,v]=r.useState(0),d=r.Children.toArray(e).filter(Nt),m=r.useRef(),h=r.useRef(new Array(d.length)),_=200,g=t==="line"||t==="line-negative",M=A([I,`${I}--${t}`,{[`${I}--fullWidth`]:n},a]),S=r.Children.map(d,({props:{tabId:b}})=>b),F=()=>S.findIndex(b=>b===c)||0,[D,C]=r.useState(F);if(new Set(S).size!==S.length)throw new Error("tabId must be unique");const j=(b,E)=>E||s?`${E||s}-${b}`:void 0,P=()=>{if(!g)return;const b=h.current[D];f((b==null?void 0:b.offsetLeft)||0),v((b==null?void 0:b.getBoundingClientRect().width)||0)},q=b=>{g&&C(d.findIndex(E=>E.props.tabId===b)),o==null||o(ve(b))},k=b=>{if(m!=null&&m.current){const{scrollLeft:E}=m.current,x=b==="left"?-_:_;m.current.scroll({left:E+x,behavior:"smooth"})}},V=({side:b})=>w.jsx("button",{className:A(`${I}__scroll-button`,`${I}__scroll-button--${b}`),onClick:()=>k(b),type:"button","aria-hidden":"true",tabIndex:-1,"data-testid":j("scroll-button"),children:w.jsx(Fe,{svg:b==="left"?Te:Ne,size:"md"})});return r.useEffect(()=>(window.addEventListener("resize",P),()=>{window.removeEventListener("resize",P)}),[]),r.useEffect(()=>{P()},[D,n,d,t]),r.useEffect(()=>{const b=x=>{if(x.every(N=>N.isIntersecting)&&x.length===d.length){u({});return}x.forEach(N=>{const R=Number(N.target.getAttribute("data-index")),ge=R===0,he=R===d.length-1;u(xe=>({...xe,...ge&&{[`${I}__wrapper--scroll-end`]:!N.isIntersecting},...he&&{[`${I}__wrapper--scroll-start`]:!N.isIntersecting}}))})},E=new IntersectionObserver(b,{threshold:[.99],root:m.current});return h.current.forEach(x=>E.observe(x)),()=>{h.current.forEach(x=>E.unobserve(x))}},[d.length]),w.jsx(gt,{defaultValue:c??d[0].props.tabId,onValueChange:q,"data-testid":s,className:M,...i,children:w.jsxs("div",{className:A(`${I}__container`),children:[w.jsxs("div",{className:A([`${I}__wrapper`,l]),children:[w.jsxs(ht,{ref:b=>{m.current=b},className:A(`${I}__list`),children:[r.Children.map(d,(b,E)=>{const{name:x,tabId:Q,"data-testid":N}=b.props;return w.jsx(Mt,{"data-testid":j("header",N),index:E,tabId:Q,ref:R=>{R&&(h.current[E]=R)},onFocus:R=>{Ft(R.target,m.current)},variant:t,children:x})}),g&&w.jsx("div",{className:A(`${I}__selected-border`),style:{width:$,transform:`translateX(${p}px)`},"data-testid":j("selected-border")})]}),w.jsx(V,{side:"left"}),w.jsx(V,{side:"right"})]}),w.jsx("div",{className:A(`${I}__content-container`),children:r.Children.map(d,b=>b)})]})})};_e.Content=Tt;exports.Tabs=_e;exports.createTabChangeDetailEvent=ve;exports.tabsVariants=Ot;
10
10
  //# sourceMappingURL=tabs.cjs.js.map