@particle-academy/react-fancy 3.3.0 → 3.4.1

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/index.cjs CHANGED
@@ -6408,6 +6408,102 @@ var Callout = react.forwardRef(
6408
6408
  }
6409
6409
  );
6410
6410
  Callout.displayName = "Callout";
6411
+ var colorClasses5 = {
6412
+ yellow: "bg-amber-100 text-amber-950 dark:bg-amber-200 dark:text-amber-950",
6413
+ blue: "bg-sky-100 text-sky-950 dark:bg-sky-200 dark:text-sky-950",
6414
+ green: "bg-emerald-100 text-emerald-950 dark:bg-emerald-200 dark:text-emerald-950",
6415
+ pink: "bg-pink-100 text-pink-950 dark:bg-pink-200 dark:text-pink-950",
6416
+ violet: "bg-violet-100 text-violet-950 dark:bg-violet-200 dark:text-violet-950"
6417
+ };
6418
+ var isPreset = (c) => c in colorClasses5;
6419
+ var StickyNote = react.forwardRef(
6420
+ ({
6421
+ value,
6422
+ defaultValue,
6423
+ onChange,
6424
+ color = "yellow",
6425
+ rotate = 0,
6426
+ width = 180,
6427
+ height = "auto",
6428
+ selected = false,
6429
+ editable = true,
6430
+ autoFocus = false,
6431
+ id,
6432
+ children,
6433
+ className,
6434
+ style
6435
+ }, ref) => {
6436
+ const isControlled = value !== void 0;
6437
+ const [internal, setInternal] = react.useState(defaultValue ?? "");
6438
+ const text = isControlled ? value : internal;
6439
+ const editRef = react.useRef(null);
6440
+ react.useEffect(() => {
6441
+ const el = editRef.current;
6442
+ if (el && document.activeElement !== el && el.textContent !== text) {
6443
+ el.textContent = text ?? "";
6444
+ }
6445
+ }, [text]);
6446
+ react.useEffect(() => {
6447
+ if (!editable || !autoFocus) return;
6448
+ const el = editRef.current;
6449
+ if (!el) return;
6450
+ el.focus();
6451
+ const range2 = document.createRange();
6452
+ range2.selectNodeContents(el);
6453
+ range2.collapse(false);
6454
+ const sel = window.getSelection();
6455
+ sel?.removeAllRanges();
6456
+ sel?.addRange(range2);
6457
+ }, [editable, autoFocus]);
6458
+ const commit = () => {
6459
+ const next = editRef.current?.textContent ?? "";
6460
+ if (next === text) return;
6461
+ if (!isControlled) setInternal(next);
6462
+ onChange?.(next);
6463
+ };
6464
+ const preset = isPreset(color);
6465
+ const content = children != null ? children : editable ? /* @__PURE__ */ jsxRuntime.jsx(
6466
+ "div",
6467
+ {
6468
+ ref: editRef,
6469
+ contentEditable: true,
6470
+ suppressContentEditableWarning: true,
6471
+ spellCheck: false,
6472
+ role: "textbox",
6473
+ "aria-multiline": "true",
6474
+ className: "outline-none whitespace-pre-wrap break-words min-h-[1.4em]",
6475
+ onBlur: commit,
6476
+ onKeyDown: (e) => {
6477
+ if (e.key === "Escape") e.currentTarget.blur();
6478
+ },
6479
+ children: text
6480
+ }
6481
+ ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "whitespace-pre-wrap break-words", children: text });
6482
+ return /* @__PURE__ */ jsxRuntime.jsx(
6483
+ "div",
6484
+ {
6485
+ ref,
6486
+ id,
6487
+ "data-react-fancy-sticky": "",
6488
+ className: cn(
6489
+ "rounded-sm p-3.5 text-sm leading-relaxed shadow-[0_2px_8px_rgba(0,0,0,0.12),0_1px_2px_rgba(0,0,0,0.08)]",
6490
+ preset ? colorClasses5[color] : "text-zinc-900",
6491
+ selected && "ring-2 ring-blue-500 ring-offset-1",
6492
+ className
6493
+ ),
6494
+ style: {
6495
+ width,
6496
+ height,
6497
+ transform: rotate ? `rotate(${rotate}deg)` : void 0,
6498
+ ...preset ? null : { background: color },
6499
+ ...style
6500
+ },
6501
+ children: content
6502
+ }
6503
+ );
6504
+ }
6505
+ );
6506
+ StickyNote.displayName = "StickyNote";
6411
6507
  var TimelineContext = react.createContext({
6412
6508
  variant: "stacked",
6413
6509
  index: 0,
@@ -10716,8 +10812,9 @@ function ContentRenderer({
10716
10812
  [instanceExtensions]
10717
10813
  );
10718
10814
  const html = react.useMemo(() => {
10719
- const resolvedFormat = format === "auto" ? detectFormat(value) : format;
10720
- const raw = resolvedFormat === "markdown" ? marked.marked.parse(value, { async: false }) : value;
10815
+ const safe = value ?? "";
10816
+ const resolvedFormat = format === "auto" ? detectFormat(safe) : format;
10817
+ const raw = resolvedFormat === "markdown" ? marked.marked.parse(safe, { async: false }) : safe;
10721
10818
  return unsafe ? raw : sanitizeHtml(raw);
10722
10819
  }, [value, format, unsafe]);
10723
10820
  const hasExtensions = extensions.length > 0;
@@ -13295,6 +13392,7 @@ exports.Separator = Separator;
13295
13392
  exports.Sidebar = Sidebar;
13296
13393
  exports.Skeleton = Skeleton;
13297
13394
  exports.Slider = Slider;
13395
+ exports.StickyNote = StickyNote;
13298
13396
  exports.Switch = Switch;
13299
13397
  exports.Table = Table;
13300
13398
  exports.Tabs = Tabs;