{"compiledCode":"\"use strict\";Object.defineProperty(exports, \"__esModule\", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }var _react = require('react'); var _react2 = _interopRequireDefault(_react);\n\n function DevelopersPage() {\n  return (\n    _react2.default.createElement('div', { className: \"pd-page pd-developers reading-picdrome\"  ,}\n      , _react2.default.createElement('style', null, \"\\n.reading-picdrome{--reading-ground:var(--c1gb4l3-runtime-bg, #f6f1e8);--reading-ink:var(--c1gb4l3-runtime-text, #2d3834);--reading-accent:var(--c1gb4l3-runtime-accent, #536956);--reading-soft:var(--c1gb4l3-runtime-panel, #e1e7d9);max-width:1120px!important;width:100%;margin:0 auto!important;padding:26px 40px 80px!important;background:var(--reading-ground)!important;color:var(--reading-ink)!important;font:16px/1.75 var(--c1gb4l3-font-body, Arial, sans-serif)!important;overflow-wrap:anywhere}\\n.reading-picdrome,.reading-picdrome *{box-sizing:border-box;min-width:0}\\n.reading-picdrome .reading-masthead{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:0 0 24px;margin:0 0 44px;border-bottom:1px solid var(--reading-accent)}\\n.reading-picdrome .reading-brand{font:24px/1.25 var(--c1gb4l3-font-heading, Georgia, serif);letter-spacing:-.5px;text-decoration:none;color:var(--reading-ink)!important}\\n.reading-picdrome .reading-navigation{display:flex;gap:12px 24px;flex-wrap:wrap;font-size:13px}.reading-picdrome .reading-navigation a{padding:10px 0}\\n.reading-picdrome a{color:var(--reading-accent);text-underline-offset:4px;text-decoration-thickness:1px}\\n.reading-picdrome :is(a,button,input,select,textarea,summary,[tabindex]):focus-visible{outline:3px solid var(--reading-accent)!important;outline-offset:4px}\\n.reading-picdrome h1{font:clamp(34px,4.8vw,56px)/1.12 var(--c1gb4l3-font-heading, Georgia, serif)!important;color:var(--reading-ink)!important;letter-spacing:-1.5px;max-width:23ch;margin:0 0 25px!important;overflow-wrap:normal}\\n.reading-picdrome h2{font:clamp(25px,3vw,34px)/1.22 var(--c1gb4l3-font-heading, Georgia, serif)!important;color:var(--reading-ink)!important;letter-spacing:-.6px;margin:42px 0 18px!important}\\n.reading-picdrome h3{font-size:19px!important;line-height:1.4!important;color:var(--reading-ink);margin:20px 0 10px}\\n.reading-picdrome p{max-width:78ch;line-height:1.8!important;margin-bottom:18px}\\n.reading-picdrome :is(.lead,.lede,.intro){font-size:18px!important;line-height:1.75!important;max-width:70ch}\\n.reading-picdrome :is(ul,ol){line-height:1.8;padding-left:24px}.reading-picdrome li{margin:7px 0}\\n.reading-picdrome .reading-hero{background:var(--reading-soft)!important;border-radius:4px!important;border:0!important;padding:40px 34px!important;margin-bottom:38px!important}.reading-picdrome .reading-hero h1{max-width:23ch}.reading-picdrome :is(section,article,nav){scroll-margin-top:24px}.reading-picdrome > section{margin-top:34px!important}\\n.reading-picdrome :is(pre,code){font-family:ui-monospace,SFMono-Regular,Consolas,monospace;white-space:pre-wrap;overflow-wrap:anywhere}.reading-picdrome pre{padding:20px;overflow:auto;background:var(--reading-soft);border-radius:4px}\\n.reading-picdrome .reading-table{overflow-x:auto;max-width:100%;margin:24px 0;border:1px solid var(--reading-accent);border-radius:4px}.reading-picdrome .reading-table table{width:100%;min-width:560px;margin:0!important;border-collapse:collapse!important;font-size:14px;line-height:1.6}.reading-picdrome :is(th,td){text-align:left;padding:14px 16px!important;border-bottom:1px solid var(--reading-soft);vertical-align:top}.reading-picdrome th{background:var(--reading-soft)!important;color:var(--reading-ink)!important;font-weight:700}\\n.reading-picdrome :is(button,summary){min-height:44px;cursor:pointer;font:inherit}.reading-picdrome summary{padding:12px 0;font-weight:600}.reading-picdrome details{border-top:1px solid var(--reading-accent);padding:8px 0;margin:10px 0}\\n.reading-picdrome :is(input,select,textarea){max-width:100%;min-height:44px;font:inherit;line-height:1.5;padding:11px 12px;border:1px solid var(--reading-accent);border-radius:4px;background:var(--reading-ground);color:var(--reading-ink)}\\n.reading-picdrome a[style*=\\\"background\\\"]{display:inline-flex!important;align-items:center;justify-content:center;min-height:44px;padding:12px 18px!important;background:var(--reading-ink)!important;color:var(--reading-ground)!important;border-color:var(--reading-ink)!important;border-radius:4px!important;font-size:14px!important;text-decoration:none!important;line-height:1.5!important}\\n.reading-picdrome :is(img,svg,video,iframe){max-width:100%}.reading-picdrome .reading-navigation a:hover{text-decoration-thickness:2px}\\n@media(max-width:720px){.reading-picdrome{padding:22px 22px 56px!important;font-size:16px!important}.reading-picdrome .reading-masthead{align-items:flex-start;gap:20px;margin-bottom:34px}.reading-picdrome .reading-brand{font-size:21px;max-width:12ch}.reading-picdrome .reading-navigation{justify-content:flex-end;gap:4px 14px;max-width:170px;font-size:12px}.reading-picdrome h1{font-size:36px!important;letter-spacing:-.8px}.reading-picdrome h2{font-size:28px!important;margin-top:32px!important}.reading-picdrome section[style*=\\\"grid\\\"],.reading-picdrome div[style*=\\\"grid-template-columns\\\"]{grid-template-columns:1fr!important}.reading-picdrome section[style*=\\\"padding\\\"],.reading-picdrome article[style*=\\\"padding\\\"]{padding-left:18px!important;padding-right:18px!important}}\\n\\n.reading-picdrome a:is([class*=\\\"btn\\\"],[class*=\\\"button\\\"],[class*=\\\"cta\\\"]){background:var(--c1gb4l3-runtime-text, #2d3834)!important;color:var(--c1gb4l3-runtime-bg, #f6f1e8)!important;border-color:var(--c1gb4l3-runtime-text, #2d3834)!important;min-height:44px;display:inline-flex;align-items:center;padding:12px 18px;text-decoration:none}\\n\\n.reading-picdrome{width:100%;max-width:100%!important;min-width:0;box-sizing:border-box} .reading-picdrome .reading-masthead,.reading-picdrome .masthead{display:none} .reading-picdrome .reading-brand{font-family:var(--c1gb4l3-font-heading,Arial,sans-serif)} .reading-picdrome h1{font-weight:750!important;letter-spacing:-.045em} .reading-picdrome h2{font-weight:650!important} .reading-picdrome :is(code,pre,.eyebrow,.number){font-family:var(--c1gb4l3-font-mono,monospace)}\\n\")\n      , _react2.default.createElement('header', { className: \"reading-masthead\",}, _react2.default.createElement('a', { className: \"reading-brand\", href: \"/\",}, \"Picdrome\"), _react2.default.createElement('nav', { className: \"reading-navigation\", 'aria-label': \"Reading navigation\" ,}, _react2.default.createElement('a', { href: \"/\",}, \"Home\"), _react2.default.createElement('a', { href: \"/use-cases\",}, \"Start reading\" ), _react2.default.createElement('a', { href: \"/ai-image-disclosure\",}, \"Standards\")))\n\n      , _react2.default.createElement('style', null, \"\\n        .reading-picdrome.pd-developers {\\n          --pd-ink:var(--c1gb4l3-runtime-text, #2d3834); --pd-slate:var(--c1gb4l3-runtime-text, #2d3834); --pd-muted:var(--c1gb4l3-runtime-muted, #59635c);\\n          --pd-line:var(--c1gb4l3-runtime-border, #d6d5c9); --pd-bg:var(--c1gb4l3-runtime-bg, #f6f1e8); --pd-soft:var(--c1gb4l3-runtime-panel, #ece6dc);\\n          --pd-brand:var(--c1gb4l3-runtime-accent, #536956); --pd-brand-dark:var(--c1gb4l3-runtime-accent, #536956); --pd-brand-soft:var(--c1gb4l3-runtime-accent-soft, #e4eadf);\\n          --pd-accent:var(--c1gb4l3-runtime-accent, #536956); --pd-warn:var(--c1gb4l3-runtime-text, #2d3834); --pd-warn-bg:var(--c1gb4l3-runtime-panel, #ece6dc);\\n          max-width:900px; margin:0 auto; padding:2rem 1.25rem 4rem;\\n          line-height:1.6; color:var(--pd-ink); background:var(--pd-bg);\\n          font-family:-apple-system,BlinkMacSystemFont,\\\"Segoe UI\\\",Roboto,Helvetica,Arial,sans-serif;\\n        }\\n        .reading-picdrome.pd-developers h1 { font-size:2rem; line-height:1.2; margin:0 0 0.5rem; }\\n        .reading-picdrome.pd-developers h2 { font-size:1.4rem; margin:2.5rem 0 0.6rem; }\\n        .reading-picdrome.pd-developers h3 { font-size:1.08rem; margin:1.4rem 0 0.4rem; }\\n        .reading-picdrome.pd-developers p { margin:0.6rem 0; }\\n        .reading-picdrome.pd-developers a { color:var(--pd-brand-dark); text-decoration:underline; }\\n        .reading-picdrome.pd-developers .pd-lede { font-size:1.18rem; color:var(--pd-muted); margin:0.4rem 0 1.2rem; }\\n        .reading-picdrome.pd-developers .pd-grid {\\n          display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr));\\n          gap:1rem; margin:1.2rem 0;\\n        }\\n        .reading-picdrome.pd-developers .pd-card {\\n          border:1px solid var(--pd-line); border-radius:12px;\\n          padding:1rem 1.1rem; background:var(--pd-bg);\\n        }\\n        .reading-picdrome.pd-developers .pd-card h3 { margin-top:0; }\\n        .reading-picdrome.pd-developers .pd-card p { color:var(--pd-muted); font-size:0.95rem; margin:0.3rem 0 0; }\\n        .reading-picdrome.pd-developers .pd-callout {\\n          border-left:4px solid var(--pd-brand); background:var(--pd-brand-soft);\\n          border-radius:8px; padding:1rem 1.1rem; margin:1.2rem 0;\\n        }\\n        .reading-picdrome.pd-developers .pd-callout--warn {\\n          border-left-color:var(--pd-warn); background:var(--pd-warn-bg);\\n        }\\n        .reading-picdrome.pd-developers .pd-callout strong { color:var(--pd-ink); }\\n        .reading-picdrome.pd-developers .pd-cta-row { display:flex; flex-wrap:wrap; gap:0.75rem; margin:1.2rem 0; }\\n        .reading-picdrome.pd-developers .pd-btn {\\n          background:var(--pd-brand); color:var(--c1gb4l3-runtime-action-fg, #ffffff); border-radius:10px;\\n          padding:0.7rem 1.1rem; font-weight:600; text-decoration:none; display:inline-block;\\n        }\\n        .reading-picdrome.pd-developers .pd-btn:hover { background:var(--pd-brand-dark); }\\n        .reading-picdrome.pd-developers .pd-btn--ghost {\\n          background:transparent; border:1px solid var(--pd-line); color:var(--pd-ink);\\n        }\\n        .reading-picdrome.pd-developers ul { padding-left:1.2rem; }\\n        .reading-picdrome.pd-developers ul li { margin:0.35rem 0; }\\n        .reading-picdrome.pd-developers .pd-fields { list-style:none; padding-left:0; margin:1rem 0; }\\n        .reading-picdrome.pd-developers .pd-fields li {\\n          padding:0.45rem 0; border-bottom:1px solid var(--pd-line);\\n          font-size:0.97rem;\\n        }\\n        .reading-picdrome.pd-developers .pd-fields li:last-child { border-bottom:none; }\\n        .reading-picdrome.pd-developers .pd-fields code {\\n          background:var(--pd-soft); border:1px solid var(--pd-line); border-radius:6px;\\n          padding:0.05rem 0.35rem; font-size:0.9rem; color:var(--pd-brand-dark);\\n        }\\n        .reading-picdrome.pd-developers pre {\\n          background:var(--pd-soft); border:1px solid var(--pd-line); border-radius:10px;\\n          padding:1rem 1.1rem; overflow-x:auto; font-size:0.88rem; line-height:1.5;\\n          color:var(--pd-ink); margin:1rem 0;\\n        }\\n        .reading-picdrome.pd-developers pre code { font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; }\\n        .reading-picdrome.pd-developers .pd-faq h3 { margin-top:1.6rem; }\\n        .reading-picdrome.pd-developers .pd-meta { font-size:0.85rem; color:var(--pd-muted); margin:0.2rem 0 1.2rem; }\\n      \\n.reading-picdrome{width:100%;max-width:100%!important;min-width:0;box-sizing:border-box} .reading-picdrome .reading-masthead,.reading-picdrome .masthead{display:none} .reading-picdrome .reading-brand{font-family:var(--c1gb4l3-font-heading,Arial,sans-serif)} .reading-picdrome h1{font-weight:750!important;letter-spacing:-.045em} .reading-picdrome h2{font-weight:650!important} .reading-picdrome :is(code,pre,.eyebrow,.number){font-family:var(--c1gb4l3-font-mono,monospace)}\\n\")\n\n        , _react2.default.createElement('h1', null, \"Picdrome integration design guide\"   )\n        , _react2.default.createElement('p', { className: \"pd-lede\",}, \"Design a reliable image workflow around structured metadata, accessible alt text, AI-image disclosure, and each image's source license.\"                 )\n      , _react2.default.createElement('div', { className: \"pd-callout\",}, _react2.default.createElement('p', null, _react2.default.createElement('strong', null, \"Scope:\"), \" This page is an integration-design reference, not documentation for a live Picdrome API. It makes no claims about endpoints, authentication, uptime, limits, or pricing.\"                        ))\n      , _react2.default.createElement('section', { 'aria-labelledby': \"who-this-is-for\",}\n        , _react2.default.createElement('h2', { id: \"who-this-is-for\",}, \"Who this is for\"   )\n        , _react2.default.createElement('p', null, \"This hub is for developers designing an image record for a template or CMS, teams behind AI website builders, and agents that need to preserve source, alt text, disclosure, and license information together. If you build websites by hand, start with the \"                                          , _react2.default.createElement('a', { href: \"/use-cases\",}, \"use-case guides\" ), \" and \"  , _react2.default.createElement('a', { href: \"/packs\",}, \"image packs\" ), \".\")\n      )\n      , _react2.default.createElement('section', { 'aria-labelledby': \"a-practical-image-record\",}\n        , _react2.default.createElement('h2', { id: \"a-practical-image-record\",}, \"A practical image record\"   )\n        , _react2.default.createElement('p', null, \"Use a record like this inside your own CMS or application. It is an illustrative internal schema, not a response from a Picdrome endpoint.\"                       )\n        , _react2.default.createElement('ul', null\n          , _react2.default.createElement('li', null, _react2.default.createElement('code', null, \"name\"), \" — a plain, human-readable title for the image.\"        )\n          , _react2.default.createElement('li', null, _react2.default.createElement('code', null, \"slug\"), \" — the stable identifier used in URLs and lookups.\"         )\n          , _react2.default.createElement('li', null, _react2.default.createElement('code', null, \"category\"), \" — the subject/style grouping the image belongs to.\"        )\n          , _react2.default.createElement('li', null, _react2.default.createElement('code', null, \"tags\"), \" — descriptive keywords for filtering and matching.\"       )\n          , _react2.default.createElement('li', null, _react2.default.createElement('code', null, \"alt_text\"), \" — descriptive alt text you can drop straight into markup.\"          )\n          , _react2.default.createElement('li', null, _react2.default.createElement('code', null, \"suggested_use_cases\"), \" — where the image fits, such as a homepage hero or an about-page section.\"              )\n          , _react2.default.createElement('li', null, _react2.default.createElement('code', null, \"related_images\"), \" — slugs of images in a similar style or subject.\"          )\n          , _react2.default.createElement('li', null, _react2.default.createElement('code', null, \"license\"), \" — a machine-readable license object describing usage terms and whether attribution applies.\"            )\n        )\n        , _react2.default.createElement('p', null, \"Keeping the \"  , _react2.default.createElement('code', null, \"license\"), \" object beside the image record prevents usage rights from being separated from the asset during import, transformation, or publishing.\"                   )\n        , _react2.default.createElement('pre', null, _react2.default.createElement('code', null, \"{\\n  \\\"name\\\": \\\"Calm coastal workspace\\\",\\n  \\\"slug\\\": \\\"calm-coastal-workspace\\\",\\n  \\\"category\\\": \\\"workspaces\\\",\\n  \\\"tags\\\": [\\\"desk\\\", \\\"coastal\\\", \\\"minimal\\\", \\\"overlay-friendly\\\"],\\n  \\\"alt_text\\\": \\\"Tidy desk by a bright window with a coastal view\\\",\\n  \\\"suggested_use_cases\\\": [\\\"homepage-hero\\\", \\\"about-section\\\", \\\"blog-header\\\"],\\n  \\\"related_images\\\": [\\\"sunlit-home-office\\\", \\\"minimal-studio-desk\\\"],\\n  \\\"license\\\": {\\n    \\\"summary\\\": \\\"Read the current license at the image source before publishing.\\\",\\n    \\\"attribution_required\\\": null,\\n    \\\"ai_generated\\\": true,\\n    \\\"terms_url\\\": \\\"(link to the current license at the image source)\\\"\\n  }\\n}\"))\n        , _react2.default.createElement('div', { className: \"pd-callout\",}, _react2.default.createElement('p', null, _react2.default.createElement('strong', null, \"Honest note.\" ), \" If an image is AI-generated, preserve that fact as structured metadata and surface it wherever your product needs to explain image provenance. See the \"                         , _react2.default.createElement('a', { href: \"/ai-image-disclosure\",}, \"AI image disclosure guide\"   ), \".\"))\n      )\n      , _react2.default.createElement('section', { 'aria-labelledby': \"available-implementation-guides\",}\n        , _react2.default.createElement('h2', { id: \"available-implementation-guides\",}, \"Available implementation guides\"  )\n        , _react2.default.createElement('p', null, \"These published articles cover the design decisions without pretending that Picdrome exposes a live service:\"              )\n        , _react2.default.createElement('div', { className: \"pd-grid\",}\n          , _react2.default.createElement('div', { className: \"pd-card\",}, _react2.default.createElement('h3', null, _react2.default.createElement('a', { href: \"/blog/add-website-images-with-an-api\",}, \"Add website images with an API\"     )), _react2.default.createElement('p', null, \"A vendor-neutral workflow for fetching, validating, and rendering image records.\"         ))\n          , _react2.default.createElement('div', { className: \"pd-card\",}, _react2.default.createElement('h3', null, _react2.default.createElement('a', { href: \"/blog/image-metadata-for-builders\",}, \"Image metadata for builders\"   )), _react2.default.createElement('p', null, \"Fields worth preserving and why they matter.\"      ))\n          , _react2.default.createElement('div', { className: \"pd-card\",}, _react2.default.createElement('h3', null, _react2.default.createElement('a', { href: \"/blog/search-images-by-use-case-api\",}, \"Search images by use case\"    )), _react2.default.createElement('p', null, \"A search-model design based on placement and business context.\"        ))\n          , _react2.default.createElement('div', { className: \"pd-card\",}, _react2.default.createElement('h3', null, _react2.default.createElement('a', { href: \"/blog/api-image-license-compliance\",}, \"Image API license compliance\"   )), _react2.default.createElement('p', null, \"How to keep license information attached to an asset.\"        ))\n          , _react2.default.createElement('div', { className: \"pd-card\",}, _react2.default.createElement('h3', null, _react2.default.createElement('a', { href: \"/blog/image-api-best-practices\",}, \"Image API best practices\"   )), _react2.default.createElement('p', null, \"Caching, errors, fallbacks, and change handling.\"     ))\n          , _react2.default.createElement('div', { className: \"pd-card\",}, _react2.default.createElement('h3', null, _react2.default.createElement('a', { href: \"/blog/ai-website-builders-images\",}, \"AI website builders and images\"    )), _react2.default.createElement('p', null, \"Selection and disclosure patterns for automated builders.\"      ))\n        )\n        , _react2.default.createElement('div', { className: \"pd-cta-row\",}\n          , _react2.default.createElement('a', { className: \"pd-btn\", href: \"/blog/image-metadata-for-builders\",}, \"Read the metadata guide\"   )\n          , _react2.default.createElement('a', { className: \"pd-btn pd-btn--ghost\" , href: \"/blog/api-image-license-compliance\",}, \"License compliance\" )\n        )\n      )\n      , _react2.default.createElement('section', { 'aria-labelledby': \"for-ai-website-builders-and-agents\",}\n        , _react2.default.createElement('h2', { id: \"for-ai-website-builders-and-agents\",}, \"For AI website builders and agents\"     )\n        , _react2.default.createElement('p', null, \"An agent building a page needs a predictable record rather than an unlabeled image file. Design the workflow so retrieval, placement, provenance, and licensing stay together.\"                         )\n        , _react2.default.createElement('p', null, \"A typical flow looks like this:\"     )\n        , _react2.default.createElement('ul', null\n          , _react2.default.createElement('li', null, \"The agent knows it needs a hero image for, say, a coffee-shop homepage.\"            )\n          , _react2.default.createElement('li', null, \"It searches an approved image source using a use case (\"          , _react2.default.createElement('code', null, \"homepage-hero\"), \") and business type (\"    , _react2.default.createElement('code', null, \"cafe\"), \").\")\n          , _react2.default.createElement('li', null, \"The integration normalizes each candidate into the record above, including alt text, suggested uses, provenance, and a \"                 , _react2.default.createElement('code', null, \"license\"), \" object.\" )\n          , _react2.default.createElement('li', null, \"The agent picks one, resolves \"     , _react2.default.createElement('code', null, \"license.attribution_required\"), \" from the current terms, and blocks publishing when the permission or attribution rule is unknown.\"               )\n        )\n        , _react2.default.createElement('p', null, \"Because the license travels with every image, an agent never has to download an asset and then separately discover whether it is allowed to use it. The deeper integration guide covers prompt patterns, fallbacks when no image matches, and how to surface licensing to end users.\"                                             )\n        , _react2.default.createElement('div', { className: \"pd-cta-row\",}\n          , _react2.default.createElement('a', { className: \"pd-btn\", href: \"/blog/ai-website-builders-images\",}, \"Read the AI-builder guide\"   )\n        )\n        , _react2.default.createElement('div', { className: \"pd-callout\",}, _react2.default.createElement('p', null, _react2.default.createElement('strong', null, \"Be honest about generated imagery.\"    ), \" When your product or agent shows an AI-generated image to an end user, describe it accurately: an AI-generated person is not a real, identifiable individual. Read the \"                            , _react2.default.createElement('a', { href: \"/ai-image-disclosure\",}, \"AI image disclosure guide\"   ), \" before you ship.\"   ))\n      )\n      , _react2.default.createElement('section', { 'aria-labelledby': \"license-compliance-and-best-practices\",}\n        , _react2.default.createElement('h2', { id: \"license-compliance-and-best-practices\",}, \"License compliance and best practices\"    )\n        , _react2.default.createElement('p', null, \"Use an image only as authorized by the current license at its source. The same rule applies whether a person selects an image or your own system imports it: keep the source and license with the record, resolve and honor any attribution requirement, and block publishing when the intended use is not clearly covered.\"                                                     )\n        , _react2.default.createElement('p', null, \"Do not describe an image as public domain, CC0, royalty-free, or unrestricted unless its current license expressly says so. This is not legal advice; the source's own license is the canonical text.\"                               )\n        , _react2.default.createElement('div', { className: \"pd-grid\",}\n          , _react2.default.createElement('div', { className: \"pd-card\",}, _react2.default.createElement('h3', null, _react2.default.createElement('a', { href: \"/blog/api-image-license-compliance\",}, \"License compliance\" )), _react2.default.createElement('p', null, \"How to preserve license metadata and pass terms through to users.\"          ))\n          , _react2.default.createElement('div', { className: \"pd-card\",}, _react2.default.createElement('h3', null, _react2.default.createElement('a', { href: \"/blog/image-api-best-practices\",}, \"Integration best practices\"  )), _react2.default.createElement('p', null, \"Guidance on caching, errors, fallbacks, and contract changes.\"       ))\n        )\n        , _react2.default.createElement('div', { className: \"pd-cta-row\",}\n          , _react2.default.createElement('a', { className: \"pd-btn\", href: \"/blog/api-image-license-compliance\",}, \"License compliance\" )\n          , _react2.default.createElement('a', { className: \"pd-btn pd-btn--ghost\" , href: \"/blog/image-api-best-practices\",}, \"Integration best practices\"  )\n        )\n      )\n      , _react2.default.createElement('section', { 'aria-labelledby': \"when-to-use-this\",}\n        , _react2.default.createElement('h2', { id: \"when-to-use-this\",}, \"When to use this\"   )\n        , _react2.default.createElement('p', null, \"Use this guide when you are defining an image record, importing assets into a CMS, or designing an agent that must retain accessibility, provenance, and licensing metadata. If you only need a handful of images, the \"                                    , _react2.default.createElement('a', { href: \"/use-cases\",}, \"use-case guides\" ), \" and \"  , _react2.default.createElement('a', { href: \"/packs\",}, \"packs\"), \" are the faster path.\"    )\n      )\n      , _react2.default.createElement('section', { 'aria-labelledby': \"related-reading\",}\n        , _react2.default.createElement('h2', { id: \"related-reading\",}, \"Related reading\" )\n        , _react2.default.createElement('ul', null\n          , _react2.default.createElement('li', null, _react2.default.createElement('a', { href: \"/blog/add-website-images-with-an-api\",}, \"Add website images with an API\"     ), \" — a walkthrough of pulling images into a site programmatically.\"          )\n          , _react2.default.createElement('li', null, _react2.default.createElement('a', { href: \"/blog/image-metadata-for-builders\",}, \"Image metadata for builders\"   ), \" — why structured fields like alt text and use cases matter when you automate.\"              )\n        )\n      )\n      , _react2.default.createElement('section', { 'aria-labelledby': \"frequently-asked-questions\", className: \"pd-faq\",}\n        , _react2.default.createElement('h2', { id: \"frequently-asked-questions\",}, \"Frequently asked questions\"  )\n        , _react2.default.createElement('h3', null, \"Does this page provide access to a live Picdrome API?\"         )\n        , _react2.default.createElement('p', null, \"No. This page provides vendor-neutral integration design guidance. It does not publish a base URL, authentication method, endpoint contract, service level, or pricing.\"                      )\n        , _react2.default.createElement('h3', null, \"Does Picdrome supply images for my application?\"      )\n        , _react2.default.createElement('p', null, \"Picdrome originals are available under the Picdrome License. This page does not document a public image-discovery API. Use images from a source whose current license covers your application, and keep that license with each record.\"                                  )\n        , _react2.default.createElement('h3', null, \"What metadata should my integration preserve?\"     )\n        , _react2.default.createElement('p', null, \"At minimum, preserve the source, name or identifier, category and tags, alt text, suggested use cases, related assets, AI-generated provenance, and a license record linking to the canonical terms. Adapt the illustrative field names to your own system.\"                                     )\n        , _react2.default.createElement('h3', null, \"How do I stay license-compliant when importing images?\"       )\n        , _react2.default.createElement('p', null, \"Keep a license record beside every imported image rather than assuming terms. Resolve any attribution requirement, surface the license summary where appropriate, and link to the source's current terms. If the current terms do not clearly authorize the intended use, block publishing and obtain written confirmation. See \"                                               , _react2.default.createElement('a', { href: \"/blog/api-image-license-compliance\",}, \"license compliance\" ), \". This is not legal advice.\"     )\n        , _react2.default.createElement('h3', null, \"Can an AI website builder use this design?\"       )\n        , _react2.default.createElement('p', null, \"Yes. An agent can search an approved source, normalize candidates into the record above, choose an image, and carry alt text, provenance, and licensing into the rendered page. The \"                             , _react2.default.createElement('a', { href: \"/blog/ai-website-builders-images\",}, \"AI-builder guide\" ), \" covers selection and fallback patterns.\"     )\n        , _react2.default.createElement('h3', null, \"Is the example schema a production contract?\"      )\n        , _react2.default.createElement('p', null, \"No. It is an illustrative internal model. Define and version your own contract, validate imported records, and test failure paths before production use.\"                      )\n      )\n      , _react2.default.createElement('section', { 'aria-labelledby': \"plain-language-summary\", className: \"pd-summary\",}\n        , _react2.default.createElement('h2', { id: \"plain-language-summary\",}, \"Plain-language summary\" )\n        , _react2.default.createElement('p', null, \"This page is a vendor-neutral design guide for keeping image metadata, alt text, AI-generated provenance, and license terms together inside a CMS, builder, or agent workflow. It does not document or promise a live Picdrome API. Use the illustrative record as a starting point for your own versioned contract, then read the \"                                                    , _react2.default.createElement('a', { href: \"/blog/image-metadata-for-builders\",}, \"metadata\"), \", \" , _react2.default.createElement('a', { href: \"/blog/search-images-by-use-case-api\",}, \"search\"), \", \" , _react2.default.createElement('a', { href: \"/blog/image-api-best-practices\",}, \"best-practices\"), \", and \"  , _react2.default.createElement('a', { href: \"/blog/api-image-license-compliance\",}, \"license-compliance\"), \" guides. Each image remains subject to its source's license. Not legal advice.\"            )\n        , _react2.default.createElement('div', { className: \"pd-cta-row\",}\n          , _react2.default.createElement('a', { className: \"pd-btn\", href: \"/blog/image-metadata-for-builders\",}, \"Read the metadata guide\"   )\n          , _react2.default.createElement('a', { className: \"pd-btn pd-btn--ghost\" , href: \"/blog/api-image-license-compliance\",}, \"License compliance\" )\n        )\n      )\n    )\n  );\n} exports.default = DevelopersPage;"}