Merge branch 'add-content-editor-storybook-stories' into 'master'

Add storybook stories for the Content Editor

See merge request gitlab-org/gitlab!69701

app/assets/javascripts/content_editor/content_editor.stories.js

+import { ContentEditor } from './index';
+
+export default {
+  component: ContentEditor,
+  title: 'Components/Content Editor',
+};
+
+const Template = (_, { argTypes }) => ({
+  components: { ContentEditor },
+  props: Object.keys(argTypes),
+  template: '<content-editor v-bind="$props" @initialized="loadContent" />',
+  methods: {
+    loadContent(contentEditor) {
+      // eslint-disable-next-line @gitlab/require-i18n-strings
+      contentEditor.setSerializedContent('Hello content editor');
+    },
+  },
+});
+
+export const Default = Template.bind({});
+
+Default.args = {
+  renderMarkdown: () => '<p>Hello content editor</p>',
+  uploadsPath: '/uploads/',
+  serializerConfig: {},
+  extensions: [],
+};

storybook/config/preview.js

+// eslint-disable-next-line import/no-extraneous-dependencies
+import Vue from 'vue';
+import translateMixin from '../../app/assets/javascripts/vue_shared/translate';
+
 const stylesheetsRequireCtx = require.context(
   '../../app/assets/stylesheets',
   true,
-  /application\.scss$/,
+  /(application|application_utilities)\.scss$/,
 );
 
+window.gon = {};
+translateMixin(Vue);
+
 stylesheetsRequireCtx('./application.scss');
+stylesheetsRequireCtx('./application_utilities.scss');

storybook/package.json

@@ -5,7 +5,9 @@
     "start": "start-storybook -p 9002 -c config",
     "build": "build-storybook -c config -o public"
   },
-  "dependencies": {},
+  "blockedDependencies": {
+    "vue": "https://gitlab.com/gitlab-org/gitlab/-/issues/340511"
+  },
   "devDependencies": {
     "@storybook/addon-a11y": "^6.2.9",
     "@storybook/addon-actions": "^6.2.9",