diff --git a/components/lib/basecomponent/BaseComponent.vue b/components/lib/basecomponent/BaseComponent.vue
index d3d1dbb79..59e30e904 100644
--- a/components/lib/basecomponent/BaseComponent.vue
+++ b/components/lib/basecomponent/BaseComponent.vue
@@ -437,7 +437,7 @@ export default {
             const getValue = (...args) => {
                 const value = this._getOptionValue(...args);
 
-                return ObjectUtils.isString(value) ? { class: value } : value;
+                return ObjectUtils.isString(value) || ObjectUtils.isArray(value) ? { class: value } : value;
             };
 
             const datasetPrefix = 'data-pc-';
diff --git a/components/lib/basedirective/BaseDirective.js b/components/lib/basedirective/BaseDirective.js
index 6575d4d11..9a774e5c5 100644
--- a/components/lib/basedirective/BaseDirective.js
+++ b/components/lib/basedirective/BaseDirective.js
@@ -18,7 +18,7 @@ const BaseDirective = {
         const getValue = (...args) => {
             const value = BaseDirective._getOptionValue(...args);
 
-            return ObjectUtils.isString(value) ? { class: value } : value;
+            return ObjectUtils.isString(value) || ObjectUtils.isArray(value) ? { class: value } : value;
         };
 
         const datasetPrefix = 'data-pc-';