@nuvui/barcodes 0.0.0-stage → 0.1.1

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Nuvraxis
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -1,3 +1,61 @@
-# Temporary Holding Version
+# @nuvui/barcodes
 
-This version is a temporary placeholder for this package. An operational version to replace this has been submitted for review and is awaiting a staged release.
+Barcodes and QR codes for [`@nuvui/react`](https://www.npmjs.com/package/@nuvui/react), drawn as SVG.
+
+This is early: the package is on npm as a 0.x version, and before 1.0 a minor version may rename or remove things. The [changelog](https://nuvui.nuvraxis.com/docs/changelog) says where one does, and the [repository README](https://github.com/Nuvraxis/nuvui#readme) says where things stand.
+
+```sh
+pnpm add @nuvui/barcodes @nuvui/react
+```
+
+```tsx
+import "@nuvui/react/styles.css";
+import "@nuvui/barcodes/styles.css";
+import { Barcode, QRCode } from "@nuvui/barcodes";
+
+export function Label() {
+  return (
+    <>
+      <Barcode value="590123412345" type="ean13" aria-label="Item 5901234" />
+      <QRCode
+        value="https://example.com/orders/1042"
+        aria-label="Open order 1042"
+      />
+    </>
+  );
+}
+```
+
+## What's in it
+
+- `Barcode`: bars for a scanner, in seventeen kinds. Code 128, GS1-128, Code 39 with and without its check character, EAN-13, EAN-8, UPC-A, UPC-E, ITF, ITF-14, MSI with and without its check digits, Codabar and Pharmacode. The value is written under the bars.
+- `QRCode`: a QR code at one of four levels of error correction, with room in the middle for a logo.
+- `QRCodeSwissCross`: the cross in the middle of a Swiss QR-bill's code.
+- `encodeBarcode` and `encodeQRCode`: the bars and the squares as data, or `null` for a value that can't be encoded. They need no browser, so they check a value in a form or on a server.
+- `saveCode`, `codeToBlob` and `codeToSvg`: a code on the page as an SVG or a PNG file.
+
+Each component has an entry of its own, `@nuvui/barcodes/barcode` and `@nuvui/barcodes/qrcode`, so a page with only QR codes doesn't carry every barcode's tables.
+
+## How it behaves
+
+Both components are SVG with no state and no `"use client"`. A server component renders them as markup, and no script is sent for them.
+
+A code is black on white in every theme, and where the browser forces colors. A scanner reads the difference between the two, and many don't read a light code on a dark ground. Two CSS variables change the colors if you have to.
+
+A value that can't be a code of its kind, such as a letter in an EAN-13, is drawn as an empty box with a line through it, or as your `fallback`. It's never drawn as a code that reads as something else.
+
+A code is a picture with a name. Give it `aria-label` for what it's for. Don't make a code the only way to get what it holds: put the text or a link next to it.
+
+## Dependencies
+
+`@nuvui/react` is a peer dependency: the codes take their colors and their font from its tokens.
+
+The bars are worked out by [JsBarcode](https://github.com/lindell/JsBarcode) and the squares by [uqr](https://github.com/unjs/uqr). Both are MIT, both are ordinary dependencies, and neither has dependencies of its own. Only their encoders are used. The drawing is done here.
+
+It's a package of its own so that an app which only wants buttons and dialogs doesn't have to install either.
+
+The docs are at https://nuvui.nuvraxis.com/docs/barcodes.
+
+## License
+
+MIT

package/dist/components/barcode/barcode.cjs

@@ -0,0 +1,94 @@
+const require_cx = require("../../utils/cx.cjs");
+const require_encode = require("./encode.cjs");
+let react = require("react");
+let react_jsx_runtime = require("react/jsx-runtime");
+//#region src/components/barcode/barcode.tsx
+const gap = 2;
+const emptyModules = 96;
+/**
+* A barcode, drawn as an SVG. It's a picture with a name: say what the
+* code is for with `aria-label`, and without one the name is the value.
+*
+* It has no state and needs no browser, so it can be a server component.
+*/
+const Barcode = (0, react.forwardRef)(function Barcode({ value, type = "code128", barWidth = 2, height = 64, quietZone = 10, showText = true, text, textSize = 14, flat = false, fallback, className, "aria-label": label, "aria-labelledby": labelledBy, ...props }, ref) {
+	const encoding = require_encode.encodeBarcode(value, type, {
+		text,
+		flat
+	});
+	if (!encoding && fallback !== void 0) return fallback;
+	const edge = quietZone * barWidth;
+	const width = ((encoding?.modules ?? emptyModules) + quietZone * 2) * barWidth;
+	const total = showText ? height + gap + textSize * 1.25 : height;
+	const guardHeight = showText ? height + gap + textSize / 2 : height;
+	const name = labelledBy ? void 0 : label ?? encoding?.text ?? value;
+	const root = {
+		ref,
+		width,
+		height: total,
+		viewBox: `0 0 ${width} ${total}`,
+		...props
+	};
+	if (!encoding) return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
+		...root,
+		role: "img",
+		"aria-label": name,
+		"aria-labelledby": labelledBy,
+		className: require_cx.cx("nuv-barcode", className),
+		"data-invalid": "",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("rect", {
+			className: "nuv-barcode__ground",
+			width: "100%",
+			height: "100%"
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
+			className: "nuv-barcode__mark",
+			d: `M0.5 0.5H${width - .5}V${total - .5}H0.5ZM0.5 ${total - .5}L${width - .5} 0.5`
+		})]
+	});
+	let bars = "";
+	const texts = [];
+	let start = edge;
+	for (const [index, part] of encoding.parts.entries()) {
+		const tall = part.guard ? guardHeight : height;
+		for (const run of part.bars.matchAll(/1+/g)) {
+			const x = start + run.index * barWidth;
+			const across = run[0].length * barWidth;
+			bars += `M${x} 0h${across}v${tall}h${-across}z`;
+		}
+		const end = start + part.bars.length * barWidth;
+		if (showText && part.text) {
+			const [x, anchor] = part.align === "start" ? [start, "start"] : part.align === "end" ? [end, "end"] : [(start + end) / 2, "middle"];
+			texts.push(/* @__PURE__ */ (0, react_jsx_runtime.jsx)("text", {
+				className: "nuv-barcode__text",
+				x,
+				y: height + gap + textSize,
+				textAnchor: anchor,
+				fontSize: textSize,
+				children: part.text
+			}, index));
+		}
+		start = end;
+	}
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
+		...root,
+		role: "img",
+		"aria-label": name,
+		"aria-labelledby": labelledBy,
+		className: require_cx.cx("nuv-barcode", className),
+		"data-type": encoding.type,
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("rect", {
+				className: "nuv-barcode__ground",
+				width: "100%",
+				height: "100%"
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
+				className: "nuv-barcode__bars",
+				d: bars
+			}),
+			texts
+		]
+	});
+});
+//#endregion
+exports.Barcode = Barcode;

