storybook-addon-pseudo-states 1.15.2--canary.45.07abc1b.0 → 1.15.2--canary.45.e370b20.0

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.
@@ -8,8 +8,8 @@ const ADDON_ID = "storybook/pseudo-states";
8
8
  exports.ADDON_ID = ADDON_ID;
9
9
  const TOOL_ID = `${ADDON_ID}/tool`;
10
10
 
11
- // Pseudo-classes, which are not allowed to have classes applied on
12
- // e.g. ::-webkit-scrollbar-thumb.pseudo-hover is not a valid selector
11
+ // Pseudo-elements which are not allowed to have classes applied on them
12
+ // E.g. ::-webkit-scrollbar-thumb.pseudo-hover is not a valid selector
13
13
  exports.TOOL_ID = TOOL_ID;
14
14
  const EXCLUDED_PSEUDO_ELEMENTS = ["::-webkit-scrollbar-thumb"];
15
15
 
@@ -16,6 +16,7 @@ const warnOnce = message => {
16
16
  console.warn(message);
17
17
  warnings.add(message);
18
18
  };
19
+ const isExcludedPseudoElement = pseudoState => _constants.EXCLUDED_PSEUDO_ELEMENTS.some(element => selector.endsWith(`${element}:${pseudoState}`));
19
20
  const rewriteRule = (cssText, selectorText, shadowRoot) => {
20
21
  return cssText.replace(selectorText, (0, _splitSelectors.splitSelectors)(selectorText).flatMap(selector => {
21
22
  if (selector.includes(".pseudo-")) {
@@ -29,20 +30,12 @@ const rewriteRule = (cssText, selectorText, shadowRoot) => {
29
30
  states.push(state);
30
31
  return "";
31
32
  });
32
- const getDoesSelectorEndsWithExcludedPseudoElement = pseudo => _constants.EXCLUDED_PSEUDO_ELEMENTS.some(element => {
33
- return selector.endsWith(`${element}:${pseudo}`);
34
- });
35
- const classSelector = states.reduce((acc, state) => {
36
- if (getDoesSelectorEndsWithExcludedPseudoElement(state)) {
37
- return undefined;
38
- }
39
- return acc.replace(new RegExp(`(?<!Y):${state}`, "g"), `.pseudo-${state}`);
40
- }, selector);
33
+ const classSelector = states.reduce((acc, state) => !isExcludedPseudoElement(state) && acc.replace(new RegExp(`(?<!Y):${state}`, "g"), `.pseudo-${state}`), selector);
41
34
  if (selector.startsWith(":host(") || selector.startsWith("::slotted(")) {
42
- return [selector, classSelector];
35
+ return [selector, classSelector].filter(Boolean);
43
36
  }
44
37
  const ancestorSelector = shadowRoot ? `:host(${states.map(s => `.pseudo-${s}`).join("")}) ${plainSelector}` : `${states.map(s => `.pseudo-${s}`).join("")} ${plainSelector}`;
45
- return [selector, classSelector, ancestorSelector].filter(selector => !selector?.includes(":not()")).filter(Boolean);
38
+ return [selector, classSelector, ancestorSelector].filter(selector => selector && !selector.includes(":not()"));
46
39
  }).join(", "));
47
40
  };
48
41
 
@@ -1,8 +1,8 @@
1
1
  export const ADDON_ID = "storybook/pseudo-states";
2
2
  export const TOOL_ID = `${ADDON_ID}/tool`;
3
3
 
4
- // Pseudo-classes, which are not allowed to have classes applied on
5
- // e.g. ::-webkit-scrollbar-thumb.pseudo-hover is not a valid selector
4
+ // Pseudo-elements which are not allowed to have classes applied on them
5
+ // E.g. ::-webkit-scrollbar-thumb.pseudo-hover is not a valid selector
6
6
  export const EXCLUDED_PSEUDO_ELEMENTS = ["::-webkit-scrollbar-thumb"];
7
7
 
8
8
  // Dynamic pseudo-classes
@@ -10,6 +10,7 @@ const warnOnce = message => {
10
10
  console.warn(message);
11
11
  warnings.add(message);
12
12
  };
13
+ const isExcludedPseudoElement = pseudoState => EXCLUDED_PSEUDO_ELEMENTS.some(element => selector.endsWith(`${element}:${pseudoState}`));
13
14
  const rewriteRule = (cssText, selectorText, shadowRoot) => {
14
15
  return cssText.replace(selectorText, splitSelectors(selectorText).flatMap(selector => {
15
16
  if (selector.includes(".pseudo-")) {
@@ -23,20 +24,12 @@ const rewriteRule = (cssText, selectorText, shadowRoot) => {
23
24
  states.push(state);
24
25
  return "";
25
26
  });
26
- const getDoesSelectorEndsWithExcludedPseudoElement = pseudo => EXCLUDED_PSEUDO_ELEMENTS.some(element => {
27
- return selector.endsWith(`${element}:${pseudo}`);
28
- });
29
- const classSelector = states.reduce((acc, state) => {
30
- if (getDoesSelectorEndsWithExcludedPseudoElement(state)) {
31
- return undefined;
32
- }
33
- return acc.replace(new RegExp(`(?<!Y):${state}`, "g"), `.pseudo-${state}`);
34
- }, selector);
27
+ const classSelector = states.reduce((acc, state) => !isExcludedPseudoElement(state) && acc.replace(new RegExp(`(?<!Y):${state}`, "g"), `.pseudo-${state}`), selector);
35
28
  if (selector.startsWith(":host(") || selector.startsWith("::slotted(")) {
36
- return [selector, classSelector];
29
+ return [selector, classSelector].filter(Boolean);
37
30
  }
38
31
  const ancestorSelector = shadowRoot ? `:host(${states.map(s => `.pseudo-${s}`).join("")}) ${plainSelector}` : `${states.map(s => `.pseudo-${s}`).join("")} ${plainSelector}`;
39
- return [selector, classSelector, ancestorSelector].filter(selector => !selector?.includes(":not()")).filter(Boolean);
32
+ return [selector, classSelector, ancestorSelector].filter(selector => selector && !selector.includes(":not()"));
40
33
  }).join(", "));
41
34
  };
42
35
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "storybook-addon-pseudo-states",
3
- "version": "1.15.2--canary.45.07abc1b.0",
3
+ "version": "1.15.2--canary.45.e370b20.0",
4
4
  "description": "CSS pseudo states for Storybook",
5
5
  "keywords": [
6
6
  "storybook-addons",