https://netdash-toolkit.vercel.app/_next/static/chunks/6986.d31107450f87cc73.js

1"use strict";(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[6986],{1923:(e,a,s)=>{s.d(a,{$:()=>i,r:()=>o});var t=s(81357),r=s(27833),l=s(67657),n=s(19543),c=s(39376);let o=(0,n.F)("inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring focus-visible:ring-[3px] aria-invalid:ring-destructive aria-invalid:border-destructive",{variants:{variant:{default:"bg-primary text-primary-foreground shadow-xs hover:bg-primary/90",destructive:"bg-destructive text-destructive-foreground shadow-xs hover:bg-destructive/90 focus-visible:ring-destructive",outline:"border border-input bg-background text-foreground shadow-xs hover:bg-accent/10 hover:text-foreground",secondary:"bg-secondary text-secondary-foreground shadow-xs hover:bg-secondary/80",ghost:"text-foreground hover:bg-accent/10 hover:text-foreground",link:"text-primary underline-offset-4 hover:underline"},size:{default:"h-9 px-4 py-2 has-[>svg]:px-3",sm:"h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5",lg:"h-10 rounded-md px-6 has-[>svg]:px-4",icon:"size-9"}},defaultVariants:{variant:"default",size:"default"}}),i=r.forwardRef((e,a)=>{let{className:s,variant:r,size:n,asChild:i=!1,...d}=e,u=i?l.DX:"button";return(0,t.jsx)(u,{ref:a,"data-slot":"button",className:(0,c.cn)(o({variant:r,size:n,className:s})),...d})});i.displayName="Button"},21068:(e,a,s)=>{s.d(a,{A:()=>c});var t=s(81357),r=s(27833),l=s(74160),n=s(39376);let c=r.forwardRef((e,a)=>{let{className:s,...r}=e;return(0,t.jsxs)(l.bL,{ref:a,className:(0,n.cn)("relative flex min-h-6 w-full touch-none items-center select-none",s),...r,children:[(0,t.jsx)(l.CC,{className:"bg-secondary relative h-2 w-full grow overflow-hidden rounded-full",children:(0,t.jsx)(l.Q6,{className:"bg-primary absolute h-full"})}),(0,t.jsx)(l.zi,{"aria-label":r["aria-label"],"aria-labelledby":r["aria-labelledby"],className:"border-primary bg-background ring-offset-background focus-visible:ring-ring relative block h-5 w-5 rounded-full border-2 transition-colors before:absolute before:-inset-0.5 before:rounded-full focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50"})]})});c.displayName=l.bL.displayName},28199:(e,a,s)=>{s.d(a,{Fc:()=>c,TN:()=>i,XL:()=>o});var t=s(81357);s(27833);var r=s(19543),l=s(39376);let n=(0,r.F)("relative w-full rounded-lg border px-4 py-3 text-sm grid has-[>svg]:grid-cols-[calc(var(--spacing)*4)_1fr] grid-cols-[0_1fr] has-[>svg]:gap-x-3 gap-y-0.5 items-start [&>svg]:size-4 [&>svg]:translate-y-0.5 [&>svg]:text-current",{variants:{variant:{default:"bg-card text-card-foreground",destructive:"text-destructive bg-card [&>svg]:text-current *:data-[slot=alert-description]:text-destructive"}},defaultVariants:{variant:"default"}});function c(e){let{className:a,variant:s,...r}=e;return(0,t.jsx)("div",{"data-slot":"alert",role:"destructive"===s?"alert":"status",className:(0,l.cn)(n({variant:s}),a),...r})}function o(e){let{className:a,...s}=e;return(0,t.jsx)("div",{"data-slot":"alert-title",className:(0,l.cn)("col-start-2 line-clamp-1 min-h-4 font-medium tracking-tight",a),...s})}function i(e){let{className:a,...s}=e;return(0,t.jsx)("div",{"data-slot":"alert-description",className:(0,l.cn)("text-muted-foreground col-start-2 grid justify-items-start gap-1 text-sm [&_p]:leading-relaxed",a),...s})}},57607:(e,a,s)=>{s.d(a,{D:()=>t});async function t(e){try{if(navigator.clipboard&&window.isSecureContext)return await navigator.clipboard.writeText(e),!0;let a=document.createElement("textarea");a.value=e,a.style.position="fixed",a.style.opacity="0",document.body.appendChild(a),a.select();let s=document.execCommand("copy");return document.body.removeChild(a),s}catch(e){return!1}}},72929:(e,a,s)=>{s.d(a,{BT:()=>o,Wu:()=>i,ZB:()=>c,Zp:()=>l,aR:()=>n});var t=s(81357);s(27833);var r=s(39376);function l(e){let{className:a,...s}=e;return(0,t.jsx)("div",{"data-slot":"card",className:(0,r.cn)("bg-card text-card-foreground flex flex-col gap-6 rounded-xl border py-6 shadow-sm",a),...s})}function n(e){let{className:a,...s}=e;return(0,t.jsx)("div",{"data-slot":"card-header",className:(0,r.cn)("@container/card-header grid auto-rows-min grid-rows-[auto_auto] items-start gap-1.5 px-6 has-data-[slot=card-action]:grid-cols-[1fr_auto] [.border-b]:pb-6",a),...s})}function c(e){let{className:a,...s}=e;return(0,t.jsx)("div",{"data-slot":"card-title",className:(0,r.cn)("leading-none font-semibold",a),...s})}function o(e){let{className:a,...s}=e;return(0,t.jsx)("div",{"data-slot":"card-description",className:(0,r.cn)("text-muted-foreground text-sm",a),...s})}function i(e){let{className:a,...s}=e;return(0,t.jsx)("div",{"data-slot":"card-content",className:(0,r.cn)("px-6",a),...s})}},76986:(e,a,s)=>{s.r(a),s.d(a,{ColorConverter:()=>eu});var t=s(81357),r=s(27833),l=s(63401),n=s(72929),c=s(82693),o=s(97379),i=s(40044),d=s(21068),u=s(28199),m=s(42995),x=s(33853),h=s(48266),p=s(99457),g=s(78357),b=s(95438),f=s(89593),v=s(89992),j=s(21964),N=s(74762),y=s(29274),w=s(81543),k=s(12127),C=s(54736),A=s(57875),M=s(61402),L=s(36484),S=s(15828),B=s(9577),H=s(92685),E=s(86233),F=s(40764),J=s(36685);let R=(0,b.b2)(f.A),T=(0,b.b2)(v.A),_=(0,b.b2)(j.A),K=(0,b.b2)(N.A),O=(0,b.b2)(y.A),z=(0,b.b2)(w.A),W=(0,b.b2)(k.A),Z=(0,b.b2)(C.A);(0,b.b2)(A.A),(0,b.b2)(M.A);let D=Object.keys(L.A),G=(0,S.A)(D,(0,B.IJ)()),P=(0,B.IJ)();function V(e,a){let s=Math.pow(10,a);return Math.round(e*s)/s}function I(e){return void 0===e.alpha?1:e.alpha}function U(e){return void 0===e?0:e}function X(e){var a;let s=e.trim();if(!s)return null;let t=/^[0-9a-f]{3,8}$/i.test(s)?"#".concat(s):s;return null!=(a=(0,H.Ay)(t))?a:null}function q(e){let{r:a,g:s,b:t}=R(e),r=1-Math.max(a,s,t),l=1-r;return{c:0===l?0:Math.round((1-a-r)/l*100),m:0===l?0:Math.round((1-s-r)/l*100),y:0===l?0:Math.round((1-t-r)/l*100),k:Math.round(100*r)}}function Y(e){let a=R(e),s=e=>Math.min(255,Math.max(0,Math.round(255*e)));return{r:s(a.r),g:s(a.g),b:s(a.b)}}function $(e){let a=W(e);return{l:V(a.l,4),c:V(a.c,4),h:V(U(a.h),2)}}function Q(e){var a,s;let t=I(e),{r,g:l,b:n}=Y(e),c=T(e),o={h:V(U(c.h),2),s:V(100*c.s,2),l:V(100*c.l,2)},i=_(e),d=K(e),u=O(e),m=z(e),x=$(e),h=Z(e),p=q(e),g=t<1?" / ".concat(V(t,3)):"";return{hex:null!=(a=(0,E.NN)(R(e)))?a:"#000000",hex8:null!=(s=(0,E.Bq)(R(e)))?s:"#000000ff",rgb:t<1?"rgb(".concat(r," ").concat(l," ").concat(n," / ").concat(V(t,3),")"):"rgb(".concat(r," ").concat(l," ").concat(n,")"),hsl:"hsl(".concat(o.h," ").concat(o.s,"% ").concat(o.l,"%").concat(g,")"),hwb:"hwb(".concat(V(U(i.h),2)," ").concat(V(100*i.w,2),"% ").concat(V(100*i.b,2),"%").concat(g,")"),lab:"lab(".concat(V(d.l,2),"% ").concat(V(d.a,2)," ").concat(V(d.b,2)).concat(g,")"),lch:"lch(".concat(V(u.l,2),"% ").concat(V(u.c,2)," ").concat(V(U(u.h),2)).concat(g,")"),oklab:"oklab(".concat(V(m.l,4)," ").concat(V(m.a,4)," ").concat(V(m.b,4)).concat(g,")"),oklch:"oklch(".concat(x.l," ").concat(x.c," ").concat(x.h).concat(g,")"),p3:"color(display-p3 ".concat(V(h.r,4)," ").concat(V(h.g,4)," ").concat(V(h.b,4)).concat(g,")"),cmyk:"cmyk(".concat(p.c,"%, ").concat(p.m,"%, ").concat(p.y,"%, ").concat(p.k,"%)")}}let ee={r:1,g:1,b:1};function ea(e,a){let s=I(e),t=function(e){let a=R(el(e)),s=e=>Math.min(1,Math.max(0,e));return{r:s(a.r),g:s(a.g),b:s(a.b)}}(e);return s>=1?{mode:"rgb",r:t.r,g:t.g,b:t.b}:{mode:"rgb",r:t.r*s+a.r*(1-s),g:t.g*s+a.g*(1-s),b:t.b*s+a.b*(1-s)}}let es={ratio:NaN,aaNormal:!1,aaaNormal:!1,aaLarge:!1,aaaLarge:!1,uiComponent:!1,composited:!1};function et(e,a){let s="string"==typeof e?X(e):e,t="string"==typeof a?X(a):a;if(!s||!t)return es;let r=ea(t,ee),l=(0,F.v)(ea(s,r),r);return Number.isFinite(l)?{ratio:l,aaNormal:l>=4.5,aaaNormal:l>=7,aaLarge:l>=3,aaaLarge:l>=4.5,uiComponent:l>=3,composited:1>I(s)||1>I(t)}:es}function er(e){return(0,J.Az)("rgb")(e)}function el(e){return er(e)?e:(0,J.KN)(e,"oklch")}let en=["#ef4444","#f97316","#eab308","#22c55e","#14b8a6","#3b82f6","#8b5cf6","#ec4899","#6b7280","#000000"],ec=["#fff","#3b82f680","rebeccapurple","rgb(59 130 246 / 0.5)","hsl(217 91% 60%)","hwb(217 23% 4%)","lab(54.6% 8.76 -65.79)","lch(54.6% 66.4 277.6)","oklab(0.623 -0.033 -0.185)","oklch(0.62 0.19 260)","color(display-p3 0.3 0.5 0.93)"];function eo(e){let{label:a,pass:s,threshold:r}=e;return(0,t.jsxs)("div",{className:"flex items-center justify-between rounded border px-2 py-1.5 text-xs",children:[(0,t.jsxs)("span",{className:"text-muted-foreground",children:[a," ",(0,t.jsx)("span",{className:"font-mono",children:r})]}),(0,t.jsx)(i.E,{variant:s?"default":"destructive",className:"ml-2",children:s?"Pass":"Fail"})]})}function ei(e){let{title:a,swatch:s,check:r}=e;return(0,t.jsxs)("div",{className:"space-y-2 rounded-lg border p-3",children:[(0,t.jsxs)("div",{className:"flex items-center justify-between",children:[(0,t.jsxs)("div",{className:"flex items-center gap-2",children:[(0,t.jsx)("span",{className:"h-5 w-5 rounded border",style:{backgroundColor:s},"aria-hidden":"true"}),(0,t.jsx)("span",{className:"text-sm font-medium",children:a})]}),(0,t.jsxs)(i.E,{variant:"outline",className:"font-mono",children:[r.ratio.toFixed(2),":1"]})]}),(0,t.jsxs)("div",{className:"grid grid-cols-1 gap-1.5 sm:grid-cols-2",children:[(0,t.jsx)(eo,{label:"AA normal",threshold:"4.5:1",pass:r.aaNormal}),(0,t.jsx)(eo,{label:"AAA normal",threshold:"7:1",pass:r.aaaNormal}),(0,t.jsx)(eo,{label:"AA large",threshold:"3:1",pass:r.aaLarge}),(0,t.jsx)(eo,{label:"AAA large",threshold:"4.5:1",pass:r.aaaLarge})]})]})}let ed={mode:"rgb",r:0,g:0,b:0};function eu(){let[{c:e,bg:a},s]=(0,l.ab)({c:l.tU.withDefault("#3b82f6"),bg:l.tU.withDefault("#0f172a")},{history:"replace"}),b=(0,r.useMemo)(()=>X(e),[e]),[f,v]=(0,r.useState)(()=>{var e;return null!=(e=X("#3b82f6"))?e:ed});(0,r.useEffect)(()=>{b&&v(b)},[b]);let j=null!=b?b:f,N=e.trim()&&!b?"Not a colour this parser recognises. Try #fff, #rrggbbaa, a CSS name, or rgb()/hsl()/hwb()/lab()/lch()/oklab()/oklch().":null,y=I(j),w=(0,r.useMemo)(()=>Q(j),[j]),k=(0,r.useMemo)(()=>Y(j),[j]),C=(0,r.useMemo)(()=>(function(e){let a=T(e);return{h:Math.round(U(a.h)),s:Math.round(100*a.s),l:Math.round(100*a.l)}})(j),[j]),A=(0,r.useMemo)(()=>$(j),[j]),M=(0,r.useMemo)(()=>q(j),[j]),L=(0,r.useMemo)(()=>(function(e){var a,s;let t=null!=(a=(0,E.NN)(R(e)))?a:"#000000",r=null!=(s=G(t)[0])?s:"black";return{name:r,exact:.5>P(t,r)}})(j),[j]),S=(0,r.useMemo)(()=>er(j),[j]),B=(0,r.useMemo)(()=>(function(e){let{r:a,g:s,b:t}=Y(el(e)),r=I(e);return r<1?"rgba(".concat(a,", ").concat(s,", ").concat(t,", ").concat(V(r,3),")"):"rgb(".concat(a,", ").concat(s,", ").concat(t,")")})(j),[j]),H=(0,r.useMemo)(()=>X(a),[a]),F=(0,r.useMemo)(()=>({white:et(j,"#ffffff"),black:et(j,"#000000"),custom:H?et(j,H):null}),[j,H]),J=function(e){let a=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"hex";s({c:Q(e)[a]})},_=e=>void s({c:e}),K=e=>y<1?{...e,alpha:y}:e;return(0,t.jsxs)("div",{className:"tool-container",children:[(0,t.jsx)(p.E,{icon:m.A,title:"Color Converter",description:"Convert between HEX, RGB, HSL, HWB, CMYK, LAB, LCH, OKLab, OKLCH and Display P3, with alpha and WCAG contrast"}),(0,t.jsxs)("div",{className:"grid grid-cols-1 gap-6 lg:grid-cols-3",children:[(0,t.jsxs)(n.Zp,{className:"lg:col-span-1",children:[(0,t.jsxs)(n.aR,{children:[(0,t.jsx)(n.ZB,{children:"Color Preview"}),(0,t.jsx)(n.BT,{children:L.exact?"CSS named color: ".concat(L.name):"Closest CSS name: ".concat(L.name)})]}),(0,t.jsxs)(n.Wu,{className:"space-y-4",children:[(0,t.jsx)("div",{className:"h-40 rounded-lg border shadow-inner",style:{backgroundColor:B,backgroundImage:y<1?"linear-gradient(45deg,#ccc 25%,transparent 25%,transparent 75%,#ccc 75%),linear-gradient(45deg,#ccc 25%,transparent 25%,transparent 75%,#ccc 75%)":void 0,backgroundSize:y<1?"16px 16px":void 0,backgroundPosition:y<1?"0 0, 8px 8px":void 0}}),!S&&(0,t.jsxs)(u.Fc,{children:[(0,t.jsx)(x.A,{className:"h-4 w-4"}),(0,t.jsx)(u.TN,{className:"text-xs",children:"Outside the sRGB gamut. The swatch shows a chroma-clamped stand-in; the OKLCH and Display P3 values below are the real ones."})]}),(0,t.jsxs)("div",{className:"space-y-2",children:[(0,t.jsx)(o.J,{htmlFor:"color-input",children:"Color (any CSS syntax)"}

1),(0,t.jsx)(c.p,{id:"color-input",value:e,onChange:e=>_(e.target.value),placeholder:"#3b82f6, rebeccapurple, oklch(0.62 0.19 260)",className:"font-mono","aria-invalid":null!==N,"aria-describedby":N?"color-input-error":void 0}),N&&(0,t.jsx)("p",{id:"color-input-error",role:"status",className:"text-xs text-red-600 dark:text-red-400",children:N})]}),(0,t.jsxs)("div",{className:"space-y-2",children:[(0,t.jsx)(o.J,{children:"Quick Select"}),(0,t.jsx)("div",{className:"flex flex-wrap gap-2",children:en.map(e=>(0,t.jsx)("button",{onClick:()=>_(e),className:"h-8 w-8 rounded-md border shadow-sm transition-transform hover:scale-110",style:{backgroundColor:e},"aria-label":"Use ".concat(e)},e))})]}),(0,t.jsxs)("div",{className:"space-y-2",children:[(0,t.jsx)(o.J,{htmlFor:"color-picker",children:"Color Picker"}),(0,t.jsx)(c.p,{id:"color-picker",type:"color",value:w.hex,onChange:e=>_(e.target.value),className:"h-12 w-full cursor-pointer"})]}),(0,t.jsxs)("div",{className:"space-y-2",children:[(0,t.jsxs)("div",{className:"flex items-center justify-between",children:[(0,t.jsx)(o.J,{children:"Alpha"}),(0,t.jsxs)(i.E,{variant:"outline",className:"font-mono",children:[Math.round(100*y),"%"]})]}),(0,t.jsx)(d.A,{value:[Math.round(100*y)],onValueChange:e=>{let[a]=e;J({...j,alpha:a/100},a>=100?"hex":"rgb")},max:100,step:1,"aria-label":"Alpha"})]}),(0,t.jsxs)("div",{className:"space-y-1",children:[(0,t.jsx)(o.J,{className:"text-xs",children:"Try"}),(0,t.jsx)("div",{className:"flex flex-wrap gap-1",children:ec.map(e=>(0,t.jsx)("button",{onClick:()=>_(e),className:"hover:bg-muted/50 rounded border px-1.5 py-0.5 font-mono text-[0.625rem]",children:e},e))})]})]})]}),(0,t.jsxs)(n.Zp,{className:"lg:col-span-2",children:[(0,t.jsxs)(n.aR,{children:[(0,t.jsx)(n.ZB,{children:"Color Values"}),(0,t.jsx)(n.BT,{children:"Every slider edits the color in its own space"})]}),(0,t.jsxs)(n.Wu,{className:"space-y-6",children:[(0,t.jsxs)("div",{className:"space-y-2",children:[(0,t.jsxs)("div",{className:"flex items-center justify-between",children:[(0,t.jsx)(o.J,{children:"RGB"}),(0,t.jsx)(g.i,{value:w.rgb})]}),(0,t.jsx)("div",{className:"grid grid-cols-3 gap-2",children:["r","g","b"].map(e=>(0,t.jsxs)("div",{className:"space-y-1",children:[(0,t.jsxs)("div",{className:"flex items-center justify-between",children:[(0,t.jsx)("span",{className:"text-muted-foreground text-xs uppercase",children:e}),(0,t.jsx)(i.E,{variant:"outline",className:"font-mono",children:k[e]})]}),(0,t.jsx)(d.A,{value:[k[e]],onValueChange:a=>{let[s]=a,t={...k,[e]:s};J(K({mode:"rgb",r:t.r/255,g:t.g/255,b:t.b/255}),y<1?"rgb":"hex")},max:255,step:1,"aria-label":"RGB ".concat(e)})]},e))}),(0,t.jsx)("p",{className:"text-muted-foreground font-mono text-sm",children:w.rgb})]}),(0,t.jsxs)("div",{className:"space-y-2",children:[(0,t.jsxs)("div",{className:"flex items-center justify-between",children:[(0,t.jsx)(o.J,{children:"HSL"}),(0,t.jsx)(g.i,{value:w.hsl})]}),(0,t.jsx)("div",{className:"grid grid-cols-3 gap-2",children:["h","s","l"].map(e=>(0,t.jsxs)("div",{className:"space-y-1",children:[(0,t.jsxs)("div",{className:"flex items-center justify-between",children:[(0,t.jsx)("span",{className:"text-muted-foreground text-xs uppercase",children:"h"===e?"Hue":"s"===e?"Sat":"Light"}),(0,t.jsxs)(i.E,{variant:"outline",className:"font-mono",children:[C[e],"h"===e?"\xb0":"%"]})]}),(0,t.jsx)(d.A,{value:[C[e]],onValueChange:a=>{let[s]=a,t={...C,[e]:s};J(K({mode:"hsl",h:t.h,s:t.s/100,l:t.l/100}),"hsl")},max:"h"===e?360:100,step:1,"aria-label":"HSL ".concat(e)})]},e))}),(0,t.jsx)("p",{className:"text-muted-foreground font-mono text-sm",children:w.hsl})]}),(0,t.jsxs)("div",{className:"space-y-2",children:[(0,t.jsxs)("div",{className:"flex items-center justify-between",children:[(0,t.jsx)(o.J,{children:"OKLCH"}),(0,t.jsx)(g.i,{value:w.oklch})]}),(0,t.jsx)("div",{className:"grid grid-cols-3 gap-2",children:[{key:"l",label:"Light",max:1,step:.001},{key:"c",label:"Chroma",max:.4,step:.001},{key:"h",label:"Hue",max:360,step:1}].map(e=>{let{key:a,label:s,max:r,step:l}=e;return(0,t.jsxs)("div",{className:"space-y-1",children:[(0,t.jsxs)("div",{className:"flex items-center justify-between",children:[(0,t.jsx)("span",{className:"text-muted-foreground text-xs uppercase",children:s}),(0,t.jsx)(i.E,{variant:"outline",className:"font-mono",children:A[a]})]}),(0,t.jsx)(d.A,{value:[A[a]],onValueChange:e=>{let[s]=e,t={...A,[a]:s};J(K({mode:"oklch",l:t.l,c:t.c,h:t.h}),"oklch")},max:r,step:l,"aria-label":"OKLCH ".concat(s)})]},a)})}),(0,t.jsx)("p",{className:"text-muted-foreground font-mono text-sm",children:w.oklch}),(0,t.jsx)("p",{className:"text-muted-foreground text-xs",children:"Perceptually uniform - equal lightness steps look equal, unlike HSL."})]}),(0,t.jsxs)("div",{className:"space-y-2",children:[(0,t.jsxs)("div",{className:"flex items-center justify-between",children:[(0,t.jsx)(o.J,{children:"CMYK"}),(0,t.jsx)(g.i,{value:w.cmyk})]}),(0,t.jsx)("div",{className:"grid grid-cols-4 gap-2",children:["c","m","y","k"].map(e=>(0,t.jsxs)("div",{className:"space-y-1",children:[(0,t.jsx)(o.J,{htmlFor:"cmyk-".concat(e),className:"text-muted-foreground text-xs uppercase",children:e}),(0,t.jsx)(c.p,{id:"cmyk-".concat(e),type:"number",min:0,max:100,value:M[e],onChange:a=>{var s;return s=Number(a.target.value),void J(function(e){let a=arguments.length>1&&void 0!==arguments[1]?arguments[1]:1,s=e.c/100,t=e.m/100,r=e.y/100,l=e.k/100,n={mode:"rgb",r:(1-s)*(1-l),g:(1-t)*(1-l),b:(1-r)*(1-l)};return a<1?{...n,alpha:a}:n}({...M,[e]:Math.min(100,Math.max(0,s))},y),y<1?"rgb":"hex")},className:"font-mono"})]},e))}),(0,t.jsx)("p",{className:"text-muted-foreground font-mono text-sm",children:w.

1cmyk}),(0,t.jsx)("p",{className:"text-muted-foreground text-xs",children:"Naive device-independent conversion, not an ICC profile - treat printer output as indicative."})]})]})]})]}),(0,t.jsxs)(n.Zp,{children:[(0,t.jsxs)(n.aR,{children:[(0,t.jsxs)(n.ZB,{className:"flex items-center gap-2",children:[(0,t.jsx)(h.A,{className:"h-5 w-5"}),"WCAG Contrast"]}),(0,t.jsx)(n.BT,{children:"This color as text on a background. Large text means 18.66px bold or 24px regular."}),F.white.composited&&(0,t.jsxs)("p",{className:"text-muted-foreground text-xs",children:["Alpha is ",Math.round(100*y),"%, so each ratio is measured on the composite that actually gets painted. WCAG 2.2 1.4.3 rates the rendered text, not the source color."]})]}),(0,t.jsxs)(n.Wu,{className:"space-y-4",children:[(0,t.jsxs)("div",{className:"grid grid-cols-1 gap-3 md:grid-cols-3",children:[(0,t.jsx)(ei,{title:"On white",swatch:"#ffffff",check:F.white}),(0,t.jsx)(ei,{title:"On black",swatch:"#000000",check:F.black}),(0,t.jsxs)("div",{className:"space-y-2 rounded-lg border p-3",children:[(0,t.jsx)(o.J,{htmlFor:"bg-input",className:"text-sm font-medium",children:"Custom background"}),(0,t.jsx)(c.p,{id:"bg-input",value:a,onChange:e=>s({bg:e.target.value}),placeholder:"#0f172a",className:"font-mono","aria-invalid":null===H,"aria-describedby":null===H?"bg-input-error":void 0}),F.custom?(0,t.jsxs)(t.Fragment,{children:[(0,t.jsxs)("div",{className:"flex items-center justify-between",children:[(0,t.jsx)("span",{className:"h-5 w-16 rounded border",style:{backgroundColor:a},"aria-hidden":"true"}),(0,t.jsxs)(i.E,{variant:"outline",className:"font-mono",children:[F.custom.ratio.toFixed(2),":1"]})]}),(0,t.jsxs)("div",{className:"grid grid-cols-1 gap-1.5",children:[(0,t.jsx)(eo,{label:"AA normal",threshold:"4.5:1",pass:F.custom.aaNormal}),(0,t.jsx)(eo,{label:"AAA normal",threshold:"7:1",pass:F.custom.aaaNormal}),(0,t.jsx)(eo,{label:"AA large",threshold:"3:1",pass:F.custom.aaLarge}),(0,t.jsx)(eo,{label:"UI component",threshold:"3:1",pass:F.custom.uiComponent})]})]}):(0,t.jsx)("p",{id:"bg-input-error",role:"status",className:"text-xs text-red-600 dark:text-red-400",children:"Unrecognised background color. Expected a CSS colour such as #0f172a, rebeccapurple or oklch(0.62 0.19 260)."})]})]}),(0,t.jsxs)("div",{className:"rounded-lg border p-4",style:{backgroundColor:H?a:"#ffffff",color:B},children:[(0,t.jsx)("p",{className:"text-sm",children:"Normal text sample - 14px regular on the custom background."}),(0,t.jsx)("p",{className:"text-2xl font-bold",children:"Large text sample"})]})]})]}),(0,t.jsxs)(n.Zp,{children:[(0,t.jsx)(n.aR,{children:(0,t.jsx)(n.ZB,{children:"All Formats"})}),(0,t.jsx)(n.Wu,{children:(0,t.jsx)("div",{className:"grid grid-cols-1 gap-3 md:grid-cols-2 lg:grid-cols-3",children:[["HEX",w.hex],["HEX + alpha",w.hex8],["RGB",w.rgb],["HSL",w.hsl],["HWB",w.hwb],["CMYK",w.cmyk],["LAB",w.lab],["LCH",w.lch],["OKLab",w.oklab],["OKLCH",w.oklch],["Display P3",w.p3]].map(e=>{let[a,s]=e;return(0,t.jsxs)("div",{className:"rounded-lg border p-3",children:[(0,t.jsxs)("div",{className:"mb-1 flex items-center justify-between",children:[(0,t.jsx)("span",{className:"text-sm font-medium",children:a}),(0,t.jsx)(g.i,{value:s})]}),(0,t.jsx)("code",{className:"text-muted-foreground text-xs break-all",children:s})]},a)})})})]})]})}},78357:(e,a,s)=>{s.d(a,{i:()=>d});var t=s(81357),r=s(27833),l=s(1923),n=s(2886),c=s(64175),o=s(39376),i=s(57607);function d(e){let{value:a,className:s,variant:d="ghost",size:u="sm"}=e,[m,x]=(0,r.useState)(!1),h=(0,r.useCallback)(async()=>{await (0,i.D)(a)&&(x(!0),setTimeout(()=>x(!1),2e3))},[a]);return(0,t.jsx)(l.$,{variant:d,size:u,className:(0,o.cn)("transition-all duration-200",m&&"text-green-600 dark:text-green-400",s),onClick:h,"aria-label":m?"Copied!":"Copy to clipboard",children:m?(0,t.jsx)(n.A,{className:"h-4 w-4"}):(0,t.jsx)(c.A,{className:"h-4 w-4"})})}},82693:(e,a,s)=>{s.d(a,{p:()=>n});var t=s(81357),r=s(27833),l=s(39376);let n=r.forwardRef((e,a)=>{let{className:s,type:r,...n}=e;return(0,t.jsx)("input",{ref:a,type:r,"data-slot":"input",className:(0,l.cn)("file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground border-input bg-background flex h-9 w-full min-w-0 rounded-md border px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm","focus-visible:border-ring focus-visible:ring-ring focus-visible:ring-[3px]","aria-invalid:ring-destructive aria-invalid:border-destructive",s),...n})});n.displayName="Input"},97379:(e,a,s)=>{s.d(a,{J:()=>n});var t=s(81357);s(27833);var r=s(70906),l=s(39376);function n(e){let{className:a,...s}=e;return(0,t.jsx)(r.b,{"data-slot":"label",className:(0,l.cn)("flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50",a),...s})}},99457:(e,a,s)=>{s.d(a,{E:()=>r});var t=s(81357);function r(e){let{icon:a,title:s,description:r,actions:l}=e;return(0,t.jsxs)("div",{className:"flex flex-col space-y-3 sm:flex-row sm:items-center sm:justify-between sm:space-y-0",children:[(0,t.jsxs)("div",{className:"flex items-start space-x-3",children:[(0,t.jsx)(a,{className:"text-primary mt-0.5 h-6 w-6 flex-shrink-0","aria-hidden":"true"}),(0,t.jsxs)("div",{children:[(0,t.jsx)("h1",{className:"text-xl font-bold sm:text-2xl",children:s}),(0,t.jsx)("p",{className:"text-muted-foreground text-sm sm:text-base",children:r})]})]}),l&&(0,t.jsx)("div",{className:"flex flex-wrap gap-2",children:l})]})}}}]);