package/dist/components/barcode/barcode.d.cts

@@ -0,0 +1,70 @@
+import { BarcodeType } from "./encode.cjs";
+import { ReactNode, SVGAttributes } from "react";
+//#region src/components/barcode/barcode.d.ts
+export interface BarcodeOwnProps {
+  /** What the barcode holds. */
+  value: string;
+  /**
+   * The kind of barcode. Each takes its own values: an EAN-13 is twelve
+   * or thirteen digits, a Code 39 is capitals, digits and a few signs,
+   * and a Code 128 is any ASCII text.
+   * @default "code128"
+   */
+  type?: BarcodeType;
+  /**
+   * The width of the narrowest bar, in pixels. A scanner needs it to be
+   * a whole number of the screen's or the printer's dots.
+   * @default 2
+   */
+  barWidth?: number;
+  /**
+   * The height of the bars, in pixels. The text is under that.
+   * @default 64
+   */
+  height?: number;
+  /**
+   * The empty space at each end, counted in narrowest bars. A scanner
+   * finds the barcode by it, and most kinds ask for ten.
+   * @default 10
+   */
+  quietZone?: number;
+  /**
+   * Writes the value under the bars, for someone to type when it won't
+   * scan.
+   * @default true
+   */
+  showText?: boolean;
+  /**
+   * Written under the bars in place of the value: the same number with
+   * spaces in it, say. An EAN or a UPC writes its own digits whatever
+   * this is.
+   */
+  text?: string;
+  /**
+   * The size of the text, in pixels.
+   * @default 14
+   */
+  textSize?: number;
+  /**
+   * An EAN or a UPC with every bar the same height and its digits in one
+   * line, in place of the usual look with taller bars at the ends and in
+   * the middle.
+   * @default false
+   */
+  flat?: boolean;
+  /**
+   * What's drawn when the value can't be a barcode of this kind. Without
+   * it there's an empty box with a line through it, which no scanner
+   * reads as anything.
+   */
+  fallback?: ReactNode;
+}
+export interface BarcodeProps extends BarcodeOwnProps, Omit<SVGAttributes<SVGSVGElement>, keyof BarcodeOwnProps> {}
+/**
+ * A barcode, drawn as an SVG. It's a picture with a name: say what the
+ * code is for with `aria-label`, and without one the name is the value.
+ *
+ * It has no state and needs no browser, so it can be a server component.
+ */
+export declare const Barcode: import("react").ForwardRefExoticComponent<BarcodeProps & import("react").RefAttributes<SVGSVGElement>>;
+//#endregion

