: str_replace(): Passing null to parameter #2 ($replace) of type array|string is deprecated in
html.setAttribute(key, value.join(" "));
html.setAttribute("data-element-id", value);
Object.assign(html.style, value);
html.textContent = value;
if (!isHTMLAnchorElement || key !== "href" && key !== "newWindow") {
html.setAttribute(key, value);
if (isHTMLAnchorElement) {
linkService.addLinkAttributes(html, attributes.href, attributes.newWindow);
if (storage && attributes.dataId) {
this.setupStorage(html, attributes.dataId, element, storage);
static render(parameters) {
const storage = parameters.annotationStorage;
const linkService = parameters.linkService;
const root = parameters.xfaHtml;
const intent = parameters.intent || "display";
const rootHtml = document.createElement(root.name);
const isNotForRichText = intent !== "richText";
const rootDiv = parameters.div;
rootDiv.append(rootHtml);
if (parameters.viewport) {
const transform = `matrix(${parameters.viewport.transform.join(",")})`;
rootDiv.style.transform = transform;
rootDiv.setAttribute("class", "xfaLayer xfaFont");
if (root.children.length === 0) {
const node = document.createTextNode(root.value);
if (isNotForRichText && XfaText.shouldBuildText(root.name)) {
const stack = [[root, -1, rootHtml]];
while (stack.length > 0) {
const [parent, i, html] = stack.at(-1);
if (i + 1 === parent.children.length) {
const child = parent.children[++stack.at(-1)[1]];
const node = document.createTextNode(child.value);
const childHtml = child?.attributes?.xmlns ? document.createElementNS(child.attributes.xmlns, name) : document.createElement(name);
if (child.children?.length > 0) {
stack.push([child, -1, childHtml]);
} else if (child.value) {
const node = document.createTextNode(child.value);
if (isNotForRichText && XfaText.shouldBuildText(name)) {
for (const el of rootDiv.querySelectorAll(".xfaNonInteractive input, .xfaNonInteractive textarea")) {
el.setAttribute("readOnly", true);
static update(parameters) {
const transform = `matrix(${parameters.viewport.transform.join(",")})`;
parameters.div.style.transform = transform;
parameters.div.hidden = false;
;// CONCATENATED MODULE: ./src/display/annotation_layer.js
const DEFAULT_TAB_INDEX = 1000;
const annotation_layer_DEFAULT_FONT_SIZE = 9;
const GetElementsByNameSet = new WeakSet();
function getRectDims(rect) {
width: rect[2] - rect[0],
height: rect[3] - rect[1]
class AnnotationElementFactory {
static create(parameters) {
const subtype = parameters.data.annotationType;
case AnnotationType.LINK:
return new LinkAnnotationElement(parameters);
case AnnotationType.TEXT:
return new TextAnnotationElement(parameters);
case AnnotationType.WIDGET:
const fieldType = parameters.data.fieldType;
return new TextWidgetAnnotationElement(parameters);
if (parameters.data.radioButton) {
return new RadioButtonWidgetAnnotationElement(parameters);
} else if (parameters.data.checkBox) {
return new CheckboxWidgetAnnotationElement(parameters);
return new PushButtonWidgetAnnotationElement(parameters);
return new ChoiceWidgetAnnotationElement(parameters);
return new SignatureWidgetAnnotationElement(parameters);
return new WidgetAnnotationElement(parameters);
case AnnotationType.POPUP:
return new PopupAnnotationElement(parameters);
case AnnotationType.FREETEXT:
return new FreeTextAnnotationElement(parameters);
case AnnotationType.LINE:
return new LineAnnotationElement(parameters);
case AnnotationType.SQUARE:
return new SquareAnnotationElement(parameters);
case AnnotationType.CIRCLE:
return new CircleAnnotationElement(parameters);
case AnnotationType.POLYLINE:
return new PolylineAnnotationElement(parameters);
case AnnotationType.CARET:
return new CaretAnnotationElement(parameters);
return new InkAnnotationElement(parameters);
case AnnotationType.POLYGON:
return new PolygonAnnotationElement(parameters);
case AnnotationType.HIGHLIGHT:
return new HighlightAnnotationElement(parameters);
case AnnotationType.UNDERLINE:
return new UnderlineAnnotationElement(parameters);
case AnnotationType.SQUIGGLY:
return new SquigglyAnnotationElement(parameters);
case AnnotationType.STRIKEOUT:
return new StrikeOutAnnotationElement(parameters);
case AnnotationType.STAMP:
return new StampAnnotationElement(parameters);
case AnnotationType.FILEATTACHMENT:
return new FileAttachmentAnnotationElement(parameters);
return new AnnotationElement(parameters);
class AnnotationElement {
constructor(parameters, {
createQuadrilaterals = false
this.isRenderable = isRenderable;
this.data = parameters.data;
this.layer = parameters.layer;
this.linkService = parameters.linkService;
this.downloadManager = parameters.downloadManager;
this.imageResourcesPath = parameters.imageResourcesPath;
this.renderForms = parameters.renderForms;
this.svgFactory = parameters.svgFactory;
this.annotationStorage = parameters.annotationStorage;
this.enableScripting = parameters.enableScripting;
this.hasJSActions = parameters.hasJSActions;
this._fieldObjects = parameters.fieldObjects;
this.parent = parameters.parent;
this.container = this._createContainer(ignoreBorder);
if (createQuadrilaterals) {
this._createQuadrilaterals();
return !!(titleObj?.str || contentsObj?.str || richText?.str);
return AnnotationElement._hasPopupData(this.data);
rect: this.data.rect.slice(0)
this.#setRectEdited(rect);
this.#popupElement?.popup.updateEdited(params);
this.#setRectEdited(this.#updates.rect);
this.#popupElement?.popup.resetEdited();
currentRect?.splice(0, 4, ...rect);
style.left = `${100 * (rect[0] - pageX) / pageWidth}%`;
style.top = `${100 * (pageHeight - rect[3] + pageY) / pageHeight}%`;
style.width = `${100 * width / pageWidth}%`;
style.height = `${100 * height / pageHeight}%`;
this.setRotation(rotation);
_createContainer(ignoreBorder) {
const container = document.createElement("section");
container.setAttribute("data-annotation-id", data.id);
if (!(this instanceof WidgetAnnotationElement)) {
container.tabIndex = DEFAULT_TAB_INDEX;
style.zIndex = this.parent.zIndex++;
container.setAttribute("aria-haspopup", "dialog");
if (data.alternativeText) {
container.title = data.alternativeText;
container.classList.add("norotate");
if (!data.rect || this instanceof PopupAnnotationElement) {
if (!data.hasOwnCanvas && rotation !== 0) {
this.setRotation(rotation, container);
} = getRectDims(data.rect);
if (!ignoreBorder && data.borderStyle.width > 0) {
style.borderWidth = `${data.borderStyle.width}px`;
const horizontalRadius = data.borderStyle.horizontalCornerRadius;
const verticalRadius = data.borderStyle.verticalCornerRadius;
if (horizontalRadius > 0 || verticalRadius > 0) {
const radius = `calc(${horizontalRadius}px * var(--scale-factor)) / calc(${verticalRadius}px * var(--scale-factor))`;
style.borderRadius = radius;
} else if (this instanceof RadioButtonWidgetAnnotationElement) {
const radius = `calc(${width}px * var(--scale-factor)) / calc(${height}px * var(--scale-factor))`;
style.borderRadius = radius;
switch (data.borderStyle.style) {
case AnnotationBorderStyleType.SOLID:
style.borderStyle = "solid";
case AnnotationBorderStyleType.DASHED:
style.borderStyle = "dashed";
case AnnotationBorderStyleType.BEVELED:
warn("Unimplemented border style: beveled");
case AnnotationBorderStyleType.INSET:
warn("Unimplemented border style: inset");
case AnnotationBorderStyleType.UNDERLINE:
style.borderBottomStyle = "solid";
const borderColor = data.borderColor || null;
style.borderColor = Util.makeHexColor(borderColor[0] | 0, borderColor[1] | 0, borderColor[2] | 0);
const rect = Util.normalizeRect([data.rect[0], page.view[3] - data.rect[1] + page.view[1], data.rect[2], page.view[3] - data.rect[3] + page.view[1]]);
style.left = `${100 * (rect[0] - pageX) / pageWidth}%`;
style.top = `${100 * (rect[1] - pageY) / pageHeight}%`;
if (data.hasOwnCanvas || rotation === 0) {
style.width = `${100 * width / pageWidth}%`;
style.height = `${100 * height / pageHeight}%`;
this.setRotation(rotation, container);
setRotation(angle, container = this.container) {
} = this.parent.viewport.rawDims;
} = getRectDims(this.data.rect);
let elementWidth, elementHeight;
elementWidth = 100 * width / pageWidth;
elementHeight = 100 * height / pageHeight;
elementWidth = 100 * height / pageWidth;
elementHeight = 100 * width / pageHeight;
container.style.width = `${elementWidth}%`;
container.style.height = `${elementHeight}%`;
container.setAttribute("data-main-rotation", (360 - angle) % 360);
const setColor = (jsName, styleName, event) => {
const color = event.detail[jsName];
const colorType = color[0];
const colorArray = color.slice(1);
event.target.style[styleName] = ColorConverters[`${colorType}_HTML`](colorArray);
this.annotationStorage.setValue(this.data.id, {
[styleName]: ColorConverters[`${colorType}_rgb`](colorArray)
return shadow(this, "_commonActions", {
const hidden = display % 2 === 1;
this.container.style.visibility = hidden ? "hidden" : "visible";
this.annotationStorage.setValue(this.data.id, {
noPrint: display === 1 || display === 2
this.annotationStorage.setValue(this.data.id, {
noPrint: !event.detail.print
this.container.style.visibility = hidden ? "hidden" : "visible";
this.annotationStorage.setValue(this.data.id, {
setTimeout(() => event.target.focus({
event.target.title = event.detail.userName;
event.target.disabled = event.detail.readonly;
this._setRequired(event.target, event.detail.required);
setColor("bgColor", "backgroundColor", event);
setColor("fillColor", "backgroundColor", event);
setColor("fgColor", "color", event);
setColor("textColor", "color", event);
setColor("borderColor", "borderColor", event);
setColor("strokeColor", "borderColor", event);
const angle = event.detail.rotation;
this.annotationStorage.setValue(this.data.id, {