@designcrowd/fe-shared-lib 1.5.36 → 1.6.0-eng-4039

package/src/atoms/components/Icon/icons/history.vue

@@ -1,12 +0,0 @@
-<template>
-  <g fill="none" transform="translate(0.25, 1.5) scale(1.1)">
-    <path d="M0.500244 3.85742L1.50022 6.35742" stroke="currentColor" stroke-linecap="round" />
-    <path d="M1.50031 6.3574L4.00037 5.35742" stroke="currentColor" stroke-linecap="round" />
-    <path
-      d="M7.46411 0C10.9158 0 13.7139 2.79836 13.7141 6.25C13.7141 9.70178 10.9159 12.5 7.46411 12.5C5.66342 12.4999 4.04145 11.7379 2.9014 10.5192C2.46116 10.0485 2.84585 9.35742 3.4903 9.35742C3.73353 9.35742 3.96191 9.46606 4.13532 9.63662C4.9923 10.4795 6.16711 10.9999 7.46411 11C10.0875 11 12.2141 8.87335 12.2141 6.25C12.2139 3.62679 10.0874 1.5 7.46411 1.5C4.84108 1.50026 2.71428 3.62695 2.71411 6.25C2.71411 6.30896 2.66854 6.35742 2.60957 6.35742H1.32451C1.26487 6.35742 1.21411 6.30964 1.21411 6.25C1.21428 2.79852 4.01266 0.000262284 7.46411 0Z"
-      fill="currentColor"
-    />
-    <path d="M7.00024 4.35742V6.85742" stroke="currentColor" stroke-linecap="round" />
-    <line x1="7.00024" y1="6.85742" x2="9.00024" y2="6.85742" stroke="currentColor" stroke-linecap="round" />
-  </g>
-</template>

package/src/atoms/components/Icon/icons/save.vue