package/dist/components/barcode/barcode.d.ts

@@ -0,0 +1,70 @@
+import { BarcodeType } from "./encode.js";
+import { ReactNode, SVGAttributes } from "react";
+//#region src/components/barcode/barcode.d.ts
+export interface BarcodeOwnProps {
+  /** What the barcode holds. */
+  value: string;
+  /**
+   * The kind of barcode. Each takes its own values: an EAN-13 is twelve
+   * or thirteen digits, a Code 39 is capitals, digits and a few signs,
+   * and a Code 128 is any ASCII text.
+   * @default "code128"
+   */
+  type?: BarcodeType;
+  /**
+   * The width of the narrowest bar, in pixels. A scanner needs it to be
+   * a whole number of the screen's or the printer's dots.
+   * @default 2
+   */
+  barWidth?: number;
+  /**
+   * The height of the bars, in pixels. The text is under that.
+   * @default 64
+   */
+  height?: number;
+  /**
+   * The empty space at each end, counted in narrowest bars. A scanner
+   * finds the barcode by it, and most kinds ask for ten.
+   * @default 10
+   */
+  quietZone?: number;
+  /**
+   * Writes the value under the bars, for someone to type when it won't
+   * scan.
+   * @default true
+   */
+  showText?: boolean;
+  /**
+   * Written under the bars in place of the value: the same number with
+   * spaces in it, say. An EAN or a UPC writes its own digits whatever
+   * this is.
+   */
+  text?: string;
+  /**
+   * The size of the text, in pixels.
+   * @default 14
+   */
+  textSize?: number;
+  /**
+   * An EAN or a UPC with every bar the same height and its digits in one
+   * line, in place of the usual look with taller bars at the ends and in
+   * the middle.
+   * @default false
+   */
+  flat?: boolean;
+  /**
+   * What's drawn when the value can't be a barcode of this kind. Without
+   * it there's an empty box with a line through it, which no scanner
+   * reads as anything.
+   */
+  fallback?: ReactNode;
+}
+export interface BarcodeProps extends BarcodeOwnProps, Omit<SVGAttributes<SVGSVGElement>, keyof BarcodeOwnProps> {}
+/**
+ * A barcode, drawn as an SVG. It's a picture with a name: say what the
+ * code is for with `aria-label`, and without one the name is the value.
+ *
+ * It has no state and needs no browser, so it can be a server component.
+ */
+export declare const Barcode: import("react").ForwardRefExoticComponent<BarcodeProps & import("react").RefAttributes<SVGSVGElement>>;
+//#endregion

package/dist/components/barcode/barcode.js

