@vishu1301/script-writing 1.0.1 → 1.0.3

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.js CHANGED
@@ -306,10 +306,10 @@ function ScreenplayEditorView({
306
306
  handleSceneNumberChange
307
307
  }) {
308
308
  const [isRulesOpen, setIsRulesOpen] = useState(false);
309
- const screenplayFont = "'Courier Prime', Courier, monospace";
309
+ const COURIER_STACK = "'Courier Prime', 'Courier', monospace";
310
310
  useEffect(() => {
311
311
  const fontId = "google-font-courier-prime";
312
- const styleId = "screenplay-editor-force-font";
312
+ const styleId = "screenplay-editor-force-v4";
313
313
  if (!document.getElementById(fontId)) {
314
314
  const link = document.createElement("link");
315
315
  link.id = fontId;
@@ -321,15 +321,18 @@ function ScreenplayEditorView({
321
321
  const style = document.createElement("style");
322
322
  style.id = styleId;
323
323
  style.textContent = `
324
- .font-screenplay-container,
325
- .font-screenplay-container *,
326
- .font-screenplay-container [contenteditable] {
327
- font-family: ${screenplayFont} !important;
324
+ /* We target by the data-attribute to ensure the highest specificity possible */
325
+ [data-screenplay-editor] *,
326
+ [data-screenplay-editor] div,
327
+ [data-screenplay-editor] span,
328
+ [data-screenplay-editor] [contenteditable="true"] {
329
+ font-family: ${COURIER_STACK} !important;
330
+ -webkit-font-smoothing: antialiased;
328
331
  }
329
332
  `;
330
333
  document.head.appendChild(style);
331
334
  }
332
- }, [screenplayFont]);
335
+ }, [COURIER_STACK]);
333
336
  return /* @__PURE__ */ jsxs(Fragment, { children: [
334
337
  /* @__PURE__ */ jsx("div", { className: "sticky top-6 z-50 bg-white backdrop-blur-xl border border-white/10 rounded-full shadow-2xl flex gap-1 max-w-fit p-1.5 mb-12 select-none overflow-x-auto custom-scrollbar", children: blockTypes.map((type) => {
335
338
  var _a;
@@ -372,15 +375,16 @@ function ScreenplayEditorView({
372
375
  /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-12 w-full items-center pb-24", children: /* @__PURE__ */ jsx(
373
376
  "div",
374
377
  {
375
- className: "relative bg-[#fdfdfc] shadow-2xl shadow-zinc-300/60 border border-zinc-100 rounded-sm md:rounded-md pl-[1.5in] py-[1in] pr-[1in] flex flex-col w-[210mm] min-h-[297mm] shrink-0 font-screenplay-container",
378
+ className: "relative bg-[#fdfdfc] shadow-2xl shadow-zinc-300/60 border border-zinc-100 rounded-sm md:rounded-md pl-[1.5in] py-[1in] pr-[1in] flex flex-col w-[210mm] min-h-[297mm] shrink-0",
376
379
  style: {
377
- fontFamily: screenplayFont,
380
+ fontFamily: COURIER_STACK,
378
381
  paddingLeft: "1.5in",
379
382
  paddingRight: "1in",
380
383
  paddingTop: "1in",
381
384
  paddingBottom: "1in",
382
385
  lineHeight: "1.2"
383
386
  },
387
+ "data-screenplay-editor": "true",
384
388
  children: blocks.map((block) => {
385
389
  var _a, _b;
386
390
  return /* @__PURE__ */ jsx(