@@ -1,6 +0,0 @@
-<template>
-  <path
-    d="M9.32715 8.01665C9.32689 8.01352 9.32545 8.01066 9.3252 8.00786C9.32271 8.00764 9.32012 8.00711 9.31738 8.00689C9.23966 8.00054 9.13128 8.00005 8.93359 8.00005H4.40039C4.20271 8.00005 4.09433 8.00054 4.0166 8.00689C4.0135 8.00714 4.01058 8.00761 4.00781 8.00786C4.00756 8.01063 4.00709 8.01355 4.00684 8.01665C4.00049 8.09437 4 8.20276 4 8.40044V12H9.33398V8.40044C9.33398 8.20276 9.3335 8.09437 9.32715 8.01665ZM0 3.86724C0 3.31819 0.000292534 2.86602 0.0302734 2.49907C0.0608946 2.12439 0.126173 1.77963 0.291016 1.4561C0.546643 0.954538 0.954488 0.546693 1.45605 0.291066C1.77958 0.126223 2.12434 0.0609446 2.49902 0.0303234C2.7322 0.0112719 2.99977 0.00535884 3.30469 0.00297968C3.31432 0.00256653 3.32425 4.99914e-05 3.33398 4.99914e-05C3.34251 5.40638e-05 3.35092 0.00265814 3.35938 0.00297968C3.51849 0.00200758 3.68774 4.99914e-05 3.86719 4.99914e-05H8.4502C8.74443 4.81347e-05 9.00014 -0.00377018 9.24805 0.0557141C9.45204 0.104689 9.64728 0.185377 9.82617 0.294972C10.0436 0.42821 10.2216 0.612265 10.4297 0.820363L12.5137 2.90435C12.7218 3.11244 12.9058 3.29044 13.0391 3.50786C13.1487 3.68675 13.2293 3.88199 13.2783 4.08599C13.3378 4.3339 13.334 4.58961 13.334 4.88384V9.46685C13.334 10.0159 13.3337 10.4681 13.3037 10.835C13.2731 11.2097 13.2078 11.5545 13.043 11.878C12.7873 12.3795 12.3795 12.7874 11.8779 13.043C11.5544 13.2079 11.2096 13.2731 10.835 13.3038C10.6015 13.3228 10.3336 13.3287 10.0283 13.3311C10.019 13.3315 10.0094 13.334 10 13.334C9.99114 13.334 9.98241 13.3315 9.97363 13.3311C9.8148 13.3321 9.64588 13.334 9.4668 13.334H3.86719C3.68774 13.334 3.51849 13.3321 3.35938 13.3311C3.35092 13.3314 3.34251 13.334 3.33398 13.334C3.32425 13.334 3.31432 13.3315 3.30469 13.3311C2.99977 13.3287 2.7322 13.3228 2.49902 13.3038C2.12434 13.2731 1.77958 13.2079 1.45605 13.043C0.954488 12.7874 0.546643 12.3795 0.291016 11.878C0.126173 11.5545 0.0608946 11.2097 0.0302734 10.835C0.000292534 10.4681 0 10.0159 0 9.46685V3.86724ZM1.33398 9.46685C1.33398 10.0379 1.33388 10.4266 1.3584 10.7266C1.38228 11.0187 1.42542 11.1683 1.47852 11.2725C1.60635 11.5234 1.81064 11.7277 2.06152 11.8555C2.16576 11.9086 2.31537 11.9518 2.60742 11.9756C2.62679 11.9772 2.64687 11.9772 2.66699 11.9786V8.40044C2.66699 8.22476 2.6669 8.05287 2.67871 7.90825C2.69116 7.75586 2.7203 7.57553 2.8125 7.39458C2.94027 7.14405 3.14401 6.94032 3.39453 6.81255C3.57548 6.72035 3.75581 6.69121 3.9082 6.67876C4.05282 6.66695 4.22471 6.66704 4.40039 6.66704H8.93359C9.10928 6.66704 9.28117 6.66695 9.42578 6.67876C9.57818 6.69121 9.7585 6.72035 9.93945 6.81255C10.19 6.94032 10.3937 7.14405 10.5215 7.39458C10.6137 7.57553 10.6428 7.75586 10.6553 7.90825C10.6671 8.05287 10.667 8.22476 10.667 8.40044V11.9786C10.6871 11.9772 10.7072 11.9772 10.7266 11.9756C11.0186 11.9518 11.1682 11.9086 11.2725 11.8555C11.5233 11.7277 11.7276 11.5234 11.8555 11.2725C11.9086 11.1683 11.9517 11.0187 11.9756 10.7266C12.0001 10.4266 12 10.0379 12 9.46685V4.88384C12 4.52686 11.9955 4.45631 11.9814 4.39751C11.9651 4.32949 11.9389 4.2638 11.9023 4.20415C11.8707 4.15253 11.8233 4.09975 11.5703 3.84673L10.666 2.94243C10.666 3.11508 10.6669 3.28361 10.6553 3.42583C10.6428 3.57823 10.6137 3.75856 10.5215 3.9395C10.3937 4.19003 10.19 4.39377 9.93945 4.52153C9.7585 4.61373 9.57818 4.64287 9.42578 4.65532C9.28117 4.66714 9.10928 4.66704 8.93359 4.66704H4.40039C4.22471 4.66704 4.05282 4.66714 3.9082 4.65532C3.75581 4.64287 3.57548 4.61373 3.39453 4.52153C3.14401 4.39377 2.94027 4.19003 2.8125 3.9395C2.7203 3.75856 2.69116 3.57823 2.67871 3.42583C2.6669 3.28122 2.66699 3.10933 2.66699 2.93364V1.35454C2.64684 1.35593 2.62681 1.35686 2.60742 1.35845C2.31537 1.38233 2.16576 1.42547 2.06152 1.47857C1.81064 1.6064 1.60635 1.81069 1.47852 2.06157C1.42542 2.16581 1.38228 2.31542 1.3584 2.60747C1.33388 2.90753 1.33398 3.29618 1.33398 3.86724V9.46685ZM4.00684 3.31743C4.00706 3.32017 4.00759 3.32276 4.00781 3.32525C4.01061 3.3255 4.01347 3.32694 4.0166 3.3272C4.09433 3.33355 4.20271 3.33403 4.40039 3.33403H8.93359C9.13128 3.33403 9.23966 3.33355 9.31738 3.3272C9.32016 3.32697 9.32269 3.32547 9.3252 3.32525C9.32542 3.32274 9.32692 3.32021 9.32715 3.31743C9.3335 3.23971 9.33398 3.13133 9.33398 2.93364V1.61333C9.20748 1.48941 9.16893 1.45562 9.12988 1.43169C9.07023 1.39514 9.00455 1.36892 8.93652 1.35259C8.87773 1.33852 8.80717 1.33404 8.4502 1.33403H4V2.93364C4 3.13133 4.00049 3.23971 4.00684 3.31743Z"
-    fill="currentColor"
-  />
-</template>

