fix: missing or duplicated namespaces (#181)

* fix: missing or duplicated namespaces
* resolveNamespace to minimal hashFragment

src/stories/UI/tableView.st.css

@@ -1,3 +1,5 @@
+@st-namespace "storiesTableView";
+
 @st-import TableView, [] from "../../TableView/tableView.st.css";
 
 .layoutExample {

src/styles/inputAdornment.st.css

@@ -1,4 +1,4 @@
-@st-namespace "shelleyIcon";
+@st-namespace "shelleyInputAdornment";
 /**
  * = InputAdornment - inputAdornment.st.css
  *

src/styles/mixins/formElements.st.css

@@ -1,3 +1,4 @@
+@st-namespace "formElementsMixin";
 /**
  * = FORM ELEMENTS - formElements.st.css
  *

src/styles/mixins/menuList.st.css

@@ -1,4 +1,5 @@
-/* = menuList.st.css. */
+@st-namespace "menuListMixin";
+
 @st-import [
   --spacing-unit,
   --color-focus,

src/styles/mixins/textVol.st.css

@@ -1,3 +1,4 @@
+@st-namespace "textVolMixin";
 /**
  * = TEXT MIXIN - /mixins/textVol.st.css
  *

src/styles/notification.st.css

@@ -1,3 +1,4 @@
+@st-namespace "shelleyNotification";
 /**
  * = Notification - notification.st.css
  *

src/styles/progressBar.st.css

@@ -1,4 +1,4 @@
-/* progressBar.st.css */
+@st-namespace "shelleyProgressBar";
 @st-import Shelley, [
   --color-ui-rgb-inverse,
   --color-ui-rgb,

src/styles/progressCircle.st.css

@@ -1,4 +1,4 @@
-@st-namespace "ShelleyProgressCircle";
+@st-namespace "shelleyProgressCircle";
 
 @st-import Shelley, [
   --color-ui-rgb,

src/styles/project.st.css

@@ -1,3 +1,4 @@
+@st-namespace "shelley";
 /**
  * Project - Shelley
  * 
@@ -7,7 +8,6 @@
  * Our Shelley styles set up some sensible defaults for an unbranded project, these 
  * can be overridden in branded project files.
  */
-@st-namespace "shelley";
 @st-import [multiply, divide, respScale] from "./formatters/common";
 
 /*=== BUILD-TIME 'VARIABLE' DEFINITIONS ===*/

src/styles/radio.st.css

@@ -1,4 +1,4 @@
-@st-namespace "adio";
+@st-namespace "shelleyRadio";
 /**
  * = Radio - radio.st.css
  *

src/styles/spacing.st.css

@@ -1,4 +1,4 @@
-@st-namespace "spacing";
+@st-namespace "shelleySpacing";
 /**
  * = spacing.st.css
  *

src/styles/visuallyHidden.st.css

@@ -1,4 +1,4 @@
-@st-namespace "visuallyHidden";
+@st-namespace "shelleyVisuallyHidden";
 /**
  * = VisuallyHidden - visuallyHidden.st.css
  *

stylable.config.cjs

@@ -1,6 +1,6 @@
 // @ts-check
-
 const { stcConfig } = require("@stylable/cli");
+const { createNamespaceStrategy } = require("@stylable/core");
 
 exports.stcConfig = stcConfig({
   options: {
@@ -9,3 +9,31 @@ exports.stcConfig = stcConfig({
     dts: true,
   },
 });
+
+/**
+ * Normalizes paths by ensuring they use a consistent separator and potentially
+ * applying other transformations as needed.
+ * @param {string} dirPath - The directory path.
+ * @param {string} filePath - The file path relative to the directory.
+ * @returns {string} - The normalized path.
+ */
+function normalizePath(dirPath, filePath) {
+  // Example: Normalize path separators to forward slashes for consistency
+  const normalizedDirPath = dirPath.replace(/\\/g, "/");
+  const normalizedFilePath = filePath.replace(/\\/g, "/");
+
+  // Combine and return the normalized path
+  // This is a simplistic approach; adjust based on your specific needs
+  return `${normalizedDirPath}/${normalizedFilePath}`;
+}
+
+module.exports.defaultConfig = (fs) => {
+  return {
+    // set a custom namespace resolver
+    resolveNamespace: createNamespaceStrategy({
+      strict: true,
+      hashFragment: "minimal",
+      normalizePath: normalizePath,
+    }),
+  };
+};