Adding outline-purple-dark-mode-button (#622)

Author: emilmilanov

.changeset/fancy-swans-refuse.md

@@ -0,0 +1,7 @@
+---
+'@cypress-design/constants-button': minor
+'@cypress-design/react-button': minor
+'@cypress-design/vue-button': minor
+---
+
+Adding outline-purple-dark-mode button

components/Button/constants/src/index.ts

@@ -63,6 +63,8 @@ export const CssVariantClassesTable = {
     'text-jade-400 border-jade-400 disabled:hocus:shadow-none hocus:shadow-jade-300/35 disabled:text-gray-700 disabled:border-white/20 focus:ring-jade-600',
   'outline-indigo-dark-mode':
     'text-indigo-300 border-indigo-400 disabled:hocus:shadow-none hocus:shadow-indigo-400/40 disabled:text-gray-700 disabled:border-white/20 focus:ring-indigo-300',
+  'outline-purple-dark-mode':
+    'text-purple-300 border-purple-400 disabled:hocus:shadow-none hocus:shadow-purple-400/40 disabled:text-gray-700 disabled:border-white/20 focus:ring-purple-300',
   'outline-dark':
     'text-white border-white/20 hocus:border-white/60 disabled:hocus:shadow-none hocus:shadow-white/20 disabled:text-gray-700 disabled:hocus:border-white/20 disabled:border-white/20 focus:ring-gray-200',
   'indigo-dark-mode':

components/Button/react/Button.rootstory.tsx

@@ -23,6 +23,7 @@ export default ({
                   variant === 'outline-red-dark-mode' ||
                   variant === 'outline-jade-dark-mode' ||
                   variant === 'outline-indigo-dark-mode' ||
+                  variant === 'outline-purple-dark-mode' ||
                   variant === 'red-dark-mode' ||
                   variant === 'indigo-dark-mode' ||
                   variant === 'disabled-dark-mode',
@@ -42,6 +43,7 @@ export default ({
                           variant === 'outline-red-dark-mode' ||
                           variant === 'outline-jade-dark-mode' ||
                           variant === 'outline-indigo-dark-mode' ||
+                          variant === 'outline-purple-dark-mode' ||
                           variant === 'red-dark-mode' ||
                           variant === 'indigo-dark-mode' ||
                           variant === 'disabled-dark-mode',

components/Button/react/ReadMe.md

@@ -73,6 +73,7 @@ export default () => {
               variant === 'outline-red-dark-mode' ||
               variant === 'outline-jade-dark-mode' ||
               variant === 'outline-indigo-dark-mode' ||
+              variant === 'outline-purple-dark-mode' ||
               variant === 'red-dark-mode' ||
               variant === 'indigo-dark-mode' ||
               variant === 'disabled-dark-mode'
@@ -83,6 +84,7 @@ export default () => {
               variant === 'outline-red-dark-mode' ||
               variant === 'outline-jade-dark-mode' ||
               variant === 'outline-indigo-dark-mode' ||
+              variant === 'outline-purple-dark-mode' ||
               variant === 'red-dark-mode' ||
               variant === 'indigo-dark-mode' ||
               variant === 'disabled-dark-mode'

components/Button/vue/Button.rootstory.tsx

@@ -20,6 +20,7 @@ export default ({
                   variant === 'outline-red-dark-mode' ||
                   variant === 'outline-jade-dark-mode' ||
                   variant === 'outline-indigo-dark-mode' ||
+                  variant === 'outline-purple-dark-mode' ||
                   variant === 'red-dark-mode' ||
                   variant === 'indigo-dark-mode' ||
                   variant === 'disabled-dark-mode',
@@ -39,6 +40,7 @@ export default ({
                           variant === 'outline-red-dark-mode' ||
                           variant === 'outline-jade-dark-mode' ||
                           variant === 'outline-indigo-dark-mode' ||
+                          variant === 'outline-purple-dark-mode' ||
                           variant === 'red-dark-mode' ||
                           variant === 'indigo-dark-mode' ||
                           variant === 'disabled-dark-mode',
@@ -47,6 +49,7 @@ export default ({
                           'outline-red-dark-mode',
                           'outline-jade-dark-mode',
                           'outline-indigo-dark-mode',
+                          'outline-purple-dark-mode',
                           'red-dark-mode',
                           'indigo-dark-mode',
                           'disabled-dark-mode',

components/Button/vue/ReadMe.md

@@ -76,6 +76,7 @@ import {
           variant === 'outline-red-dark-mode' ||
           variant === 'outline-jade-dark-mode' ||
           variant === 'outline-indigo-dark-mode' ||
+          variant === 'outline-purple-dark-mode' ||
           variant === 'red-dark-mode' ||
           variant === 'indigo-dark-mode' ||
           variant === 'disabled-dark-mode',
@@ -84,6 +85,7 @@ import {
           'outline-red-dark-mode',
           'outline-jade-dark-mode',
           'outline-indigo-dark-mode',
+          'outline-purple-dark-mode',
           'red-dark-mode',
           'indigo-dark-mode',
           'disabled-dark-mode',