https://michaelharding.co.uk/assets/EquivalentFinder-B_GbUnkW.js

1import{j as e,r as w,u as q,a as A,S as D,c as Q,A as U,L as I,b as T}from"./index-BXFUGXGO.js";import{P as E}from"./ProductDetailCard-B1yhuCmc.js";import{n as Y,c as v,s as _}from"./pigmentUtils-CqGjLUvH.js";import{g as K}from"./pigmentKnowledge-6wEkJSrc.js";import{u as Z,M as X}from"./MediumToggle-BreNO3n8.js";import{C as J}from"./ColourDisclaimer-B97AgtH8.js";import"./colourMath--2_mtqw1.js";const S=[{name:"French Ultramarine",code:"PB29"},{name:"Ultramarine Blue Light",code:"PB29"},{name:"Cadmium Yellow Pale",code:"PY35"},{name:"Cadmium Yellow Light",code:"PY35"},{name:"Cadmium Red Deep",code:"PR108"},{name:"Cadmium Red Medium",code:"PR108"},{name:"Cadmium Red Light",code:"PR108"},{name:"Titanium White",code:"PW6"},{name:"Ivory Black",code:"PBk9"},{name:"Scheveningen Black",code:"PBk9"},{name:"Carbon Black",code:"PBk6"},{name:"Yellow Ochre",code:"PY43"},{name:"Raw Sienna",code:"PBr7"},{name:"Burnt Sienna",code:"PBr7"},{name:"Burnt Sienna Light",code:"PBr7"},{name:"Raw Umber",code:"PBr6"},{name:"Burnt Umber",code:"PBr6"},{name:"Phthalo Green",code:"PG7"},{name:"Phthalo Blue",code:"PB15"},{name:"Phthalo Blue (Red Shade)",code:"PB15"},{name:"Quinacridone Magenta",code:"PR122"},{name:"Quinacridone Red",code:"PV19"},{name:"Permanent Rose",code:"PV19"},{name:"Viridian",code:"PG18"},{name:"Cobalt Blue",code:"PB28"},{name:"Naples Yellow",code:"PY41"},{name:"Hansa Yellow Light",code:"PY3"},{name:"Prussian Blue",code:"PB27",featured:!1},{name:"Cobalt Teal Blue",code:"PB50",featured:!1},{name:"Cobalt Blue Deep",code:"PB74",featured:!1},{name:"Phthalocyanine Blue Red Shade",code:"PB15.1",featured:!1},{name:"Phthalocyanine Blue Green Shade",code:"PB15.3",featured:!1},{name:"Vine Black",code:"PBk11",featured:!1},{name:"Mars Black",code:"PBk11",featured:!1},{name:"Perylene Green",code:"PBk31",featured:!1},{name:"Van Dyke Brown",code:"PBr8",featured:!1},{name:"Vandyke Brown",code:"PBr8",featured:!1},{name:"Chrome Titanium Yellow",code:"PBr24",featured:!1},{name:"Quinacridone Brown",code:"PBr25",featured:!1},{name:"Chromium Oxide Green",code:"PG17",featured:!1},{name:"Cobalt Green",code:"PG19",featured:!1},{name:"Green Earth",code:"PG23",featured:!1},{name:"Terre Verte",code:"PG23",featured:!1},{name:"Cobalt Teal",code:"PG50",featured:!1},{name:"Phthalocyanine Green Yellow Shade",code:"PG36",featured:!1},{name:"Cadmium Orange",code:"PO20",featured:!1},{name:"Orange Lake",code:"PO34",featured:!1},{name:"Benzimidazolone Orange",code:"PO36.1",featured:!1},{name:"Brilliant Orange",code:"PO62",featured:!1},{name:"Permanent Orange",code:"PO73",featured:!1},{name:"Mars Red",code:"PR101",featured:!1},{name:"Transparent Oxide Red",code:"PR101",featured:!1},{name:"Natural Red Ochre",code:"PR102",featured:!1},{name:"Red Ochre",code:"PR102",featured:!1},{name:"Vermilion",code:"PR106",featured:!1},{name:"Cinnabar",code:"PR106",featured:!1},{name:"Perylene Crimson",code:"PR149",featured:!1},{name:"Scarlet Lake",code:"PR170",featured:!1},{name:"Naphthol Red",code:"PR170",featured:!1},{name:"Alizarin Claret",code:"PR177",featured:!1},{name:"Perylene Maroon",code:"PR179",featured:!1},{name:"Naphthol Red AS",code:"PR188",featured:!1},{name:"Quinacridone Maroon",code:"PR206",featured:!1},{name:"Potter's Pink",code:"PR233",featured:!1},{name:"Pyrrole Red",code:"PR254",featured:!1},{name:"Ultramarine Pink",code:"PR259",featured:!1},{name:"Pyrrole Crimson",code:"PR264",featured:!1},{name:"Alizarin Crimson",code:"PR83",featured:!1},{name:"Quinacridone Coral",code:"PR209",featured:!1},{name:"Cobalt Violet",code:"PV14",featured:!1},{name:"Ultramarine Violet",code:"PV15",featured:!1},{name:"Manganese Violet",code:"PV16",featured:!1},{name:"Dioxazine Violet",code:"PV23",featured:!1},{name:"Perylene Violet",code:"PV29",featured:!1},{name:"Quinacridone Purple",code:"PV55",featured:!1},{name:"Cobalt Turquoise",code:"PB36",featured:!1},{name:"Indanthrone Blue",code:"PB60",featured:!1},{name:"Lead White",code:"PW1",featured:!1},{name:"Flake White",code:"PW1",featured:!1},{name:"Zinc White",code:"PW4",featured:!1},{name:"Green Gold",code:"PY129",featured:!1},{name:"Isoindoline Yellow",code:"PY139",featured:!1},{name:"Nickel Azo Yellow",code:"PY150",featured:!1},{name:"Benzimidazolone Yellow",code:"PY151",featured:!1},{name:"Citron Yellow",code:"PY175",featured:!1},{name:"Yellow Lake",code:"PY180",featured:!1},{name:"Turner's Yellow",code:"PY216",featured:!1},{name:"Lemon Yellow",code:"PY31",featured:!1},{name:"Aureolin",code:"PY40",featured:!1},{name:"Cobalt Yellow",code:"PY40",featured:!1},{name:"Hansa Yellow Medium",code:"PY97",featured:!1},{name:"Arylide Yellow",code:"PY74",featured:!1},{name:"Yellow Oxide",code:"PY42",featured:!1},{name:"Diarylide Yellow",code:"PY83",featured:!1},{name:"Bismuth Yellow",code:"PY184",featured:!1},{name:"Madder Lake",code:"NR9",featured:!1}];function ee(){return e.jsxs("section",{className:"mt-12 max-w-2xl border-t border-border pt-8",children:[e.jsx("div",{className:"font-mono-tech text-[10px] uppercase tracking-[0.2em] text-primary mb-3",children:"How matches are determined"}

1),e.jsxs("div",{className:"space-y-3 text-foreground/75 leading-relaxed text-[15px]",children:[e.jsxs("p",{children:["The Pigment Finder matches by ",e.jsx("strong",{children:"Colour Index pigment code"})," — the standard international identifier for a pigment's chemical family and type (for example, PB29 for ultramarine, PR108 for cadmium red). A colour name you enter is resolved to its Colour Index code through a curated common-name index, then the live Michael Harding oil and watercolour catalogue is read to show every colour built on that pigment."]}),e.jsxs("p",{children:["A pigment match means the same Colour Index pigment. It is ",e.jsx("strong",{children:"not an exact colour match"}),": the binder (linseed oil vs gum arabic), the grind and the pigment load all affect how a pigment appears and handles, so two paints sharing a pigment can look and behave differently. Treat the result as a suggested starting point built on shared pigment chemistry, not a like-for-like replacement."]})]})]})}function ae({view:o,query:r,mediumWord:m,otherWord:P}){if(!o||!r)return null;if(o.type==="name"&&r.matches){const s=r.matches.map(c=>c.name);return e.jsxs("div",{className:"mt-8 max-w-2xl border-l-2 border-primary pl-5",children:[e.jsxs("p",{className:"text-foreground/80 leading-relaxed text-[15px]",children:["You searched for ",e.jsx("strong",{children:r.q}),". Michael Harding makes"," ",e.jsxs("strong",{children:[r.matches.length," ",r.matches.length===1?"colour":"colours"]})," ","matching that name: ",s.join(", "),"."]}),e.jsx("p",{className:"text-foreground/60 leading-relaxed mt-2 text-sm",children:"This is a name match against the live catalogue, not a pigment or colour equivalence."})]})}if(o.type==="code"){const{code:s,info:c,here:l,there:n,makesIt:k}=o,h=c!=null&&c.commonName&&c.commonName!==s?c.commonName:null,p=((l==null?void 0:l.length)||0)+((n==null?void 0:n.length)||0);if(!k)return e.jsx("div",{className:"mt-8 max-w-2xl border-l-2 border-primary pl-5",children:e.jsxs("p",{className:"text-foreground/80 leading-relaxed text-[15px]",children:["You searched for ",e.jsx("strong",{children:s}),h?` (${h})`:"",". Michael Harding does not currently make an oil or watercolour colour built on this pigment."]})});const M=[...l||[],...n||[]].slice(0,6).map(L=>L.name),B=p>6?` and ${p-6} more`:"";return e.jsxs("div",{className:"mt-8 max-w-2xl border-l-2 border-primary pl-5",children:[e.jsxs("p",{className:"text-foreground/80 leading-relaxed text-[15px]",children:["You searched for ",e.jsx("strong",{children:s}),h?` (${h})`:"",". Michael Harding makes ",e.jsxs("strong",{children:[p," ",p===1?"colour":"colours"]})," built on this pigment:"," ",M.join(", "),B,"."]}),((l==null?void 0:l.length)||0)>0&&((n==null?void 0:n.length)||0)>0&&e.jsxs("p",{className:"text-foreground/70 leading-relaxed mt-2 text-sm",children:[l.length," in the ",m," range and ",n.length," in the ",P," range."]}),e.jsx("p",{className:"text-foreground/60 leading-relaxed mt-2 text-sm",children:"This is a pigment match (same Colour Index code), not an exact colour match — binder, grind and pigment load affect the result."})]})}return null}const j={oil:"Oil Colour",watercolour:"Watercolour"};function ce(){const{mediumKey:o,setMedium:r}=Z(),m=o==="watercolour"?"watercolour":"oil",P=o==="watercolour"?"oil":"watercolour",s=P==="watercolour"?"watercolour":"oil",[c,l]=w.useState(""),[n,k]=w.useState(""),[h]=q();w.useEffect(()=>{const t=h.get("q");t&&(l(t),k(G(t)))},[h]);const{data:p,isLoading:M}=A({queryKey:["products",j.oil],queryFn:()=>T.entities.Product.filter({category:j.oil},"-created_date",500)}),{data:B,isLoading:L}=A({queryKey:["products",j.watercolour],queryFn:()=>T.entities.Product.filter({category:j.watercolour},"-created_date",500)}),F=M||L,C=w.useMemo(()=>p||[],[p]),R=w.useMemo(()=>B||[],[B]),V=o==="watercolour"?R:C,O=o==="watercolour"?C:R,G=t=>{const N=t.match(/\b([A-Za-z]{2,3}\d+(\.\d+)?)\b/);if(N)return{kind:"code",code:Y(N[1])};const y=t.trim();if(!y)return{kind:"none"};const x=f=>f.toLowerCase().replace(/['’]/g,"").replace(/[^a-z0-9]+/g," ").replace(/\s+/g," ").trim(),u=x(y);if(!u)return{kind:"none"};const i=[...C,...R].filter(f=>{if(!f.name)return!1;const g=x(f.name);return g.includes(u)||g.length>=3&&u.includes(g)});if(i.length)return{kind:"name",q:y,matches:i};const d=S.find(f=>x(f.name)===u);if(d)return{kind:"code",code:Y(d.code)};const b=S.find(f=>{const g=x(f.name);return g.includes(u)||g.length>=3&&u.includes(g)});return b?{kind:"code",code:Y(b.code)}:{kind:"none"}},W=t=>{t.preventDefault(),k(G(c))},H=t=>{l(t.name),k({kind:"code",code:Y(t.code)})},a=w.useMemo(()=>

1{if(!n||n.kind==="none")return{type:"idle"};if(n.kind==="name"){const i=n.matches.filter(b=>b.category===j[o]),d=n.matches.filter(b=>b.category===j[P]);return{type:"name",here:i,there:d,info:null,code:null}}const t=n.code,N=i=>_(i.pigment_code).some(d=>d===t||d.startsWith(`${t}.`)),y=V.filter(N).sort((i,d)=>v(i)-v(d)),x=O.filter(N).sort((i,d)=>v(i)-v(d)),u=y.length>0||x.length>0;return{type:"code",code:t,here:y,there:x,makesIt:u,info:K(t)}},[n,V,O,o,P]),$=F&&(!C.length||!R.length);return e.jsxs("section",{className:"pt-32 md:pt-40 pb-24 md:pb-32 bg-background min-h-screen",children:[e.jsx(D,{title:"Pigment Finder",description:`Find the Michael Harding ${m} colour built on any Colour Index pigment. Search by pigment code (e.g. PB29) or a colour name.`,jsonLd:{"@context":"https://schema.org","@type":"WebApplication",name:"Michael Harding Pigment Finder",applicationCategory:"ArtApplication",description:`Find the Michael Harding ${m} colour built on any Colour Index pigment by code or colour name.`}}),e.jsxs("div",{className:"mx-auto max-w-[1400px] px-6 md:px-10",children:[e.jsx("div",{className:"font-mono-tech text-[10px] uppercase tracking-[0.2em] text-primary mb-4",children:"Pigment-Matched"}),e.jsx("h1",{className:"font-display text-[clamp(2.5rem,7vw,5.5rem)] leading-[0.92] font-medium tracking-tight",children:"Pigment Finder"}),e.jsx("div",{className:"w-24 h-1 bg-primary mt-4"}),e.jsx("div",{className:"mt-6 mb-2",children:e.jsx(X,{mediumKey:o,onChange:r})}),e.jsxs("p",{className:"text-base text-foreground/70 mt-4 mb-10 max-w-2xl",children:["Type a pigment code (e.g. ",e.jsx("span",{className:"font-mono-tech",children:"PB29"}),") or a colour name, and we'll show the Michael Harding colours built on that pigment. Matches are read straight from our live oil and watercolour catalogue, so the answer always reflects what we actually make."]}),e.jsxs("form",{onSubmit:W,className:"relative max-w-xl mb-4",children:[e.jsx(Q,{className:"absolute left-4 top-1/2 -translate-y-1/2 w-4 h-4 text-foreground/40"}),e.jsx("input",{type:"text",value:c,onChange:t=>l(t.target.value),placeholder:"Try a colour name or a pigment code…",className:"w-full text-base bg-background border border-border pl-12 pr-32 py-3.5 text-foreground placeholder:text-foreground/40 focus:outline-none focus:border-foreground"}),e.jsxs("button",{type:"submit",className:"absolute right-2 top-1/2 -translate-y-1/2 flex items-center gap-1.5 font-mono-tech text-[11px] uppercase tracking-[0.18em] bg-primary text-background px-4 py-2.5 hover:bg-primary/90 transition-colors",children:["Find ",e.jsx(U,{className:"w-3.5 h-3.5"})]})]}),e.jsx("div",{className:"flex flex-wrap gap-2 mb-12 max-w-3xl",children:S.filter(t=>t.featured!==!1).map(t=>e.jsx("button",{onClick:()=>H(t),className:"font-mono-tech text-[11px] uppercase tracking-[0.1em] border border-border px-3 py-1.5 text-foreground/70 hover:border-foreground hover:text-foreground transition-colors",children:t.name},t.name))}),e.jsx(ee,{}),n&&n.kind!=="none"&&e.jsxs("div",{className:"border-t border-border pt-10",children:[e.jsx(ae,{view:a,query:n,mediumWord:m,otherWord:s}),a.type==="code"&&a.info&&e.jsxs("div",{className:"mb-8 max-w-2xl",children:[e.jsxs("p",{className:"font-mono-tech text-[11px] uppercase tracking-[0.2em] text-primary mb-1",children:["Matched pigment · ",a.code]}),e.jsx("h2",{className:"font-display text-2xl md:text-3xl font-medium",children:a.info.commonName!==a.code?a.info.commonName:a.code}),a.info.chemistry&&a.info.chemistry!=="-"&&e.jsx("p",{className:"text-foreground/70 mt-1",children:a.info.chemistry}),e.jsx(I,{to:`/pigments/${encodeURIComponent(a.code)}`,className:"link-underline font-mono-tech text-[11px] uppercase tracking-[0.18em] text-primary mt-3 inline-block",children:"View pigment encyclopaedia entry →"})]}),a.type==="name"&&e.jsxs("div",{className:"mb-8 max-w-2xl",children:[e.jsx("p",{className:"font-mono-tech text-[11px] uppercase tracking-[0.2em] text-primary mb-1",children:"Colour name match"}),e.jsx("h2",{className:"font-display text-2xl md:text-3xl font-medium capitalize",children:n.q})]}),$?e.jsx("div",{className:"py-16 text-center font-mono-tech text-[11px] uppercase tracking-[0.2em] text-muted-foreground",children:"Loading our catalogue…"}):a.type==="code"&&!a.makesIt?e.jsxs("div",{className:"py-16 text-center",children:[e.jsx("p",{className:"font-display text-2xl text-foreground

1/70 mb-2",children:"Not in our range"}),e.jsxs("p",{className:"text-foreground/50",children:["We don't currently make an oil or watercolour colour built on pigment ",a.code,". Try another code or browse the"," ",e.jsx(I,{to:"/pigments",className:"text-primary link-underline",children:"pigment encyclopaedia"}),"."]})]}):a.here.length===0?e.jsxs("div",{children:[e.jsxs("p",{className:"text-foreground/60 mb-6 max-w-2xl",children:["No ",m," colour uses ",a.type==="code"?`pigment ${a.code}`:"this name",", but we do make it in our ",s," range."]}),e.jsxs("button",{onClick:()=>r(P),className:"font-mono-tech text-[11px] uppercase tracking-[0.18em] text-primary link-underline mb-8",children:["Switch to ",s," →"]}),e.jsx(z,{products:a.there})]}):e.jsxs(e.Fragment,{children:[e.jsxs("p",{className:"font-mono-tech text-[11px] uppercase tracking-[0.15em] text-foreground/50 mb-6",children:[a.here.length," Michael Harding ",a.here.length===1?`${m} colour`:`${m} colours`,a.there.length>0&&a.type==="code"&&` · also ${a.there.length} in ${s}`]}),e.jsx(z,{products:a.here})]})]}),e.jsx(J,{className:"mt-16"})]})]})}function z({products:o}){return e.jsx("div",{className:"grid grid-cols-2 sm:grid-cols-3 lg:grid-cols-4 gap-x-4 gap-y-8 md:gap-x-6 md:gap-y-12",children:o.map(r=>e.jsx(E,{p:r},r.id))})}export{ce as default};