@icij/murmur-next 4.0.0 → 4.0.3

package/.storybook/doc_variables.scss

@@ -1,20 +0,0 @@
-@import '@/styles/variables.scss';
-
-$docs-menu-bg: #000;
-$docs-menu-color: #fff;
-$docs-menu-muted: mix($docs-menu-bg, $docs-menu-color, 50%);
-
-$docs-header-bg: $jumbotron-bg;
-$docs-header-border-color: darken($docs-header-bg, 10%);
-
-$pre-color: $light;
-$app-menu-max-width: 300px;
-$app-main-max-width: 770px;
-
-$modal-backdrop-bg: rgba(darken($dark, 10%), .5);
-$code-color: $info;
-
-$link-color: #000;
-$link-decoration: none;
-$link-hover-color: $primary;
-$link-hover-decoration: none;

package/.storybook/main.ts

@@ -1,35 +0,0 @@
-import type { StorybookConfig } from "@storybook/vue3-vite";
-import { mergeConfig } from "vite";
-
-const config:StorybookConfig = {
-  core: {
-    disableTelemetry: true, // 👈 Disables telemetry
-  },
-  stories: ["../stories/**/*.mdx", "../stories/**/*.stories.@(js|jsx|ts|tsx)"],
-  staticDirs: ["../public"],
-  addons: [
-    "@storybook/addon-links",
-    "@storybook/addon-essentials",
-    "@storybook/addon-interactions",
-    "@storybook/addon-mdx-gfm",
-    "@storybook/preset-scss",
-    "@storybook/addon-themes"
-  ],
-  framework: {
-    name: "@storybook/vue3-vite",
-    options: {},
-  },
-  docs: {
-    autodocs: "tag",
-  },
-  viteFinal: (config, options) => {
-    return mergeConfig(config, {
-      // This is needed because the copy plugin can't copy files outside of the root directory
-      // The files are copied back to the root by the post script
-      build: {
-        outDir: 'storybook-static'
-      }
-    });
-  }
-};
-export default config;

package/.storybook/preview-head.html

@@ -1,2 +0,0 @@
-<link rel="preload" href="https://fonts.googleapis.com/css?family=Poppins:400,700,800|Anton:300,400,400italic&display=swap" as="style">
-<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Poppins:400,700,800|Anton:300,400,400italic&display=swap">

package/.storybook/preview.ts

@@ -1,32 +0,0 @@
-import {setup, Preview} from '@storybook/vue3'
-import './app.scss';
-import Murmur from "@/main";
-import { withThemeByDataAttribute } from '@storybook/addon-themes';
-
-setup((app)=>{
-  app.use(Murmur)
-})
-export const decorators = [
-  withThemeByDataAttribute({
-    themes: {
-      light: 'light',
-      dark: 'dark',
-    },
-    defaultTheme: 'light',
-    attributeName: 'data-bs-theme',
-  }),
-];
-export const parameters = {
-  actions: { argTypesRegex: "^on[A-Z].*" },
-  controls: {
-    matchers: {
-      color: /(background|color)$/i,
-      date: /Date$/,
-    },
-  },
-};
-
-const preview: Preview = {
-  parameters
-};
-export default preview;

package/deploy.js

@@ -1,15 +0,0 @@
-import gh from 'gh-pages'
-import path from 'path'
-import ora from 'ora'
-import chalk from 'chalk'
-
-process.env.NODE_ENV = 'production'
-
-const spinner = ora('push dist folder to gh-pages branch...')
-const message = 'Updates [ci skip]'
-spinner.start()
-
-gh.publish(path.join(process.cwd(), 'dist', 'docs'), { message }, () => {
-  spinner.stop()
-  console.log(chalk.cyan('  Push complete.\n'))
-});

package/docs/components/ApiTable.vue

