@digitalpromise/design 4.8.1 → 4.8.5

package/dist/index.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const f=require("./icon-1CrM76QC.cjs"),e=require("react/jsx-runtime"),v=require("next/navigation"),w=require("react"),C=new Map([["black","/primary-badge-engine-logo-black.svg"],["white","/primary-badge-engine-logo-white.svg"],["color","/primary-badge-engine-logo-color.svg"]]);function k({variant:c="color",className:b}){const r=C.get(c);return r===void 0?null:e.jsx("img",{src:r,width:186,height:36,alt:"Badge Engine",className:b})}function I({count:c,limit:b,pageParamKey:r="page"}){const s=v.useSearchParams(),h=v.usePathname(),l=v.useRouter(),y=s.get(r),d=y?Number.parseInt(y,10):Number.NaN,t=Number.isFinite(d)?d:1,n=Math.max(1,Math.ceil(c/b)),P=n<=7?Array.from({length:n},(a,i)=>i+1):t<=4?[1,2,3,4,5,"ellipsis",n]:t>=n-3?[1,"ellipsis",n-4,n-3,n-2,n-1,n]:[1,"ellipsis",t-1,t,t+1,"ellipsis",n],j=t===1,u=t===n,S=a=>{if(j&&a==="prev"||u&&a==="next")return;const i=a==="prev"?t-1:t+1,g=new URLSearchParams(s.toString());g.set(r,String(i)),l.push(`${h}?${g.toString()}`,{scroll:!1})},N=a=>{const i=new URLSearchParams(s.toString());i.set(r,String(a)),l.push(`${h}?${i.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:j,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:()=>S("prev"),children:e.jsx(f.Icon,{name:"ArrowLineLeft"})})}),P.map((a,i)=>{const g=a==="ellipsis",x=g?void 0:a,m=x===t,p=g||m,o=g?"Pagination ellipsis":`Go to page ${x}`;return e.jsx("li",{children:e.jsx("button",{type:"button","aria-label":o,"aria-current":m?"page":void 0,disabled:p,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 ${m?"bg-blue-1 text-blue-4":""} ${p?"cursor-default":"cursor-pointer hover:bg-gray-1"}`.trim(),onClick:!p&&x?()=>N(x):void 0,children:g?"...":x})},`${a}-${i}`)}),e.jsx("li",{className:"ml-2",children:e.jsx("button",{type:"button","aria-label":"Next page",disabled:u,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:()=>S("next"),children:e.jsx(f.Icon,{name:"ArrowLineRight"})})})]})}function L({placeholder:c,className:b,inputWidth:r,value:s,onChange:h,syncToUrl:l=!0,id:y="search",paramKey:d="s"}){const t=v.useSearchParams(),n=v.usePathname(),P=v.useRouter(),j=w.useRef(null),u=s!==void 0,[S,N]=w.useState(u?s:t.get(d)?.toString()??""),a=u?s:S,i=Math.max(c.length,1),g=`calc(${i}ch + 60px)`,x=r===void 0?g:typeof r=="number"?`${r}px`:r;w.useEffect(()=>{!l||u||N(t.get(d)?.toString()??"")},[u,d,t,l]);const m=p=>{if(!l)return;const o=new URLSearchParams(t.toString());p?(o.set(d,p),o.delete("page")):(o.delete(d),o.delete("page"));const $=o.toString();P.replace($?`${n}?${$}`:n)};return e.jsxs("form",{className:b??"",noValidate:!0,children:[e.jsx("label",{className:"sr-only",htmlFor:y,children:"Search"}),e.jsxs("div",{className:"relative max-w-full",style:{width:x},children:[e.jsx(f.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:j,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:i,id:y,type:"search",autoComplete:"off",value:a,placeholder:c,onChange:p=>{const o=p.target.value;u||N(o),h?.(o),m(o)}}),a.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:()=>{u||N(""),h?.(""),m(""),j.current?.focus()},children:e.jsx(f.Icon,{name:"Close"})})]})]})}function R({columns:c,rows:b,rowKey:r}){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:c.map(s=>e.jsx("td",{className:`px-3 py-4 ${s.headerClassName??""}`.trim(),children:s.header},s.key))})}),e.jsx("tbody",{children:b.map((s,h)=>e.jsx("tr",{className:"border-t border-gray-2",children:c.map(l=>e.jsx("td",{className:`${l.cellClassName??"px-3 py-4"}`.trim(),children:l.render(s)},l.key))},r(s,h)))})]})}exports.Button=f.Button;exports.Icon=f.Icon;exports.IconButton=f.IconButton;exports.Logo=k;exports.Pagination=I;exports.Search=L;exports.Table=R;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const f=require("./icon-1CrM76QC.cjs"),e=require("react/jsx-runtime"),v=require("next/navigation"),w=require("react"),C=new Map([["black","/primary-badge-engine-logo-black.svg"],["white","/primary-badge-engine-logo-white.svg"],["color","/primary-badge-engine-logo-color.svg"]]);function k({variant:c="color",className:b}){const r=C.get(c);return r===void 0?null:e.jsx("img",{src:r,width:186,height:36,alt:"Badge Engine",className:b})}function I({count:c,limit:b,pageParamKey:r="page"}){const s=v.useSearchParams(),h=v.usePathname(),l=v.useRouter(),y=s.get(r),d=y?Number.parseInt(y,10):Number.NaN,t=Number.isFinite(d)?d:1,n=Math.max(1,Math.ceil(c/b)),P=n<=7?Array.from({length:n},(a,i)=>i+1):t<=4?[1,2,3,4,5,"ellipsis",n]:t>=n-3?[1,"ellipsis",n-4,n-3,n-2,n-1,n]:[1,"ellipsis",t-1,t,t+1,"ellipsis",n],j=t===1,u=t===n,S=a=>{if(j&&a==="prev"||u&&a==="next")return;const i=a==="prev"?t-1:t+1,g=new URLSearchParams(s.toString());g.set(r,String(i)),l.push(`${h}?${g.toString()}`,{scroll:!1})},N=a=>{const i=new URLSearchParams(s.toString());i.set(r,String(a)),l.push(`${h}?${i.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:j,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:()=>S("prev"),children:e.jsx(f.Icon,{name:"ArrowLineLeft"})})}),P.map((a,i)=>{const g=a==="ellipsis",x=g?void 0:a,m=x===t,p=g||m,o=g?"Pagination ellipsis":`Go to page ${x}`;return e.jsx("li",{children:e.jsx("button",{type:"button","aria-label":o,"aria-current":m?"page":void 0,disabled:p,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 ${m?"bg-blue-1 text-blue-4":""} ${p?"cursor-default":"cursor-pointer hover:bg-gray-1"}`.trim(),onClick:!p&&x?()=>N(x):void 0,children:g?"...":x})},`${a}-${i}`)}),e.jsx("li",{className:"ml-2",children:e.jsx("button",{type:"button","aria-label":"Next page",disabled:u,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:()=>S("next"),children:e.jsx(f.Icon,{name:"ArrowLineRight"})})})]})}function L({placeholder:c,className:b,inputWidth:r,value:s,onChange:h,syncToUrl:l=!0,id:y="search",paramKey:d="s"}){const t=v.useSearchParams(),n=v.usePathname(),P=v.useRouter(),j=w.useRef(null),u=s!==void 0,[S,N]=w.useState(u?s:t.get(d)?.toString()??""),a=u?s:S,i=Math.max(c.length,1),g=`calc(${i}ch + 60px)`,x=r===void 0?g:typeof r=="number"?`${r}px`:r;w.useEffect(()=>{!l||u||N(t.get(d)?.toString()??"")},[u,d,t,l]);const m=p=>{if(!l)return;const o=new URLSearchParams(t.toString());p?(o.set(d,p),o.delete("page")):(o.delete(d),o.delete("page"));const $=o.toString();P.replace($?`${n}?${$}`:n)};return e.jsxs("form",{className:b??"",noValidate:!0,children:[e.jsx("label",{className:"sr-only",htmlFor:y,children:"Search"}),e.jsxs("div",{className:"relative max-w-full",style:{width:x},children:[e.jsx(f.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:j,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:i,id:y,type:"search",autoComplete:"off",value:a,placeholder:c,onChange:p=>{const o=p.target.value;u||N(o),h?.(o),m(o)}}),a.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:()=>{u||N(""),h?.(""),m(""),j.current?.focus()},children:e.jsx(f.Icon,{name:"Close"})})]})]})}function R({columns:c,rows:b,rowKey:r}){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:c.map(s=>e.jsx("td",{className:`px-3 py-4 ${s.headerClassName??""}`.trim(),children:s.header},s.key))})}),e.jsx("tbody",{children:b.map((s,h)=>e.jsx("tr",{className:"border-t border-gray-2",children:c.map(l=>e.jsx("td",{className:`${l.cellClassName??"px-3 py-4"}`.trim(),children:l.render(s)},l.key))},r(s,h)))})]})}exports.Button=f.Button;exports.Icon=f.Icon;exports.IconButton=f.IconButton;exports.Logo=k;exports.Pagination=I;exports.Search=L;exports.Table=R;