package/src/experiences/components/UploadYourLogoOnBoarding/LogoKeywords.stories.js

@@ -1,65 +0,0 @@
-import LogoKeywords from './LogoKeywords.vue';
-
-export default {
-  title: 'Components/LogoKeywords',
-  component: LogoKeywords,
-};
-
-export const Loading = () => {
-  return {
-    components: {
-      LogoKeywords,
-    },
-    template: `
-      <div style="max-width: 500px;">
-        <LogoKeywords
-          progress-label="Step 3 of 5"
-          event-category="BYO-PrePurchase"
-          business-name="My Business"
-          template-type="business card"
-          anti-forgery-token="mock-anti-forgery-token"
-        />
-      </div>
-    `,
-  };
-};
-
-export const Populated = () => {
-  return {
-    components: {
-      LogoKeywords,
-    },
-    template: `
-      <div style="max-width: 500px;">
-        <LogoKeywords
-          progress-label="Step 3 of 5"
-          event-category="BYO-PrePurchase"
-          saved-keywords="modern, professional, creative, bold"
-          business-name="My Business"
-          template-type="business card"
-          anti-forgery-token="mock-anti-forgery-token"
-        />
-      </div>
-    `,
-  };
-};
-
-export const Empty = () => {
-  return {
-    components: {
-      LogoKeywords,
-    },
-    template: `
-      <div style="max-width: 500px;">
-        <LogoKeywords
-          progress-label="Step 3 of 5"
-          event-category="BYO-PrePurchase"
-          saved-keywords=""
-          business-name=""
-          template-type="business card"
-          anti-forgery-token="mock-anti-forgery-token"
-        />
-      </div>
-    `,
-  };
-};

package/src/experiences/components/UploadYourLogoOnBoarding/LogoKeywords.vue