@@ -1,171 +0,0 @@
-<template>
-  <section class="api-table">
-    <h3 class="api-table__heading mb-3">
-      API 
-    </h3>
-    <div :key="docgen.title" class="api-table__component">
-      <b-tabs class="api-table__component__tabs">
-        <b-tab v-if="hasItems(docgen.props)" title="Properties" class="api-table__component__tabs__container">
-          <b-table :items="toItems(docgen.props)" :fields="propsFields" small class="m-0 small">
-            <template v-for="{ key } in propsFields" v-slot:[`cell(${key})`]="{ value }">
-              <span v-html="value" :key="key"></span>
-            </template>
-          </b-table>
-        </b-tab>
-
-        <b-tab v-if="hasItems(docgen.slots)" title="Slots" class="api-table__component__tabs__container">
-          <b-table :items="toItems(docgen.slots)" :fields="slotsFields" small class="m-0 small">
-            <template v-for="{ key } in slotsFields" v-slot:[`cell(${key})`]="{ value }">
-              <span v-html="value" :key="key"></span>
-            </template>
-          </b-table>
-        </b-tab>
-
-        <b-tab v-if="hasItems(docgen.events)" title="Events" class="api-table__component__tabs__container">
-          <b-table :items="toItems(docgen.events)" :fields="eventsFields" small class="m-0 small">
-            <template v-for="{ key } in eventsFields" v-slot:[`cell(${key})`]="{ value }">
-              <span v-html="value" :key="key"></span>
-            </template>
-          </b-table>
-        </b-tab>
-
-        <b-tab v-if="hasItems(docgen.methods)" title="Methods" class="api-table__component__tabs__container">
-          <b-table :items="toItems(docgen.methods)" :fields="methodsFields" small class="m-0 small">
-            <template v-for="{ key } in methodsFields" v-slot:[`cell(${key})`]="{ value }">
-              <span v-html="value" :key="key"></span>
-            </template>
-          </b-table>
-        </b-tab>
-      </b-tabs>
-    </div>
-  </section>
-</template>
-
-<script>
-  import reduce from 'lodash/reduce'
-  import sortBy from 'lodash/sortBy'
-  import keys from 'lodash/keys'
-  import isObject from 'lodash/isObject'
-
-  import { BTabs } from 'bootstrap-vue/esm/components/tabs/tabs'
-  import { BTab } from 'bootstrap-vue/esm/components/tabs/tab'
-  import { BTable } from 'bootstrap-vue/esm/components/table/table'
-
-  export default {
-    components: {
-      BTabs,
-      BTab,
-      BTable,
-    },
-    props: {
-      api: {
-        type: [Object, String],
-        default: () => {}
-      },
-      path: {
-        type: String,
-        default: null
-      }
-    },
-    methods: {
-      toItems(docgen = {}) {
-        return sortBy(reduce(keys(docgen), (items, name) => {
-          items.push({ name, ...docgen[name] })
-          return items
-        }, []), 'name')
-      },
-      hasItems(docgen = {}) {
-        return !!keys(docgen).length
-      },
-      codeFormatter (v = '—') {
-        return `<code>${v}</code>`
-      },
-      varFormatter (v = '—') {
-        if (v && (v.indexOf('function() {') === 0 || v.indexOf('() =>') === 0)) {
-          return '<span class="text-muted">computed</span>'
-        }
-        return `<var>${v}</var>`
-      }
-    },
-    async mounted () {
-      if (this.path) {
-        const path = this.path.replace(/\.vue$/i, '')
-        const docgens = import.meta.glob('@/**/*.vue', { as: 'vue-docgen' })
-        this.docgen = (await docgens[`/lib/${path}.vue`]()).default
-      } else if (this.api) {
-        this.docgen = isObject(this.api) ? this.api : JSON.parse(this.api)
-      }
-    },
-    data () {
-      return {
-        docgen: {},
-        propsFields: [
-          { label: 'Name', key: 'name', formatter: this.codeFormatter },
-          { label: 'Description', key: 'description', class: 'description' },
-          { label: 'Type', key: 'type.name' },
-          { label: 'Default', key: 'defaultValue.value', formatter: this.varFormatter }
-        ],
-        slotsFields: [
-          { label: 'Slot name', key: 'name', slot: 'cell(name)', formatter: this.codeFormatter },
-          { label: 'Description', key: 'description', class: 'description' }
-        ],
-        eventsFields: [
-          { label: 'Name', key: 'name', slot: 'cell(name)', formatter: this.codeFormatter },
-          { label: 'Description', key: 'description' , class: 'description'},
-          { label: 'Parameters', key: 'type.names', formatter: this.varFormatter }
-        ],
-        methodsFields: [
-          { label: 'Name', key: 'name', slot: 'cell(name)', formatter: this.codeFormatter },
-          { label: 'Description', key: 'description', class: 'description' },
-          { label: 'Return', key: 'return', formatter: this.varFormatter }
-        ]
-      }
-    }
-  }
-</script>
-
-<style lang="scss">
-  @import '../../lib/styles/lib.scss';
-
-  .api-table {
-
-    &__component {
-
-      &__tabs {
-
-        .nav-item {
-          text-transform: uppercase;
-          font-size: 0.9rem;
-
-          .active {
-            font-weight: bolder;
-          }
-        }
-
-        &__container {
-          padding: $spacer * 0.5;
-          overflow: auto;
-          width: 100%;
-          border: 1px solid $table-border-color;
-          border-top: 0;
-
-          .table {
-            white-space: nowrap;
-            thead th {
-              border-top: 0;
-
-              &.description {
-                min-width: 330px;
-                max-width: 450px;
-              }
-            }
-
-            td > span > code {
-              white-space: nowrap;
-            }
-          }
-        }
-      }
-    }
-  }
-</style>

