@noirmd/previewer 2.1.5 → 2.1.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/vue.cjs CHANGED
@@ -11080,6 +11080,7 @@ function createModal(title) {
11080
11080
  header.appendChild(titleEl);
11081
11081
  const closeBtn = document.createElement("button");
11082
11082
  closeBtn.className = "nr-modal__close";
11083
+ closeBtn.setAttribute("aria-label", "Close");
11083
11084
  closeBtn.appendChild(createIcon("close"));
11084
11085
  closeBtn.addEventListener("click", () => dialog.close());
11085
11086
  header.appendChild(closeBtn);
@@ -11361,6 +11362,18 @@ function openModal(dialog) {
11361
11362
  }
11362
11363
  }
11363
11364
  var IMG_RE = /!\[([^\]]*)\]\(([^)]+)\)/g;
11365
+ function applyAlignClass(el, baseClass, align) {
11366
+ if (align === "center") {
11367
+ el.classList.add(`${baseClass}--center`);
11368
+ } else if (align === "right") {
11369
+ el.classList.add(`${baseClass}--right`);
11370
+ }
11371
+ }
11372
+ function resolveIcon(value, fallback) {
11373
+ if (!value) return fallback;
11374
+ if (value === "none" || value === "off") return null;
11375
+ return value;
11376
+ }
11364
11377
  function parseIntProp(value, defaultValue) {
11365
11378
  if (!value) return defaultValue;
11366
11379
  const n = parseInt(value, 10);
@@ -11400,13 +11413,16 @@ var modalDirective = ({ props, renderSlot }) => {
11400
11413
  const label = props.label || props.title || "Open";
11401
11414
  const modalTitle = props.title || "Modal";
11402
11415
  const align = props.align || "left";
11416
+ const iconName = resolveIcon(props.icon, "open_in_full");
11403
11417
  const wrapper = document.createElement("div");
11404
- wrapper.className = `nr-modal-trigger${align === "center" ? " nr-modal-trigger--center" : align === "right" ? " nr-modal-trigger--right" : ""}`;
11418
+ wrapper.className = "nr-modal-trigger";
11419
+ applyAlignClass(wrapper, "nr-modal-trigger", align);
11405
11420
  const btn = document.createElement("button");
11406
- btn.className = `nr-button nr-button--default`;
11421
+ btn.className = "nr-button nr-button--default";
11422
+ btn.setAttribute("aria-haspopup", "dialog");
11423
+ applyColor(btn, props.color, "nr-button");
11407
11424
  applyBaseProps(btn, props);
11408
- const icon = props.icon || "open_in_new";
11409
- if (icon) btn.appendChild(createIcon(icon));
11425
+ if (iconName) btn.appendChild(createIcon(iconName));
11410
11426
  btn.appendChild(document.createTextNode(label));
11411
11427
  const dialog = createModal(modalTitle);
11412
11428
  const body = dialog.querySelector(".nr-modal__body");
@@ -11427,20 +11443,21 @@ var modal_default = modalDirective;
11427
11443
  var buttonDirective = ({ props, renderSlot }) => {
11428
11444
  const url = props.url || props.href || "#";
11429
11445
  const label = props.label || props.title;
11430
- const icon = props.icon || "near_me";
11446
+ const iconName = resolveIcon(props.icon, "touch_app");
11431
11447
  const target = props.target || "_blank";
11432
- const customClass = props.class || "";
11433
11448
  const align = props.align || "left";
11434
11449
  const wrapper = document.createElement("div");
11435
- wrapper.className = `nr-button-wrap${align === "center" ? " nr-button-wrap--center" : align === "right" ? " nr-button-wrap--right" : ""}`;
11450
+ wrapper.className = "nr-button-wrap";
11451
+ applyAlignClass(wrapper, "nr-button-wrap", align);
11436
11452
  if (label) {
11437
11453
  const a = document.createElement("a");
11438
11454
  a.href = url;
11439
11455
  a.target = target;
11440
- a.rel = "noopener noreferrer";
11456
+ if (target === "_blank") a.rel = "noopener noreferrer";
11441
11457
  a.className = "nr-button nr-button--default";
11458
+ applyColor(a, props.color, "nr-button");
11442
11459
  applyBaseProps(a, props);
11443
- a.appendChild(createIcon(icon));
11460
+ if (iconName) a.appendChild(createIcon(iconName));
11444
11461
  a.appendChild(document.createTextNode(label));
11445
11462
  wrapper.appendChild(a);
11446
11463
  return wrapper;
@@ -11450,6 +11467,8 @@ var buttonDirective = ({ props, renderSlot }) => {
11450
11467
  if (links.length > 0) {
11451
11468
  links.forEach((link) => {
11452
11469
  link.classList.add("nr-button", "nr-button--default");
11470
+ applyColor(link, props.color, "nr-button");
11471
+ if (iconName) link.prepend(createIcon(iconName));
11453
11472
  applyBaseProps(link, props);
11454
11473
  });
11455
11474
  wrapper.appendChild(slotContent);
@@ -11457,10 +11476,11 @@ var buttonDirective = ({ props, renderSlot }) => {
11457
11476
  const a = document.createElement("a");
11458
11477
  a.href = url;
11459
11478
  a.target = target;
11460
- a.rel = "noopener noreferrer";
11479
+ if (target === "_blank") a.rel = "noopener noreferrer";
11461
11480
  a.className = "nr-button nr-button--default";
11481
+ applyColor(a, props.color, "nr-button");
11462
11482
  applyBaseProps(a, props);
11463
- a.appendChild(createIcon(icon));
11483
+ if (iconName) a.appendChild(createIcon(iconName));
11464
11484
  a.appendChild(slotContent);
11465
11485
  wrapper.appendChild(a);
11466
11486
  }