DEV Community

Cover image for Article 50 compliance in about 30 lines of code: a developer guide to the EU AI Act
Gatis Ozols
Gatis Ozols

Posted on

Article 50 compliance in about 30 lines of code: a developer guide to the EU AI Act

#ai #eu #javascript #typescript

Article 50 of the EU AI Act starts applying on 2 August 2026, 41 days out as I write this. If your product talks to users with AI, or generates content, you owe a transparency disclosure. This is the developer version: what the rule says, and how to satisfy the visible part of it with real code.

What Article 50 actually requires

Four sub-rules, which map to five cases you handle in code:

  • 50(1): AI that interacts with users must tell them it is AI. Chatbots, voice agents.
  • 50(2): AI generated text, image, audio or video must be marked, in a machine readable way. Your content features.
  • 50(3): emotion recognition and biometric categorisation must be disclosed to the people subject to them.
  • 50(4): deepfakes must be labelled as artificially generated.

The naive version, and why it fails an audit 

<div class="ai-notice">This chat is AI generated</div>
Enter fullscreen mode Exit fullscreen mode

Three problems. It is English only, and Article 50 has to inform the user, across 24 official EU languages. It drifts, because someone refactors the component in three weeks and the line is gone and nobody notices. And it does nothing machine readable.

The free version: disclos-sdk

One script tag renders a compliant notice that auto detects the visitor's language across all 24 EU languages. Free, no key, no build step.

<script src="https://www.disclos.eu/sdk/disclos.js" data-disclos="chatbot"></script>
Enter fullscreen mode Exit fullscreen mode

data-disclos accepts chatbot, generated, deepfake, emotion, biometric, the five cases above.

Want control, use the JavaScript API:

<script src="https://www.disclos.eu/sdk/disclos.js"></script>
<script>
  // inject a chatbot disclosure into your chat container
  Disclos.chatbot({ target: "#chat" });

  // generated-content notice, forced to German
  Disclos.generated({ target: "#post", lang: "de" });

  // or grab the raw text and render it in your own component
  const notice = Disclos.text("deepfake", "fr");
</script>
Enter fullscreen mode Exit fullscreen mode

Methods: Disclos.chatbot/generated/deepfake/emotion/biometric(opts), Disclos.show(type, opts), Disclos.build(type, opts) which returns the element, Disclos.text(type, lang), plus Disclos.langs and Disclos.version.

In a React app, the text method keeps it inside your own markup:

function AiNotice({ type = "chatbot", lang }) {
  return <p className="ai-notice">{Disclos.text(type, lang)}</p>;
}
Enter fullscreen mode Exit fullscreen mode

Script-tag options:

attribute purpose default
data-target CSS selector to inject into top of body
data-lang force a language, e.g. de auto detect
data-append append instead of prepend false
data-attribution show the disclos.eu link true
data-note show the "not legal advice" line true

Prefer to vendor it instead of loading from our domain? It is on npm, a single file with no dependencies:

npm i disclos-sdk
Enter fullscreen mode Exit fullscreen mode

Install it, serve disclos.js from your own CDN, point the script tag at your copy. Same behaviour, your infrastructure.

The five types, mapped to the rule

type Article 50 sub-rule use when
chatbot 50(1) users interact with an AI (chat, voice agent)
generated 50(2) you publish AI generated text, image, audio or video
deepfake 50(4) content resembles real people, places or events
emotion 50(3) you run emotion recognition
biometric 50(3) you categorise people by biometric traits

The machine readable half of 50(2)

The SDK handles the visible, multilingual notice, which is the part most teams fail on language. 50(2) also wants AI generated media marked in a machine readable way. For images, audio and video that means provenance metadata, with C2PA the expected route. The SDK does not stamp your media files, so treat provenance as a separate step in your generation pipeline.

Compliance answers inside your editor

If you would rather ask than read the law, there are two free remote MCP servers:

  • disclos-eu-ai-act, connector mcp.disclos.eu. Classify any AI system, get the risk tier, obligations and deadlines, cited to the articles. github.com/GatisOzols/disclos-eu-ai-act
  • disclos-article-50, connector article50.disclos.eu. Generate the exact disclosure text and the machine readable marker, and work out which sub-rules apply. Run it locally with npx -y github:GatisOzols/disclos-article-50. github.com/GatisOzols/disclos-article-50

Add either in Claude or Cursor under Settings, Connectors, Add custom connector. They are connectors, not web pages, so do not open them in a browser.

Make sure it stays shipped

The disclosure being live the day you deploy is not the same as it being live after four more deploys. Monitoring closes that gap: it checks your live site every week, in every language you serve, and gives you a public verification page and a signed audit trail.

Disclos Monitoring verification page for a live site

Free audit for 10 teams

Beyond the free tools, I am auditing 10 SaaS products properly before the deadline. A full EU AI Act audit, normally 997 euros, free, plus up to six months of Monitoring. 41 days to 2 August 2026, 10 seats.

Apply: https://www.disclos.eu/free-audit

General information, not legal advice.

Top comments (0)