package/docs/components/App.vue

@@ -1,146 +0,0 @@
-<template>
-  <div id="app" class="app">
-    <div class="app__navbar d-block d-lg-none bg-dark p-3 clearfix">
-      <router-link to="/">
-        <img
-          src="@/assets/images/murmur-white.svg"
-          alt="ICIJ"
-          class="border border-primary d-inline-block"
-          height="30px"
-        />
-      </router-link>
-      <button class="btn btn-link text-white float-end" @click="toggleMenu">
-        <fa icon="bars" />
-      </button>
-    </div>
-    <transition name="fade">
-      <div v-if="!collapseMenu" class="app__overlay" @click="toggleMenu"></div>
-    </transition>
-    <div class="row no-gutters flex-nowrap">
-      <div class="col app__menu" :class="{ 'app__menu--collapse': collapseMenu }">
-        <docs-menu></docs-menu>
-      </div>
-      <div class="col">
-        <div class="app__main">
-          <docs-header></docs-header>
-          <router-view class="app__main__view py-4"></router-view>
-          <edit-link></edit-link>
-        </div>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script>
-import { faBars } from '@fortawesome/free-solid-svg-icons/faBars'
-import { mapState } from 'vuex'
-
-import DocsHeader from './DocsHeader.vue'
-import DocsMenu from './DocsMenu.vue'
-import EditLink from './EditLink.vue'
-
-import { library } from '@/components/Fa'
-
-export default {
-  name: 'App',
-  components: {
-    DocsHeader,
-    DocsMenu,
-    EditLink
-  },
-  watch: {
-    '$route.name': function () {
-      this.$store.commit('collapseMenu')
-    },
-    collapseMenu: function () {
-      // Use bootstrap's class to disable scrolling on the body
-      document.body.classList.toggle('modal-open', !this.collapseMenu)
-    }
-  },
-  beforeCreate() {
-    library.add(faBars)
-  },
-  computed: {
-    ...mapState(['collapseMenu'])
-  },
-  methods: {
-    toggleMenu() {
-      this.$store.commit('toggleMenu')
-    }
-  }
-}
-</script>
-
-<style lang="scss" scoped>
-@import '../styles/variables.scss';
-@import 'node_modules/bootstrap/scss/_mixins.scss';
-
-.app {
-  &:deep(.hljs) {
-    background: $dark;
-    padding: $spacer;
-    display: block;
-  }
-
-  .fade-enter-active,
-  .fade-leave-active {
-    transition: opacity 300ms;
-  }
-  .fade-enter,
-  .fade-leave-to {
-    opacity: 0;
-  }
-
-  @include media-breakpoint-down(md) {
-    &__overlay {
-      z-index: $zindex-modal-backdrop;
-      position: fixed;
-      top: 0;
-      left: 0;
-      right: 0;
-      bottom: 0;
-      background: $modal-backdrop-bg;
-    }
-  }
-
-  &__menu {
-    max-width: $app-menu-max-width;
-    min-width: $app-menu-max-width;
-    background: $docs-menu-bg;
-
-    @include media-breakpoint-down(md) {
-      z-index: $zindex-modal;
-      position: fixed;
-      top: 0;
-      left: 0;
-      bottom: 0;
-      width: auto;
-      overflow: auto;
-      transform: translateX(0%);
-      transition: transform 300ms;
-
-      &--collapse {
-        pointer-events: none;
-        transform: translateX(-100%);
-      }
-    }
-  }
-
-  &__main {
-    min-height: 100%;
-    border: $spacer solid $docs-menu-bg;
-    border-left: 0;
-
-    @include media-breakpoint-down(md) {
-      min-height: auto;
-      border: 0;
-    }
-
-    &__view {
-      max-width: $app-main-max-width;
-      padding: 0 $spacer;
-      margin: auto;
-    }
-  }
-}
-</style>

package/docs/components/CollapsibleBlock.vue

