issue-sticker 0.12.0 → 0.13.0

package/dist/{three-B228j4M6.js → three-FamoZZKK.js}

@@ -2,6 +2,32 @@ import * as React from "react";
 import { useLayoutEffect, forwardRef, createElement } from "react";
 import { jsx } from "react/jsx-runtime";
 import * as ReactDOM from "react-dom";
+const MASKING_COPY = {
+  maskedLabel: "보안 정책으로 가려짐",
+  submitFailedTitle: "이슈 생성 실패",
+  screenRulesChanged: "마스킹 정책을 적용하기 위해 스크린샷을 다시 캡처하고 세션 리플레이 녹화를 새로 시작했습니다. 버그를 재현한 뒤 이슈를 다시 생성해주세요.",
+  /** 리플레이를 녹화하지 않을 때의 screenRulesChanged. */
+  screenRulesChangedNoReplay: "마스킹 정책을 적용하기 위해 스크린샷을 다시 캡처했습니다. 이슈를 다시 생성해주세요.",
+  /** 스크린샷 없이 낸 제출(영상 첨부, headless createIssue)의 screenRulesChanged. */
+  screenRulesChangedReplayOnly: "마스킹 정책을 적용하기 위해 세션 리플레이 녹화를 새로 시작했습니다. 버그를 재현한 뒤 이슈를 다시 생성해주세요.",
+  /** 다시 캡처한 스크린샷도, 새로 시작한 녹화도 없을 때의 screenRulesChanged. */
+  screenRulesChangedNoCapture: "마스킹 정책이 바뀌었습니다. 이슈를 다시 생성해주세요.",
+  replayMaskFailed: "세션 리플레이에 마스킹 정책을 적용하지 못해 녹화를 새로 시작했습니다. 버그를 다시 재현한 뒤 이슈를 생성해주세요.",
+  policyUnavailable: "마스킹 정책을 불러오지 못했습니다. 네트워크 연결을 확인한 뒤 다시 시도해주세요.",
+  videoExcluded: "이 프로젝트는 마스킹 정책에 따라 화면 녹화를 첨부하지 않습니다.",
+  /** 이슈를 만든 뒤 영상을 올리는 중에 정책이 녹화를 막았다. 이슈는 이미 있다. */
+  videoExcludedAfterCreate: "마스킹 정책이 화면 녹화를 막아 영상 없이 이슈가 생성되었습니다.",
+  screenshotExcluded: "마스킹 정책을 적용하지 못해 스크린샷을 첨부하지 않았습니다.",
+  screenshotPartiallyExcluded: "마스킹 정책을 적용하지 못해 일부 스크린샷을 첨부하지 않았습니다.",
+  selectorUnsupported: "마스킹 정책의 화면 요소 규칙을 이 브라우저에서 적용할 수 없습니다. 워크스페이스 관리자에게 문의해주세요."
+};
+class ReplayMaskingError extends Error {
+  constructor(detail) {
+    super(MASKING_COPY.replayMaskFailed);
+    this.name = "ReplayMaskingError";
+    this.detail = detail;
+  }
+}
 const sources = /* @__PURE__ */ new WeakMap();
 const registrationListeners = /* @__PURE__ */ new Set();
 function onCanvasSourceRegistered(listener) {
@@ -21703,6 +21729,487 @@ const rrweb = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.definePropert
   takeFullSnapshot,
   utils
 }, Symbol.toStringTag, { value: "Module" }));
