@magicgol/polyjuice 0.3.0 → 0.4.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@magicgol/polyjuice",
-  "version": "0.3.0",
+  "version": "0.4.0",
   "scripts": {
     "serve": "vue-cli-service serve",
     "build": "vue-cli-service build",

package/src/assets/palette.scss

@@ -1,3 +1,10 @@
 $palette: (
     'brand': #d81159,
+    'warning': #ff614c,
+    'success': #349B50,
+    'info': #004781,
+    'goalkeeper': #ffc700,
+    'defender': #3de000,
+    'midfielder': #116dd8,
+    'forward': #f30026,
 );

package/src/components/card/vertical-card/VCard.stories.js

@@ -2,7 +2,7 @@ import MgVCard from './VCard.vue';
 
 // More on default export: https://storybook.js.org/docs/vue/writing-stories/introduction#default-export
 export default {
-  title: 'Layout/Card/VCard',
+  title: 'Card/VCard',
   component: MgVCard,
   // More on argTypes: https://storybook.js.org/docs/vue/api/argtypes
   argTypes: {
@@ -25,7 +25,7 @@ export default {
 const Template = (args, { argTypes }) => ({
   props: Object.keys(argTypes),
   components: { MgVCard },
-  template: `<mg-v-card @click="onClick" v-bind="$props"><template v-if="${'default' in args}" v-slot>${args.default}</template></mg-v-card>`,
+  template: `<mg-v-card @click="$emit('click')" v-bind="$props"><template v-if="${'default' in args}" v-slot>${args.default}</template></mg-v-card>`,
 });
 
 export const Default = Template.bind({});

package/src/components/form/primary-button/PrimaryButton.stories.js

@@ -35,7 +35,7 @@ export default {
 const Template = (args, { argTypes }) => ({
   props: Object.keys(argTypes),
   components: { MgPrimaryButton },
-  template: `<mg-primary-button @click="onClick" v-bind="$props"><template v-if="${'default' in args}" v-slot>${args.default}</template></mg-primary-button>`,
+  template: `<mg-primary-button @click="$emit('click')" v-bind="$props"><template v-if="${'default' in args}" v-slot>${args.default}</template></mg-primary-button>`,
 });
 
 export const Default = Template.bind({});

package/src/components/form/secondary-button/SecondaryButton.stories.js

@@ -25,7 +25,7 @@ export default {
 const Template = (args, { argTypes }) => ({
   props: Object.keys(argTypes),
   components: { MgSecondaryButton },
-  template: `<mg-secondary-button @click="onClick" v-bind="$props"><template v-if="${'default' in args}" v-slot>${args.default}</template></mg-secondary-button>`,
+  template: `<mg-secondary-button @click="$emit('click')" v-bind="$props"><template v-if="${'default' in args}" v-slot>${args.default}</template></mg-secondary-button>`,
 });
 
 export const Default = Template.bind({});

package/src/components/form/tertiary-button/TertiaryButton.stories.js

@@ -25,7 +25,7 @@ export default {
 const Template = (args, { argTypes }) => ({
   props: Object.keys(argTypes),
   components: { MgTertiaryButton },
-  template: `<mg-tertiary-button @click="onClick" v-bind="$props"><template v-if="${'default' in args}" v-slot>${args.default}</template></mg-tertiary-button>`,
+  template: `<mg-tertiary-button @click="$emit('click')" v-bind="$props"><template v-if="${'default' in args}" v-slot>${args.default}</template></mg-tertiary-button>`,
 });
 
 export const Default = Template.bind({});

package/src/documentation/Alert.stories.mdx

@@ -0,0 +1,21 @@
+import {ColorItem, ColorPalette, Meta} from '@storybook/addon-docs';
+
+<Meta title="Colors/Alert" />
+
+<ColorPalette>
+    <ColorItem
+        title="Warning"
+        subtitle="Used for error messages"
+        colors={{Persimmon: '#ff614c'}}
+    />
+    <ColorItem
+        title="Success"
+        subtitle="Used for success messages"
+        colors={{'Sea Green': '#349B50'}}
+    />
+    <ColorItem
+        title="Info"
+        subtitle="Used for info messages"
+        colors={{'Congress Blue': '#004781'}}
+    />
+</ColorPalette>

package/src/documentation/Brand.stories.mdx

@@ -0,0 +1,10 @@
+import {ColorItem, ColorPalette, Meta} from '@storybook/addon-docs';
+
+<Meta title="Colors/Brand" />
+
+<ColorPalette>
+    <ColorItem
+        title="Brand Color"
+        colors={{Razzmatazz: '#d81159'}}
+    />
+</ColorPalette>

package/src/documentation/Footballer.stories.mdx

@@ -0,0 +1,22 @@
+import {ColorItem, ColorPalette, Meta} from '@storybook/addon-docs';
+
+<Meta title="Colors/Footballer" />
+
+<ColorPalette>
+    <ColorItem
+        title="Goalkeeper"
+        colors={{Supernova: '#ffc700'}}
+    />
+    <ColorItem
+        title="Defender"
+        colors={{Harlequin: '#3de000'}}
+    />
+    <ColorItem
+        title="Midfielder"
+        colors={{Denim: '#116dd8'}}
+    />
+    <ColorItem
+        title="Forward"
+        colors={{'Torch Red': '#f30026'}}
+    />
+</ColorPalette>