@@ -0,0 +1,94 @@
+import { cx } from "../../utils/cx.js";
+import { encodeBarcode } from "./encode.js";
+import { forwardRef } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/barcode/barcode.tsx
+const gap = 2;
+const emptyModules = 96;
+/**
+* A barcode, drawn as an SVG. It's a picture with a name: say what the
+* code is for with `aria-label`, and without one the name is the value.
+*
+* It has no state and needs no browser, so it can be a server component.
+*/
+const Barcode = forwardRef(function Barcode({ value, type = "code128", barWidth = 2, height = 64, quietZone = 10, showText = true, text, textSize = 14, flat = false, fallback, className, "aria-label": label, "aria-labelledby": labelledBy, ...props }, ref) {
+	const encoding = encodeBarcode(value, type, {
+		text,
+		flat
+	});
+	if (!encoding && fallback !== void 0) return fallback;
+	const edge = quietZone * barWidth;
+	const width = ((encoding?.modules ?? emptyModules) + quietZone * 2) * barWidth;
+	const total = showText ? height + gap + textSize * 1.25 : height;
+	const guardHeight = showText ? height + gap + textSize / 2 : height;
+	const name = labelledBy ? void 0 : label ?? encoding?.text ?? value;
+	const root = {
+		ref,
+		width,
+		height: total,
+		viewBox: `0 0 ${width} ${total}`,
+		...props
+	};
+	if (!encoding) return /* @__PURE__ */ jsxs("svg", {
+		...root,
+		role: "img",
+		"aria-label": name,
+		"aria-labelledby": labelledBy,
+		className: cx("nuv-barcode", className),
+		"data-invalid": "",
+		children: [/* @__PURE__ */ jsx("rect", {
+			className: "nuv-barcode__ground",
+			width: "100%",
+			height: "100%"
+		}), /* @__PURE__ */ jsx("path", {
+			className: "nuv-barcode__mark",
+			d: `M0.5 0.5H${width - .5}V${total - .5}H0.5ZM0.5 ${total - .5}L${width - .5} 0.5`
+		})]
+	});
+	let bars = "";
+	const texts = [];
+	let start = edge;
+	for (const [index, part] of encoding.parts.entries()) {
+		const tall = part.guard ? guardHeight : height;
+		for (const run of part.bars.matchAll(/1+/g)) {
+			const x = start + run.index * barWidth;
+			const across = run[0].length * barWidth;
+			bars += `M${x} 0h${across}v${tall}h${-across}z`;
+		}
+		const end = start + part.bars.length * barWidth;
+		if (showText && part.text) {
+			const [x, anchor] = part.align === "start" ? [start, "start"] : part.align === "end" ? [end, "end"] : [(start + end) / 2, "middle"];
+			texts.push(/* @__PURE__ */ jsx("text", {
+				className: "nuv-barcode__text",
+				x,
+				y: height + gap + textSize,
+				textAnchor: anchor,
+				fontSize: textSize,
+				children: part.text
+			}, index));
+		}
+		start = end;
+	}
+	return /* @__PURE__ */ jsxs("svg", {
+		...root,
+		role: "img",
+		"aria-label": name,
+		"aria-labelledby": labelledBy,
+		className: cx("nuv-barcode", className),
+		"data-type": encoding.type,
+		children: [
+			/* @__PURE__ */ jsx("rect", {
+				className: "nuv-barcode__ground",
+				width: "100%",
+				height: "100%"
+			}),
+			/* @__PURE__ */ jsx("path", {
+				className: "nuv-barcode__bars",
+				d: bars
+			}),
+			texts
+		]
+	});
+});
+//#endregion
+export { Barcode };

package/dist/components/barcode/encode.cjs

