storybook-addon-pseudo-states 2.1.0 → 2.1.1--canary.7274efd.0

package/dist/preview.js

@@ -89,7 +89,7 @@ var warnOnce = (message) => {
   warnings.add(message);
 };
 var isExcludedPseudoElement = (selector, pseudoState) => EXCLUDED_PSEUDO_ELEMENTS.some((element) => selector.endsWith(`${element}:${pseudoState}`));
-var rewriteRule = ({ cssText, selectorText }, shadowRoot) => {
+var rewriteRule = ({ cssText, selectorText }, { shadowRoot, pseudo }) => {
   return cssText.replace(
     selectorText,
     splitSelectors(selectorText).flatMap((selector) => {
@@ -113,16 +113,19 @@ var rewriteRule = ({ cssText, selectorText }, shadowRoot) => {
         return [selector, classSelector].filter(Boolean);
       }
       const ancestorSelector = shadowRoot ? `:host(${states.map((s) => `.pseudo-${s}`).join("")}) ${plainSelector}` : `${states.map((s) => `.pseudo-${s}`).join("")} ${plainSelector}`;
-      return [selector, classSelector, ancestorSelector].filter(
+      const includeAncestor = !pseudo || states.some((state) => pseudo[state] === true);
+      const selectors = [
+        selector,
+        classSelector,
+        ...includeAncestor ? [ancestorSelector] : []
+      ];
+      return selectors.filter(
         (selector2) => selector2 && !selector2.includes(":not()")
       );
     }).join(", ")
   );
 };
-var rewriteStyleSheet = (sheet, shadowRoot, shadowHosts2) => {
-  if (sheet.__pseudoStatesRewritten)
-    return;
-  sheet.__pseudoStatesRewritten = true;
+var rewriteStyleSheet = (sheet, shadowRoot, shadowHosts2, pseudo) => {
   try {
     let index = -1;
     for (const cssRule of sheet.cssRules) {
@@ -131,7 +134,7 @@ var rewriteStyleSheet = (sheet, shadowRoot, shadowHosts2) => {
         continue;
       const styleRule = cssRule;
       if (matchOne.test(styleRule.selectorText)) {
-        const newRule = rewriteRule(styleRule, shadowRoot);
+        const newRule = rewriteRule(styleRule, { shadowRoot, pseudo });
         sheet.deleteRule(index);
         sheet.insertRule(newRule, index);
         if (shadowRoot && shadowHosts2)
@@ -226,10 +229,11 @@ var withPseudoState = (StoryFn, { viewMode, parameters, id, globals: globalsArgs
   return StoryFn();
 };
 var rewriteStyleSheets = (shadowRoot) => {
+  const pseudo = channel.data.storyPrepared[0].parameters.pseudo;
   let styleSheets = Array.from(shadowRoot ? shadowRoot.styleSheets : document.styleSheets);
   if (shadowRoot?.adoptedStyleSheets?.length)
     styleSheets = shadowRoot.adoptedStyleSheets;
-  styleSheets.forEach((sheet) => rewriteStyleSheet(sheet, shadowRoot, shadowHosts));
+  styleSheets.forEach((sheet) => rewriteStyleSheet(sheet, shadowRoot, shadowHosts, pseudo));
 };
 channel.on(import_core_events.STORY_CHANGED, () => shadowHosts.clear());
 channel.on(import_core_events.STORY_RENDERED, () => rewriteStyleSheets());

package/dist/preview.mjs

@@ -57,7 +57,7 @@ var warnOnce = (message) => {
   warnings.add(message);
 };
 var isExcludedPseudoElement = (selector, pseudoState) => EXCLUDED_PSEUDO_ELEMENTS.some((element) => selector.endsWith(`${element}:${pseudoState}`));
-var rewriteRule = ({ cssText, selectorText }, shadowRoot) => {
+var rewriteRule = ({ cssText, selectorText }, { shadowRoot, pseudo }) => {
   return cssText.replace(
     selectorText,
     splitSelectors(selectorText).flatMap((selector) => {
@@ -81,16 +81,19 @@ var rewriteRule = ({ cssText, selectorText }, shadowRoot) => {
         return [selector, classSelector].filter(Boolean);
       }
       const ancestorSelector = shadowRoot ? `:host(${states.map((s) => `.pseudo-${s}`).join("")}) ${plainSelector}` : `${states.map((s) => `.pseudo-${s}`).join("")} ${plainSelector}`;
-      return [selector, classSelector, ancestorSelector].filter(
+      const includeAncestor = !pseudo || states.some((state) => pseudo[state] === true);
+      const selectors = [
+        selector,
+        classSelector,
+        ...includeAncestor ? [ancestorSelector] : []
+      ];
+      return selectors.filter(
         (selector2) => selector2 && !selector2.includes(":not()")
       );
     }).join(", ")
   );
 };
-var rewriteStyleSheet = (sheet, shadowRoot, shadowHosts2) => {
-  if (sheet.__pseudoStatesRewritten)
-    return;
-  sheet.__pseudoStatesRewritten = true;
+var rewriteStyleSheet = (sheet, shadowRoot, shadowHosts2, pseudo) => {
   try {
     let index = -1;
     for (const cssRule of sheet.cssRules) {
@@ -99,7 +102,7 @@ var rewriteStyleSheet = (sheet, shadowRoot, shadowHosts2) => {
         continue;
       const styleRule = cssRule;
       if (matchOne.test(styleRule.selectorText)) {
-        const newRule = rewriteRule(styleRule, shadowRoot);
+        const newRule = rewriteRule(styleRule, { shadowRoot, pseudo });
         sheet.deleteRule(index);
         sheet.insertRule(newRule, index);
         if (shadowRoot && shadowHosts2)
@@ -194,10 +197,11 @@ var withPseudoState = (StoryFn, { viewMode, parameters, id, globals: globalsArgs
   return StoryFn();
 };
 var rewriteStyleSheets = (shadowRoot) => {
+  const pseudo = channel.data.storyPrepared[0].parameters.pseudo;
   let styleSheets = Array.from(shadowRoot ? shadowRoot.styleSheets : document.styleSheets);
   if (shadowRoot?.adoptedStyleSheets?.length)
     styleSheets = shadowRoot.adoptedStyleSheets;
-  styleSheets.forEach((sheet) => rewriteStyleSheet(sheet, shadowRoot, shadowHosts));
+  styleSheets.forEach((sheet) => rewriteStyleSheet(sheet, shadowRoot, shadowHosts, pseudo));
 };
 channel.on(STORY_CHANGED, () => shadowHosts.clear());
 channel.on(STORY_RENDERED, () => rewriteStyleSheets());

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "storybook-addon-pseudo-states",
-  "version": "2.1.0",
+  "version": "2.1.1--canary.7274efd.0",
   "description": "CSS pseudo states for Storybook",
   "keywords": [
     "storybook-addons",