@bobbykim/mcl-footer 0.2.0 → 0.4.0

package/CHANGELOG.md

@@ -3,6 +3,29 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [0.4.0](https://github.com/bobbykim89/manguito-component-library/compare/@bobbykim/mcl-footer@0.3.0...@bobbykim/mcl-footer@0.4.0) (2024-03-21)
+
+
+### Features
+
+* **mcl-header:** move deprecated items to deprecated folder in root dir, update configs, init mcl-header-b component ([19aa842](https://github.com/bobbykim89/manguito-component-library/commit/19aa842faa7f1594f7be030b97d5093014efe7cb))
+* tsconfig update, slots and emits update ([c30ff80](https://github.com/bobbykim89/manguito-component-library/commit/c30ff804c961d205ac097e20cd51285a15ca8966))
+
+
+
+
+
+# [0.3.0](https://github.com/bobbykim89/manguito-component-library/compare/@bobbykim/mcl-footer@0.2.0...@bobbykim/mcl-footer@0.3.0) (2024-02-27)
+
+
+### Features
+
+* **/components/**/README.md,/deprecated:** update readme files, move deprecated packages to deprecated folder ([c0f8f7d](https://github.com/bobbykim89/manguito-component-library/commit/c0f8f7df158b8fcd99b4e3d191e02e3c8a9c144d))
+
+
+
+
+
 # 0.2.0 (2024-02-27)
 
 

package/README.md

@@ -1,16 +1,36 @@
 # @bobbykim/mcl-footer
 
-Add description
-
 ## Demo
 
-[MCL Histoire Page](https://manguito-component-library.vercel.app/story/{%story-link%})
+[MCL Storybook Page](https://manguito-component-library.vercel.app/)
+
+- [MCL Footer A](https://manguito-component-library.vercel.app/?path=/docs/sections-footer-mclfootera--mclfootera)
 
 ## Install
 
+```sh
+npm i @bobbykim/mcl-footer
+```
+
 ## Usage
 
-`import MclFooter from "@bobbykim/mcl-footer"`;
+`import { MclFooterA } from "@bobbykim/mcl-footer"`;
+
+```vue
+<script setup lang="ts">
+...
+import { MclFooterA } from "@bobbykim/mcl-footer"
+...
+</script>
+
+<template>
+  <mcl-footer-a></mcl-footer-a>
+</template>
+```
+
+## Dependencies
+
+- @bobbykim/manguito-theme
 
 ## Maintainer
 

package/lib/mcl-footer-a/MclFooterA.vue

@@ -7,7 +7,7 @@ import type {
 } from '@bobbykim/manguito-theme'
 import generateClass from '@bobbykim/manguito-theme'
 import SocialIcons from './SocialIcons.vue'
-import type { MenuItemEvent, MenuItemType, SocialUrl } from './index.types'
+import type { MenuItemType, SocialUrl } from './index.types'
 
 const props = withDefaults(
   defineProps<{
@@ -54,8 +54,13 @@ const props = withDefaults(
   }
 )
 
-const emit = defineEmits(['menu-click', 'logo-click', 'secondary-menu-click'])
-type EmitType = 'menu' | 'logo' | 'secondary'
+const slots = defineSlots<{
+  default: any
+}>()
+const emit = defineEmits<{
+  (e: 'logo-click', event: Event, link: string, target: CtaTarget): void
+  (e: 'menu-click', event: Event, item: MenuItemType): void
+}>()
 
 const getFooterClass = (bg: ColorPalette, border: ColorPalette): string => {
   /**
@@ -100,39 +105,16 @@ const getMenuItemClass = (
   return classArray.join(' ')
 }
 
-const footerItemClick = (
-  e: Event,
-  title: string,
-  link: string,
-  target: CtaTarget = '_self',
-  itemLink: boolean,
-  emitType: EmitType
-): void => {
-  /**
-   * @e - $event
-   * @title - menuItems[#].title / title
-   * @link - menuItems[#].url / logoLink
-   * @target - menuItems[#].target / logoLinkTaget
-   * @itemlink - menuItemAsLink / logoAsLink
-   * @emitType - Non prop value type EmitType
-   */
-  !itemLink && e.preventDefault()
+const handleTitleClick = (e: Event) => {
+  const { logoAsLink, logoLink, logoLinkTarget } = props
+  !logoAsLink && e.preventDefault()
+  emit('logo-click', e, logoLink, logoLinkTarget)
+}
 
-  const eventObj: MenuItemEvent = {
-    event: e,
-    title,
-    link,
-    target: target ? target : '_self',
-  }
-  if (emitType === 'menu') {
-    emit('menu-click', eventObj)
-  }
-  if (emitType === 'logo') {
-    emit('logo-click', eventObj)
-  }
-  if (emitType === 'secondary') {
-    emit('secondary-menu-click', eventObj)
-  }
+const handleMenuItemClick = (e: Event, item: MenuItemType) => {
+  const { menuItemAsLink } = props
+  !menuItemAsLink && e.preventDefault()
+  emit('menu-click', e, item)
 }
 </script>
 
@@ -152,16 +134,7 @@ const footerItemClick = (
             :target="logoLinkTarget"
             class="h-full inline-block outline-none focus:ring-2 ring-offset-2 ring-offset-transparent rounded-md transition-all duration-300 ease-linear"
             :class="generateClass('RINGCOLOR', titleColor)"
-            @click="
-              footerItemClick(
-                $event,
-                title,
-                logoLink,
-                logoLinkTarget,
-                logoAsLink,
-                'logo'
-              )
-            "
+            @click="handleTitleClick($event)"
           >
             <img class="inline-block h-full" :src="logo" :alt="logoAlt" />
           </a>
@@ -206,21 +179,12 @@ const footerItemClick = (
             >
               <a
                 :href="item.url"
-                :target="item.target"
+                :target="item.target ? item.target : '_self'"
                 class="tracking-wide outline-none nav__text"
                 :class="
                   getMenuItemClass(menuTextSize, menuTextColor, menuTextBold)
                 "
-                @click="
-                  footerItemClick(
-                    $event,
-                    item.title,
-                    item.url,
-                    item.target,
-                    menuItemAsLink,
-                    'menu'
-                  )
-                "
+                @click="handleMenuItemClick($event, item)"
                 v-html="item.title"
               >
               </a>
@@ -244,21 +208,12 @@ const footerItemClick = (
             >
               <a
                 :href="item.url"
-                :target="item.target"
+                :target="item.target ? item.target : '_self'"
                 class="tracking-wide outline-none nav__text"
                 :class="
                   getMenuItemClass(menuTextSize, menuTextColor, menuTextBold)
                 "
-                @click="
-                  footerItemClick(
-                    $event,
-                    item.title,
-                    item.url,
-                    item.target,
-                    menuItemAsLink,
-                    'secondary'
-                  )
-                "
+                @click="handleMenuItemClick($event, item)"
                 v-html="item.title"
               >
               </a>

package/lib/mcl-footer-a/MclFooterA.vue.d.ts

@@ -41,9 +41,8 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     borderTopColor: string;
     headlineColor: string;
 }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    "menu-click": (...args: any[]) => void;
-    "logo-click": (...args: any[]) => void;
-    "secondary-menu-click": (...args: any[]) => void;
+    "logo-click": (event: Event, link: string, target: CtaTarget) => void;
+    "menu-click": (event: Event, item: MenuItemType) => void;
 }, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
     title: string;
     titleSize?: HeadingSize | undefined;
@@ -85,10 +84,10 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     borderTopColor: string;
     headlineColor: string;
 }>>> & {
-    "onMenu-click"?: ((...args: any[]) => any) | undefined;
-    "onLogo-click"?: ((...args: any[]) => any) | undefined;
-    "onSecondary-menu-click"?: ((...args: any[]) => any) | undefined;
+    "onLogo-click"?: ((event: Event, link: string, target: CtaTarget) => any) | undefined;
+    "onMenu-click"?: ((event: Event, item: MenuItemType) => any) | undefined;
 }, {
+    bgColor: ColorPalette;
     titleColor: ColorPalette;
     titleSize: HeadingSize;
     logoAsLink: boolean;
@@ -101,12 +100,11 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     menuTextBold: boolean;
     displayHighlight: boolean;
     highlightColor: ColorPalette;
-    bgColor: ColorPalette;
     borderTopColor: ColorPalette;
     headlineColor: ColorPalette;
-}, {}>, {
-    default?(_: {}): any;
-}>;
+}, {}>, Readonly<{
+    default: any;
+}>>;
 export default _default;
 type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
 type __VLS_TypePropsToRuntimeProps<T> = {

package/lib/mcl-footer-a/index.types.d.ts

@@ -10,9 +10,3 @@ export interface SocialUrl {
     github?: string;
     twitter?: string;
 }
-export interface MenuItemEvent {
-    event: Event;
-    title: string;
-    link: string;
-    target?: CtaTarget;
-}

package/lib/mcl-footer-a/index.types.ts

@@ -12,10 +12,3 @@ export interface SocialUrl {
   github?: string
   twitter?: string
 }
-
-export interface MenuItemEvent {
-  event: Event
-  title: string
-  link: string
-  target?: CtaTarget
-}

package/package.json

@@ -1 +1,27 @@
-{"name":"@bobbykim/mcl-footer","version":"0.2.0","description":"","type":"module","main":"index.ts","scripts":{"build":"vue-tsc --project tsconfig.vue.json && tsc"},"author":{"name":"Bobby Kim","url":"https://www.devbobbykim.com/"},"homepage":"https://manguito-component-library.vercel.app/","repository":{"type":"git","url":"https://github.com/bobbykim89/manguito-component-library.git"},"publishConfig":{"access":"public"},"license":"MIT","dependencies":{"@bobbykim/manguito-theme":"^0.14.0"},"gitHead":"4d94a8d34988d926c8d465891fd7aa535cffdf33"}
+{
+  "name": "@bobbykim/mcl-footer",
+  "version": "0.4.0",
+  "description": "",
+  "type": "module",
+  "main": "index.ts",
+  "scripts": {
+    "build": "vue-tsc --project tsconfig.vue.json && tsc --project tsconfig.ts.json"
+  },
+  "author": {
+    "name": "Bobby Kim",
+    "url": "https://www.devbobbykim.com/"
+  },
+  "homepage": "https://manguito-component-library.vercel.app/",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/bobbykim89/manguito-component-library.git"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "license": "MIT",
+  "dependencies": {
+    "@bobbykim/manguito-theme": "^0.16.0"
+  },
+  "gitHead": "5b81953e5108fd166c0b89ebc6a24e6de9499635"
+}

package/tsconfig.json

@@ -1,9 +1,5 @@
 {
-"extends": "../../../tsconfig.json",
-"include": ["./**/*.ts"],
-"exclude": ["node_modules", "./**/*.vue.d.ts", "./**/*.vue"],
-"compilerOptions": {
-"skipLibCheck": true,
-"declaration": true
-}
+  "extends": "../../../tsconfig.json",
+  "include": ["./**/*.ts", "./**/*.vue"],
+  "exclude": ["node_modules", "./**/*.vue.d.ts"]
 }

package/tsconfig.ts.json

@@ -0,0 +1,9 @@
+{
+  "extends": "../../../tsconfig.json",
+  "include": ["./**/*.ts"],
+  "exclude": ["node_modules", "./**/*.vue.d.ts", "./**/*.vue"],
+  "compilerOptions": {
+    "skipLibCheck": true,
+    "declaration": true
+  }
+}