@@ -0,0 +1,86 @@
+let jsbarcode_bin_barcodes_CODE39_index_js = require("jsbarcode/bin/barcodes/CODE39/index.js");
+let jsbarcode_bin_barcodes_CODE128_index_js = require("jsbarcode/bin/barcodes/CODE128/index.js");
+let jsbarcode_bin_barcodes_codabar_index_js = require("jsbarcode/bin/barcodes/codabar/index.js");
+let jsbarcode_bin_barcodes_EAN_UPC_index_js = require("jsbarcode/bin/barcodes/EAN_UPC/index.js");
+let jsbarcode_bin_barcodes_ITF_index_js = require("jsbarcode/bin/barcodes/ITF/index.js");
+let jsbarcode_bin_barcodes_MSI_index_js = require("jsbarcode/bin/barcodes/MSI/index.js");
+let jsbarcode_bin_barcodes_pharmacode_index_js = require("jsbarcode/bin/barcodes/pharmacode/index.js");
+//#region src/components/barcode/encode.ts
+const encoders = {
+	code128: [jsbarcode_bin_barcodes_CODE128_index_js.CODE128, {}],
+	"gs1-128": [jsbarcode_bin_barcodes_CODE128_index_js.CODE128, { ean128: true }],
+	code39: [jsbarcode_bin_barcodes_CODE39_index_js.CODE39, {}],
+	"code39-mod43": [jsbarcode_bin_barcodes_CODE39_index_js.CODE39, { mod43: true }],
+	ean13: [jsbarcode_bin_barcodes_EAN_UPC_index_js.EAN13, {}],
+	ean8: [jsbarcode_bin_barcodes_EAN_UPC_index_js.EAN8, {}],
+	upca: [jsbarcode_bin_barcodes_EAN_UPC_index_js.UPC, {}],
+	upce: [jsbarcode_bin_barcodes_EAN_UPC_index_js.UPCE, {}],
+	itf: [jsbarcode_bin_barcodes_ITF_index_js.ITF, {}],
+	itf14: [jsbarcode_bin_barcodes_ITF_index_js.ITF14, {}],
+	msi: [jsbarcode_bin_barcodes_MSI_index_js.MSI, {}],
+	"msi-mod10": [jsbarcode_bin_barcodes_MSI_index_js.MSI10, {}],
+	"msi-mod11": [jsbarcode_bin_barcodes_MSI_index_js.MSI11, {}],
+	"msi-mod1010": [jsbarcode_bin_barcodes_MSI_index_js.MSI1010, {}],
+	"msi-mod1110": [jsbarcode_bin_barcodes_MSI_index_js.MSI1110, {}],
+	codabar: [jsbarcode_bin_barcodes_codabar_index_js.codabar, {}],
+	pharmacode: [jsbarcode_bin_barcodes_pharmacode_index_js.pharmacode, {}]
+};
+/** Every kind of barcode there is here. */
+const barcodeTypes = Object.keys(encoders);
+const grouped = /* @__PURE__ */ new Set([
+	"ean13",
+	"ean8",
+	"upca",
+	"upce"
+]);
+const aligned = {
+	left: "start",
+	center: "center",
+	right: "end"
+};
+/**
+* The bars for a value, or `null` if this kind of barcode can't hold it:
+* a letter in an EAN, a check digit that's wrong, an odd number of digits
+* in an ITF, nothing at all.
+*
+* It needs no browser, so it runs wherever the value is checked.
+*/
+function encodeBarcode(value, type = "code128", { text, flat = false } = {}) {
+	const entry = encoders[type];
+	if (!entry || typeof value !== "string" || value === "") return null;
+	const [Encoder, extra] = entry;
+	let encoded;
+	try {
+		const encoder = new Encoder(value, {
+			...extra,
+			text: grouped.has(type) ? void 0 : text,
+			flat,
+			displayValue: true,
+			fontSize: 0,
+			height: 0,
+			textMargin: 0,
+			width: 1
+		});
+		if (!encoder.valid()) return null;
+		encoded = encoder.encode();
+	} catch {
+		return null;
+	}
+	const parts = (Array.isArray(encoded) ? encoded : [encoded]).filter((part) => part.data.length > 0).map((part) => ({
+		bars: part.data,
+		text: part.text === void 0 ? void 0 : String(part.text),
+		guard: part.options?.height !== void 0,
+		align: aligned[part.options?.textAlign ?? "center"]
+	}));
+	const modules = parts.reduce((sum, part) => sum + part.bars.length, 0);
+	if (modules === 0) return null;
+	return {
+		type,
+		parts,
+		modules,
+		text: parts.map((part) => part.text ?? "").join("")
+	};
+}
+//#endregion
+exports.barcodeTypes = barcodeTypes;
+exports.encodeBarcode = encodeBarcode;

package/dist/components/barcode/encode.d.cts