@@ -1,156 +0,0 @@
-<template>
-  <div class="tw-w-full tw-flex tw-flex-col tw-h-full lg:tw-h-auto">
-    <div class="tw-h-full tw-pb-24 lg:tw-pb-0">
-      <div class="tw-pb-8">
-        <p class="tw-text-grayscale-600 tw-font-bold tw-text-xs tw-mb-2 tw-uppercase">
-          {{ progressLabel }}
-        </p>
-        <h2 class="tw-mb-4 tw-text-4xl tw-text-black tw-font-bold">{{ uploadYourLogoTr('keywords') }}</h2>
-        <p class="tw-mt-0">{{ uploadYourLogoTr('keywordsDescription') }}</p>
-      </div>
-
-      <div class="tw-pb-8 tw-px-8">
-        <div class="tw-relative">
-          <input
-            v-model="keywordsText"
-            :disabled="isLoading"
-            class="tw-w-full tw-py-3.5 tw-px-4 tw-rounded tw-box-border tw-border tw-border-solid tw-border-grayscale-500 tw-text-grayscale-600"
-            @keyup="onKeywordsKeyUp"
-          />
-          <div
-            v-if="isLoading"
-            class="tw-absolute tw-inset-0 tw-flex tw-items-center tw-justify-center tw-bg-white/50 tw-rounded"
-          >
-            <div class="tw-animate-spin tw-h-5 tw-w-5 tw-border-2 tw-border-grayscale-500 tw-border-t-transparent tw-rounded-full" />
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <div
-      class="tw-fixed tw-rounded-b tw-bottom-0 tw-left-0 tw-z-10 tw-bg-grayscale-200 lg:tw-static tw-flex tw-w-full tw-items-center tw-justify-center tw-border-0 tw-border-t tw-border-black/10 tw-border-solid tw-py-4 tw-px-8 tw-box-border"
-    >
-      <Button
-        :label="uploadYourLogoTr('back')"
-        size="large"
-        variant="outline"
-        container-classes="tw-mx-2"
-        data-test-back-btn
-        @on-click="back"
-      />
-      <Button
-        :label="uploadYourLogoTr('continue')"
-        size="large"
-        variant="primary-with-icon"
-        icon="chevron-right-wide"
-        container-classes="tw-mx-2"
-        data-test-continue-btn
-        :disabled="isLoading"
-        @on-click="save"
-      />
-    </div>
-  </div>
-</template>
-<script>
-import Button from '../../../atoms/components/Button/Button.vue';
-import brandCrowdClient from '../../clients/brand-crowd-api.client';
-import trackEvent from '../../helpers/tracking';
-import { uploadYourLogoTr } from '../../../useSharedLibTranslate';
-
-export default {
-  components: {
-    Button,
-  },
-  props: {
-    progressLabel: {
-      type: String,
-      required: true,
-    },
-    eventCategory: {
-      type: String,
-      required: true,
-    },
-    savedKeywords: {
-      type: String,
-      required: false,
-      default: null,
-    },
-    businessName: {
-      type: String,
-      required: false,
-      default: '',
-    },
-    templateType: {
-      type: String,
-      required: true,
-    },
-    antiForgeryToken: {
-      type: String,
-      required: true,
-    },
-    refreshAntiForgeryToken: {
-      type: Function,
-      required: false,
-      default: null,
-    },
-  },
-  setup() {
-    return {
-      uploadYourLogoTr,
-    };
-  },
-  data() {
-    return {
-      keywordsText: '',
-      isLoading: false,
-    };
-  },
-  async mounted() {
-    if (this.savedKeywords !== null) {
-      this.keywordsText = this.savedKeywords;
-      return;
-    }
-    if (!this.businessName) {
-      return;
-    }
-    this.isLoading = true;
-    try {
-      const token = this.refreshAntiForgeryToken ? await this.refreshAntiForgeryToken() : this.antiForgeryToken;
-      const result = await brandCrowdClient.getKeywordSuggestionsAsync({
-        businessName: this.businessName,
-        templateType: this.templateType,
-        antiForgeryToken: token,
-      });
-      if (result && result.keywords && result.keywords.length > 0) {
-        this.keywordsText = result.keywords.join(', ');
-      }
-    } finally {
-      this.isLoading = false;
-    }
-  },
-  methods: {
-    back() {
-      this.$emit('on-go-back');
-    },
-    save() {
-      if (this.isLoading) return;
-
-      trackEvent({
-        eventCategory: this.eventCategory,
-        eventAction: 'keywords',
-        eventLabel: 'Clicked_Continue',
-        event: 'click',
-      });
-
-      this.$emit('on-save', {
-        keywords: this.keywordsText,
-      });
-    },
-    onKeywordsKeyUp(e) {
-      if (e.key === 'Enter' && !this.isLoading) {
-        this.save();
-      }
-    },
-  },
-};
-</script>