@designcrowd/fe-shared-lib 1.5.7-eng-3522-1 → 1.5.7

package/src/atoms/components/PillBar/PillBar.stories.js

@@ -1,39 +1,39 @@
-import PillBar from './PillBar.vue';
-import categories from './PillBar.fixtures';
-
-export default {
-  title: 'Components/PillBar',
-  component: PillBar,
-};
-
-export const Sample = () => {
-  return {
-    components: { PillBar },
-    data() {
-      return {
-        categories,
-      };
-    },
-    template: `
-      <div class="tw-max-w-300">
-        <PillBar :categories="categories" />
-      </div>
-    `,
-  };
-};
-
-export const SampleDarkMode = () => {
-  return {
-    components: { PillBar },
-    data() {
-      return {
-        categories,
-      };
-    },
-    template: `
-      <div class="tw-max-w-300 tw-bg-black tw-p-8">
-        <PillBar :categories="categories" is-dark-mode />
-      </div>
-    `,
-  };
-};
+import PillBar from './PillBar.vue';
+import categories from './PillBar.fixtures';
+
+export default {
+  title: 'Components/PillBar',
+  component: PillBar,
+};
+
+export const Sample = () => {
+  return {
+    components: { PillBar },
+    data() {
+      return {
+        categories,
+      };
+    },
+    template: `
+      <div class="tw-max-w-300">
+        <PillBar :categories="categories" />
+      </div>
+    `,
+  };
+};
+
+export const SampleDarkMode = () => {
+  return {
+    components: { PillBar },
+    data() {
+      return {
+        categories,
+      };
+    },
+    template: `
+      <div class="tw-max-w-300 tw-bg-black tw-p-8">
+        <PillBar :categories="categories" is-dark-mode />
+      </div>
+    `,
+  };
+};

package/src/atoms/components/PillBar/PillBar.vue

@@ -1,62 +1,62 @@
-<template>
-  <ul class="tw-list-none tw-flex tw-overflow-y-hidden tw-overflow-x-auto tw-m-0 tw-p-0">
-    <li v-for="category in categories" :key="category.name" class="carousel-filter__category">
-      <Button
-        :label="category.name"
-        :variant="isDarkMode ? 'dark-mode-pill' : 'pill'"
-        :active="category.name === selectedCategory"
-        @on-click="onSelectCategory(category)"
-      />
-    </li>
-  </ul>
-</template>
-
-<script>
-import Button from '../Button/Button.vue';
-
-export default {
-  components: {
-    Button,
-  },
-  props: {
-    categories: {
-      type: Array,
-      required: true,
-      default: () => [],
-    },
-    initialCategory: {
-      type: String,
-      required: false,
-      default: 'Popular',
-    },
-    isDarkMode: {
-      type: Boolean,
-      default: false,
-    },
-  },
-  data() {
-    return {
-      selectedCategory: null,
-    };
-  },
-  created() {
-    this.selectedCategory = this.initialCategory;
-  },
-  methods: {
-    onSelectCategory(category) {
-      this.selectedCategory = category.name;
-      this.$emit('on-click-category', category);
-    },
-  },
-};
-</script>
-
-<style>
-.carousel-filter__category {
-  @apply tw-whitespace-nowrap;
-}
-
-.carousel-filter__category:not(:last-child) {
-  @apply tw-mr-3;
-}
-</style>
+<template>
+  <ul class="tw-list-none tw-flex tw-overflow-y-hidden tw-overflow-x-auto tw-m-0 tw-p-0">
+    <li v-for="category in categories" :key="category.name" class="carousel-filter__category">
+      <Button
+        :label="category.name"
+        :variant="isDarkMode ? 'dark-mode-pill' : 'pill'"
+        :active="category.name === selectedCategory"
+        @on-click="onSelectCategory(category)"
+      />
+    </li>
+  </ul>
+</template>
+
+<script>
+import Button from '../Button/Button.vue';
+
+export default {
+  components: {
+    Button,
+  },
+  props: {
+    categories: {
+      type: Array,
+      required: true,
+      default: () => [],
+    },
+    initialCategory: {
+      type: String,
+      required: false,
+      default: 'Popular',
+    },
+    isDarkMode: {
+      type: Boolean,
+      default: false,
+    },
+  },
+  data() {
+    return {
+      selectedCategory: null,
+    };
+  },
+  created() {
+    this.selectedCategory = this.initialCategory;
+  },
+  methods: {
+    onSelectCategory(category) {
+      this.selectedCategory = category.name;
+      this.$emit('on-click-category', category);
+    },
+  },
+};
+</script>
+
+<style>
+.carousel-filter__category {
+  @apply tw-whitespace-nowrap;
+}
+
+.carousel-filter__category:not(:last-child) {
+  @apply tw-mr-3;
+}
+</style>

