Migrated Rating

components/lib/theme/aura/index.js

@@ -37,6 +37,7 @@ import panelmenu from 'primevue/theme/aura/panelmenu';
 import picklist from 'primevue/theme/aura/picklist';
 import progressbar from 'primevue/theme/aura/progressbar';
 import progressspinner from 'primevue/theme/aura/progressspinner';
+import rating from 'primevue/theme/aura/rating';
 import scrollpanel from 'primevue/theme/aura/scrollpanel';
 import scrolltop from 'primevue/theme/aura/scrolltop';
 import sidebar from 'primevue/theme/aura/sidebar';
@@ -214,6 +215,7 @@ export default {
         picklist,
         progressbar,
         progressspinner,
+        rating,
         scrollpanel,
         scrolltop,
         skeleton,

components/lib/theme/aura/rating/index.js

@@ -0,0 +1,58 @@
+export default {
+    variables: {
+        colorScheme: {
+            light: {
+                icon: {
+                    color: '{surface.500}',
+                    colorHover: '{primary.color}',
+                    colorActive: '{primary.color}'
+                }
+            },
+            dark: {
+                icon: {
+                    color: '{surface.400}',
+                    colorHover: '{primary.color}',
+                    colorActive: '{primary.color}'
+                }
+            }
+        }
+    },
+    css: `
+.p-rating {
+    position: relative;
+    display: flex;
+    align-items: center;
+    gap: 0.25rem;
+}
+
+.p-rating-item {
+    display: inline-flex;
+    align-items: center;
+    cursor: pointer;
+    outline-color: transparent;
+    border-radius: 50%;
+    cursor: pointer;
+}
+
+.p-rating-item.p-focus-visible {
+    outline: var(--p-focus-ring-width) var(--p-focus-ring-style) var(--p-focus-ring-color);
+    outline-offset: var(--p-focus-ring-offset);
+}
+
+.p-rating-icon {
+    color: var(--p-rating-icon-color);
+    transition: background-color var(--p-transition-duration), color var(--p-transition-duration), border-color var(--p-transition-duration), outline-color var(--p-transition-duration);
+    font-size: 1rem;
+    width: 1rem;
+    height: 1rem;
+}
+
+.p-rating:not(.p-disabled):not(.p-readonly) .p-rating-item:hover .p-rating-icon {
+    color: var(--p-rating-icon-color-hover);
+}
+
+.p-rating-item-active .p-rating-icon {
+    color: var(--p-rating-icon-color-active);
+}
+`
+};

components/lib/theme/aura/rating/package.json

@@ -0,0 +1,6 @@
+{
+    "main": "./index.cjs.js",
+    "module": "./index.esm.js",
+    "unpkg": "./index.min.js",
+    "types": "./index.d.ts"
+}