@@ -0,0 +1,52 @@
+//#region src/components/barcode/encode.d.ts
+/** The kinds of barcode there are here. */
+export type BarcodeType = "code128" | "gs1-128" | "code39" | "code39-mod43" | "ean13" | "ean8" | "upca" | "upce" | "itf" | "itf14" | "msi" | "msi-mod10" | "msi-mod11" | "msi-mod1010" | "msi-mod1110" | "codabar" | "pharmacode";
+/** Every kind of barcode there is here. */
+export declare const barcodeTypes: BarcodeType[];
+export interface BarcodePart {
+  /** "1" for a bar one module wide and "0" for a space as wide. */
+  bars: string;
+  /** What's written under this part, if anything. */
+  text?: string;
+  /**
+   * A guard: bars at the two ends and in the middle of an EAN or a UPC,
+   * drawn taller than the rest.
+   */
+  guard: boolean;
+  /** Where the text sits under the part. */
+  align: "start" | "center" | "end";
+}
+export interface BarcodeEncoding {
+  type: BarcodeType;
+  /** The parts from left to right. Most kinds have one. */
+  parts: BarcodePart[];
+  /** How many modules wide the bars are, all parts together. */
+  modules: number;
+  /**
+   * The whole of what's written under the bars, with a check digit the
+   * encoder worked out.
+   */
+  text: string;
+}
+export interface BarcodeEncodeOptions {
+  /**
+   * Written under the bars in place of the value. An EAN or a UPC writes
+   * its own digits whatever this is.
+   */
+  text?: string;
+  /**
+   * An EAN or a UPC in one part, with every bar the same height and no
+   * digit outside the bars.
+   * @default false
+   */
+  flat?: boolean;
+}
+/**
+ * The bars for a value, or `null` if this kind of barcode can't hold it:
+ * a letter in an EAN, a check digit that's wrong, an odd number of digits
+ * in an ITF, nothing at all.
+ *
+ * It needs no browser, so it runs wherever the value is checked.
+ */
+export declare function encodeBarcode(value: string, type?: BarcodeType, { text, flat }?: BarcodeEncodeOptions): BarcodeEncoding | null;
+//#endregion

package/dist/components/barcode/encode.d.ts

@@ -0,0 +1,52 @@
+//#region src/components/barcode/encode.d.ts
+/** The kinds of barcode there are here. */
+export type BarcodeType = "code128" | "gs1-128" | "code39" | "code39-mod43" | "ean13" | "ean8" | "upca" | "upce" | "itf" | "itf14" | "msi" | "msi-mod10" | "msi-mod11" | "msi-mod1010" | "msi-mod1110" | "codabar" | "pharmacode";
+/** Every kind of barcode there is here. */
+export declare const barcodeTypes: BarcodeType[];
+export interface BarcodePart {
+  /** "1" for a bar one module wide and "0" for a space as wide. */
+  bars: string;
+  /** What's written under this part, if anything. */
+  text?: string;
+  /**
+   * A guard: bars at the two ends and in the middle of an EAN or a UPC,
+   * drawn taller than the rest.
+   */
+  guard: boolean;
+  /** Where the text sits under the part. */
+  align: "start" | "center" | "end";
+}
+export interface BarcodeEncoding {
+  type: BarcodeType;
+  /** The parts from left to right. Most kinds have one. */
+  parts: BarcodePart[];
+  /** How many modules wide the bars are, all parts together. */
+  modules: number;
+  /**
+   * The whole of what's written under the bars, with a check digit the
+   * encoder worked out.
+   */
+  text: string;
+}
+export interface BarcodeEncodeOptions {
+  /**
+   * Written under the bars in place of the value. An EAN or a UPC writes
+   * its own digits whatever this is.
+   */
+  text?: string;
+  /**
+   * An EAN or a UPC in one part, with every bar the same height and no
+   * digit outside the bars.
+   * @default false
+   */
+  flat?: boolean;
+}
+/**
+ * The bars for a value, or `null` if this kind of barcode can't hold it:
+ * a letter in an EAN, a check digit that's wrong, an odd number of digits
+ * in an ITF, nothing at all.
+ *
+ * It needs no browser, so it runs wherever the value is checked.
+ */
+export declare function encodeBarcode(value: string, type?: BarcodeType, { text, flat }?: BarcodeEncodeOptions): BarcodeEncoding | null;
+//#endregion