@@ -1,122 +0,0 @@
-<template>
-  <component :is="tag" class="collapsible-block card mb-5" :class="{ 'collapsible-block--visible': visible }">
-    <div class="d-flex">
-      <a class="py-3 px-4 d-block collapsible-block__caret" @click="toggle">
-        <fa icon="caret-right" :rotation="show ? 90 : null" />
-      </a>
-      <div class="flex-grow-1">
-        <slot name="label" v-bind:label="label">
-          <a v-if="label" class="py-3 pe-4 collapsible-block__label d-block" @click="toggle">
-            {{ label }}
-          </a>
-        </slot>
-      </div>
-    </div>
-    <b-collapse :visible="show" class="collapsible-block__body">
-      <slot v-if="useSlot" />
-      <pre v-else-if="json"><code class="hljs language-json" v-html="formattedJson"></code></pre>
-    </b-collapse>
-  </component>
-</template>
-
-<script>
-  import hljs from 'highlight.js'
-  import { faCaretRight } from '@fortawesome/free-solid-svg-icons/faCaretRight'
-
-  import { library, default as Fa } from '@/components/Fa'
-
-  export default {
-    name: 'CollapsibleBlock',
-    components: {
-      Fa
-    },
-    beforeMount () {
-      library.add(faCaretRight)
-    },
-    model: {
-      prop: 'visible',
-      event: 'input'
-    },
-    props: {
-      visible: {
-        type: Boolean,
-        default: false
-      },
-      tag: {
-        type: [String, Object],
-        default: 'div'
-      },
-      label: {
-        type: String,
-        default: null
-      },
-      json: {
-        default: null
-      }
-    },
-    data() {
-      return {
-        show: this.visible
-      }
-    },
-    watch: {
-      visible (value) {
-        if (value !== this.show) {
-          this.show = value
-        }
-      },
-      show (value, oldValue) {
-        if (value !== oldValue) {
-          this.$emit('input', this.show)
-        }
-      }
-    },
-    created() {
-      this.show = this.visible
-    },
-    mounted() {
-      this.show = this.visible
-    },
-    beforeDestroy() {
-      this.show = false
-    },
-    methods: {
-      toggle() {
-        this.show = !this.show
-      }
-    },
-    computed: {
-      useSlot() {
-        return !!this.$slots.default && !!this.$slots.default.length
-      },
-      stringifiedJson() {
-        return JSON.stringify(this.json, null, 2)
-      },
-      formattedJson() {
-        const language = 'json'
-        const { value } = hljs.highlight(this.stringifiedJson, { language })
-        return value
-      }
-    }
-  }
-</script>
-
-<style lang="scss">
-  .collapsible-block {
-
-    &__caret, &__label {
-      cursor: pointer;
-    }
-
-    &__caret .svg-inline--fa{
-      transition: transform 300ms;
-    }
-
-    &__body {
-      // Exception for code block
-      & *[class^=language-] pre {
-        margin-bottom: 0;
-      }
-    }
-  }
-</style>

package/docs/components/DocsHeader.vue

@@ -1,68 +0,0 @@
-<template>
-  <div v-if="showHeader" class="docs-header">
-    <div class="docs-header__container">
-      <div v-if="showBreadcrumb" class="docs-header__container__breadcrumb">
-        <a v-for="(item, i) in breadcrumb" :key="i" class="docs-header__container__breadcrumb">
-          {{ item }}
-        </a>
-      </div>
-      <h1 class="docs-header__container__title">
-        {{ title }}
-      </h1>
-      <p class="lead m-0">
-        {{ description }}
-      </p>
-    </div>
-  </div>
-</template>
-
-<script>
-import get from 'lodash/get'
-import startCase from 'lodash/startCase'
-
-export default {
-  name: 'DocsMenu',
-  computed: {
-    title() {
-      return get(this, '$route.meta.title', '')
-    },
-    section() {
-      return get(this, '$route.meta.section')
-    },
-    breadcrumb() {
-      return get(this, '$route.meta.breadcrumb', [this.section]).map(startCase)
-    },
-    description() {
-      return get(this, '$route.meta.description', '')
-    },
-    showHeader() {
-      return this.title !== ''
-    },
-    showBreadcrumb() {
-      return this.breadcrumb.length > 0
-    }
-  }
-}
-</script>
-
-<style lang="scss" scoped>
-@import '../styles/variables.scss';
-
-.docs-header {
-  background: $docs-header-bg;
-  border-bottom: 1px solid $docs-header-border-color;
-
-  &__container {
-    max-width: $app-main-max-width;
-    margin: auto;
-    padding: $spacer * 1.5 $spacer;
-
-    &__title {
-      padding: 0;
-      text-transform: uppercase;
-      font-family: $jumbotron-font-family;
-      font-weight: $jumbotron-font-weight;
-    }
-  }
-}
-</style>