@digitalpromise/design 4.11.0 → 4.12.0

package/dist/index.cjs

@@ -1 +1 @@
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const m=require("./icon-r9-powj6.cjs"),e=require("react/jsx-runtime"),j=require("next/navigation"),P=require("react"),z=["default","danger","inverse","emphasize","decolor"],L=["md","sm","xs"],R=["primary","secondary","tertiary","ghost","outline"],F="inline-flex items-center justify-center rounded-lg cursor-pointer focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-blue-4 disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50",q={md:"h-12 w-12 p-3",sm:"h-8 w-8 p-2",xs:"h-6 w-6 p-0"},M={default:"text-gray-5 hover:text-neutral-5 transition-colors",danger:"text-red-4 hover:text-red-5",inverse:"text-white hover:text-gray-1",emphasize:"bg-white text-gray-5 hover:bg-gray-1 hover:text-neutral-5 focus-visible:bg-blue-1 focus-visible:text-blue-4 focus-visible:hover:bg-blue-2 focus-visible:hover:text-blue-5",decolor:"text-gray-5 hover:text-neutral-5 transition-colors"},O={ghost:"",outline:"border-2 border-gray-5"},V={default:"flex items-center gap-2 py-3 text-gray-5",danger:"flex items-center gap-2 py-3 text-red-4 hover:text-red-5",inverse:"flex items-center gap-2 py-3 text-white hover:text-gray-1",emphasize:"flex items-center gap-2 py-3 text-gray-5",decolor:"flex items-center gap-2 py-3 text-gray-5 hover:text-neutral-5"},G="inline-flex items-center justify-center gap-2";function I(n,a){return`${n==="xs"?"block h-5 w-5 shrink-0 leading-none":n==="sm"?"block h-4 w-4 shrink-0 text-base leading-none":"block h-6 w-6 shrink-0 text-2xl leading-none"} ${a??""}`.trim()}function A({className:n,size:a="md",state:t="default",variant:r="ghost"}){if(r==="primary"||r==="secondary"){const i=t==="emphasize"?"default":t;return`${m.getButtonClassName({className:G,variant:r,state:i})} ${n??""}`.trim()}return r==="tertiary"?`${V[t]} ${n??""}`.trim():`${F} ${q[a]} ${M[t]} ${O[r]} ${n??""}`.trim()}function E({children:n,icon:a,iconClassName:t,iconPosition:r="start",size:i="md",textClassName:c,variant:o="ghost"}){const l=a?e.jsx(m.Icon,{name:a,className:o==="ghost"||o==="outline"?I(i,t):o==="tertiary"?`h-5 w-5 shrink-0 ${t??""}`.trim():t}):null;if(o==="tertiary"){const s=n?e.jsx("span",{className:`font-semibold underline ${c??""}`.trim(),children:n}):null;return r==="end"?e.jsxs(e.Fragment,{children:[s,l]}):e.jsxs(e.Fragment,{children:[l,s]})}if(o==="primary"||o==="secondary"){const s=c?e.jsx("span",{className:c,children:n}):n;return l?s?r==="end"?e.jsxs(e.Fragment,{children:[s,l]}):e.jsxs(e.Fragment,{children:[l,s]}):l:s}return e.jsxs(e.Fragment,{children:[l,n]})}function T({children:n,icon:a,iconClassName:t,iconPosition:r="start",label:i,className:c,size:o="md",state:l="default",textClassName:s,type:u="button",variant:b="ghost",...y}){return e.jsx("button",{type:u,className:A({className:c,size:o,state:l,variant:b}),...y,"aria-label":i,children:E({children:n,icon:a,iconClassName:t,iconPosition:r,size:o,textClassName:s,variant:b})})}function D({name:n,size:a="md",className:t}){return e.jsx(m.Icon,{name:n,className:I(a,t)})}const Q=new Map([["black","/primary-badge-engine-logo-black.svg"],["white","/primary-badge-engine-logo-white.svg"],["color","/primary-badge-engine-logo-color.svg"]]);function U({variant:n="color",className:a}){const t=Q.get(n);return t===void 0?null:e.jsx("img",{src:t,width:186,height:36,alt:"Badge Engine",className:a})}function _({count:n,limit:a=10,pageParamKey:t="page"}){const r=j.useSearchParams(),i=j.usePathname(),c=j.useRouter(),o=r.get(t),l=o?Number.parseInt(o,10):Number.NaN,s=Number.isFinite(l)?l:1,u=Math.max(1,Math.ceil(n/a)),b=u<=7?Array.from({length:u},(d,g)=>g+1):s<=4?[1,2,3,4,5,"ellipsis",u]:s>=u-3?[1,"ellipsis",u-4,u-3,u-2,u-1,u]:[1,"ellipsis",s-1,s,s+1,"ellipsis",u],y=s===1,w=s===u,N=d=>{if(y&&d==="prev"||w&&d==="next")return;const g=d==="prev"?s-1:s+1,h=new URLSearchParams(r.toString());h.set(t,String(g)),c.push(`${i}?${h.toString()}`,{scroll:!1})},p=d=>{const g=new URLSearchParams(r.toString());g.set(t,String(d)),c.push(`${i}?${g.toString()}`,{scroll:!1})};return e.jsxs("ul",{className:"flex items-center justify-center gap-4 font-medium",children:[e.jsx("li",{className:"mr-2",children:e.jsx("button",{type:"button","aria-label":"Previous page",disabled:y,className:"inline-flex h-[42px] w-[42px] items-center justify-center rounded-[4px] bg-transparent p-[9px] text-gray-5 transition hover:bg-transparent hover:text-neutral-5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-blue-4 disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50",onClick:()=>N("prev"),children:e.jsx(m.Icon,{name:"ArrowLineLeft"})})}),b.map((d,g)=>{const h=d==="ellipsis",f=h?void 0:d,S=f===s,$=h||S,C=h?"Pagination ellipsis":`Go to page ${f}`;return e.jsx("li",{children:e.jsx("button",{type:"button","aria-label":C,"aria-current":S?"page":void 0,disabled:$,className:`flex h-[36px] w-[36px] items-center justify-center rounded-[4px] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-blue-4 ${S?"bg-blue-1 text-blue-4":""} ${$?"cursor-default":"cursor-pointer hover:bg-gray-1"}`.trim(),onClick:!$&&f?()=>p(f):void 0,children:h?"...":f})},`${d}-${g}`)}),e.jsx("li",{className:"ml-2",children:e.jsx("button",{type:"button","aria-label":"Next page",disabled:w,className:"inline-flex h-[42px] w-[42px] items-center justify-center rounded-[4px] bg-transparent p-[9px] text-gray-5 transition hover:bg-transparent hover:text-neutral-5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-blue-4 disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50",onClick:()=>N("next"),children:e.jsx(m.Icon,{name:"ArrowLineRight"})})})]})}function H({placeholder:n,className:a,inputWidth:t,value:r,onChange:i,syncToUrl:c=!0,id:o="search",paramKey:l="s",firstResultSelector:s,onEnter:u}){const b=j.useSearchParams(),y=j.usePathname(),w=j.useRouter(),N=P.useRef(null),p=r!==void 0,[d,g]=P.useState(p?r:b.get(l)?.toString()??""),h=p?r:d,f=Math.max(n.length,1),S=`calc(${f}ch + 60px)`,$=t===void 0?S:typeof t=="number"?`${t}px`:t;P.useEffect(()=>{!c||p||g(b.get(l)?.toString()??"")},[p,l,b,c]);const C=v=>{if(!c)return;const x=new URLSearchParams(b.toString());v?(x.set(l,v),x.delete("page")):(x.delete(l),x.delete("page"));const k=x.toString();w.replace(k?`${y}?${k}`:y)},B=v=>{if(v.preventDefault(),u?.(h),s&&h.trim()){const x=document.querySelector(s);x&&x.focus()}};return e.jsxs("form",{className:`search-field ${a??""}`.trim(),noValidate:!0,onSubmit:B,children:[e.jsx("label",{className:"sr-only",htmlFor:o,children:"Search"}),e.jsxs("div",{className:"relative max-w-full",style:{width:$},children:[e.jsx(m.Icon,{name:"Magnifier","aria-hidden":!0,className:"absolute left-[15px] top-1/2 z-10 -translate-y-1/2 text-large leading-5 text-gray-5"}),e.jsx("input",{ref:N,className:"hide-search-clear block w-full max-w-full rounded-sm bg-white py-[11px] pl-[15px] pr-[40px] text-base leading-5 indent-[30px] outline-1 outline-gray-5 transition focus:outline-2 focus:outline-blue-4",style:{color:"#000000",WebkitTextFillColor:"#000000"},size:f,id:o,type:"search",autoComplete:"off",value:h,placeholder:n,onChange:v=>{const x=v.target.value;p||g(x),i?.(x),C(x)}}),h.length>0&&e.jsx("button",{type:"button","aria-label":"Clear search",className:"absolute right-1 top-1/2 z-10 inline-flex h-8 w-8 -translate-y-1/2 items-center justify-center rounded-lg p-2 text-gray-5 hover:text-neutral-5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-blue-4",onClick:()=>{p||g(""),i?.(""),C(""),N.current?.focus()},children:e.jsx(m.Icon,{name:"Close"})})]})]})}function J({columns:n,rows:a,rowKey:t}){const r=P.useId();return e.jsxs("table",{className:"w-full table-auto border-y border-gray-2 text-gray-5",children:[e.jsx("thead",{className:"font-bold",children:e.jsx("tr",{children:n.map(i=>e.jsx("th",{id:`${r}-col-${i.key}`,scope:"col",className:`px-3 py-4 text-left leading-[23px] ${i.headerClassName??""}`.trim(),children:i.header},i.key))})}),e.jsx("tbody",{children:a.map((i,c)=>e.jsx("tr",{className:"border-t border-gray-2",children:n.map(o=>e.jsx("td",{headers:`${r}-col-${o.key}`,className:`${o.cellClassName??"px-3 py-4"}`.trim(),children:o.render(i)},o.key))},t(i,c)))})]})}exports.Button=m.Button;exports.Icon=m.Icon;exports.IconButton=T;exports.IconButtonGlyph=D;exports.Logo=U;exports.Pagination=_;exports.Search=H;exports.Table=J;exports.iconButtonSizes=L;exports.iconButtonStates=z;exports.iconButtonVariants=R;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const m=require("./icon-r9-powj6.cjs"),e=require("react/jsx-runtime"),j=require("next/navigation"),P=require("react"),z=["default","danger","inverse","emphasize","decolor"],L=["md","sm","xs"],R=["primary","secondary","tertiary","ghost","outline"],F="inline-flex items-center justify-center rounded-lg cursor-pointer focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-blue-4 disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50",q={md:"h-8 w-8 p-0",sm:"h-7 w-7 p-0",xs:"h-6 w-6 p-0"},M={default:"text-gray-5 hover:text-neutral-5 transition-colors",danger:"text-red-4 hover:text-red-5",inverse:"text-white hover:text-gray-1",emphasize:"bg-white text-gray-5 hover:bg-gray-1 hover:text-neutral-5 focus-visible:bg-blue-1 focus-visible:text-blue-4 focus-visible:hover:bg-blue-2 focus-visible:hover:text-blue-5",decolor:"text-gray-5 hover:text-neutral-5 transition-colors"},O={ghost:"",outline:"border-2 border-gray-5"},V={default:"flex items-center gap-2 py-3 text-gray-5",danger:"flex items-center gap-2 py-3 text-red-4 hover:text-red-5",inverse:"flex items-center gap-2 py-3 text-white hover:text-gray-1",emphasize:"flex items-center gap-2 py-3 text-gray-5",decolor:"flex items-center gap-2 py-3 text-gray-5 hover:text-neutral-5"},G="inline-flex items-center justify-center gap-2";function I(n,a){return`${n==="xs"?"block h-5 w-5 shrink-0 leading-none":n==="sm"?"block h-4 w-4 shrink-0 text-base leading-none":"block h-6 w-6 shrink-0 text-2xl leading-none"} ${a??""}`.trim()}function A({className:n,size:a="md",state:t="default",variant:r="ghost"}){if(r==="primary"||r==="secondary"){const i=t==="emphasize"?"default":t;return`${m.getButtonClassName({className:G,variant:r,state:i})} ${n??""}`.trim()}return r==="tertiary"?`${V[t]} ${n??""}`.trim():`${F} ${q[a]} ${M[t]} ${O[r]} ${n??""}`.trim()}function E({children:n,icon:a,iconClassName:t,iconPosition:r="start",size:i="md",textClassName:c,variant:o="ghost"}){const l=a?e.jsx(m.Icon,{name:a,className:o==="ghost"||o==="outline"?I(i,t):o==="tertiary"?`h-5 w-5 shrink-0 ${t??""}`.trim():t}):null;if(o==="tertiary"){const s=n?e.jsx("span",{className:`font-semibold underline ${c??""}`.trim(),children:n}):null;return r==="end"?e.jsxs(e.Fragment,{children:[s,l]}):e.jsxs(e.Fragment,{children:[l,s]})}if(o==="primary"||o==="secondary"){const s=c?e.jsx("span",{className:c,children:n}):n;return l?s?r==="end"?e.jsxs(e.Fragment,{children:[s,l]}):e.jsxs(e.Fragment,{children:[l,s]}):l:s}return e.jsxs(e.Fragment,{children:[l,n]})}function T({children:n,icon:a,iconClassName:t,iconPosition:r="start",label:i,className:c,size:o="md",state:l="default",textClassName:s,type:u="button",variant:b="ghost",...y}){return e.jsx("button",{type:u,className:A({className:c,size:o,state:l,variant:b}),...y,"aria-label":i,children:E({children:n,icon:a,iconClassName:t,iconPosition:r,size:o,textClassName:s,variant:b})})}function D({name:n,size:a="md",className:t}){return e.jsx(m.Icon,{name:n,className:I(a,t)})}const Q=new Map([["black","/primary-badge-engine-logo-black.svg"],["white","/primary-badge-engine-logo-white.svg"],["color","/primary-badge-engine-logo-color.svg"]]);function U({variant:n="color",className:a}){const t=Q.get(n);return t===void 0?null:e.jsx("img",{src:t,width:186,height:36,alt:"Badge Engine",className:a})}function _({count:n,limit:a=10,pageParamKey:t="page"}){const r=j.useSearchParams(),i=j.usePathname(),c=j.useRouter(),o=r.get(t),l=o?Number.parseInt(o,10):Number.NaN,s=Number.isFinite(l)?l:1,u=Math.max(1,Math.ceil(n/a)),b=u<=7?Array.from({length:u},(d,g)=>g+1):s<=4?[1,2,3,4,5,"ellipsis",u]:s>=u-3?[1,"ellipsis",u-4,u-3,u-2,u-1,u]:[1,"ellipsis",s-1,s,s+1,"ellipsis",u],y=s===1,w=s===u,N=d=>{if(y&&d==="prev"||w&&d==="next")return;const g=d==="prev"?s-1:s+1,h=new URLSearchParams(r.toString());h.set(t,String(g)),c.push(`${i}?${h.toString()}`,{scroll:!1})},p=d=>{const g=new URLSearchParams(r.toString());g.set(t,String(d)),c.push(`${i}?${g.toString()}`,{scroll:!1})};return e.jsxs("ul",{className:"flex items-center justify-center gap-4 font-medium",children:[e.jsx("li",{className:"mr-2",children:e.jsx("button",{type:"button","aria-label":"Previous page",disabled:y,className:"inline-flex h-[42px] w-[42px] items-center justify-center rounded-[4px] bg-transparent p-[9px] text-gray-5 transition hover:bg-transparent hover:text-neutral-5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-blue-4 disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50",onClick:()=>N("prev"),children:e.jsx(m.Icon,{name:"ArrowLineLeft"})})}),b.map((d,g)=>{const h=d==="ellipsis",f=h?void 0:d,S=f===s,$=h||S,C=h?"Pagination ellipsis":`Go to page ${f}`;return e.jsx("li",{children:e.jsx("button",{type:"button","aria-label":C,"aria-current":S?"page":void 0,disabled:$,className:`flex h-[36px] w-[36px] items-center justify-center rounded-[4px] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-blue-4 ${S?"bg-blue-1 text-blue-4":""} ${$?"cursor-default":"cursor-pointer hover:bg-gray-1"}`.trim(),onClick:!$&&f?()=>p(f):void 0,children:h?"...":f})},`${d}-${g}`)}),e.jsx("li",{className:"ml-2",children:e.jsx("button",{type:"button","aria-label":"Next page",disabled:w,className:"inline-flex h-[42px] w-[42px] items-center justify-center rounded-[4px] bg-transparent p-[9px] text-gray-5 transition hover:bg-transparent hover:text-neutral-5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-blue-4 disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50",onClick:()=>N("next"),children:e.jsx(m.Icon,{name:"ArrowLineRight"})})})]})}function H({placeholder:n,className:a,inputWidth:t,value:r,onChange:i,syncToUrl:c=!0,id:o="search",paramKey:l="s",firstResultSelector:s,onEnter:u}){const b=j.useSearchParams(),y=j.usePathname(),w=j.useRouter(),N=P.useRef(null),p=r!==void 0,[d,g]=P.useState(p?r:b.get(l)?.toString()??""),h=p?r:d,f=Math.max(n.length,1),S=`calc(${f}ch + 60px)`,$=t===void 0?S:typeof t=="number"?`${t}px`:t;P.useEffect(()=>{!c||p||g(b.get(l)?.toString()??"")},[p,l,b,c]);const C=v=>{if(!c)return;const x=new URLSearchParams(b.toString());v?(x.set(l,v),x.delete("page")):(x.delete(l),x.delete("page"));const k=x.toString();w.replace(k?`${y}?${k}`:y)},B=v=>{if(v.preventDefault(),u?.(h),s&&h.trim()){const x=document.querySelector(s);x&&x.focus()}};return e.jsxs("form",{className:`search-field ${a??""}`.trim(),noValidate:!0,onSubmit:B,children:[e.jsx("label",{className:"sr-only",htmlFor:o,children:"Search"}),e.jsxs("div",{className:"relative max-w-full",style:{width:$},children:[e.jsx(m.Icon,{name:"Magnifier","aria-hidden":!0,className:"absolute left-[15px] top-1/2 z-10 -translate-y-1/2 text-large leading-5 text-gray-5"}),e.jsx("input",{ref:N,className:"hide-search-clear block w-full max-w-full rounded-sm bg-white py-[11px] pl-[15px] pr-[40px] text-base leading-5 indent-[30px] outline-1 outline-gray-5 transition focus:outline-2 focus:outline-blue-4",style:{color:"#000000",WebkitTextFillColor:"#000000"},size:f,id:o,type:"search",autoComplete:"off",value:h,placeholder:n,onChange:v=>{const x=v.target.value;p||g(x),i?.(x),C(x)}}),h.length>0&&e.jsx("button",{type:"button","aria-label":"Clear search",className:"absolute right-1 top-1/2 z-10 inline-flex h-8 w-8 -translate-y-1/2 items-center justify-center rounded-lg p-2 text-gray-5 hover:text-neutral-5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-blue-4",onClick:()=>{p||g(""),i?.(""),C(""),N.current?.focus()},children:e.jsx(m.Icon,{name:"Close"})})]})]})}function J({columns:n,rows:a,rowKey:t}){const r=P.useId();return e.jsxs("table",{className:"w-full table-auto border-y border-gray-2 text-gray-5",children:[e.jsx("thead",{className:"font-bold",children:e.jsx("tr",{children:n.map(i=>e.jsx("th",{id:`${r}-col-${i.key}`,scope:"col",className:`px-3 py-4 text-left leading-[23px] ${i.headerClassName??""}`.trim(),children:i.header},i.key))})}),e.jsx("tbody",{children:a.map((i,c)=>e.jsx("tr",{className:"border-t border-gray-2",children:n.map(o=>e.jsx("td",{headers:`${r}-col-${o.key}`,className:`${o.cellClassName??"px-3 py-4"}`.trim(),children:o.render(i)},o.key))},t(i,c)))})]})}exports.Button=m.Button;exports.Icon=m.Icon;exports.IconButton=T;exports.IconButtonGlyph=D;exports.Logo=U;exports.Pagination=_;exports.Search=H;exports.Table=J;exports.iconButtonSizes=L;exports.iconButtonStates=z;exports.iconButtonVariants=R;

package/dist/index.js

@@ -17,8 +17,8 @@ const Z = [
   "ghost",
   "outline"
 ], E = "inline-flex items-center justify-center rounded-lg cursor-pointer focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-blue-4 disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50", G = {
-  md: "h-12 w-12 p-3",
-  sm: "h-8 w-8 p-2",
+  md: "h-8 w-8 p-0",
+  sm: "h-7 w-7 p-0",
   xs: "h-6 w-6 p-0"
 }, q = {
   default: "text-gray-5 hover:text-neutral-5 transition-colors",

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@digitalpromise/design",
   "private": false,
-  "version": "4.11.0",
+  "version": "4.12.0",
   "type": "module",
   "main": "dist/index.js",
   "exports": {