storybook 9.1.0-alpha.2 → 9.1.0-alpha.4

package/dist/backgrounds/index.js

@@ -1,130 +0,0 @@
-var U = Object.defineProperty;
-var a = (e, t) => U(e, "name", { value: t, configurable: !0 });
-
-// src/backgrounds/preview.ts
-import { definePreview as V } from "storybook/preview-api";
-
-// src/backgrounds/constants.ts
-var z = "storybook/background", c = "backgrounds";
-var W = {
-  UPDATE: `${z}/update`
-};
-
-// src/backgrounds/decorator.ts
-import { useEffect as L } from "storybook/preview-api";
-
-// src/backgrounds/defaults.ts
-var R = {
-  light: { name: "light", value: "#F8F8F8" },
-  dark: { name: "dark", value: "#333" }
-};
-
-// src/backgrounds/utils.ts
-var { document: n } = globalThis, P = /* @__PURE__ */ a(() => globalThis?.matchMedia ? !!globalThis.matchMedia("(prefers-reduced-motion: red\
-uce)")?.matches : !1, "isReduceMotionEnabled"), k = /* @__PURE__ */ a((e) => {
-  (Array.isArray(e) ? e : [e]).forEach(N);
-}, "clearStyles"), N = /* @__PURE__ */ a((e) => {
-  if (!n)
-    return;
-  let t = n.getElementById(e);
-  t && t.parentElement && t.parentElement.removeChild(t);
-}, "clearStyle"), D = /* @__PURE__ */ a((e, t) => {
-  if (!n)
-    return;
-  let i = n.getElementById(e);
-  if (i)
-    i.innerHTML !== t && (i.innerHTML = t);
-  else {
-    let r = n.createElement("style");
-    r.setAttribute("id", e), r.innerHTML = t, n.head.appendChild(r);
-  }
-}, "addGridStyle"), _ = /* @__PURE__ */ a((e, t, i) => {
-  if (!n)
-    return;
-  let r = n.getElementById(e);
-  if (r)
-    r.innerHTML !== t && (r.innerHTML = t);
-  else {
-    let o = n.createElement("style");
-    o.setAttribute("id", e), o.innerHTML = t;
-    let d = `addon-backgrounds-grid${i ? `-docs-${i}` : ""}`, l = n.getElementById(d);
-    l ? l.parentElement?.insertBefore(o, l) : n.head.appendChild(o);
-  }
-}, "addBackgroundStyle");
-
-// src/backgrounds/decorator.ts
-var Y = {
-  cellSize: 100,
-  cellAmount: 10,
-  opacity: 0.8
-}, v = "addon-backgrounds", C = "addon-backgrounds-grid", j = P() ? "" : "transition: background-color 0.3s;", w = /* @__PURE__ */ a((e, t) => {
-  let { globals: i = {}, parameters: r = {}, viewMode: o, id: d } = t, {
-    options: l = R,
-    disable: I,
-    grid: H = Y
-  } = r[c] || {}, p = i[c] || {}, S = typeof p == "string" ? p : p?.value, y = S ? l[S] : void 0, E = typeof y == "string" ? y : y?.value ||
-  "transparent", A = typeof p == "string" ? !1 : p.grid || !1, h = !!y && !I, B = o === "docs" ? `#anchor--${d} .docs-story` : ".sb-show-mai\
-n", M = o === "docs" ? `#anchor--${d} .docs-story` : ".sb-show-main", K = r.layout === void 0 || r.layout === "padded", G = o === "docs" ? 20 :
-  K ? 16 : 0, { cellAmount: g, cellSize: s, opacity: u, offsetX: m = G, offsetY: f = G } = H, b = o === "docs" ? `${v}-docs-${d}` : `${v}-co\
-lor`, T = o === "docs" ? d : null;
-  L(() => {
-    let $ = `
-    ${B} {
-      background: ${E} !important;
-      ${j}
-      }`;
-    if (!h) {
-      k(b);
-      return;
-    }
-    _(b, $, T);
-  }, [B, b, T, h, E]);
-  let x = o === "docs" ? `${C}-docs-${d}` : `${C}`;
-  return L(() => {
-    if (!A) {
-      k(x);
-      return;
-    }
-    let $ = [
-      `${s * g}px ${s * g}px`,
-      `${s * g}px ${s * g}px`,
-      `${s}px ${s}px`,
-      `${s}px ${s}px`
-    ].join(", "), O = `
-        ${M} {
-          background-size: ${$} !important;
-          background-position: ${m}px ${f}px, ${m}px ${f}px, ${m}px ${f}px, ${m}px ${f}px !important;
-          background-blend-mode: difference !important;
-          background-image: linear-gradient(rgba(130, 130, 130, ${u}) 1px, transparent 1px),
-           linear-gradient(90deg, rgba(130, 130, 130, ${u}) 1px, transparent 1px),
-           linear-gradient(rgba(130, 130, 130, ${u / 2}) 1px, transparent 1px),
-           linear-gradient(90deg, rgba(130, 130, 130, ${u / 2}) 1px, transparent 1px) !important;
-        }
-      `;
-    D(x, O);
-  }, [g, s, M, x, A, m, f, u]), e();
-}, "withBackgroundAndGrid");
-
-// src/backgrounds/preview.ts
-var X = globalThis.FEATURES?.backgrounds ? [w] : [], q = {
-  [c]: {
-    grid: {
-      cellSize: 20,
-      opacity: 0.5,
-      cellAmount: 5
-    },
-    disable: !1
-  }
-}, J = {
-  [c]: { value: void 0, grid: !1 }
-}, F = /* @__PURE__ */ a(() => V({
-  decorators: X,
-  parameters: q,
-  initialGlobals: J
-}), "default");
-
-// src/backgrounds/index.ts
-var ft = F;
-export {
-  ft as default
-};

