Components vs Rulesets

Spoiler alert: They're the same thing, but context matters.

Selectoplasm specifically deals with the CSS portion of what you would call a single file component in Vue or Svelte. That is, you handle the HTML and javascript in your project, and selectoplasm takes care of the CSS, and saves it to a separate file. (You might wonder what the benefit of this is. Check the FAQ if so.)

Additionally, Selectoplasm makes use of nested CSS while building components. So moving forward, whenever Selectoplasm uses the word "component", it specifically means a CSS ruleset which appears in your component library in Selectoplasm. It may have nested rulesets, but since these are treated as part of the component, Selectoplasm refers to them as rulesets. Here's an example:

/* component */
article {
   padding: 1px;

   /* ruleset */
   header {
      font-weight: bold;
   }

   /* ruleset */
   footer {
      background-color: blue;
   }
}

There is no difference in functionality; the terminology is solely to help distinguish between root level and nested rulesets.