feat(css): add createId option

swordev · Dec 26, 2022 · 02740d8 · 02740d8
1 parent f428fe7
commit 02740d8
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 4 deletions.
diff --git a/.changeset/eleven-mugs-tap.md b/.changeset/eleven-mugs-tap.md
@@ -0,0 +1,5 @@
+---
+"@suid/css": minor
+---
+
+Add `createId` option
diff --git a/packages/css/src/createStyleObject.ts b/packages/css/src/createStyleObject.ts
@@ -22,14 +22,14 @@ export type StyleObjectOptions = {
   name: string;
   props: StyleProps;
   extraProperties?: Record<string, (value: any) => any>;
+  createId?: () => string;
   cache?: StyleObjectCache;
 };
 
-function create(name: string, rules: string) {
-  const id = randomString().slice(0, 6);
+function create(name: string, rules: string, id: string) {
   return {
     id,
-    name: name,
+    name,
     className: `${name}-${id}`,
     rules: rules.replaceAll(`$id`, `${id}`),
   };
@@ -48,7 +48,13 @@ function createStyleObject(options: StyleObjectOptions) {
     )
     .join("\n");
 
-  const styleObject = options.cache?.get(rules) || create(options.name, rules);
+  const styleObject =
+    options.cache?.get(rules) ||
+    create(
+      options.name,
+      rules,
+      options.createId ? options.createId() : randomString().slice(0, 6)
+    );
 
   if (options.cache) options.cache.set(rules, styleObject);