package/dist/backgrounds/preview.cjs

@@ -1,31 +1,31 @@
 "use strict";
 var b = Object.defineProperty;
-var z = Object.getOwnPropertyDescriptor;
-var N = Object.getOwnPropertyNames;
+var U = Object.getOwnPropertyDescriptor;
+var z = Object.getOwnPropertyNames;
 var Y = Object.prototype.hasOwnProperty;
-var i = (e, t) => b(e, "name", { value: t, configurable: !0 });
-var j = (e, t) => {
-  for (var n in t)
-    b(e, n, { get: t[n], enumerable: !0 });
-}, V = (e, t, n, o) => {
-  if (t && typeof t == "object" || typeof t == "function")
-    for (let r of N(t))
-      !Y.call(e, r) && r !== n && b(e, r, { get: () => t[r], enumerable: !(o = z(t, r)) || o.enumerable });
-  return e;
+var s = (t, e) => b(t, "name", { value: e, configurable: !0 });
+var j = (t, e) => {
+  for (var n in e)
+    b(t, n, { get: e[n], enumerable: !0 });
+}, V = (t, e, n, o) => {
+  if (e && typeof e == "object" || typeof e == "function")
+    for (let r of z(e))
+      !Y.call(t, r) && r !== n && b(t, r, { get: () => e[r], enumerable: !(o = U(e, r)) || o.enumerable });
+  return t;
 };
-var X = (e) => V(b({}, "__esModule", { value: !0 }), e);
+var X = (t) => V(b({}, "__esModule", { value: !0 }), t);
 
 // src/backgrounds/preview.ts
-var ot = {};
-j(ot, {
-  default: () => rt
+var oe = {};
+j(oe, {
+  default: () => re
 });
-module.exports = X(ot);
-var I = require("storybook/preview-api");
+module.exports = X(oe);
+var I = require("storybook/internal/csf");
 
 // src/backgrounds/constants.ts
 var q = "storybook/background", c = "backgrounds";
-var at = {
+var ae = {
   UPDATE: `${q}/update`
 };
 
@@ -39,33 +39,33 @@ var P = {
 };
 
 // src/backgrounds/utils.ts
-var { document: a } = globalThis, _ = /* @__PURE__ */ i(() => globalThis?.matchMedia ? !!globalThis.matchMedia("(prefers-reduced-motion: red\
-uce)")?.matches : !1, "isReduceMotionEnabled"), S = /* @__PURE__ */ i((e) => {
-  (Array.isArray(e) ? e : [e]).forEach(J);
-}, "clearStyles"), J = /* @__PURE__ */ i((e) => {
+var { document: a } = globalThis, _ = /* @__PURE__ */ s(() => globalThis?.matchMedia ? !!globalThis.matchMedia("(prefers-reduced-motion: red\
+uce)")?.matches : !1, "isReduceMotionEnabled"), S = /* @__PURE__ */ s((t) => {
+  (Array.isArray(t) ? t : [t]).forEach(J);
+}, "clearStyles"), J = /* @__PURE__ */ s((t) => {
   if (!a)
     return;
-  let t = a.getElementById(e);
-  t && t.parentElement && t.parentElement.removeChild(t);
-}, "clearStyle"), L = /* @__PURE__ */ i((e, t) => {
+  let e = a.getElementById(t);
+  e && e.parentElement && e.parentElement.removeChild(e);
+}, "clearStyle"), L = /* @__PURE__ */ s((t, e) => {
   if (!a)
     return;
-  let n = a.getElementById(e);
+  let n = a.getElementById(t);
   if (n)
-    n.innerHTML !== t && (n.innerHTML = t);
+    n.innerHTML !== e && (n.innerHTML = e);
   else {
     let o = a.createElement("style");
-    o.setAttribute("id", e), o.innerHTML = t, a.head.appendChild(o);
+    o.setAttribute("id", t), o.innerHTML = e, a.head.appendChild(o);
   }
-}, "addGridStyle"), v = /* @__PURE__ */ i((e, t, n) => {
+}, "addGridStyle"), v = /* @__PURE__ */ s((t, e, n) => {
   if (!a)
     return;
-  let o = a.getElementById(e);
+  let o = a.getElementById(t);
   if (o)
-    o.innerHTML !== t && (o.innerHTML = t);
+    o.innerHTML !== e && (o.innerHTML = e);
   else {
     let r = a.createElement("style");
-    r.setAttribute("id", e), r.innerHTML = t;
+    r.setAttribute("id", t), r.innerHTML = e;
     let d = `addon-backgrounds-grid${n ? `-docs-${n}` : ""}`, l = a.getElementById(d);
     l ? l.parentElement?.insertBefore(r, l) : a.head.appendChild(r);
   }
@@ -76,42 +76,42 @@ var Q = {
   cellSize: 100,
   cellAmount: 10,
   opacity: 0.8
-}, C = "addon-backgrounds", w = "addon-backgrounds-grid", W = _() ? "" : "transition: background-color 0.3s;", F = /* @__PURE__ */ i((e, t) => {
-  let { globals: n = {}, parameters: o = {}, viewMode: r, id: d } = t, {
+}, C = "addon-backgrounds", w = "addon-backgrounds-grid", W = _() ? "" : "transition: background-color 0.3s;", F = /* @__PURE__ */ s((t, e) => {
+  let { globals: n = {}, parameters: o = {}, viewMode: r, id: d } = e, {
     options: l = P,
-    disable: H,
-    grid: K = Q
-  } = o[c] || {}, p = n[c] || {}, A = typeof p == "string" ? p : p?.value, y = A ? l[A] : void 0, h = typeof y == "string" ? y : y?.value ||
-  "transparent", B = typeof p == "string" ? !1 : p.grid || !1, M = !!y && !H, T = r === "docs" ? `#anchor--${d} .docs-story` : ".sb-show-mai\
-n", G = r === "docs" ? `#anchor--${d} .docs-story` : ".sb-show-main", O = o.layout === void 0 || o.layout === "padded", R = r === "docs" ? 20 :
-  O ? 16 : 0, { cellAmount: g, cellSize: s, opacity: u, offsetX: m = R, offsetY: f = R } = K, x = r === "docs" ? `${C}-docs-${d}` : `${C}-co\
+    disable: N,
+    grid: H = Q
+  } = o[c] || {}, p = n[c] || {}, A = typeof p == "string" ? p : p?.value, y = A ? l[A] : void 0, B = typeof y == "string" ? y : y?.value ||
+  "transparent", h = typeof p == "string" ? !1 : p.grid || !1, T = !!y && !N, M = r === "docs" ? `#anchor--${d} .docs-story` : ".sb-show-mai\
+n", G = r === "docs" ? `#anchor--${d} .docs-story` : ".sb-show-main", K = o.layout === void 0 || o.layout === "padded", R = r === "docs" ? 20 :
+  K ? 16 : 0, { cellAmount: g, cellSize: i, opacity: u, offsetX: m = R, offsetY: f = R } = H, x = r === "docs" ? `${C}-docs-${d}` : `${C}-co\
 lor`, D = r === "docs" ? d : null;
   (0, E.useEffect)(() => {
-    let k = `
-    ${T} {
-      background: ${h} !important;
+    let $ = `
+    ${M} {
+      background: ${B} !important;
       ${W}
       }`;
-    if (!M) {
+    if (!T) {
       S(x);
       return;
     }
-    v(x, k, D);
-  }, [T, x, D, M, h]);
-  let $ = r === "docs" ? `${w}-docs-${d}` : `${w}`;
+    v(x, $, D);
+  }, [M, x, D, T, B]);
+  let k = r === "docs" ? `${w}-docs-${d}` : `${w}`;
   return (0, E.useEffect)(() => {
-    if (!B) {
-      S($);
+    if (!h) {
+      S(k);
       return;
     }
-    let k = [
-      `${s * g}px ${s * g}px`,
-      `${s * g}px ${s * g}px`,
-      `${s}px ${s}px`,
-      `${s}px ${s}px`
-    ].join(", "), U = `
+    let $ = [
+      `${i * g}px ${i * g}px`,
+      `${i * g}px ${i * g}px`,
+      `${i}px ${i}px`,
+      `${i}px ${i}px`
+    ].join(", "), O = `
         ${G} {
-          background-size: ${k} !important;
+          background-size: ${$} !important;
           background-position: ${m}px ${f}px, ${m}px ${f}px, ${m}px ${f}px, ${m}px ${f}px !important;
           background-blend-mode: difference !important;
           background-image: linear-gradient(rgba(130, 130, 130, ${u}) 1px, transparent 1px),
@@ -120,12 +120,12 @@ lor`, D = r === "docs" ? d : null;
            linear-gradient(90deg, rgba(130, 130, 130, ${u / 2}) 1px, transparent 1px) !important;
         }
       `;
-    L($, U);
-  }, [g, s, G, $, B, m, f, u]), e();
+    L(k, O);
+  }, [g, i, G, k, h, m, f, u]), t();
 }, "withBackgroundAndGrid");
 
 // src/backgrounds/preview.ts
-var Z = globalThis.FEATURES?.backgrounds ? [F] : [], tt = {
+var Z = globalThis.FEATURES?.backgrounds ? [F] : [], ee = {
   [c]: {
     grid: {
       cellSize: 20,
@@ -134,10 +134,10 @@ var Z = globalThis.FEATURES?.backgrounds ? [F] : [], tt = {
     },
     disable: !1
   }
-}, et = {
+}, te = {
   [c]: { value: void 0, grid: !1 }
-}, rt = /* @__PURE__ */ i(() => (0, I.definePreview)({
+}, re = /* @__PURE__ */ s(() => (0, I.definePreviewAddon)({
   decorators: Z,
-  parameters: tt,
-  initialGlobals: et
+  parameters: ee,
+  initialGlobals: te
 }), "default");