package/dist/index.js

@@ -1,3 +1,4 @@
+"use client";
 import { I as w } from "./icon-Ce5_UC8P.js";
 import { B as T, a as U } from "./icon-Ce5_UC8P.js";
 import { jsx as e, jsxs as S } from "react/jsx-runtime";

package/dist/tokens.d.ts

@@ -0,0 +1,134 @@
+/**
+ * Do not edit directly, this file was auto-generated.
+ */
+
+export default tokens;
+
+declare interface DesignToken {
+  $value?: any;
+  $type?: string;
+  $description?: string;
+  name?: string;
+  themeable?: boolean;
+  attributes?: Record<string, unknown>;
+  [key: string]: any;
+}
+
+declare const tokens: {
+  color: {
+    gray: {
+      "1": DesignToken;
+      "2": DesignToken;
+      "3": DesignToken;
+      "4": DesignToken;
+      "5": DesignToken;
+    };
+    blue: {
+      "1": DesignToken;
+      "2": DesignToken;
+      "3": DesignToken;
+      "4": DesignToken;
+      "5": DesignToken;
+    };
+    indigo: {
+      "1": DesignToken;
+      "2": DesignToken;
+      "3": DesignToken;
+      "4": DesignToken;
+      "5": DesignToken;
+    };
+    purple: {
+      "1": DesignToken;
+      "2": DesignToken;
+      "3": DesignToken;
+      "4": DesignToken;
+      "5": DesignToken;
+    };
+    violet: {
+      "1": DesignToken;
+      "2": DesignToken;
+      "3": DesignToken;
+      "4": DesignToken;
+      "5": DesignToken;
+    };
+    magenta: {
+      "1": DesignToken;
+      "2": DesignToken;
+      "3": DesignToken;
+      "4": DesignToken;
+      "5": DesignToken;
+    };
+    red: {
+      "1": DesignToken;
+      "2": DesignToken;
+      "3": DesignToken;
+      "4": DesignToken;
+      "5": DesignToken;
+    };
+    orange: {
+      "1": DesignToken;
+      "2": DesignToken;
+      "3": DesignToken;
+      "4": DesignToken;
+      "5": DesignToken;
+    };
+    green: {
+      "1": DesignToken;
+      "2": DesignToken;
+      "3": DesignToken;
+      "4": DesignToken;
+      "5": DesignToken;
+    };
+    jade: {
+      "1": DesignToken;
+      "2": DesignToken;
+      "3": DesignToken;
+      "4": DesignToken;
+      "5": DesignToken;
+    };
+    teal: {
+      "1": DesignToken;
+      "2": DesignToken;
+      "3": DesignToken;
+      "4": DesignToken;
+      "5": DesignToken;
+    };
+    neutral: {
+      "1": DesignToken;
+      "2": DesignToken;
+      "3": DesignToken;
+      "4": DesignToken;
+      "5": DesignToken;
+    };
+    primary: DesignToken;
+    "primary-hover": DesignToken;
+    danger: DesignToken;
+    "danger-hover": DesignToken;
+    disabled: DesignToken;
+  };
+  text: {
+    small: DesignToken;
+    medium: DesignToken;
+    "medium-large": DesignToken;
+    large: DesignToken;
+    "x-large": DesignToken;
+    "xx-large": DesignToken;
+    "xxx-large": DesignToken;
+    base: DesignToken;
+  };
+  spacing: {
+    "0": DesignToken;
+    "1": DesignToken;
+    "2": DesignToken;
+    "3": DesignToken;
+    "4": DesignToken;
+    "5": DesignToken;
+    "6": DesignToken;
+    "7": DesignToken;
+    "8": DesignToken;
+    "9": DesignToken;
+    "10": DesignToken;
+    "11": DesignToken;
+    "12": DesignToken;
+  };
+};