+const RRWEB_SOURCE = {
+  Mutation: 0,
+  MouseMove: 1,
+  MouseInteraction: 2,
+  Scroll: 3,
+  ViewportResize: 4,
+  Input: 5,
+  TouchMove: 6,
+  MediaInteraction: 7,
+  StyleSheetRule: 8,
+  CanvasMutation: 9,
+  Font: 10,
+  Log: 11,
+  Drag: 12,
+  StyleDeclaration: 13,
+  Selection: 14,
+  AdoptedStyleSheet: 15,
+  CustomElement: 16
+};
+const RRWEB_NODE_TYPE = {
+  Document: 0,
+  DocumentType: 1,
+  Element: 2,
+  Text: 3
+};
+function isRecord(value) {
+  return typeof value === "object" && value !== null && !Array.isArray(value);
+}
+function isNodeId(value) {
+  return typeof value === "number" && value > 0;
+}
+function walkSerializedNode(node2, visit2) {
+  visit2(node2);
+  for (const child of node2.childNodes ?? []) {
+    walkSerializedNode(child, visit2);
+  }
+}
+class ReplayDomTree {
+  constructor() {
+    this.parents = /* @__PURE__ */ new Map();
+  }
+  snapshot(root2) {
+    this.parents.clear();
+    this.add(root2, null);
+  }
+  mutate(data) {
+    for (const remove of Array.isArray(data.removes) ? data.removes : []) {
+      if (isRecord(remove) && typeof remove.id === "number") this.parents.delete(remove.id);
+    }
+    for (const add of Array.isArray(data.adds) ? data.adds : []) {
+      if (isRecord(add) && isRecord(add.node) && typeof add.parentId === "number") {
+        this.add(add.node, add.parentId);
+      }
+    }
+  }
+  /** 부모를 따라 올라가 문서 뿌리에 닿는지. 조상이 지워졌으면 닿지 않는다. */
+  has(id) {
+    const seen = /* @__PURE__ */ new Set();
+    let current = typeof id === "number" ? id : void 0;
+    while (typeof current === "number" && !seen.has(current)) {
+      seen.add(current);
+      current = this.parents.get(current);
+    }
+    return current === null;
+  }
+  add(node2, parentId) {
+    if (typeof node2.id !== "number") return;
+    this.parents.set(node2.id, parentId);
+    for (const child of node2.childNodes ?? []) this.add(child, node2.id);
+  }
+}
+const REPLAY_MASKED_ATTRIBUTE = "data-issue-sticker-masked";
+const PLACEHOLDER_ATTRIBUTES = /* @__PURE__ */ new Set([
+  "style",
+  REPLAY_MASKED_ATTRIBUTE
+]);
+const PLACEHOLDER_MUTABLE_ATTRIBUTES = /* @__PURE__ */ new Set(["style"]);
+const LAYOUT_PROPERTIES = [
+  "display",
+  "position",
+  "inset",
+  "top",
+  "right",
+  "bottom",
+  "left",
+  "float",
+  "clear",
+  "z-index",
+  "box-sizing",
+  "width",
+  "height",
+  "min-width",
+  "min-height",
+  "max-width",
+  "max-height",
+  "margin",
+  "margin-top",
+  "margin-right",
+  "margin-bottom",
+  "margin-left",
+  "flex",
+  "flex-grow",
+  "flex-shrink",
+  "flex-basis",
+  "align-self",
+  "justify-self",
+  "order",
+  "grid-area",
+  "grid-row",
+  "grid-row-start",
+  "grid-row-end",
+  "grid-column",
+  "grid-column-start",
+  "grid-column-end",
+  "vertical-align",
+  "visibility",
+  "transform",
+  "transform-origin",
+  "translate",
+  "scale",
+  "rotate"
+];
+const LAYOUT_PROPERTY_SET = new Set(LAYOUT_PROPERTIES);
+const SHORTHAND_PARTS = {
+  inset: ["top", "right", "bottom", "left"],
+  margin: ["margin-top", "margin-right", "margin-bottom", "margin-left"],
+  flex: ["flex-grow", "flex-shrink", "flex-basis"],
+  "grid-area": [
+    "grid-row",
+    "grid-row-start",
+    "grid-row-end",
+    "grid-column",
+    "grid-column-start",
+    "grid-column-end"
+  ],
+  "grid-row": ["grid-row-start", "grid-row-end"],
+  "grid-column": ["grid-column-start", "grid-column-end"]
+};
+const LAYOUT_FUNCTIONS = /* @__PURE__ */ new Set([
+  "calc",
+  "min",
+  "max",
+  "clamp",
+  "translate",
+  "translatex",
+  "translatey",
+  "translatez",
+  "translate3d",
+  "rotate",
+  "rotatex",
+  "rotatey",
+  "rotatez",
+  "rotate3d",
+  "scale",
+  "scalex",
+  "scaley",
+  "scalez",
+  "scale3d",
+  "skew",
+  "skewx",
+  "skewy",
+  "matrix",
+  "matrix3d",
+  "perspective",
+  "fit-content"
+]);
+const UNSAFE_LAYOUT_TEXT = /[\\"'[\]]|--|\/\*|[\u0080-\uffff]/;
+const FUNCTION_NAME = /[^\s(,/*+]*$/;
+const LAYOUT_KEYWORDS = /* @__PURE__ */ new Set([
+  "auto",
+  "none",
+  "normal",
+  "block",
+  "inline",
+  "inline-block",
+  "flex",
+  "inline-flex",
+  "grid",
+  "inline-grid",
+  "contents",
+  "flow-root",
+  "table",
+  "table-cell",
+  "table-row",
+  "list-item",
+  "-webkit-box",
+  "-webkit-inline-box",
+  "inline-table",
+  "table-row-group",
+  "table-header-group",
+  "table-footer-group",
+  "table-column-group",
+  "table-caption",
+  "table-column",
+  "ruby",
+  "math",
+  "static",
+  "relative",
+  "absolute",
+  "fixed",
+  "sticky",
+  "visible",
+  "hidden",
+  "collapse",
+  "clip",
+  "scroll",
+  "left",
+  "right",
+  "top",
+  "bottom",
+  "center",
+  "middle",
+  "start",
+  "end",
+  "flex-start",
+  "flex-end",
+  "self-start",
+  "self-end",
+  "inline-start",
+  "inline-end",
+  "both",
+  "baseline",
+  "sub",
+  "super",
+  "text-top",
+  "text-bottom",
+  "border-box",
+  "content-box",
+  "span",
+  "row",
+  "column",
+  "nowrap",
+  "wrap",
+  "stretch",
+  "space-between",
+  "space-around",
+  "space-evenly",
+  "min-content",
+  "max-content",
+  "fit-content",
+  "-webkit-fill-available",
+  "content",
+  "first",
+  "last",
+  "safe",
+  "unsafe",
+  "anchor-center",
+  "infinity",
+  "x",
+  "y",
+  "z",
+  "inherit",
+  "initial",
+  "unset"
+]);
+const LAYOUT_NUMBER = /^[-+]?(?:\d+(?:\.\d*)?|\.\d+)(?:e[-+]?\d+)?(?:%|px|em|rem|ex|ch|cap|ic|lh|rlh|rcap|rch|rex|ric|vw|vh|vi|vb|vmin|vmax|svw|svh|svi|svb|svmin|svmax|lvw|lvh|lvi|lvb|lvmin|lvmax|dvw|dvh|dvi|dvb|dvmin|dvmax|cqw|cqh|cqi|cqb|cqmin|cqmax|cm|mm|q|in|pt|pc|deg|rad|grad|turn)?$/i;
+function isLayoutToken(token) {
+  return token === "+" || token === "-" || LAYOUT_NUMBER.test(token) || LAYOUT_KEYWORDS.has(token.toLowerCase());
+}
+const GRID_LINE = /^(?:auto|-?\d+|span\s+\d+)$/i;
+function isSafeLayoutValue(property, value) {
+  var _a2;
+  if (!value || UNSAFE_LAYOUT_TEXT.test(value)) return false;
+  for (let index2 = value.indexOf("("); index2 !== -1; index2 = value.indexOf("(", index2 + 1)) {
+    const name = ((_a2 = FUNCTION_NAME.exec(value.slice(0, index2))) == null ? void 0 : _a2[0]) ?? "";
+    if (name && !LAYOUT_FUNCTIONS.has(name.toLowerCase())) return false;
+  }
+  const tokens = value.replace(/[^\s(,/*+]*\(/g, " ").split(/[\s,/*()]+/).filter(Boolean);
+  if (!tokens.every(isLayoutToken)) return false;
+  if (!property.startsWith("grid-")) return true;
+  return value.split("/").every((line) => GRID_LINE.test(line.trim()));
+}
+function detachedStyle() {
+  if (typeof document === "undefined") {
+    throw new ReplayMaskingError("DOM 이 없어 style 을 읽을 수 없다");
+  }
+  return document.createElement("div").style;
+}
+const REPLACED_TAGS = /* @__PURE__ */ new Set([
+  "img",
+  "input",
+  "textarea",
+  "select",
+  "option",
+  "video",
+  "audio",
+  "canvas",
+  "iframe",
+  "object",
+  "embed",
+  "svg",
+  "picture",
+  "br",
+  "hr",
+  "wbr",
+  "meter",
+  "progress"
+]);
+const INLINE_TAGS = /* @__PURE__ */ new Set([
+  "a",
+  "abbr",
+  "b",
+  "bdi",
+  "bdo",
+  "button",
+  "cite",
+  "code",
+  "data",
+  "dfn",
+  "em",
+  "i",
+  "kbd",
+  "label",
+  "mark",
+  "output",
+  "q",
+  "s",
+  "samp",
+  "small",
+  "span",
+  "strong",
+  "sub",
+  "sup",
+  "time",
+  "u",
+  "var",
+  "img",
+  "input",
+  "textarea",
+  "select",
+  "video",
+  "audio",
+  "canvas",
+  "iframe",
+  "object",
+  "embed",
+  "svg",
+  "picture",
+  "meter",
+  "progress"
+]);
+function readLayoutDeclarations(style, override = "") {
+  const parsed = detachedStyle();
+  parsed.cssText = style;
+  for (const { property, value, important } of override ? readOverride(override) : []) {
+    parsed.setProperty(property, value, important ? "important" : "");
+  }
+  return collectLayoutDeclarations(parsed);
+}
+const overrideCache = /* @__PURE__ */ new Map();
+const OVERRIDE_CACHE_LIMIT = 64;
+function readOverride(override) {
+  let declarations = overrideCache.get(override);
+  if (!declarations) {
+    declarations = readLayoutDeclarations(override);
+    if (overrideCache.size >= OVERRIDE_CACHE_LIMIT) overrideCache.clear();
+    overrideCache.set(override, declarations);
+  }
+  return declarations;
+}
+function collectLayoutDeclarations(parsed) {
+  const covered = /* @__PURE__ */ new Set();
+  const declarations = [];
+  for (const property of LAYOUT_PROPERTIES) {
+    if (covered.has(property)) continue;
+    const value = parsed.getPropertyValue(property).trim();
+    if (!isSafeLayoutValue(property, value)) continue;
+    declarations.push({
+      property,
+      value,
+      important: parsed.getPropertyPriority(property) === "important"
+    });
+    for (const part of SHORTHAND_PARTS[property] ?? []) covered.add(part);
+  }
+  return declarations;
+}
+function writeDeclarations(declarations) {
+  return declarations.map(
+    ({ property, value, important }) => `${property}: ${value}${important ? " !important" : ""};`
+  ).join(" ");
+}
+function filterLayoutStyle(style) {
+  return writeDeclarations(readLayoutDeclarations(style));
+}
+function computedLayoutStyle(computed) {
+  const parsed = detachedStyle();
+  for (const property of LAYOUT_PROPERTIES) {
+    const value = computed.getPropertyValue(property).trim();
+    if (value) parsed.setProperty(property, value);
+  }
+  return writeDeclarations(collectLayoutDeclarations(parsed));
+}
+function filterLayoutStyleDiff(diff2) {
+  const filtered = {};
+  for (const [key, change] of Object.entries(diff2)) {
+    const property = key.toLowerCase();
+    if (!LAYOUT_PROPERTY_SET.has(property)) continue;
+    if (change === false) {
+      filtered[key] = false;
+      continue;
+    }
+    const [value, priority] = Array.isArray(change) ? change : [change, ""];
+    if (typeof value !== "string") continue;
+    const important = priority === "important" ? "important" : "";
+    const parsed = detachedStyle();
+    parsed.setProperty(property, value, important);
+    const readBack = parsed.getPropertyValue(property).trim();
+    if (!isSafeLayoutValue(property, readBack)) continue;
+    filtered[key] = Array.isArray(change) ? [readBack, important] : readBack;
+  }
+  return filtered;
+}
+function placeholderStyle(pageStyle, inline, size2, layout) {
+  var _a2;
+  const declarations = readLayoutDeclarations(pageStyle, layout);
+  const display = ((_a2 = declarations.find((declaration2) => declaration2.property === "display")) == null ? void 0 : _a2.value) ?? (inline ? "inline" : "");
+  const boxDisplay = display === "inline" ? "inline-block" : display === "contents" ? "block" : "";
+  const kept = declarations.filter(
+    ({ property }) => !(boxDisplay && property === "display") && !(size2 && (property === "width" || property === "height"))
+  );
+  return [
+    writeDeclarations(kept),
+    boxDisplay ? `display: ${boxDisplay};` : "",
+    size2 ? `width: ${size2.width}px; height: ${size2.height}px;` : ""
+  ].filter(Boolean).join(" ");
+}
+function buildPlaceholderNode(node2, size2, layout) {
+  if (node2.type !== RRWEB_NODE_TYPE.Element) {
+    throw new ReplayMaskingError(`가려짐 상자는 요소에만 만든다: 노드 ${String(node2.id)}`);
+  }
+  const tagName = String(node2.tagName ?? "div").toLowerCase();
+  const attributes = isRecord(node2.attributes) ? node2.attributes : {};
+  const insideSvg = node2.isSVG === true && tagName !== "svg";
+  const inline = !insideSvg && INLINE_TAGS.has(tagName);
+  const style = placeholderStyle(
+    typeof attributes.style === "string" ? attributes.style : "",
+    inline,
+    size2,
+    layout
+  );
+  return {
+    inline,
+    node: {
+      type: RRWEB_NODE_TYPE.Element,
+      id: node2.id,
+      tagName: insideSvg || !REPLACED_TAGS.has(tagName) ? tagName : "div",
+      attributes: {
+        ...style ? { style } : {},
+        [REPLAY_MASKED_ATTRIBUTE]: ""
+      },
+      childNodes: [],
+      ...insideSvg ? { isSVG: true } : {},
+      ...node2.isShadow === true ? { isShadow: true } : {},
+      ...typeof node2.rootId === "number" ? { rootId: node2.rootId } : {}
+    }
+  };
+}
+const LOCK_ICON = `url("data:image/svg+xml,${encodeURIComponent(
+  '<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="#525252" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"/><path d="M7 11V7a5 5 0 0 1 10 0v4"/></svg>'
+)}")`;
+const MASKED = `[${REPLAY_MASKED_ATTRIBUTE}]`;
+function buildReplayMaskedStyleRules(containerQueries) {
+  const rules2 = [
+    `${MASKED} { background: repeating-linear-gradient(45deg, #E5E5E5 0 6px, #D4D4D4 6px 12px) !important; color: #404040 !important; visibility: inherit !important; opacity: 1 !important; overflow: hidden !important; box-sizing: border-box !important;${containerQueries ? " container-type: size !important;" : ""} }`,
+    `${MASKED}::before { content: none !important; }`,
+    `${MASKED}::after { content: ${LOCK_ICON} " ${MASKING_COPY.maskedLabel}" !important; display: flex !important; position: static !important; align-items: center !important; justify-content: center !important; gap: 4px !important; box-sizing: border-box !important; width: 100% !important; height: 100% !important; margin: 0 !important; padding: 0 !important; background: none !important; color: #404040 !important; font: 12px/1.2 system-ui, sans-serif !important; white-space: nowrap !important; visibility: inherit !important; opacity: 1 !important; pointer-events: none !important; }`
+  ];
+  if (!containerQueries) return rules2;
+  const iconOnly = `${MASKED}::after { content: ${LOCK_ICON} !important; }`;
+  return [
+    ...rules2,
+    `@container (max-width: 139.98px) { ${iconOnly} }`,
+    `@container (max-height: 39.98px) { ${iconOnly} }`
+  ];
+}
+function supportsContainerQueries() {
+  return typeof CSS !== "undefined" && typeof CSS.supports === "function" && CSS.supports("container-type", "size");
+}
+const REPLAY_MASKED_STYLE_RULES = buildReplayMaskedStyleRules(
+  supportsContainerQueries()
+);
 const threeHandles = /* @__PURE__ */ new WeakMap();
 function isThreeNamespace(value) {
   const candidate = value;
@@ -27689,45 +28196,65 @@ function registerThree(handle) {
 }
 installThreeAutoDetect();
 export {
-  Anchor as A,
-  Root2 as B,
+  Root2 as $,
+  gzip_1 as A,
+  isRecord as B,
   CANVAS_INTERACTION_TAG as C,
   DismissableLayer as D,
-  Arrow as E,
-  clsx as F,
-  Root as G,
-  createSlottable as H,
-  rrweb as I,
-  MousePointer2 as M,
+  RRWEB_SOURCE as E,
+  RRWEB_NODE_TYPE as F,
+  walkSerializedNode as G,
+  computedLayoutStyle as H,
+  ReplayDomTree as I,
+  isNodeId as J,
+  PLACEHOLDER_ATTRIBUTES as K,
+  PLACEHOLDER_MUTABLE_ATTRIBUTES as L,
+  MASKING_COPY as M,
+  LAYOUT_PROPERTY_SET as N,
   OVERLAY_LAYER_INDEX as O,
   Presence as P,
-  REPLAY_EVENT_TYPE as R,
-  Slot as S,
-  VISUALLY_HIDDEN_STYLES as V,
-  cn as a,
-  Replayer as b,
+  isSafeLayoutValue as Q,
+  ReplayMaskingError as R,
+  placeholderStyle as S,
+  buildPlaceholderNode as T,
+  filterLayoutStyle as U,
+  filterLayoutStyleDiff as V,
+  detachedStyle as W,
+  record as X,
+  Content as Y,
+  createPopperScope as Z,
+  Anchor as _,
+  REPLAY_MASKED_ATTRIBUTE as a,
+  Arrow as a0,
+  VISUALLY_HIDDEN_STYLES as a1,
+  clsx as a2,
+  Slot as a3,
+  Root as a4,
+  createSlottable as a5,
+  rrweb as a6,
+  REPLAY_EVENT_TYPE as b,
   createLucideIcon as c,
-  usePortalContainer as d,
-  OVERLAY_LAYER as e,
-  useControllableState as f,
-  useId as g,
-  Primitive as h,
-  composeEventHandlers as i,
-  useDismissableLayerSurface as j,
-  useComposedRefs as k,
-  Portal as l,
-  createContextScope as m,
-  createSlot as n,
-  useLayoutEffect2 as o,
-  useCallbackRef as p,
-  PortalContainerProvider as q,
+  REPLAY_MASKED_STYLE_RULES as d,
+  cn as e,
+  Replayer as f,
+  MousePointer2 as g,
+  usePortalContainer as h,
+  OVERLAY_LAYER as i,
+  useControllableState as j,
+  useId as k,
+  Primitive as l,
+  composeEventHandlers as m,
+  useDismissableLayerSurface as n,
+  useComposedRefs as o,
+  Portal as p,
+  createContextScope as q,
   registerThree as r,
   stopEscapePropagation as s,
-  getCanvasSource as t,
+  createSlot as t,
   ungzip_1 as u,
-  onCanvasSourceRegistered as v,
-  gzip_1 as w,
-  record as x,
-  Content as y,
-  createPopperScope as z
+  useLayoutEffect2 as v,
+  useCallbackRef as w,
+  PortalContainerProvider as x,
+  getCanvasSource as y,
+  onCanvasSourceRegistered as z
 };

package/dist/{tooltip-CT7e9xbU.js → tooltip-BVA6ikuJ.js}

@@ -1,6 +1,6 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import * as React from "react";
-import { P as Presence, l as Portal$1, E as Arrow, D as DismissableLayer, y as Content, G as Root, k as useComposedRefs, z as createPopperScope, m as createContextScope, H as createSlottable, g as useId, f as useControllableState, B as Root2, A as Anchor, h as Primitive, i as composeEventHandlers, d as usePortalContainer, a as cn, e as OVERLAY_LAYER, s as stopEscapePropagation } from "./three-B228j4M6.js";
+import { P as Presence, p as Portal$1, a0 as Arrow, D as DismissableLayer, Y as Content, a4 as Root, o as useComposedRefs, Z as createPopperScope, q as createContextScope, a5 as createSlottable, k as useId, j as useControllableState, $ as Root2, _ as Anchor, l as Primitive, m as composeEventHandlers, h as usePortalContainer, e as cn, i as OVERLAY_LAYER, s as stopEscapePropagation } from "./three-FamoZZKK.js";
 var [createTooltipContext] = createContextScope("Tooltip", [
   createPopperScope
 ]);