package/src/atoms/components/Price/Price.fixtures.js

@@ -1,85 +1,85 @@
-export const usdCurrency = {
-  id: 1,
-  name: 'United State Dollars',
-  iso4127Code: 'USD',
-  symbol: '$',
-  abbreviation: 'US',
-};
-
-export const audCurrency = {
-  id: 2,
-  name: 'Australian Dollars',
-  iso4127Code: 'AUD',
-  symbol: '$',
-  abbreviation: 'A',
-};
-
-export const gbpCurrency = {
-  id: 3,
-  name: 'British Pound',
-  iso4127Code: 'GBP',
-  symbol: '£',
-  abbreviation: 'UK',
-};
-
-export const euroCurrency = {
-  id: 4,
-  name: 'Euro',
-  iso4127Code: 'EUR',
-  symbol: '€',
-  abbreviation: 'EU',
-};
-
-export const inrCurrency = {
-  id: 5,
-  name: 'Indian Rupee',
-  iso4127Code: 'INR',
-  symbol: '₹',
-  abbreviation: 'IN',
-};
-
-export const phpCurrency = {
-  id: 6,
-  name: 'Philippine Peso',
-  iso4127Code: 'PHP',
-  symbol: '₱',
-  abbreviation: 'PH',
-};
-
-export const brlCurrency = {
-  id: 7,
-  name: 'Brazilian Real',
-  iso4127Code: 'BRL',
-  symbol: 'R$',
-  abbreviation: 'R',
-};
-
-export const mxnCurrency = {
-  id: 8,
-  name: 'Mexican Peso',
-  iso4127Code: 'MXN',
-  symbol: 'MX$',
-  abbreviation: 'MX',
-};
-
-export const zarCurrency = {
-  id: 9,
-  name: 'South African Rand',
-  iso4127Code: 'ZAR',
-  symbol: 'R',
-  abbreviation: 'R',
-};
-
-export const currencies = [
-  usdCurrency,
-  audCurrency,
-  gbpCurrency,
-  euroCurrency,
-  inrCurrency,
-  phpCurrency,
-  brlCurrency,
-  mxnCurrency,
-  zarCurrency,
-];
-
-export const locales = [ 'en-US', 'fr-FR', 'es-ES', 'pt-PT', 'de-DE', 'fr-CA', 'pt-BR']
+export const usdCurrency = {
+  id: 1,
+  name: 'United State Dollars',
+  iso4127Code: 'USD',
+  symbol: '$',
+  abbreviation: 'US',
+};
+
+export const audCurrency = {
+  id: 2,
+  name: 'Australian Dollars',
+  iso4127Code: 'AUD',
+  symbol: '$',
+  abbreviation: 'A',
+};
+
+export const gbpCurrency = {
+  id: 3,
+  name: 'British Pound',
+  iso4127Code: 'GBP',
+  symbol: '£',
+  abbreviation: 'UK',
+};
+
+export const euroCurrency = {
+  id: 4,
+  name: 'Euro',
+  iso4127Code: 'EUR',
+  symbol: '€',
+  abbreviation: 'EU',
+};
+
+export const inrCurrency = {
+  id: 5,
+  name: 'Indian Rupee',
+  iso4127Code: 'INR',
+  symbol: '₹',
+  abbreviation: 'IN',
+};
+
+export const phpCurrency = {
+  id: 6,
+  name: 'Philippine Peso',
+  iso4127Code: 'PHP',
+  symbol: '₱',
+  abbreviation: 'PH',
+};
+
+export const brlCurrency = {
+  id: 7,
+  name: 'Brazilian Real',
+  iso4127Code: 'BRL',
+  symbol: 'R$',
+  abbreviation: 'R',
+};
+
+export const mxnCurrency = {
+  id: 8,
+  name: 'Mexican Peso',
+  iso4127Code: 'MXN',
+  symbol: 'MX$',
+  abbreviation: 'MX',
+};
+
+export const zarCurrency = {
+  id: 9,
+  name: 'South African Rand',
+  iso4127Code: 'ZAR',
+  symbol: 'R',
+  abbreviation: 'R',
+};
+
+export const currencies = [
+  usdCurrency,
+  audCurrency,
+  gbpCurrency,
+  euroCurrency,
+  inrCurrency,
+  phpCurrency,
+  brlCurrency,
+  mxnCurrency,
+  zarCurrency,
+];
+
+export const locales = [ 'en-US', 'fr-FR', 'es-ES', 'pt-PT', 'de-DE', 'fr-CA', 'pt-BR']