@lax-wp/design-system 0.5.3 → 0.5.4
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/index.umd.js
CHANGED
|
@@ -126,7 +126,7 @@
|
|
|
126
126
|
transform: translateX(220px);
|
|
127
127
|
}
|
|
128
128
|
}
|
|
129
|
-
`}),e.jsxs("linearGradient",{id:"loaderGradientDark",x1:"0%",y1:"0%",x2:"100%",y2:"0%",children:[e.jsx("stop",{offset:"0%",stopColor:"var(--color-primary-500)",stopOpacity:"1"}),e.jsx("stop",{offset:"50%",stopColor:"var(--color-primary-300)",stopOpacity:"1"}),e.jsx("stop",{offset:"100%",stopColor:"var(--color-primary-500)",stopOpacity:"1"})]}),e.jsxs("linearGradient",{id:"glowGradientDark",x1:"0%",y1:"0%",x2:"100%",y2:"0%",children:[e.jsx("stop",{offset:"0%",stopColor:"var(--color-primary-200)",stopOpacity:"0"}),e.jsx("stop",{offset:"20%",stopColor:"var(--color-primary-200)",stopOpacity:"1"}),e.jsx("stop",{offset:"80%",stopColor:"var(--color-primary-200)",stopOpacity:"1"}),e.jsx("stop",{offset:"100%",stopColor:"var(--color-primary-200)",stopOpacity:"0"})]}),e.jsx("filter",{id:"barGlowDark",filterUnits:"userSpaceOnUse",x:"0",y:"100",width:"300",height:"80",children:e.jsx("feGaussianBlur",{in:"SourceGraphic",stdDeviation:"8",result:"blur"})}),e.jsx("clipPath",{id:"SVGID_2_dark",children:e.jsx("path",{d:"M161.3,212.3c-0.8,9.1-4.4,14.2-8,17.1c-5.3,4.2-12.7,4-17.9-0.3c-11.6-9.7-18.9-34.2-20.6-40.7 c0-0.1-0.1-0.3-0.1-0.4c0-0.2-0.1-0.4-0.1-0.5c0-0.2-0.1-0.3-0.1-0.5c0-0.1-0.1-0.2-0.1-0.4l0,0c-8.2-34.3-15.5-68.8-23.8-103.1 c-3.9-16.1-12.9-46.9-16.4-58.5c-1.8-6.2-5.1-11.8-9.6-16.3c-3.2-3.1-7.2-6-12.3-7.5c0,0,0,0-0.1,0l0,0c-0.3-0.1-0.6-0.2-1-0.2 C38.5-2.1,25.5,3.1,17.7,13.5c-4.3,5.8-6.4,11.6-7.2,14.2c-0.5,1.5-0.9,3.1-1.2,4.7c-1.6,7.4-2.2,15.1-2.5,23h5.1 c0,0,3.4-12.9,6-18.5c8.1-17,29.3-18.9,40.5-3.8c2.8,3.8,5.5,8.1,6.9,12.6c4.1,12.5,7.6,25.1,11,37.8c0.6,2.4,0.1,5.6-1,7.9 C53.2,139.9,22.1,207.5,0,256h33.9c0,0,36.1-82.3,53.8-122.9c6.3,26.2,11.3,52.2,17.9,78.2c2.1,8.2,4.7,16.4,7.9,24.3 c0,0,0,0,0,0.1c0,0,0,0,0,0.1c0.2,0.6,1.1,3,2.7,6c3.6,6.9,10.7,14.3,21.4,14.3c25.5,0,29-43.7,29-43.7L161.3,212.3L161.3,212.3z"})}),e.jsx("clipPath",{id:"SVGID_4_dark",children:e.jsx("path",{d:"M216.4,255.9h-10.7l-10.6-15.7L185,255.9h-10.8l15.7-22.5L175,212.2h10.7l9.7,14.6l9.4-14.6h10.8l-14.8,21.4L216.4,255.9z"})}),e.jsx("clipPath",{id:"loaderClipDark",children:e.jsx("rect",{x:"40",y:"135",width:"220",height:"3",rx:"1.5"})}),e.jsx("clipPath",{id:"glowClipDark",children:e.jsx("rect",{x:"40",y:"0",width:"220",height:"200"})})]}),e.jsxs("g",{style:{filter:"drop-shadow(0 0 15px rgba(0, 85, 187, 0.15))"},transform:"translate(135, 65) scale(0.17)",children:[e.jsx("g",{style:{clipPath:"url(#SVGID_2_dark)"},children:e.jsx("path",{style:{fill:"none",stroke:"#ffffff",strokeWidth:38,strokeLinecap:"round",strokeLinejoin:"round",strokeMiterlimit:10,strokeDasharray:770,strokeDashoffset:770,animation:"offset_one_dark 3.5s ease-out infinite"},d:"M6.7,65.7l8.3-38l15.3-14h27.3l-1.3-2.2c4.7,3.1,9,6.8,12.7,10.7C79.4,33,86.5,46.6,90,61.2l17.6,72.8l15.4,72 l4.8,23.8l14.3,17.7l13.7-28l2.2-19.3L106,62.7L13.5,263"})}),e.jsx("g",{style:{clipPath:"url(#SVGID_4_dark)"},children:e.jsx("polyline",{style:{fill:"none",stroke:"var(--color-primary-600)",strokeWidth:9,strokeLinecap:"round",strokeLinejoin:"round",strokeMiterlimit:10,strokeDasharray:220,strokeDashoffset:220,animation:"offset_two_dark 3.5s ease-out infinite"},points:"176.8,207.2 212.8,258 221.5,258 221.5,196.3 176,260"})})]}),e.jsx("rect",{x:"40",y:"135",width:"220",height:"3",rx:"2",fill:"rgba(255, 255, 255, 0.1)"}),e.jsx("g",{clipPath:"url(#glowClipDark)",children:e.jsx("rect",{style:{animation:"slide_dark 2.5s linear infinite"},x:"40",y:"135.5",width:"45",height:"2",rx:"1",fill:"var(--color-primary-200)",filter:"url(#barGlowDark)",opacity:"0.8"})}),e.jsx("g",{clipPath:"url(#loaderClipDark)",children:e.jsx("rect",{style:{animation:"slide_dark 2.5s linear infinite"},x:"40",y:"135",width:"45",height:"3",rx:"1.5",fill:"url(#loaderGradientDark)"})})]}),uo=({classValue:r,isDarkMode:t})=>e.jsx("div",{className:`${P(r)} flex justify-center items-center`,children:
|
|
129
|
+
`}),e.jsxs("linearGradient",{id:"loaderGradientDark",x1:"0%",y1:"0%",x2:"100%",y2:"0%",children:[e.jsx("stop",{offset:"0%",stopColor:"var(--color-primary-500)",stopOpacity:"1"}),e.jsx("stop",{offset:"50%",stopColor:"var(--color-primary-300)",stopOpacity:"1"}),e.jsx("stop",{offset:"100%",stopColor:"var(--color-primary-500)",stopOpacity:"1"})]}),e.jsxs("linearGradient",{id:"glowGradientDark",x1:"0%",y1:"0%",x2:"100%",y2:"0%",children:[e.jsx("stop",{offset:"0%",stopColor:"var(--color-primary-200)",stopOpacity:"0"}),e.jsx("stop",{offset:"20%",stopColor:"var(--color-primary-200)",stopOpacity:"1"}),e.jsx("stop",{offset:"80%",stopColor:"var(--color-primary-200)",stopOpacity:"1"}),e.jsx("stop",{offset:"100%",stopColor:"var(--color-primary-200)",stopOpacity:"0"})]}),e.jsx("filter",{id:"barGlowDark",filterUnits:"userSpaceOnUse",x:"0",y:"100",width:"300",height:"80",children:e.jsx("feGaussianBlur",{in:"SourceGraphic",stdDeviation:"8",result:"blur"})}),e.jsx("clipPath",{id:"SVGID_2_dark",children:e.jsx("path",{d:"M161.3,212.3c-0.8,9.1-4.4,14.2-8,17.1c-5.3,4.2-12.7,4-17.9-0.3c-11.6-9.7-18.9-34.2-20.6-40.7 c0-0.1-0.1-0.3-0.1-0.4c0-0.2-0.1-0.4-0.1-0.5c0-0.2-0.1-0.3-0.1-0.5c0-0.1-0.1-0.2-0.1-0.4l0,0c-8.2-34.3-15.5-68.8-23.8-103.1 c-3.9-16.1-12.9-46.9-16.4-58.5c-1.8-6.2-5.1-11.8-9.6-16.3c-3.2-3.1-7.2-6-12.3-7.5c0,0,0,0-0.1,0l0,0c-0.3-0.1-0.6-0.2-1-0.2 C38.5-2.1,25.5,3.1,17.7,13.5c-4.3,5.8-6.4,11.6-7.2,14.2c-0.5,1.5-0.9,3.1-1.2,4.7c-1.6,7.4-2.2,15.1-2.5,23h5.1 c0,0,3.4-12.9,6-18.5c8.1-17,29.3-18.9,40.5-3.8c2.8,3.8,5.5,8.1,6.9,12.6c4.1,12.5,7.6,25.1,11,37.8c0.6,2.4,0.1,5.6-1,7.9 C53.2,139.9,22.1,207.5,0,256h33.9c0,0,36.1-82.3,53.8-122.9c6.3,26.2,11.3,52.2,17.9,78.2c2.1,8.2,4.7,16.4,7.9,24.3 c0,0,0,0,0,0.1c0,0,0,0,0,0.1c0.2,0.6,1.1,3,2.7,6c3.6,6.9,10.7,14.3,21.4,14.3c25.5,0,29-43.7,29-43.7L161.3,212.3L161.3,212.3z"})}),e.jsx("clipPath",{id:"SVGID_4_dark",children:e.jsx("path",{d:"M216.4,255.9h-10.7l-10.6-15.7L185,255.9h-10.8l15.7-22.5L175,212.2h10.7l9.7,14.6l9.4-14.6h10.8l-14.8,21.4L216.4,255.9z"})}),e.jsx("clipPath",{id:"loaderClipDark",children:e.jsx("rect",{x:"40",y:"135",width:"220",height:"3",rx:"1.5"})}),e.jsx("clipPath",{id:"glowClipDark",children:e.jsx("rect",{x:"40",y:"0",width:"220",height:"200"})})]}),e.jsxs("g",{style:{filter:"drop-shadow(0 0 15px rgba(0, 85, 187, 0.15))"},transform:"translate(135, 65) scale(0.17)",children:[e.jsx("g",{style:{clipPath:"url(#SVGID_2_dark)"},children:e.jsx("path",{style:{fill:"none",stroke:"#ffffff",strokeWidth:38,strokeLinecap:"round",strokeLinejoin:"round",strokeMiterlimit:10,strokeDasharray:770,strokeDashoffset:770,animation:"offset_one_dark 3.5s ease-out infinite"},d:"M6.7,65.7l8.3-38l15.3-14h27.3l-1.3-2.2c4.7,3.1,9,6.8,12.7,10.7C79.4,33,86.5,46.6,90,61.2l17.6,72.8l15.4,72 l4.8,23.8l14.3,17.7l13.7-28l2.2-19.3L106,62.7L13.5,263"})}),e.jsx("g",{style:{clipPath:"url(#SVGID_4_dark)"},children:e.jsx("polyline",{style:{fill:"none",stroke:"var(--color-primary-600)",strokeWidth:9,strokeLinecap:"round",strokeLinejoin:"round",strokeMiterlimit:10,strokeDasharray:220,strokeDashoffset:220,animation:"offset_two_dark 3.5s ease-out infinite"},points:"176.8,207.2 212.8,258 221.5,258 221.5,196.3 176,260"})})]}),e.jsx("rect",{x:"40",y:"135",width:"220",height:"3",rx:"2",fill:"rgba(255, 255, 255, 0.1)"}),e.jsx("g",{clipPath:"url(#glowClipDark)",children:e.jsx("rect",{style:{animation:"slide_dark 2.5s linear infinite"},x:"40",y:"135.5",width:"45",height:"2",rx:"1",fill:"var(--color-primary-200)",filter:"url(#barGlowDark)",opacity:"0.8"})}),e.jsx("g",{clipPath:"url(#loaderClipDark)",children:e.jsx("rect",{style:{animation:"slide_dark 2.5s linear infinite"},x:"40",y:"135",width:"45",height:"3",rx:"1.5",fill:"url(#loaderGradientDark)"})})]}),uo=({classValue:r,isDarkMode:t})=>{const a=t??document.documentElement.classList.contains("dark");return e.jsx("div",{className:`${P(r)} flex justify-center items-center`,children:a?e.jsx(qs,{}):e.jsx(Ks,{})})};uo.displayName="LogoLoader";const t1=u.forwardRef(({item:r,variant:t,isLastItem:a=!1,onClick:o},l)=>{const n=()=>t==="secondary"?a?"text-neutral-900 dark:text-primary-500":"text-neutral-400 dark:text-neutral-400 hover:text-neutral-900 dark:hover:text-neutral-300":a?"text-white":"text-primary-200 dark:text-neutral-400 hover:text-white",s=()=>{o?.(r?.id||"")};return e.jsx("div",{ref:l,className:"min-w-0 w-full",children:e.jsx(G,{size:"small",variant:"medium",className:`flex items-center ${n()} cursor-pointer min-w-0 ${a?"":t==="secondary"?"hover:bg-neutral-200 dark:hover:bg-neutral-600":"hover:bg-primary-400 dark:hover:bg-neutral-600"} px-1 py-0.5 rounded transition-colors duration-200`,appearance:"custom",onClick:s,children:e.jsx("span",{className:"truncate min-w-0 block",children:r?.title})})})});t1.displayName="BreadCrumbItem";const Js=({fill:r="#D9D9D9",size:t=20,className:a})=>e.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",width:t,height:t,viewBox:"0 0 20 20",fill:r,className:a,children:e.jsx("path",{d:"M7.25001 14.4167C7.09723 14.2639 7.02084 14.0694 7.02084 13.8333C7.02084 13.5972 7.09723 13.4028 7.25001 13.25L10.5 9.99999L7.25001 6.74999C7.09723 6.59721 7.02084 6.40277 7.02084 6.16666C7.02084 5.93055 7.09723 5.7361 7.25001 5.58332C7.40279 5.43055 7.59723 5.35416 7.83334 5.35416C8.06945 5.35416 8.2639 5.43055 8.41668 5.58332L12.25 9.41666C12.3333 9.49999 12.3925 9.59027 12.4275 9.68749C12.462 9.78471 12.4792 9.88888 12.4792 9.99999C12.4792 10.1111 12.462 10.2153 12.4275 10.3125C12.3925 10.4097 12.3333 10.5 12.25 10.5833L8.41668 14.4167C8.2639 14.5694 8.06945 14.6458 7.83334 14.6458C7.59723 14.6458 7.40279 14.5694 7.25001 14.4167Z",fill:r})}),fo=({items:r,variant:t="primary",onClick:a,renderLink:o})=>{const l=u.useRef([]),[n,s]=u.useState([]);u.useEffect(()=>{const i=()=>{const h=l?.current?.map(b=>{if(!b)return!1;const g=b.querySelector("span")||b.querySelector('[class*="truncate"]')||b;return g?g.scrollWidth>g.clientWidth:!1})||[];s(h)},f=setTimeout(i,100);window.addEventListener("resize",i);let d=null;return window.ResizeObserver&&l.current.length>0&&(d=new ResizeObserver(()=>{setTimeout(i,10)}),l.current.forEach(h=>{h&&d?.observe(h)})),()=>{clearTimeout(f),window.removeEventListener("resize",i),d&&d.disconnect()}},[r]);const c=(i,f)=>{const d=f===r?.length-1,h=e.jsx(t1,{item:i,variant:t,isLastItem:d,onClick:a});return i?.link&&o?e.jsx(de.Tooltip,{title:n[f]?i?.title:"",placement:"bottom",children:o(i,h,d)}):e.jsx(de.Tooltip,{title:n[f]?i?.title:"",placement:"bottom",children:e.jsx("div",{children:h})})};return e.jsx("div",{className:"flex items-center justify-start min-w-0 w-full overflow-hidden animate-fade-in gap-1 pr-2",children:r.map((i,f)=>e.jsxs("div",{className:"flex items-center min-w-0 animate-slide-in-left",style:{animationDelay:`${f*100}ms`,animationFillMode:"both",flexShrink:f===0?.2:f===1?.4:f===2?.6:1},children:[e.jsx("div",{className:`min-w-0 flex-1 ${f===0?"max-w-none":f===1?"max-w-80 sm:max-w-96 md:max-w-none lg:max-w-none xl:max-w-none":f===2?"max-w-64 sm:max-w-80 md:max-w-96 lg:max-w-none xl:max-w-none":"max-w-32 sm:max-w-48 md:max-w-64 lg:max-w-80 xl:max-w-96"}`,ref:d=>l.current[f]=d,children:c(i,f)}),f<r?.length-1&&e.jsx("div",{className:"flex-shrink-0 mx-2",children:e.jsx(Js,{size:t==="secondary"?14:20,className:"text-primary-400 dark:text-primary-400"})})]},f))})};fo.displayName="BreadCrumb";const ho=({children:r,className:t})=>{const a=P(`w-full justify-center items-center ${r?"gap-1":"gap-0"} inline-flex`,t);return e.jsxs("div",{className:a,children:[e.jsx("div",{className:"grow shrink basis-0 h-[1px] border border-gray-200 dark:border-neutral-700"}),r&&e.jsx("div",{className:"text-gray-400 text-xs font-medium uppercase tracking-tight",children:r}),e.jsx("div",{className:"grow shrink basis-0 h-[1px] border border-gray-200 dark:border-neutral-700"})]})};ho.displayName="Divider";const a1=({active:r=!0})=>e.jsx(de.Skeleton,{active:r});a1.displayName="Skeleton";const Ke={grey:{main:"rgb(237 237 237)",gradient:"rgb(230 230 230)"},dark:{main:"rgb(80 80 80)",gradient:"rgb(60 60 60)"}},o1="100%",ut="1fr",l1="100%",Xs="row",po="flex-start",bo="flex-start",go="1fr / 1fr",mo=10,Co=0,xo="grey",ft=100,Qs=Object.freeze(Object.defineProperty({__proto__:null,DEFAULT_ALIGN_ITEMS_ALIGNMENT:bo,DEFAULT_DIRECTION_GRID_COLS:Xs,DEFAULT_GAP:mo,DEFAULT_GRID_CONTAINER_WIDTH:ut,DEFAULT_GRID_STYLE:go,DEFAULT_HEIGHT:l1,DEFAULT_JUSTIFY_ALIGNMENT:po,DEFAULT_REPEAT_COUNT:Co,DEFAULT_SKELETON_GRADIENT_WIDTH:ft,DEFAULT_SKELETON_WIDTH:o1,DEFAULT_VARIANT:xo,VARIANTS:Ke},Symbol.toStringTag,{value:"Module"}));var ye=(r=>(r.row="row",r.column="column",r))(ye||{});const n1=(r,t)=>{let a="0px",o;const l=()=>r.reduce((n,s)=>(n+=typeof s=="number"?s+"px ":s+" ",n),"");return(Array.isArray(r)||!isNaN(r))&&(a=typeof r=="number"?r+"px":l()||"0px"),t&&(o={...t==="center"?{marginLeft:"auto",marginRight:"auto"}:{},[t==="right"?"marginLeft":"marginRight"]:"auto"}),{margin:a,...o}},vo=r=>r.reduce((t,a)=>(t+=Array.isArray(a)?ut:a.w+" ",t),"1fr / "),ht=(r,t)=>t>0?[].constructor(t).fill(r[0]):r,yo=(r,t,a,o)=>(t||o)>0&&a?1-1/(t||o)*r:1,Rs=()=>{const[r,t]=u.useState(!1);return u.useEffect(()=>{const a=()=>{t(document.documentElement.classList.contains("dark"))};a();const o=new MutationObserver(l=>{l.forEach(n=>{n.attributeName==="class"&&a()})});return o.observe(document.documentElement,{attributes:!0}),()=>o.disconnect()},[]),r},ei=({grid:r,style:t={},variant:a=xo})=>{const o=Rs(),l=(s,c,i,f)=>s.map((d,h)=>d.hasOwnProperty("children")?n(d,`${c}_${h}`):e.jsx("div",{"data-key":`skeleton__${c}-${h}`,style:{width:d.w===ut?o1:d.w||o1,height:d.h||l1,borderRadius:d.r||"0px",margin:n1(d.margin||[]).margin,backgroundColor:o?Ke.dark.main:Ke[a].main,opacity:yo(h,i,f,s.length)},className:"relative overflow-hidden",children:e.jsx("div",{className:"left-0 absolute h-full top-0 animate-[skeleton_1s_infinite_linear]",style:{width:d.skeletonW||ft,backgroundImage:`linear-gradient(
|
|
130
130
|
90deg,
|
|
131
131
|
${o?Ke.dark.main:Ke[a].main} 0px,
|
|
132
132
|
${o?Ke.dark.gradient:Ke[a].gradient} ${(d.skeletonW||ft)/2}px,
|